/* Interiors — gallery and full-bleed frame. */

/* ---------- gallery ---------- */
.ir-gallery{max-width:1400px;margin:auto;padding:72px 32px 110px}
.ir-gallery h1{font-size:clamp(58px,8.5vw,124px);font-weight:400;line-height:.92;letter-spacing:-.06em;margin:24px 0 34px}
.ir-gallery h1 em{font-style:normal;color:#c9b8ff}
.ir-intro{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:34px;max-width:1000px;margin-bottom:58px}
.ir-intro p{font-size:18px;line-height:1.65;color:var(--muted);margin:0}
.ir-wall+.ir-intro{margin:48px 0 0}
.ir-intro p:first-child{color:var(--body)}
.ir-wall{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
.ir-tile{grid-column:span 2;position:relative;display:block;aspect-ratio:4/3.1;border-radius:12px;overflow:hidden;background:#05060a;border:1px solid #23262b;color:#f2f4f6;text-decoration:none;isolation:isolate}
.ir-tile:nth-child(1),.ir-tile:nth-child(2),.ir-tile:nth-child(6),.ir-tile:nth-child(7){grid-column:span 3;aspect-ratio:16/9.5}
.ir-tile:hover,.ir-tile:focus-visible{border-color:var(--ir-accent);color:#fff}
.ir-tile:focus-visible{outline:2px solid var(--ir-accent);outline-offset:3px}
.ir-poster{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:-1;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.ir-tile:hover .ir-poster{transform:scale(1.035)}
.ir-tile-text{position:absolute;left:0;right:0;bottom:0;padding:60px 22px 20px;display:flex;flex-direction:column;gap:6px;background:linear-gradient(transparent,rgba(3,4,7,.92) 62%)}
.ir-tile-no{font:10px/1.4 var(--mono);text-transform:uppercase;letter-spacing:.14em;color:var(--ir-accent)}
.ir-tile-title{font:400 30px/1 var(--sans);letter-spacing:-.035em}
.ir-tile-eq{font:12px/1.4 var(--mono);color:var(--ir-accent);opacity:.9}
.ir-tile-cap{font:14px/1.5 var(--sans);color:#b9c0c7;max-width:44ch}
.ir-note{margin:34px 0 16px;max-width:760px;font:12px/1.7 var(--mono);color:var(--muted)}

/* ---------- full-bleed frame ---------- */
body.ir-playing .topbar,body.ir-playing .site-footer{display:none}
body.ir-playing{background:#05060a;overflow:hidden}
body.ir-playing main{min-height:100dvh}
.ir-piece{position:fixed;inset:0;background:#05060a;color:#eef1f4;font-family:var(--sans);--ir-accent:#c9b8ff;overflow:hidden;user-select:none;-webkit-user-select:none}
.ir-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.ir-canvas{transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.ir-piece.ir-drawer-open .ir-canvas{transform:translateX(calc(min(420px,92vw) / -2))}
.ir-over{touch-action:none;cursor:crosshair;outline:none}
.ir-over:focus-visible{box-shadow:inset 0 0 0 2px var(--ir-accent)}
.ir-chrome{transition:opacity .9s ease}
.ir-piece.ir-idle .ir-chrome{opacity:.12}
.ir-piece.ir-idle .ir-dock{opacity:.35}
.ir-piece button{font:12px var(--sans);min-height:40px;padding:9px 14px;border-radius:6px;border:1px solid rgba(255,255,255,.16);background:rgba(10,12,16,.55);color:#e6eaee;cursor:pointer;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.ir-piece button:hover{border-color:var(--ir-accent);color:#fff}
.ir-piece button[aria-pressed=true]{border-color:var(--ir-accent);color:var(--ir-accent);background:rgba(20,22,30,.75)}
.ir-piece kbd{font:10px var(--mono);opacity:.55;margin-left:4px}

.ir-top{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;gap:20px;padding:16px 22px;pointer-events:none;background:linear-gradient(rgba(5,6,10,.7),transparent)}
.ir-top>*{pointer-events:auto}
.ir-back{font:12px var(--mono);color:#c3cad1;text-decoration:none}
.ir-back:hover{color:#fff}
.ir-where{font:10px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ir-accent)}
.ir-top-actions{margin-left:auto;display:flex;gap:6px;align-items:center}
.ir-top-actions a{display:inline-grid;place-items:center;min-width:40px;min-height:40px;border-radius:999px;border:1px solid rgba(255,255,255,.16);color:#e6eaee;text-decoration:none;background:rgba(10,12,16,.55);font-size:16px}
.ir-top-actions a:hover{border-color:var(--ir-accent);color:#fff}

.ir-caption{position:absolute;left:28px;bottom:26px;max-width:min(560px,calc(100vw - 56px));pointer-events:none}
.ir-caption>*{pointer-events:auto;position:relative}
.ir-caption::before{content:'';position:absolute;left:-140px;bottom:-120px;width:calc(100% + 280px);height:calc(100% + 220px);background:radial-gradient(closest-side,rgba(5,6,10,.78),rgba(5,6,10,0));pointer-events:none}
.ir-caption h1{font:400 clamp(40px,4.8vw,70px)/.95 var(--sans);letter-spacing:-.05em;margin:0 0 10px;text-shadow:0 2px 30px rgba(0,0,0,.6)}
.ir-caption:has(.ir-insight:not([hidden])) h1{font-size:clamp(32px,3.6vw,48px)}
.ir-caption h1{transition:font-size .6s ease}
.ir-eq{font:15px/1.4 var(--mono);color:var(--ir-accent);margin:0 0 12px;text-shadow:0 1px 14px rgba(0,0,0,.9)}
.ir-sub{font:17px/1.5 var(--sans);color:#d5dbe0;margin:0 0 16px;text-shadow:0 1px 14px rgba(0,0,0,.9)}
.ir-guide{border-left:1px solid var(--ir-accent);padding:2px 0 2px 14px}
.ir-prompt{font:13px/1.55 var(--mono);color:#f2f4f6;margin:0;text-shadow:0 1px 10px #000}
.ir-prompt span{color:var(--ir-accent);margin-right:4px}
.ir-insight{font:15px/1.55 var(--sans);color:#f3efe6;margin:0 0 10px;text-shadow:0 1px 12px #000,0 0 2px #000;max-width:52ch}
.ir-insight::before{content:'✦ ';color:var(--ir-accent)}
.ir-insight b{color:var(--ir-accent);font-weight:600}
.ir-piece.ir-idle .ir-caption{opacity:.5}
.ir-insight.ir-flash{animation:ir-flash 1.2s ease}
@keyframes ir-flash{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.ir-dots{display:flex;gap:6px;margin-top:10px}
.ir-dots i{width:18px;height:3px;border-radius:2px;background:rgba(255,255,255,.18)}
.ir-dots i.on{background:var(--ir-accent)}
.ir-dots i.now{background:rgba(255,255,255,.55)}

.ir-dock{position:absolute;z-index:2;right:22px;bottom:22px;display:flex;flex-direction:column;align-items:stretch;gap:10px;width:min(272px,calc(100vw - 44px));padding:14px;border-radius:14px;background:rgba(8,10,14,.5);border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.ir-dock-body{display:flex;flex-direction:column;align-items:stretch;gap:10px}
.ir-dock-body>button{width:100%}
.ir-piece .ir-dock-toggle{align-self:flex-end;min-height:30px;padding:4px 12px;font:10px var(--mono);letter-spacing:.12em;text-transform:uppercase;border-color:transparent;background:none}
.ir-piece .ir-dock-toggle::after{content:' ▾'}
.ir-dock.ir-dock-closed{width:auto;padding:6px}
.ir-dock.ir-dock-closed .ir-dock-body{display:none}
.ir-dock.ir-dock-closed .ir-dock-toggle::after{content:' ▸'}
.ir-piece.ir-drawer-open .ir-dock{right:calc(min(420px,92vw) + 22px)}
.ir-range{display:flex;flex-direction:column;gap:6px;font:11px var(--mono);color:#c5ccd3}
.ir-range>span{display:flex;justify-content:space-between}
.ir-range output{color:var(--ir-accent)}
.ir-range input{width:100%;accent-color:var(--ir-accent);height:24px}
.ir-choice{display:flex;flex-direction:column;gap:6px}
.ir-choice-label{font:11px var(--mono);color:#c5ccd3}
.ir-choice>div{display:flex;flex-wrap:wrap;gap:5px}
.ir-choice button{min-height:34px;padding:6px 11px;font-size:11px}

.ir-drawer{position:absolute;top:0;right:0;bottom:0;width:min(420px,92vw);overflow-y:auto;padding:70px 28px 40px;background:rgba(6,7,11,.88);border-left:1px solid rgba(255,255,255,.08);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);user-select:text;-webkit-user-select:text}
.ir-drawer-close{position:absolute;top:16px;right:18px}
.ir-drawer-kicker{font:10px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ir-accent);margin:0 0 8px}
.ir-drawer h2{font:400 30px/1.1 var(--sans);letter-spacing:-.03em;margin:0 0 22px}
.ir-drawer h3{font:10px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#9aa4ae;margin:28px 0 10px}
.ir-drawer p{font:14px/1.7 var(--sans);color:#c8cfd6;margin:0 0 12px}
.ir-drawer p b,.ir-drawer p strong{color:#fff;font-weight:500}
.ir-live{border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:16px 18px;margin-bottom:22px;background:rgba(255,255,255,.025);font:13px/1.7 var(--mono);color:#e8ecef}
.ir-live .eq{font:15px/1.6 var(--mono);color:#fff;margin:0 0 10px;white-space:pre-wrap}
.ir-live .row{display:flex;justify-content:space-between;gap:12px;border-top:1px dashed rgba(255,255,255,.08);padding:4px 0}
.ir-live .row span:first-child{color:#9aa4ae}
.ir-live .hl{color:var(--ir-accent)}
.ir-live table{width:100%;border-collapse:collapse;font:12px var(--mono)}
.ir-live td,.ir-live th{padding:3px 4px;text-align:right;border-top:1px dashed rgba(255,255,255,.08)}
.ir-live th{color:#9aa4ae;font-weight:400}
.ir-live td:first-child,.ir-live th:first-child{text-align:left}
.ir-live .bar{display:inline-block;height:6px;border-radius:3px;background:var(--ir-accent);vertical-align:middle}
.ir-live .mat{display:inline-grid;grid-template-columns:auto auto;gap:0 16px;padding:2px 10px;border-left:1px solid #fff;border-right:1px solid #fff;vertical-align:middle;text-align:right}
.ir-honest{font-size:12.5px!important;color:#9aa4ae!important;border-left:2px solid rgba(255,255,255,.15);padding-left:12px}
.ir-refs{display:flex;flex-direction:column;gap:6px}
.ir-refs a{font:12px var(--mono);color:var(--ir-accent)}

@media (max-width:900px){
  .ir-wall{grid-template-columns:1fr 1fr}
  .ir-tile,.ir-tile:nth-child(n){grid-column:span 1;aspect-ratio:4/3.4}
  .ir-tile:nth-child(1){grid-column:span 2;aspect-ratio:16/10}
  .ir-intro{grid-template-columns:1fr}
}
@media (max-width:760px){
  .ir-gallery{padding:44px 16px 80px}
  .ir-wall{grid-template-columns:1fr}
  .ir-tile,.ir-tile:nth-child(n){grid-column:span 1;aspect-ratio:4/3.2}
  .ir-top{padding:10px 12px;gap:10px}
  .ir-where,.ir-top-actions kbd{display:none}
  .ir-top-actions button{padding:8px 11px}
  .ir-caption{left:16px;right:16px;bottom:64px}
  .ir-caption h1,.ir-caption:has(.ir-insight:not([hidden])) h1{font-size:30px;margin-bottom:6px}
  .ir-sub{font-size:13px;margin-bottom:8px}
  .ir-eq{font-size:12px;margin-bottom:6px}
  .ir-insight{font-size:13px;margin-bottom:6px}
  .ir-prompt{font-size:12px}
  .ir-top-actions .ir-step,.ir-wide{display:none}
  .ir-top-actions{gap:4px}
  .ir-dock{left:12px;right:12px;bottom:12px;width:auto;padding:10px;gap:8px}
  .ir-dock.ir-dock-closed{left:auto}
  .ir-dock-body{flex-direction:row;flex-wrap:wrap}.ir-dock-body>*{flex:1 1 140px}
  .ir-piece.ir-drawer-open .ir-dock{display:none}
  .ir-drawer{width:100vw}
}
@media (prefers-reduced-motion:reduce){.ir-poster,.ir-insight.ir-flash{transition:none;animation:none}}