.viewer-header{padding:20px 40px;display:flex;align-items:center;gap:36px;border-bottom:1px solid var(--line);flex-wrap:wrap}.wordmark{font:600 28px var(--font-display);color:var(--ivory);display:flex;align-items:center;gap:12px;text-decoration:none}.viewer-header nav{display:flex;gap:24px;font-size:14px}.viewer-header nav a{text-decoration:none}.screen-picker{margin-left:auto;display:flex;align-items:center;gap:12px;font-size:13px;color:var(--muted)}select{font:inherit;color:var(--ivory);background:var(--surface);border:1px solid var(--line);padding:10px 30px 10px 12px;border-radius:8px;max-width:240px}main{padding:40px}.intro{margin-bottom:36px}.intro h1{font:600 42px var(--font-display);margin:0 0 8px}.intro p{margin:0;color:var(--muted);font-size:14px}.screens{display:grid;grid-template-columns:repeat(auto-fit,402px);gap:44px 32px;justify-content:center}.screen{width:402px;min-width:0}.screen-title{display:block;margin-bottom:14px;font-size:12px;color:var(--muted);text-decoration:none}.device{width:402px;height:874px;border-radius:44px;overflow:hidden;position:relative;outline:1px solid #466056;background:var(--background);box-shadow:0 16px 32px #04140f66}.screen-content{height:100%;width:100%;overflow:hidden}.screen-content>div{min-height:0}.screen-content div[style*="overflow: auto"]{min-height:0;scrollbar-width:none}.screen-content div[style*="overflow: auto"]::-webkit-scrollbar{display:none}.statusbar{position:absolute;z-index:5;left:0;right:0;top:0;height:54px;display:flex;align-items:center;justify-content:space-between;padding:0 28px 0 34px;pointer-events:none;color:#F8F5EE;font:600 16px Inter,sans-serif}.status-symbols{display:flex;align-items:center;gap:6px}.home-indicator{position:absolute;z-index:5;bottom:8px;left:50%;transform:translateX(-50%);width:134px;height:5px;border-radius:3px;background:var(--ivory);pointer-events:none}.tabbar{flex-shrink:0}.tabbar [role=link]{cursor:pointer}.tabbar [role=link]:focus-visible{outline:2px solid var(--gold);outline-offset:-4px;border-radius:8px}[hidden]{display:none!important}.single .intro{display:none}.single .screens{grid-template-columns:402px}.single main{padding-top:24px}.asset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:28px}.asset-card{margin:0}.asset-card>img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:16px;background:var(--surface)}.asset-card figcaption{padding-top:12px;font-size:14px}.asset-card small{display:block;color:var(--muted);margin-top:5px}.asset-card a{display:inline-block;margin-top:10px;font-size:12px}.asset-heading{font:600 32px var(--font-display);margin:48px 0 22px}.icons-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}.icon-tile{background:var(--canvas);padding:24px 12px;display:flex;flex-direction:column;align-items:center;gap:14px;font-size:12px}.icon-tile svg{color:var(--gold);width:28px;height:28px}.icon-tile a{color:var(--muted)}@media(max-width:600px){.viewer-header{padding:16px;gap:16px}.viewer-header nav{margin-left:auto;gap:16px}.wordmark{font-size:24px}.screen-picker{margin:0;width:100%;justify-content:space-between}main{padding:24px 16px}.intro h1{font-size:34px}.screens,.single .screens{grid-template-columns:minmax(0,402px);gap:28px}.screen{width:100%}.device{width:100%;height:874px;border-radius:32px}.statusbar{padding-left:28px;padding-right:24px}.asset-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 12px}.asset-card figcaption{font-size:13px}.viewer-header nav a:last-child{display:none}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.tabbar [role=link],.prototype-action{cursor:pointer}.tabbar [role=link]:focus-visible,.prototype-action:focus-visible{outline:2px solid var(--gold);outline-offset:-4px;border-radius:8px}.prototype-action{transition:filter 160ms ease,transform 160ms ease}.prototype-action:hover{filter:brightness(1.06)}.prototype-action:active{transform:scale(.985)}
@media(max-width:600px){.single .viewer-header{display:none}.single main{padding:0}.single .screens{display:block}.single .screen{width:100vw}.single .screen-title{display:none}.single .device{width:100vw;height:100dvh;border-radius:0;outline:0;box-shadow:none}.single .screen-content{height:100dvh}}