/* Rooms of the world (16 Oct 2026, the owner: "внутренние страницы уже без эффекта такого как у нас воздушности и плоские").
   Every inner page stands in one place of the homepage's world: the same pre-rendered stills as the airy level
   (images/space-stills), two to four per page, handed over as the page scrolls (js/space-room.js) with a slow push-in,
   so reading a page is a short flight through its part of the world. A veil in the theme's own paper keeps the copy's
   ink: white on the deep rooms by night, the page's dark ink on a light frost by day. The old page field stands down. */
html[data-room]{background:#000208}
html[data-room]:not([data-theme=dark]){background:#e2e5eb}
html[data-room] body{background:transparent!important}
html[data-room] body::after{opacity:0!important}          /* no page grain over the stills: the renders carry their own */
html[data-room].no-field body::before,html[data-room] body::before{display:none!important}
.room-world{position:fixed;inset:0;width:100%;height:100lvh;z-index:-2;overflow:hidden;pointer-events:none;contain:strict}
.room-still{position:absolute;inset:-2%;opacity:0;will-change:opacity,transform;transform-origin:50% 55%}
.room-still img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.room-veil{position:fixed;inset:0;height:100lvh;z-index:-1;pointer-events:none;background:var(--room-veil)}
html[data-room]{--room-veil:rgba(7,10,16,.46)}
html[data-room]:not([data-theme=dark]){--room-veil:rgba(240,243,249,.7)}
/* cases carry dense product screens: a calmer room behind them */
html[data-room=case]{--room-veil:rgba(7,10,16,.58)}
html[data-room=case]:not([data-theme=dark]){--room-veil:rgba(240,243,249,.78)}
@media (prefers-reduced-motion:reduce){.room-still{will-change:opacity}}
/* The live world inside (17 Oct, work/space/PLAN-LIVE-ROOMS.md): html.room-live has the homepage's world behind the
   page; the stills are its poster until the first frame, then hand over and leave. */
html.room-live .space-world,html.room-live .space-fade{position:fixed;inset:0;width:100%;height:100lvh;z-index:-3;display:block;pointer-events:none}
html.room-live .space-world{opacity:0;transition:opacity 1.2s cubic-bezier(.16,1,.3,1)}
html.room-live .space-world.is-ready{opacity:1}
html.room-live .space-fade{opacity:0}
.room-world{transition:opacity 1.2s cubic-bezier(.16,1,.3,1)}
.room-world.is-handed{opacity:0}
@media (prefers-reduced-motion:reduce){html.room-live .space-world{transition-duration:.25s}}
/* the footer's own water scene stands down: the world is the art behind the footer now */
html.room-live .footer-art{display:none}
/* the openers with their own scene (About's glass head, the 404 folds) stop being a card on the world: edge to edge,
   no radius, and the lower edge dissolves into the room, so the scene reads as the place you arrive in */
html.room-live body[data-page=about] .page-opening.about-head-hero,html.room-live body .hero-frame{margin:0!important;border-radius:0!important;height:100svh!important;
 -webkit-mask-image:linear-gradient(#000 0 95%,transparent);mask-image:linear-gradient(#000 0 95%,transparent)}
html.room-live body .hero-frame{min-height:100svh}

/* ---- the live world inside, finishing pass (17 Oct) --------------------------------------------------------------
   The four weak points the owner found on the evening of 16 Oct. On the homepage css/space.css turns the page's own
   plates into glass over the world; inner pages never got that layer, because it hangs on html:is(.space-on,.airy)
   and a room publishes data-room-world instead. These rules give the rooms the same treatment, scoped to .room-live
   so the still-room fallback is untouched. One ink per section stays the rule; nothing gets a frame or a shadow. */

/* the display face of the world on inner pages too (Instrument Serif since 21 Oct, css/type-2026.css; it once carried
   the variable axes the type lens, js/space-type.js, moved) */
html.room-live :is(.section-heading h1,.about-opening-copy h1,.page-opening h1,.cv-opening h1,.gallery-opening-copy h1,.case-cover-copy h1,.hero-copy h1){
 font-family:'Archivo Lens',Basel,Arial,sans-serif;font-variation-settings:normal;font-kerning:normal}

/* About hero: the glass head used to sit on an opaque card, which read as a light plate on the dark world (and
   inverted by day). The card goes; the head stands in the room, the copy keeps the page ink. */
html.room-live body[data-page=about] .about-head-hero{background:transparent!important}
html.room-live body[data-page=about] .about-opening-copy{background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
/* The About opener keeps its own scene (`.about-head-art`): the glass head is the subject of the page, not decoration.
   Its canvas clears to its own colour inside WebGL, so CSS cannot see through it — the scene itself has to be told to
   use the room's palette (js/3d/glass-head.js stops inverting the hero inside a room). The plate behind it goes. */
html:is(.room-world-live,[data-room]) body[data-page=about] .about-head-art{background:transparent!important}
/* The opener's ink follows the scene, not the old inverted card: the hero is now night in the dark theme, so its copy
   is light there (it had been dark-on-dark the moment the inversion was dropped). One ink per section. */
html:is(.room-world-live,[data-room])[data-theme=dark] body[data-page=about] .about-head-hero :is(h1,p,.about-opening-copy){color:#f4f7fd!important}
html:is(.room-world-live,[data-room])[data-theme=dark] body[data-page=about] .about-head-hero p{color:rgba(244,247,253,.84)!important}
/* by day the head stands in a pale room, but --hero-ink still carried the old inverted card's white (seen 17 Oct:
   white "Dmytro Dintsen." on a near-white frame): the page's dark ink there */
html:is(.room-world-live,[data-room]):not([data-theme=dark]) body[data-page=about] .about-head-hero{--hero-ink:#15181e}
html:is(.room-world-live,[data-room]):not([data-theme=dark]) body[data-page=about] .about-head-hero :is(h1,.about-opening-copy){color:#15181e!important}
html:is(.room-world-live,[data-room]):not([data-theme=dark]) body[data-page=about] .about-head-hero p{color:rgba(21,24,30,.78)!important}

/* Approach: the scene's own opaque background covered the world, and the cycle panels and practice cards sat on
   plates. The scene keeps its forms but lets the room through, and the panels become the same deep glass as the
   homepage's industry panels (css/space.css), not opaque cards. */
html.room-live body[data-page=approach] :is(.scene-art,.cycle-diagram,.cycle-model,[data-scene]){background:transparent!important}
html.room-live body[data-page=approach] :is(.cycle-panel,.practice-detail,.cycle-detail,.approach-intro){
 background:color-mix(in srgb,#12151b 26%,transparent)!important;-webkit-backdrop-filter:blur(10px) saturate(1.2);backdrop-filter:blur(10px) saturate(1.2);
 border:0!important;box-shadow:none!important}
/* Seen in the browser (17 Oct): white glass at 32 % over the bright day sky was a white-on-white wash — the panels
   had no edge and the frame read as a blown highlight, which is what the owner called "засветы". By day the glass
   takes the page's own navy at a low strength instead: it reads as glass over the sea, the copy keeps its dark ink,
   and the panel has an edge again without a frame or a shadow. */
html.room-live:not([data-theme=dark]) body[data-page=approach] :is(.cycle-panel,.practice-detail,.cycle-detail,.approach-intro){
 background:color-mix(in srgb,#e1e4ea 62%,transparent)!important;-webkit-backdrop-filter:blur(14px) saturate(1.15);backdrop-filter:blur(14px) saturate(1.15)}

/* the round arrow (404 "Back to homepage", redesign.css) was a 1px ring: no frames in this style. A solid white disc
   with the navy arrow, the site's button rule */
html.room-world-live body .round-arrow{border:0!important;background:#f4f7fd!important;color:#15181e!important}

/* Explore: the orb's live canvas no longer starts over the world, so its poster stood alone, a render with its own dark
   background baked in: a dark plate beside the heading (seen 17 Oct). The world's own glass sphere is the orb here. */
html.room-world-live body .explore-orb{display:none!important}

/* Approach opener (17 Oct, Zelda pass): it stands over the painted open sea, a saturated blue in both themes, where the
   day ink (navy heading, slate lede rgb(86,89,95)) had no contrast. One ink for the section: light in both themes. */
html.room-world-live body[data-page=approach] .page-opening :is(h1,h2){color:#f4f7fd!important}
html.room-world-live body[data-page=approach] .page-opening p{color:rgba(244,247,253,.86)!important}
/* the same sea runs the whole page: by day the cycle and practice panels were pale rectangles (a plate with hard
   corners) and the cycle's stage names a slate grey on blue. In the live world they stand bare, in the light ink. */
html.room-world-live:not([data-theme=dark]) body[data-page=approach] :is(.cycle-panel,.practice-detail,.cycle-detail,.approach-intro){
 background:transparent!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
html.room-world-live body[data-page=approach] :is(.design-cycle,.practice-grid,.cycle-panel,.cycle-detail,.practice-detail) :is(h2,h3,h4,p,li,.cycle-tab){color:#f4f7fd!important}
html.room-world-live body[data-page=approach] :is(.design-cycle,.practice-grid) :is(p,li){color:rgba(244,247,253,.84)!important}
/* the three practice cards (Product logic, One interface system, Ready for handoff) were still white glass plates
   (portfolio-polish-v54.css: 66 % white + backdrop blur) under the light ink — white text on a pale plate, unreadable
   (seen 18 Oct, review P0); their headings were the acid accent blue, a second ink. In the world they stand bare, in
   the section's one light ink, divided by air alone */
html.room-world-live body[data-page=approach] .practice-grid article{background:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;
 border:0!important;border-radius:0!important;box-shadow:none!important;padding-left:0!important;padding-right:0!important}
html.room-world-live body[data-page=approach] .practice-grid article :is(h3,h3 *){color:#f4f7fd!important;-webkit-text-fill-color:#f4f7fd!important;background:none!important}

/* 404: the audit found its heading at rgb(28,31,37) — the page's dark ink on the night world, unreadable. The lost
   page stands in the orbit, which is dark in both themes (like the homepage hero, css/space.css), so its copy is
   light in both. Its own folds scene (`.hero-art`) sits at z-index -3 with a transparent backdrop and is part of the
   room, not a cover over it, so it stays. */
html.room-live body .hero-frame :is(h1,h2,p,.hero-note){color:#f4f7fd!important}
html.room-live body .hero-frame p{color:rgba(244,247,253,.84)!important}
/* ...except that the folds scene (`.hero-art`) still inverts with the theme: in the dark theme it clears to a pale
   frame and covers the orbit, so the white copy vanished (seen 17 Oct). The ink follows what is actually behind it. */
html.room-live[data-theme=dark] body .hero-frame :is(h1,h2,p,.hero-note){color:#15181e!important}
html.room-live[data-theme=dark] body .hero-frame p{color:rgba(21,24,30,.78)!important}

/* Case pages: the opener continues the ring scene instead of standing on its own flat ground. */
html.room-live body[data-page=case] .case-cover{background:transparent!important}
html.room-live body[data-page=case] .case-cover-copy{background:transparent!important}

/* ---- light and colour over the live world (17 Oct, second pass) ---------------------------------------------------
   The owner: «настроить цвета, графику, а то были странные свечения, засветы». Three causes, all here:

   1. The veil. It was written for the *stills*, which are flat renders that need dimming for white copy. The live
      world dims itself from the camera's own position (js/space-dim.js), so the same veil on top of it was a second
      dimming — and on the light theme a 70–78 % white sheet over a moving frame reads as a wash, a flat glare rather
      than air. PLAN-LIVE-ROOMS.md said the veil should be "lighter when live"; this is that rule, finally applied.
   2. The cursor light (.cursor-light, css/portfolio-v42.css) is a 560 px radial blob set to mix-blend-mode:screen on
      the dark theme. Screen only ever brightens: over a dark page it is a soft sheen, but over the lit world it is a
      moving bright patch that follows the pointer — the "странное свечение". It belongs to the flat pages.
   3. The page grain and the old page field are already off; nothing else may add light on top of the world. */
/* `html[data-room]` above carries the same weight as a single class, so these must also name [data-room] to win;
   without it the stills' own 46–78 % veil stayed in force over the live world. */
html.room-world-live[data-room]{--room-veil:rgba(7,10,16,.18)}
html.room-world-live[data-room]:not([data-theme=dark]){--room-veil:rgba(231,234,240,.22)}
html.room-world-live[data-room=case]{--room-veil:rgba(7,10,16,.3)}        /* cases still need a calm bed for dense screens */
html.room-world-live[data-room=case]:not([data-theme=dark]){--room-veil:rgba(231,234,240,.36)}
/* CV by day opens under water on the way up to the dawn: a mid cobalt under dark ink read heavy (review 18 Oct, P1
   1.3d). A luminous aqua sheet lifts the water to a clear sea-blue; the ink stays dark and gains contrast */
html.room-world-live[data-room=cv]:not([data-theme=dark]){--room-veil:linear-gradient(rgba(234,237,243,.42),rgba(234,237,243,.22) 70%)}
html.room-world-live .room-veil{transition:background 1.2s cubic-bezier(.16,1,.3,1)}
/* the pointer's own glow never lights the world; the world answers the cursor by itself (space-world.js onPointer) */
html.room-world-live .cursor-light{display:none!important}
/* The world's own veil. js/3d/space-world.js mounts .space-dim and drives it from the camera's position on every page
   (setDim at line 432), but the rule for it lived only in css/space.css, which inner pages never load — so the sheet
   was mounted and invisible, and the copy had to rely on the flat room veil instead. Same sheet, same deep blue as the
   homepage: it only dims where the camera is over a bright frame. */
html.room-live .space-dim{position:fixed;inset:0;width:100%;height:100lvh;z-index:-2;pointer-events:none;
 background:#0c0f15;opacity:var(--space-dim,0);transition:opacity 1.2s cubic-bezier(.65,0,.35,1)}
@media (prefers-reduced-motion:reduce){html.room-live .space-dim{transition:none}}

/* Once the world has drawn its first frame (js/space-room.js adds .room-world-live), the page's own decorative WebGL
   scenes stand down: two contexts were drawing the same frame, which is what made the inner pages heavy on phones.
   The About glass head keeps its scene — it is the subject of that page, not decoration. */
html.room-world-live body:is([data-page=approach],[data-page=gallery],[data-page=work],[data-page=cv]) :is(.scene-art,[data-scene]:not([data-service-preview]):not(.os-live))>canvas{display:none!important}
html.room-world-live body:is([data-page=approach],[data-page=gallery],[data-page=work],[data-page=cv]) :is(.scene-art,[data-scene]:not([data-service-preview]))>.scene-poster{opacity:0!important}
/* Seen in the browser (17 Oct): Approach's own tile field is `.tile-field > canvas.kit-canvas` — it carries no
   [data-scene] attribute and is not .scene-art, so the rules above never reached it. It sits at z-index 0 against the
   world's -3 and covered the whole frame: the page looked like the old flat scene with no world behind it at all.
   The opener keeps the tiles (they are the page's own art); past the first screen the world takes over. */
/* The decorative scene kit (js/3d/scene-kit.js) mounts `canvas.kit-canvas` inside whatever block asked for a scene:
   `.tile-field` on Approach, the cover ring on Work, the tunnel on Explore. None of them carry [data-scene] or
   .scene-art, so the attribute rules above never reached any of them — the audit found the same canvas covering the
   world on Work as well (754x516, z-index above the world's -3). One rule for the kit, everywhere the world is live.
   The About head is not the kit and keeps its own scene: it is the subject of that page. */
html.room-world-live canvas.kit-canvas{opacity:0!important;transition:opacity 1.2s cubic-bezier(.16,1,.3,1);pointer-events:none}
@media (prefers-reduced-motion:reduce){html.room-world-live canvas.kit-canvas{transition:none}}
/* the footer's water scene is already off; its poster goes too, so nothing decodes for it */
html.room-world-live .footer-art img{display:none!important}

/* SOTD review 18 Oct: the supplied-material sections painted a 78% surface plate with hard seams across the room's
   world (Pass, "One security system across every screen."); in the live world they sit on the world like the rest */
html.room-world-live .case-supplied-v52:not(#_u){background:transparent!important}

/* 20 Oct: a room page is a room from its first paint. The head's posters followed the old inversion (a light page showed
   the dark head) until the world's hand-over, so the arrival's cells opened on a dark negative head on the paper page
   for a second; in a room the poster takes the room's palette, like the live head (js/3d/glass-head.js). */
html[data-room] .head-fallback[data-surface=dark]{display:none}
html[data-room] .head-fallback[data-surface=light]{display:block}
html[data-room][data-theme=dark] .head-fallback[data-surface=light]{display:none}
html[data-room][data-theme=dark] .head-fallback[data-surface=dark]{display:block}
