/* Public mockup catalogue. Product images carry the visual weight. */
.mockup-library{flex:1;min-height:0;overflow:auto;background:var(--panel);color:var(--text);scrollbar-gutter:stable;}
.ml-container{width:min(1320px,calc(100% - 64px));margin:0 auto;}
.ml-breadcrumb{display:flex;gap:12px;align-items:center;padding:25px 0 22px;font-size:12px;color:var(--muted);}
.ml-breadcrumb a{color:inherit;text-decoration:none;}.ml-breadcrumb a:hover{color:var(--accent);}
.ml-breadcrumb [aria-current]{color:var(--text);}
.ml-intro{position:relative;display:grid;grid-template-columns:1fr 1fr;align-items:center;min-height:236px;padding:36px 44px;overflow:hidden;border-radius:14px;background:var(--bg);}
.ml-intro-copy{position:relative;z-index:1;}
.ml-intro h1{margin:0;font-size:36px;font-weight:560;letter-spacing:-.035em;line-height:1.35;}
.ml-intro h1 span{display:block;}.ml-intro p{margin:18px 0 0;font-size:13px;line-height:1.8;color:var(--muted);max-width:37ch;}
.ml-intro-deck{display:flex;align-items:center;justify-content:center;gap:14px;height:200px;transform:rotate(-7deg) translate(20px,20px);}
.ml-intro-deck img{display:block;width:30%;height:190px;object-fit:cover;border-radius:9px;box-shadow:0 8px 20px rgba(28,39,50,.08);}
.ml-intro-deck img:nth-child(2){height:170px;transform:translateY(-16px);object-fit:contain;background:#fff;}
.ml-intro-deck img:nth-child(3){transform:translateY(18px);}
.ml-browser{padding:32px 0 54px;}
.ml-tabs{display:flex;align-items:center;gap:24px;overflow-x:auto;border-bottom:1px solid var(--line);scrollbar-width:thin;}
.ml-tabs button{display:flex;align-items:center;gap:8px;min-height:48px;padding:0 0 14px;border:0;border-bottom:2px solid transparent;background:transparent;font:inherit;font-size:14px;font-weight:500;color:var(--muted);white-space:nowrap;cursor:pointer;}
.ml-tabs button span{font-size:11px;min-width:18px;text-align:center;font-weight:400;color:var(--muted);}
.ml-tabs button:hover{color:var(--text);}.ml-tabs button[aria-pressed="true"]{color:var(--text);border-bottom-color:var(--text);}
.ml-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px 0;}
.ml-search{display:flex;align-items:center;gap:12px;width:min(540px,100%);min-height:44px;padding:5px 6px 5px 16px;border:1px solid var(--line);border-radius:8px;background:var(--panel);}
.ml-search:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.08);}
.ml-search>span{color:var(--muted);font-size:26px;line-height:1;}
.ml-search input{flex:1;width:0;min-width:0;outline:none;border:0;background:transparent;color:var(--text);font-size:14px;box-shadow:none;padding:5px 0;}
.ml-search input::placeholder{color:var(--muted);opacity:1;}
.ml-search button{border:0;border-radius:5px;background:var(--panel-alt);color:var(--text);height:32px;padding:0 14px;font-size:12px;cursor:pointer;}.ml-search button:hover{background:var(--line);}
.ml-toolbar-options{display:flex;gap:10px;flex-shrink:0;}.ml-select select{display:block;width:132px;min-height:44px;border:1px solid var(--line);border-radius:8px;padding:8px 30px 8px 12px;background:var(--panel);color:var(--text);font-size:12px;cursor:pointer;}
.ml-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.ml-results-heading{display:flex;align-items:baseline;gap:12px;margin:8px 0 22px;}
.ml-results-heading h2{margin:0;font-size:19px;font-weight:550;letter-spacing:-.02em;}.ml-results-heading>span{font-size:12px;color:var(--muted);}
.ml-clear{margin-left:auto;border:0;background:transparent;color:var(--muted);font-size:12px;cursor:pointer;padding:8px;}.ml-clear:hover{color:var(--accent);}
.ml-query{font-size:13px;color:var(--muted);margin:-5px 0 24px;}.ml-query strong{font-weight:500;color:var(--text);}
.ml-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 22px;}
.ml-card{min-width:0;}.ml-card-preview{position:relative;}
.ml-preview-button{position:relative;display:block;width:100%;border:0;padding:0;border-radius:10px;background:var(--bg);text-align:left;cursor:pointer;overflow:hidden;}
.ml-image{display:flex;align-items:center;justify-content:center;aspect-ratio:1.35;overflow:hidden;border-radius:10px;background:var(--bg);}
.ml-image img{display:block;width:100%;height:100%;object-fit:contain;transition:transform .25s ease;}.ml-preview-button:hover .ml-image img{transform:scale(1.025);}
.ml-image-unavailable{padding:24px;color:var(--muted);font-size:13px;}
.ml-preview-hint{position:absolute;bottom:14px;left:14px;display:inline-flex;gap:14px;align-items:center;padding:8px 12px;border-radius:6px;background:var(--panel);color:var(--text);font-size:12px;opacity:0;transform:translateY(3px);transition:opacity .18s,transform .18s;}
.ml-card:hover .ml-preview-hint,.ml-card:focus-within .ml-preview-hint{opacity:1;transform:translateY(0);}
.ml-favorite{position:absolute;right:12px;top:12px;display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--line);border-radius:50%;background:var(--panel);color:var(--muted);font-size:23px;line-height:1;cursor:pointer;transition:color .18s,background .18s;}
.ml-favorite:hover,.ml-favorite.is-favorite{color:var(--accent);}.ml-favorite:disabled{cursor:wait;opacity:.6;}
.ml-card-caption{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;}
.ml-card-caption h3{margin:0;min-width:0;font-size:13px;font-weight:500;}
.ml-card-caption h3 button{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:0;padding:0;background:transparent;color:var(--text);font:inherit;text-align:left;cursor:pointer;}
.ml-card-caption h3 button:hover{color:var(--accent);}
.ml-access-label{flex-shrink:0;border:1px solid var(--line);border-radius:4px;padding:2px 6px;font-size:10px;line-height:1.5;color:var(--muted);}
.ml-card-device{margin:7px 0 0;font-size:11px;color:var(--muted);}
.ml-empty{text-align:center;padding:65px 24px;background:var(--bg);border-radius:12px;}.ml-empty h3{font-size:17px;font-weight:500;margin:0 0 18px;}.ml-empty p{font-size:13px;color:var(--muted);margin-bottom:24px;}.ml-error{font-size:13px;color:#b13c38;}
.ml-skeleton>div{aspect-ratio:1.35;border-radius:10px;background:var(--panel-alt);}.ml-skeleton>span{display:block;height:13px;width:52%;margin:16px 0 12px;border-radius:4px;background:var(--panel-alt);}
.ml-load-more{display:flex;justify-content:center;margin-top:32px;}.ml-end{font-size:12px;text-align:center;color:var(--muted);margin:46px 0 10px;}
.mockup-library .marketing-footer{position:static;margin:0;padding:0;border-top:1px solid var(--line);background:var(--panel);box-shadow:none;}
.mockup-library .marketing-footer-inner{width:min(1320px,calc(100% - 64px));margin:auto;padding:26px 0;}.mockup-library .marketing-footer-copy{font-size:12px;}
.ml-dialog{width:min(960px,calc(100% - 48px));max-height:calc(100dvh - 64px);overflow:auto;padding:0;border:1px solid var(--line);border-radius:14px;background:var(--panel);color:var(--text);box-shadow:0 24px 64px rgba(10,20,30,.18);}
.ml-dialog::backdrop{background:rgba(16,22,28,.5);}
.ml-dialog-content{position:relative;display:grid;grid-template-columns:1.3fr 1fr;min-height:470px;}
.ml-dialog-close{position:absolute;top:12px;right:12px;z-index:1;width:36px;height:36px;border:1px solid var(--line);border-radius:50%;background:var(--panel);color:var(--text);font-size:24px;cursor:pointer;}
.ml-dialog-image{height:min(560px,65dvh);min-height:0;aspect-ratio:auto;border-radius:0;}.ml-dialog-image img{object-fit:contain;max-height:70dvh;}
.ml-dialog-details{align-self:center;padding:56px 36px 36px;}.ml-dialog-device{font-size:12px;color:var(--muted);}.ml-dialog-details h2{font-size:25px;font-weight:550;line-height:1.5;margin:16px 0;overflow-wrap:anywhere;}.ml-dialog-details p{font-size:13px;color:var(--muted);line-height:1.8;}.ml-dialog-access{margin:22px 0;color:var(--muted);font-size:12px;}.ml-dialog-details .btn{min-height:44px;padding:10px 20px;gap:24px;}
body[data-ui-theme="dark"] .ml-intro-deck{opacity:.9;}
@media(min-width:1600px){.ml-grid{grid-template-columns:repeat(4,minmax(0,1fr));}}
@media(max-width:1000px){.ml-intro{padding:32px;}.ml-intro h1{font-size:30px;}.ml-intro-deck{gap:10px;transform:rotate(-7deg) translate(12px,20px);}.ml-intro-deck img{height:160px;}.ml-intro-deck img:nth-child(2){height:140px;}.ml-grid{gap:26px 18px;}.ml-select select{width:116px;}}
@media(max-width:800px){.ml-container{width:calc(100% - 40px);}.ml-intro{grid-template-columns:1.1fr 1fr;min-height:210px;padding:28px;}.ml-intro h1{font-size:27px;}.ml-intro p{font-size:12px;}.ml-intro-deck{transform:rotate(-7deg) translate(24px,12px);}.ml-toolbar{align-items:stretch;flex-direction:column;gap:12px;}.ml-search{width:100%;}.ml-toolbar-options{justify-content:flex-end;}.ml-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.ml-tabs{gap:22px;}.ml-dialog-content{grid-template-columns:1fr 1fr;min-height:360px;}.ml-dialog-image{min-height:360px;}.ml-dialog-details{padding:46px 24px 30px;}.ml-dialog-details h2{font-size:21px;}.mockup-library .marketing-footer-inner{width:calc(100% - 40px);}}
@media(max-width:520px){.ml-breadcrumb{padding:20px 0;font-size:11px;}.ml-intro{grid-template-columns:1fr;min-height:0;padding:25px 24px 0;border-radius:12px;}.ml-intro h1{font-size:28px;line-height:1.4;}.ml-intro p{max-width:28ch;line-height:1.9;margin-top:14px;}.ml-intro-deck{height:125px;justify-content:flex-end;transform:rotate(-7deg) translate(30px,28px);margin-top:-35px;margin-left:55%;width:48%;gap:6px;}.ml-intro-deck img{height:112px;width:42%;flex:0 0 42%;border-radius:5px;}.ml-intro-deck img:nth-child(2){height:100px;transform:translateY(-10px);}.ml-intro-deck img:nth-child(3){display:none;}.ml-browser{padding-top:24px;}.ml-tabs{gap:20px;}.ml-tabs button{font-size:12px;min-height:44px;padding-bottom:12px;}.ml-tabs button span{font-size:10px;}.ml-toolbar{padding:20px 0 16px;}.ml-search input{font-size:16px;}.ml-search input::placeholder{font-size:12px;}.ml-select{flex:1;}.ml-select select{width:100%;font-size:12px;}.ml-results-heading{margin:10px 0 20px;gap:10px;}.ml-results-heading h2{font-size:17px;}.ml-results-heading>span{font-size:11px;}.ml-clear{font-size:11px;}.ml-grid{gap:24px 12px;}.ml-image{aspect-ratio:1;border-radius:8px;}.ml-preview-button{border-radius:8px;}.ml-favorite{width:30px;height:30px;top:7px;right:7px;font-size:21px;}.ml-card-caption{gap:7px;margin-top:11px;}.ml-card-caption h3{font-size:11px;}.ml-access-label{font-size:9px;padding:1px 4px;}.ml-card-device{font-size:10px;}.ml-preview-hint{display:inline-flex;opacity:1;transform:none;bottom:8px;left:8px;padding:6px 9px;font-size:11px;}.ml-dialog{width:calc(100% - 24px);max-height:calc(100dvh - 32px);}.ml-dialog-content{grid-template-columns:1fr;}.ml-dialog-image{height:290px;min-height:0;aspect-ratio:auto;}.ml-dialog-image img{max-height:290px;}.ml-dialog-details{padding:24px;}.ml-dialog-details h2{font-size:20px;margin:10px 0;}.ml-dialog-access{margin:15px 0 20px;}.ml-dialog-details .btn{width:100%;}.ml-end{line-height:1.8;max-width:25ch;margin:34px auto 0;}.mockup-library .marketing-footer-inner{flex-direction:column;align-items:flex-start;gap:14px;}}
@media(prefers-reduced-motion:reduce){.mockup-library *{scroll-behavior:auto!important;transition:none!important;animation:none!important;}}
.topbar .nav-link[aria-current="page"]{color:var(--text);}
@media(min-width:801px) and (max-width:1100px){.topbar .nav>a[href="/console"]{display:none;}.topbar .nav{gap:18px;}}
@media(max-width:800px){.topbar.mobile-nav-open .topbar-lang{top:308px;}.topbar .products-panel{top:216px;max-height:calc(100dvh - 234px);}}

@media(hover:none){.ml-preview-hint{opacity:1;transform:none;}}
.ml-preview-hint{background:#24282d;color:#fff;padding:10px 16px;border-radius:7px;font-size:13px;font-weight:500;}
@media(max-width:520px){.ml-preview-hint{padding:7px 10px;font-size:11px;}}