/* Detailed worlds retain the existing universe and its visual vocabulary. */
[hidden]{display:none!important}
button,a,input{ -webkit-tap-highlight-color:transparent }
button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #8deeff;outline-offset:4px}
.topbar{z-index:31}
.detail-shell{inset:max(90px,9vh) 2vw 3vh 36vw;background:linear-gradient(145deg,rgba(2,9,18,.99),rgba(4,11,21,.992));backdrop-filter:none;transition:transform .42s cubic-bezier(.2,.82,.2,1)}
.detail-scroll{padding:32px clamp(22px,3vw,52px) 44px;scroll-behavior:smooth;scrollbar-color:#264857 transparent;scrollbar-width:thin}
.detail h1{line-height:1.08;font-size:clamp(30px,3.3vw,54px);overflow-wrap:anywhere}
#detailTitle:focus{outline:none}
.detail-hero{grid-template-columns:minmax(0,1fr) minmax(160px,210px);gap:22px}
.metric{padding:13px 11px;min-width:0}.metric b{font-size:16px;overflow-wrap:normal}.metric small{line-height:1.5;letter-spacing:.06em}
.detail-overview{font-size:14px;line-height:1.85;color:#afc3d0;max-width:80ch;margin:20px 0 26px}
.project-actions{margin:0 0 20px}.project-actions a{border-color:#7deaff44;background:#7deaff09}#projectMedia{scroll-margin-top:24px}
.detail-contents{display:flex;gap:8px;flex-wrap:wrap;padding:18px 0 24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:25px 0 8px}
.detail-contents>span{width:100%;font-size:9px;letter-spacing:.18em;color:var(--project-accent,#8deeff);margin-bottom:3px}
.detail-contents a{font-size:11px;color:#adc8d7;text-decoration:none;padding:7px 10px;border:1px solid #81d9ff1c;border-radius:8px;line-height:1.4;background:#79cfff05}
.detail-contents a:hover{color:#eaffff;border-color:#81d9ff55}
.feature-section{display:grid;grid-template-columns:30px minmax(0,1fr);gap:16px;padding:27px 0;border-bottom:1px solid #81d9ff14;scroll-margin-top:18px}
.section-number{font-size:11px;color:var(--project-accent,#8deeff);opacity:.45;padding-top:6px;font-variant-numeric:tabular-nums}
.feature-section h2{font-size:clamp(18px,1.7vw,24px);font-weight:600;line-height:1.4;margin:0 0 13px;letter-spacing:-.02em;color:#e8f5fc}
.feature-section p{font-size:14px;line-height:1.85;color:#afc3d0;margin:0 0 12px;max-width:80ch;overflow-wrap:anywhere}.feature-section p:last-child{margin-bottom:0}
.detail-columns{grid-template-columns:1fr;margin-top:28px;gap:28px}.tags{gap:8px}.tag{font-size:10px;line-height:1.45}
.detail h3{font-size:10px}.link-row a,.contact-links a{font-size:11px;line-height:1.5}.link-row a:hover{border-color:#7deaff77;background:#7deaff10}
.detail-topline .kicker{max-width:62%;text-align:right;line-height:1.5}.back-btn{white-space:nowrap;min-height:34px}
.project-gallery{min-width:0}.gallery-empty{padding:26px;border:1px solid #7adfff20;border-radius:18px;background:radial-gradient(ellipse at 50% 0,#54ccff10,transparent 70%);text-align:center}
.gallery-empty>b{font-size:18px;font-weight:500;color:#b5d5e5}.gallery-empty>p{font-size:12px;color:#738e9d;margin:9px 0 22px}
.gallery-empty-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.gallery-empty-tiles>span{aspect-ratio:16/10;display:grid;place-items:center;font-size:26px;color:#69bed93a;border:1px dashed #7adfff25;border-radius:12px;background:#01101b66}
.gallery-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:13px;font-size:11px;color:#8aacbd}
.gallery-filters{display:flex;gap:5px}.gallery-filter{border:1px solid #7adfff20;color:#a6c4d3;background:#0a1724;border-radius:8px;padding:8px 12px;cursor:pointer;font-size:11px}
.gallery-filter[aria-pressed="true"]{background:#6cdfff17;color:#d0faff;border-color:#6cdfff60}
.gallery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.gallery-card{position:relative;aspect-ratio:16/10;border:1px solid #7adfff25;border-radius:13px;overflow:hidden;background:#08131e;padding:0;cursor:zoom-in;text-align:left;color:#e1f6ff}
.gallery-card>img,.gallery-card>video{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}.gallery-card:hover>img,.gallery-card:hover>video{transform:scale(1.035)}
.gallery-caption{position:absolute;bottom:0;left:0;right:0;padding:24px 12px 10px;font-size:11px;line-height:1.4;background:linear-gradient(transparent,#020a12e8);overflow-wrap:anywhere}
.play-badge{position:absolute;z-index:1;top:12px;left:12px;border-radius:50%;width:32px;height:32px;display:grid;place-items:center;background:#041421aa;border:1px solid #b9ebff70;font-size:12px}
.media-failed::before{content:'◇';position:absolute;inset:0;display:grid;place-items:center;color:#54809c;font-size:28px}
.gallery-status{color:#86a2b2;font-size:12px}.gallery-more{display:block;margin:18px auto 0;min-height:40px}
.media-viewer{width:min(1200px,94vw);max-width:94vw;max-height:94dvh;padding:16px;border:1px solid #81e5ff45;background:#020912f5;color:#e8f6ff;border-radius:18px;box-shadow:0 30px 100px #000b;overflow:auto}
.media-viewer::backdrop{background:#000c;backdrop-filter:blur(14px)}.viewer-toolbar{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.viewer-toolbar button{border:1px solid #81e5ff30;background:#0b1b29;color:#ccefff;border-radius:9px;width:40px;height:40px;font-size:20px;cursor:pointer}
.viewer-toolbar [data-viewer-close]{margin-left:auto}.viewer-counter{font-size:12px;color:#89b3c8}
.viewer-stage{display:flex;align-items:center;justify-content:center;min-height:120px}.viewer-stage img,.viewer-stage video{display:block;max-width:100%;max-height:72dvh;object-fit:contain;border-radius:7px}.viewer-caption{font-size:12px;color:#a1bbcb;overflow-wrap:anywhere}
.access-gate{position:absolute;inset:58px 0 0;display:flex;align-items:center;justify-content:center;padding:22px;overflow:auto;background:#01081250;backdrop-filter:none}
.detail.locked .detail-scroll{filter:blur(14px);user-select:none;pointer-events:none;overflow:hidden;opacity:.45}
.access-card{max-width:490px;width:100%;padding:32px;border:1px solid #b5dfff30;border-radius:22px;background:linear-gradient(145deg,#071525f7,#090e1af7);box-shadow:0 20px 100px #0009;animation:access-enter .35s ease-out}
.access-symbol{font-size:46px;line-height:1;color:#c2e6ff;text-shadow:0 0 30px #3faaff8a;margin-bottom:19px}.access-card h2{font-size:clamp(23px,2.4vw,32px);line-height:1.22;letter-spacing:-.025em;margin:15px 0}
.access-card p{font-size:14px;line-height:1.75;color:#9db5c7}.access-card label{display:block;color:#bad3e0;font-size:11px;margin:21px 0 9px}
.access-input-row{display:flex;gap:9px}.access-input-row input{min-width:0;width:100%;border:1px solid #8edfff38;border-radius:10px;background:#010b15;color:#e2f8ff;padding:12px 14px;font-size:16px}.access-input-row button{flex-shrink:0;font-size:10px}
.access-card .access-feedback{min-height:37px;font-size:12px;margin:11px 0 0;color:#f4c99b}.access-contact a{font-size:12px;color:#9edfff;text-decoration:none}
.access-public{display:flex;gap:9px;flex-wrap:wrap;border-top:1px solid #8edfff20;margin-top:20px;padding-top:15px}.access-public a{font-size:11px;line-height:1.5;color:#80a9c0;text-decoration:none}.access-public a:hover{color:#c6efff}
.sealed-preview>div{height:120px;margin:20px 0;background:repeating-linear-gradient(transparent 0 18px,#bbdeff1c 18px 23px);border-radius:9px}
.contact-directory{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:23px}.contact-directory a{display:flex;flex-direction:column;gap:7px;padding:15px;border:1px solid #8bdfff22;background:#79dfff05;border-radius:12px;text-decoration:none;min-width:0}.contact-directory a:hover{border-color:#8bdfff66}.contact-directory small{font-size:10px;color:#7a9aaf}.contact-directory b{font-size:13px;color:#d0efff;font-weight:500;overflow-wrap:anywhere}
.modal-card{width:min(900px,95vw);padding:40px}.modal-card h1{padding-right:10px;line-height:1.1;overflow-wrap:anywhere}.about-sections .feature-section p{font-size:14px}.fact small{line-height:1.5}
.modal-card>.close-x{z-index:2}#infoContent>.kicker{padding-right:42px;line-height:1.6}
@keyframes access-enter{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@media(min-width:1600px){.detail-shell{left:40vw}}
@media(max-width:1100px){.detail-shell{inset:8vh 3vw 3vh 22vw}.detail-hero{grid-template-columns:1fr}.metrics{grid-template-columns:repeat(4,minmax(0,1fr))}.metric b{font-size:18px}}
@media(max-width:900px){.detail-shell{inset:9vh 3vw 3vh}.detail h1{font-size:clamp(30px,6vw,46px)}}
@media(max-width:560px){.detail-shell{inset:8vh 0 0;border-radius:20px 20px 0 0}.detail-scroll{padding:24px 20px 36px}.detail-hero{gap:18px}.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.feature-section{grid-template-columns:22px minmax(0,1fr);gap:10px;padding:23px 0}.feature-section p{font-size:13px;line-height:1.8}.detail-contents a{font-size:10px}.access-gate{padding:14px;align-items:flex-start}.access-card{padding:24px 20px;margin:auto 0}.access-card p{font-size:13px}.access-symbol{font-size:34px}.contact-directory{grid-template-columns:1fr}.gallery-grid{grid-template-columns:1fr}.gallery-empty{padding:20px 14px}.gallery-empty-tiles{gap:8px}.modal-card{padding:35px 20px 25px}.fact{padding:12px 9px}.fact small{font-size:7px;letter-spacing:.05em}.fact b{font-size:19px}.media-viewer{padding:10px}.detail-topline .kicker{font-size:6px}}
@media(prefers-reduced-motion:reduce){.detail-scroll{scroll-behavior:auto}.access-card{animation:none}.gallery-card>img,.gallery-card>video{transition:none}}
.mobile-worlds{display:none}
@media(max-width:900px), (hover:none) and (pointer:coarse){
 .topbar{padding:max(12px,env(safe-area-inset-top)) 12px 12px;height:80px;align-items:center}
 .brand-mark{width:42px;height:42px}.nav-actions{gap:4px}.nav-actions .hud-btn{min-height:44px;padding:10px 9px;font-size:8px;letter-spacing:.06em}
 .mobile-worlds{display:flex;position:fixed;z-index:19;left:0;right:0;bottom:calc(43px + env(safe-area-inset-bottom));gap:8px;padding:14px 18px;overflow-x:auto;scrollbar-width:none;overscroll-behavior-x:contain;scroll-snap-type:x proximity;background:linear-gradient(transparent,#01040ab8);transition:opacity .25s}
 .mobile-worlds::-webkit-scrollbar{display:none}.mobile-worlds button{flex:0 0 auto;scroll-snap-align:center;min-height:44px;padding:11px 14px;border:1px solid color-mix(in srgb,var(--glow) 32%,transparent);border-radius:14px;background:#03111ed9;color:#dff7ff;font-size:10px;letter-spacing:.06em;cursor:pointer}
 .loading .mobile-worlds,.intro-running .mobile-worlds,.viewing-world .mobile-worlds{opacity:0;pointer-events:none}
 .micro-footer{display:flex;bottom:calc(17px + env(safe-area-inset-bottom));font-size:7px;white-space:nowrap;gap:9px}
 .fps-stack{right:8px;bottom:calc(8px + env(safe-area-inset-bottom))}
 .detail-shell{inset:40dvh 0 0;border-radius:22px 22px 0 0}.detail-topline{height:58px;padding:8px 16px}.back-btn{min-height:42px;font-size:9px}.detail-topline .kicker{font-size:7px;letter-spacing:.06em}
 .detail-scroll{height:calc(100% - 58px);padding:24px 20px calc(62px + env(safe-area-inset-bottom));overscroll-behavior:contain}
 .detail-lead{font-size:15px}.detail-hero{grid-template-columns:1fr}.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.metric b{font-size:17px}
 .detail-contents a,.link-row a{min-height:40px;display:flex;align-items:center}.detail.locked .detail-shell{top:22dvh}.access-gate{padding:16px;align-items:flex-start}.access-card{margin:auto 0;padding:24px 20px}.access-symbol{font-size:30px;margin-bottom:10px}.access-card h2{font-size:24px}.access-card p{font-size:13px}.access-card label{margin-top:15px}
 .drawer{width:100%;padding:calc(20px + env(safe-area-inset-top)) 20px calc(35px + env(safe-area-inset-bottom))}.index-grid{grid-template-columns:1fr}.index-card{min-height:125px}.index-card small{font-size:9px}.index-card p{font-size:12px}.close-x{width:44px;height:44px}
 .modal-panel{padding:12px}.modal-card{max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));width:100%;overscroll-behavior:contain}.contact-directory a{min-height:70px}
 .hover-label{display:none}.viewer-toolbar button{min-width:44px;min-height:44px}
}
@media(max-width:900px) and (max-height:560px) and (orientation:landscape) and (min-width:480px), (hover:none) and (pointer:coarse) and (max-height:560px) and (orientation:landscape) and (min-width:480px){.detail-shell,.detail.locked .detail-shell{inset:80px 0 0}.mobile-worlds{bottom:30px;padding:7px 12px}.mobile-worlds button{min-height:38px}.micro-footer{bottom:8px}.access-card{padding:20px}.access-symbol{display:none}}

/* Restricted Elira entry: one warning and one route to the contact directory. */
.restricted-hover{text-align:center}
.restricted-hover .eyebrow[hidden],[hidden]#detailType,[hidden]#detailBadge{display:none}
.access-card{border-color:rgba(255,200,87,.32);background:linear-gradient(145deg,rgba(28,25,17,.97),rgba(4,12,20,.98))}
.access-symbol{width:72px;height:65px;margin:0 auto 18px}
.access-symbol svg{display:block;width:100%;height:100%}
.access-card .kicker{color:#ffdb91}
.access-card h2{font-size:clamp(18px,2.5vw,23px);line-height:1.4}
.access-contact button{border:0;background:none;padding:6px 0;color:#bdebf2;font:inherit;cursor:pointer;text-decoration:underline;text-underline-offset:5px}
.access-contact button:hover{color:#ffdb91}
@media(max-width:900px), (hover:none) and (pointer:coarse){.access-symbol{width:60px;height:54px;margin-bottom:12px}}

.contact-work{margin-top:34px;padding-top:28px;border-top:1px solid rgba(109,214,234,.18)}
.contact-work h2{font-size:clamp(23px,3vw,34px);line-height:1.2;margin:14px 0 22px}

.hover-label.restricted-hover{width:max-content;max-width:calc(100vw - 32px);min-width:0;padding:12px 16px}

@media(max-width:900px), (hover:none) and (pointer:coarse){.brand-copy{display:none}.offer-grid{grid-template-columns:1fr}.modal-card{width:100%;max-width:100%}.nav-actions{min-width:0}.detail,.modal-panel,.drawer{max-width:100vw}.modal-card h1{font-size:clamp(30px,7vw,48px)}body{height:100dvh;overflow:hidden}.access-input-row{flex-wrap:wrap}.access-input-row input{flex:1 1 170px}.access-input-row button{min-height:44px}}

@media(max-width:900px), (hover:none) and (pointer:coarse){
 .nav-actions .hud-btn{font-size:10px;letter-spacing:.02em;padding:10px 8px}
 .mobile-worlds button{font-size:12px;letter-spacing:.02em}
 .detail-lead,.detail-overview,.feature-section p,.feature-section li,.modal-card p,.about-sections .feature-section p{font-size:16px;line-height:1.7}
 .detail-scroll{padding-left:18px;padding-right:18px}
 .metric small,.detail-contents a,.link-row a{font-size:12px}
 .contact-directory small{font-size:12px}.contact-directory b{font-size:15px}
 .index-card small{font-size:11px}.index-card p{font-size:15px;line-height:1.6}
 .offer b{font-size:12px}.offer p{font-size:15px}.contact-how{font-size:16px!important}
 .access-card p,.access-card label{font-size:15px}.access-contact button{font-size:15px;min-height:44px}
}

@media(max-width:900px), (hover:none) and (pointer:coarse){.tag{font-size:12px}.fact small{font-size:11px}.nav-actions .hud-btn{display:inline-flex;align-items:center;justify-content:center}}

.fact{min-width:0}.fact small{overflow-wrap:anywhere}.modal-card p,.modal-card li{overflow-wrap:anywhere}

/* Touch controls use readable type, not scaled desktop labels. The gate must
   not summon a keyboard or cover navigation as soon as Elira opens. */
@media(max-width:900px), (hover:none) and (pointer:coarse){
 .topbar{height:128px;padding:12px;gap:12px;align-items:flex-start;z-index:31}
 .brand-mark{width:44px;height:44px;font-size:18px}
 .nav-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:min(300px,calc(100% - 56px));gap:6px}
 .nav-actions .hud-btn{font-size:15px;line-height:1.2;letter-spacing:0;padding:10px 8px;min-height:46px}
 .mobile-worlds button{font-size:15px;min-height:48px;letter-spacing:0}
 .detail-shell{top:max(144px,40dvh)}
 .detail.locked .detail-shell{top:max(136px,22dvh)}
 .detail-topline{height:60px;padding:8px 14px;gap:10px}
 .back-btn{font-size:15px;min-height:44px;padding:10px 14px;letter-spacing:0}
 .detail-topline .kicker{font-size:11px;letter-spacing:0;line-height:1.35}
 .detail-scroll{height:calc(100% - 60px)}
 .detail-lead,.detail-overview,.feature-section p,.feature-section li,.modal-card p,.about-sections .feature-section p{font-size:17px;line-height:1.7}
 .metric small,.detail-contents a,.link-row a,.tag{font-size:14px;letter-spacing:0}
 .detail-contents>span,.detail h3{font-size:13px;letter-spacing:.06em}
 .metric b{font-size:20px}.feature-section h2{font-size:22px}
 .access-gate{inset:60px 0 0;padding:16px;align-items:flex-start}
 .access-card{margin:0;padding:22px 18px}
 .access-card h2{font-size:22px}.access-card .kicker{font-size:14px;letter-spacing:0}
 .access-card p,.access-contact button{font-size:17px}
 .access-input-row input,.access-input-row button{font-size:17px;min-height:48px;letter-spacing:0}
 .access-input-row{flex-wrap:nowrap}.access-input-row input{flex:1 1 120px;width:0}.access-input-row button{width:auto;min-width:78px;padding:10px}
 .access-card .access-feedback{font-size:15px;min-height:24px;margin-top:8px}
}
@media(max-width:900px) and (max-height:720px), (hover:none) and (pointer:coarse) and (max-height:720px){
 .access-symbol{width:44px;height:40px;margin-bottom:10px}.access-card{padding:18px 16px}
 .access-card h2{font-size:20px;line-height:1.35;margin:10px 0}
}
@media(max-width:900px) and (max-height:560px) and (orientation:landscape) and (min-width:480px), (hover:none) and (pointer:coarse) and (max-height:560px) and (orientation:landscape) and (min-width:480px){
 .topbar{height:72px}.nav-actions{display:flex;width:auto;gap:5px}.nav-actions .hud-btn{font-size:15px}
 .detail-shell,.detail.locked .detail-shell{top:80px}.access-symbol{display:none}
}

/* Minimum readable sizes for captions and utility text on every screen. */
.gallery-empty>p,.gallery-toolbar,.gallery-filter,.gallery-caption,.gallery-status,.viewer-caption,.viewer-counter{font-size:14px;line-height:1.55}
.gallery-filter,.viewer-toolbar button{min-height:44px}
.viewer-toolbar button{width:44px}
.loader-copy b{font-size:18px}.loader-copy small{font-size:13px;opacity:.75}
.fps-box small{font-size:12px;opacity:.75}.fps-box b{font-size:20px}
.micro-footer{font-size:12px;letter-spacing:.04em;color:#9cb5c3}
.metric small{opacity:.8}.fact small{opacity:.8}
.metric b,.metric small{overflow-wrap:anywhere;hyphens:auto}
@media(max-width:900px) and (max-height:600px), (hover:none) and (pointer:coarse) and (max-height:600px){.access-symbol{display:none}}
.contact-links a{font-size:15px;line-height:1.5;min-height:44px}
.contact-secondary{font-size:15px!important;line-height:1.65}
.contact-directory small,.index-card small,.fact small,.project-badge{font-size:13px;letter-spacing:.04em}
.index-card b{font-size:20px}.index-card p,.offer p{font-size:16px;line-height:1.6}
.offer b{font-size:14px;letter-spacing:.04em}
.media-placeholder b,.media-placeholder small{font-size:13px}
@media(max-width:900px), (hover:none) and (pointer:coarse){
 .metrics{grid-template-columns:repeat(auto-fit,minmax(min(170px,100%),1fr))}
 .detail-topline .kicker{font-size:12px}.kicker{font-size:12px}
 .section-number{font-size:13px}
 .micro-footer{flex-direction:column;gap:2px;line-height:1.25;bottom:calc(12px + env(safe-area-inset-bottom))}
 .close-x{width:44px;height:44px;font-size:22px}
 .detail-contents a,.link-row a{display:inline-flex;align-items:center;min-height:44px}
}
@media(min-width:901px) and (hover:hover) and (pointer:fine){
 .brand-mark{width:44px;height:44px;font-size:18px}.brand-copy b{font-size:16px}
 .brand-copy small{font-size:11px;opacity:.75;letter-spacing:.08em}
 .hud-btn,.back-btn{font-size:14px;letter-spacing:.04em;min-height:44px;padding:11px 16px}
 .kicker,.hover-label .eyebrow,.detail-contents>span,.detail h3{font-size:12px;letter-spacing:.08em}
 .hover-label{width:min(370px,80vw);padding:16px 18px}.hover-label b{font-size:20px}
 .hover-label small{font-size:15px;line-height:1.6}.hover-label.restricted-hover{width:max-content}
 .detail-lead,.detail-overview,.feature-section p,.feature-section li,.modal-card p,.about-sections .feature-section p,.detail-columns p{font-size:17px;line-height:1.75}
 .detail h1{font-size:clamp(36px,3.3vw,56px)}.feature-section h2{font-size:25px}
 .metric b{font-size:24px}.metric small,.tag,.detail-contents a,.link-row a{font-size:14px;letter-spacing:.03em}
 .section-number{font-size:14px}.fact b{font-size:28px}.bigline{font-size:21px!important}
 .contact-directory b{font-size:17px}.contact-how{font-size:17px!important}
 .access-card p,.access-card label,.access-contact button,.access-input-row button{font-size:16px}
 .close-x{width:44px;height:44px}.index-card{min-height:175px}
}

/* CSS pixels already account for device density. Scale wide desktop windows
   gently as well: 17px at 1440px, about 18px at 1920px, 23px at 3840px. */
@media(min-width:901px) and (hover:hover) and (pointer:fine){
 :root{--reading-size:clamp(17px,calc(13px + .28vw),23px);--control-size:clamp(14px,calc(10px + .28vw),20px);--caption-size:clamp(13px,calc(10px + .21vw),18px)}
 .detail-lead,.detail-overview,.feature-section p,.feature-section li,.modal-card p,.about-sections .feature-section p,.detail-columns p,.contact-how{font-size:var(--reading-size)!important}
 .hud-btn,.back-btn,.link-row a,.contact-links a,.access-card p,.access-card label,.access-contact button,.access-input-row input,.access-input-row button{font-size:var(--control-size)}
 .metric small,.tag,.detail-contents a,.gallery-empty>p,.gallery-toolbar,.gallery-filter,.gallery-caption,.gallery-status,.viewer-caption,.viewer-counter,.contact-directory small,.index-card small,.fact small,.project-badge{font-size:var(--caption-size)}
 .detail h1{font-size:clamp(36px,3.3vw,72px)}.feature-section h2{font-size:clamp(25px,1.6vw,34px)}
 .metric b{font-size:clamp(24px,calc(17px + .5vw),32px)}.contact-directory b,.index-card p,.offer p{font-size:var(--reading-size)}
 .brand-mark{width:clamp(44px,3.05vw,64px);height:clamp(44px,3.05vw,64px);font-size:clamp(18px,1.25vw,26px)}
 .brand-copy b{font-size:clamp(16px,calc(14px + .14vw),20px)}.brand-copy small{font-size:clamp(11px,calc(9px + .14vw),14px)}
 .micro-footer,.kicker,.hover-label .eyebrow,.detail-contents>span,.detail h3,.loader-copy small{font-size:clamp(12px,calc(9px + .21vw),16px)}
 .access-card .access-feedback,.access-card .kicker{font-size:var(--caption-size)}
 .hover-label{width:clamp(370px,23vw,520px)}.hover-label b,.index-card b{font-size:clamp(20px,calc(17px + .21vw),28px)}.hover-label small{font-size:var(--control-size)}
 .offer b,.section-number,.media-placeholder b,.media-placeholder small{font-size:var(--caption-size)}
 .modal-card .bigline{font-size:clamp(21px,calc(17px + .28vw),28px)!important}
 .fact b{font-size:clamp(28px,calc(21px + .5vw),36px)}
 .fps-box b{font-size:clamp(20px,calc(17px + .28vw),28px)}.fps-box small{font-size:clamp(12px,calc(9px + .21vw),16px)}
}
.engine-error p{font-size:17px;line-height:1.7}

/* Portrait layout: the scene owns the upper view; long-form content scrolls in
   the lower panel at a genuinely readable CSS-pixel size. */
@media (max-width:900px) and (orientation:portrait), (hover:none) and (pointer:coarse) and (orientation:portrait){
 .topbar{display:block;height:168px;padding:10px 12px;pointer-events:none}
 .topbar .brand,.topbar .nav-actions{pointer-events:auto}
 .brand-mark{width:46px;height:46px;font-size:22px}
 .nav-actions{width:100%;max-width:none;margin-top:7px;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
 .nav-actions .hud-btn{font-size:25px;line-height:1.15;min-height:47px;padding:6px 4px;white-space:nowrap}
 .mobile-worlds{bottom:calc(50px + env(safe-area-inset-bottom));padding:12px 14px;gap:10px}
 .mobile-worlds button{font-size:24px;min-height:56px;padding:9px 14px;white-space:nowrap}
 .detail-shell,.detail.locked .detail-shell{top:max(320px,40dvh);bottom:0}
 .detail-topline{height:auto;min-height:66px;padding:8px 15px;align-items:center}
 .detail-topline .kicker{display:none}
 .back-btn{font-size:25px;min-height:50px;padding:8px 10px}
 .detail-scroll{height:calc(100% - 66px);padding:22px 18px calc(80px + env(safe-area-inset-bottom))}
 .detail h1{font-size:clamp(35px,10vw,48px);overflow-wrap:break-word}
 .detail-lead,.detail-overview,.feature-section p,.feature-section li,
 .modal-card p,.modal-card li,.about-sections .feature-section p,
 .detail-columns p,.contact-how,.index-card p,.offer p{font-size:30px!important;line-height:1.48;overflow-wrap:break-word;word-break:normal;hyphens:none}
 .feature-section{grid-template-columns:1fr;gap:5px;padding:26px 0}
 .section-number,.project-badge,.kicker,.detail-contents>span,.detail h3{font-size:22px;letter-spacing:0}
 .feature-section h2,.contact-work h2{font-size:32px;line-height:1.25}
 .metrics,.fact-grid{grid-template-columns:1fr;gap:10px}
 .metric{padding:14px 16px}.metric b,.fact b{font-size:31px;overflow-wrap:break-word;hyphens:none}
 .metric small,.fact small,.tag,.detail-contents a,.link-row a,
 .contact-directory small,.contact-directory b,.index-card small,.gallery-caption,
 .gallery-toolbar,.gallery-filter,.gallery-status,.viewer-caption,.viewer-counter,
 .gallery-empty>p,.media-placeholder b,.media-placeholder small,
 .offer b,.contact-secondary{font-size:24px!important;line-height:1.35;letter-spacing:0;overflow-wrap:break-word;word-break:normal;hyphens:none}
 .detail-contents a,.link-row a,.contact-links a{min-height:52px;padding:10px 12px}
 .contact-links a,.contact-how,.access-card label,.access-contact button{font-size:27px!important;line-height:1.35}
 .index-card b,.gallery-empty>b,.modal-card .bigline{font-size:30px!important}
 .index-card{min-height:170px;padding:20px}.drawer{padding:24px 16px 60px}.drawer h2,.modal-card h1{font-size:38px}
 .modal-card{padding:28px 18px}.contact-directory{grid-template-columns:1fr}.contact-directory a{padding:18px}
 .access-gate{inset:66px 0 0;padding:12px;display:flex;align-items:safe center;justify-content:center;overflow-y:auto}
 .access-card{margin:0;width:min(100%,520px);padding:22px 18px}
 .access-symbol{width:68px;height:62px;margin-bottom:14px}
 .access-card .kicker,.access-card .access-feedback{font-size:22px;letter-spacing:0}
 .access-card h2{font-size:30px;line-height:1.27;margin:12px 0}
 .access-card p{font-size:27px}.access-card label{margin:12px 0 7px}
 .access-input-row{display:grid;grid-template-columns:1fr;gap:8px}
 .access-input-row input,.access-input-row button{box-sizing:border-box;width:100%;min-height:52px;font-size:27px;padding:8px 12px}
 .access-contact button{min-height:52px;text-align:left}
 .access-card .access-feedback{min-height:12px;margin:4px 0}
 .micro-footer{font-size:18px;bottom:calc(11px + env(safe-area-inset-bottom))}
 .fps-box small{font-size:17px}.fps-box b{font-size:26px}
 .viewing-world .fps-stack{top:calc(max(320px,40dvh) - 55px);bottom:auto;right:8px}
 .close-x{width:52px;height:52px;font-size:30px}
 .gallery-more,.gallery-filter,.viewer-toolbar button{font-size:24px;min-height:52px}
}
@media (max-width:360px) and (orientation:portrait){
 .nav-actions .hud-btn{font-size:22px}
 .detail-shell,.detail.locked .detail-shell{top:max(308px,40dvh)}
 .viewing-world .fps-stack{top:calc(max(308px,40dvh) - 55px)}
 .access-card{display:grid;grid-template-columns:54px minmax(0,1fr);column-gap:8px;padding:13px}
 .access-symbol{grid-column:1;grid-row:1/3;width:48px;height:45px;margin:0}
 .access-card .kicker{grid-column:2;font-size:20px}
 .access-card h2{grid-column:2;font-size:24px;line-height:1.2;margin:2px 0 9px}
 .access-card form,.access-contact{grid-column:1/-1}
 .access-input-row{display:flex;flex-wrap:nowrap}
 .access-input-row input{flex:1 1 0;width:0;font-size:24px}
 .access-input-row button{flex:0 0 auto;width:auto;min-width:105px;font-size:22px}
 .access-contact button{font-size:23px!important;min-height:45px}
 .access-card .access-feedback:empty{display:none}
}
@media (max-width:900px) and (orientation:portrait), (hover:none) and (pointer:coarse) and (orientation:portrait){
 .access-symbol{height:52px;width:58px;margin-bottom:7px}
 .access-card h2{margin:5px 0 9px}
 .access-card{padding-top:13px;padding-bottom:13px}
}
@media (max-width:360px) and (orientation:portrait){
 .access-card{padding:13px}
 .access-symbol{width:48px;height:45px;margin:0}
 .access-card h2{margin:2px 0 9px}
}

/* Project facts need space for whole words on a wide screen. */
@media (min-width:901px){
 .detail-hero{grid-template-columns:minmax(0,1fr)}
 .metrics{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
 .metric{padding:16px 18px}
 .metric b,.metric small{overflow-wrap:normal;word-break:normal;hyphens:none}
}
@media (min-width:901px) and (max-width:1800px){
 .metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px), (hover:none) and (pointer:coarse){
 .metric b,.metric small{overflow-wrap:normal;word-break:normal;hyphens:none}
}
@media (max-width:900px) and (orientation:portrait), (hover:none) and (pointer:coarse) and (orientation:portrait){
 .topbar{display:flex;height:128px;align-items:flex-start}
 .brand-mark{width:84px;height:84px;font-size:40px;flex:none}
 .nav-actions{width:calc(100% - 96px);max-width:none;margin-top:0;margin-left:auto}
 .nav-actions .hud-btn{font-size:clamp(23px,6.4vw,27px);min-height:55px;padding:6px 3px;letter-spacing:0}
 .mobile-worlds{bottom:calc(94px + env(safe-area-inset-bottom));padding:14px 16px;gap:12px}
 .mobile-worlds button{font-size:29px;min-height:78px;padding:14px 20px}
 .micro-footer{bottom:calc(14px + env(safe-area-inset-bottom))}
}
@media (max-width:360px) and (orientation:portrait){
 .brand-mark{width:72px;height:72px;font-size:36px}
 .nav-actions{width:calc(100% - 74px)}
 .nav-actions .hud-btn{font-size:20px}
 .nav-actions .hud-btn:nth-child(3){font-size:clamp(18px,5.4vw,20px)}
 .mobile-worlds button{font-size:26px}
}
/* v39.1 viewer: fixed stage size, crossfade between files, preview while loading */
.viewer-stage{position:relative;width:100%;aspect-ratio:16/10;max-height:72dvh;min-height:0;overflow:hidden;border-radius:9px;background:#01060c}
.viewer-stage>.viewer-media{position:absolute;inset:0;width:100%;height:100%;max-width:none;max-height:none;object-fit:contain;border-radius:0;opacity:0;transition:opacity .26s ease}
.viewer-stage>.viewer-media.shown{opacity:1}
.viewer-stage>.viewer-error{display:flex;align-items:center;justify-content:center;margin:0;color:#a1bbcb}
.viewer-stage.loading::after{content:"";position:absolute;right:14px;bottom:14px;width:18px;height:18px;border:2px solid #81e5ff33;border-top-color:#81e5ffcc;border-radius:50%;animation:viewerSpin .8s linear infinite;pointer-events:none}
@keyframes viewerSpin{to{transform:rotate(360deg)}}
.viewer-caption[hidden]{display:none}
@media (prefers-reduced-motion:reduce){.viewer-stage>.viewer-media{transition:none}.viewer-stage.loading::after{animation:none}}