.viewer-header{padding:18px 32px;border-bottom:2px solid var(--ink);display:flex;align-items:center;justify-content:space-between;gap:20px;background:var(--cream)}.viewer-brand{display:flex;align-items:center;gap:12px;font:22px var(--display)}.viewer-brand span{font:10px Space Mono,monospace;text-transform:uppercase;border-left:1px solid var(--ink);padding-left:12px}.viewer-back{font-size:13px;font-weight:700}.viewer-intro{max-width:1380px;margin:0 auto;padding:46px 32px 34px;display:flex;justify-content:space-between;gap:36px;align-items:end}.viewer-intro h1{font-size:clamp(38px,4.5vw,62px);margin:18px 0 0}.viewer-intro h1 span{display:block;font:16px/1.5 var(--body);margin-top:12px}.viewer-intro p{max-width:43ch;font-size:16px;line-height:1.6;margin:0}.viewer-workspace{margin:0 24px;border:2px solid var(--ink);border-radius:20px;box-shadow:0 6px 0 var(--ink);overflow:hidden}.viewer-toolbar{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:14px 18px;background:var(--orange);border-bottom:2px solid var(--ink)}.viewer-devices,.viewer-actions{display:flex;gap:8px;align-items:center}.viewer-toolbar button,.viewer-toolbar a{font:700 12px var(--body);border:2px solid var(--ink);border-radius:999px;padding:10px 16px;background:var(--cream);color:var(--ink)}.viewer-toolbar button[aria-pressed=true]{background:var(--brown);color:var(--cream)}.viewer-toolbar button:hover,.viewer-toolbar a:hover{box-shadow:0 3px 0 var(--ink)}.viewer-canvas{background:var(--green);padding:24px;display:flex;justify-content:center}.viewer-canvas iframe{width:100%;height:75vh;min-height:480px;display:block;border:2px solid var(--ink);background:var(--cream)}.viewer-canvas[data-size=tablet] iframe{max-width:768px}.viewer-canvas[data-size=mobile] iframe{max-width:390px}.viewer-caption{display:flex;justify-content:space-between;gap:18px;padding:13px 18px;font:10px/1.6 Space Mono,monospace}.viewer-after{max-width:1200px;margin:0 auto;padding:78px 32px;display:grid;grid-template-columns:1fr 1fr;gap:70px}.viewer-after h2{font-size:44px;margin:22px 0}.viewer-after p{line-height:1.7;max-width:45ch}.viewer-after .btn{margin-top:12px}.viewer-faq details{border-top:2px solid var(--ink);padding:20px 0}.viewer-faq details:last-child{border-bottom:2px solid var(--ink)}.viewer-faq summary{cursor:pointer;font-weight:700;line-height:1.5}.viewer-faq p{font-size:14px}.viewer-catalog{display:flex;flex-wrap:wrap;gap:20px;padding:0 32px 24px}.viewer-catalog [aria-current=page]{text-decoration:underline}.viewer-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}body:has(.viewer-header) :focus-visible{outline:3px solid var(--green);outline-offset:4px}.viewer-focused{overflow:hidden}.viewer-focused .viewer-workspace{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;margin:0;border-radius:0;display:flex;flex-direction:column}.viewer-focused .viewer-canvas{flex:1;min-height:0;padding:12px}.viewer-focused .viewer-canvas iframe{height:100%;min-height:0}.viewer-focused .viewer-caption{background:var(--cream)}.viewer-focused .viewer-header,.viewer-focused .viewer-intro,.viewer-focused .viewer-after,.viewer-focused .viewer-catalog{display:none}@media(max-width:700px){.viewer-header{padding:14px 16px;flex-wrap:wrap;gap:12px}.viewer-brand{font-size:18px}.viewer-intro{padding:28px 18px;display:block}.viewer-intro .kicker{font-size:9px;letter-spacing:.04em}.viewer-intro p{margin-top:18px;font-size:14px}.viewer-workspace{margin:0 8px;border-radius:14px}.viewer-toolbar{padding:12px;gap:12px}.viewer-toolbar button,.viewer-toolbar a{padding:10px 12px;font-size:11px}.viewer-canvas{padding:8px}.viewer-canvas iframe{min-height:460px;height:72vh}.viewer-caption{display:block}.viewer-caption>span{display:block}.viewer-after{padding:52px 22px;grid-template-columns:1fr;gap:32px}.viewer-after h2{font-size:36px}}