.room-page{background:var(--room-night);color:var(--on-dark)}.room-scene{aspect-ratio:1145/768;isolation:isolate;width:min(100%,149svh - 101.32px);max-width:1440px;margin:0 auto;position:relative}.room-backdrop{object-fit:contain;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.room-wall{z-index:3;display:grid;position:absolute}.room-wall--main{transform-origin:0 0;grid-template-columns:repeat(3,minmax(0,1fr));gap:7% 13.7%;width:31%;top:19%;left:9.45%;transform:skewY(-15deg)}.room-wall--side{transform-origin:0 0;grid-template-columns:repeat(4,minmax(0,1fr));gap:13% 5%;width:23%;top:13%;left:57%;transform:skewY(17deg)}.project-cd{aspect-ratio:1;white-space:normal;background:0 0;border:0;border-radius:3px;width:100%;min-width:0;height:auto;padding:0;transition:transform .18s;display:block;position:relative}.project-cd:hover{z-index:5;background:0 0;transform:translateY(-4px)}.project-cd__case{border:2px solid var(--room-case-edge);background:var(--room-case);width:100%;height:100%;box-shadow:3px 5px 6px color-mix(in oklab, var(--room-shadow) 70%, transparent), inset 0 0 0 1px var(--on-dark);border-left-width:6px;border-radius:3px;display:block;position:relative}.project-cd__case:after{content:"";background:var(--room-disc);z-index:-1;border:1px solid var(--room-case-edge);border-radius:50%;width:24%;height:86%;position:absolute;top:7%;right:-9%}.project-cd__cover{object-fit:cover;border-radius:1px;width:100%;height:100%;padding:0;font-size:10px;line-height:1.3;display:block}.project-cd__shine{background:linear-gradient(120deg, transparent 25%, color-mix(in oklab, var(--on-dark) 18%, transparent) 45%, transparent 65%);pointer-events:none;position:absolute;inset:0}.project-cd__label{font-family:var(--font-display);letter-spacing:0;color:var(--on-dark);background:color-mix(in oklab, var(--room-shadow) 87%, transparent);text-align:center;overflow-wrap:anywhere;padding:4px 3px;font-size:10px;font-weight:600;line-height:1.2;position:absolute;bottom:0;left:0;right:0}.room-wall--side .project-cd__label{opacity:0;border:1px solid var(--electric);pointer-events:none;border-radius:4px;width:max-content;max-width:170px;padding:5px 8px;bottom:-30px;left:50%;right:auto;transform:translate(-50%)skewY(-17deg)}.room-wall--side .project-cd:hover .project-cd__label,.room-wall--side .project-cd:focus-visible .project-cd__label{opacity:1}.project-cd:hover .project-cd__case,.project-cd:focus-visible .project-cd__case{border-color:var(--electric);box-shadow:0 0 18px color-mix(in oklab, var(--electric) 45%, transparent)}.project-cd--selected .project-cd__case{opacity:.3;border-color:var(--amber)}.project-cd:focus-visible{outline:3px solid var(--electric);outline-offset:5px}.room-character{aspect-ratio:896/1200;pointer-events:none;z-index:4;transform-origin:60% 80%;width:21.2%;transition:transform .5s;position:absolute;top:33.8%;left:28.3%}.room-character img{object-fit:contain;width:100%;height:100%;transition:opacity .18s;position:absolute;inset:0}.room-desk-light{background:var(--electric);width:28%;height:1%;box-shadow:0 0 14px var(--electric);opacity:.25;pointer-events:none;animation:5s ease-in-out infinite alternate room-light;position:absolute;top:58%;left:11%}@keyframes room-light{to{opacity:.65}}.room-hero{grid-template-columns:minmax(0,1fr) minmax(0,.8fr);align-items:center;gap:32px;max-width:1200px;margin:0 auto;padding:28px 32px 36px;display:grid}.room-hero__title{font-family:var(--font-display);letter-spacing:0;margin-top:10px;font-size:28px;font-weight:700;line-height:1.2}.room-hero__description{color:color-mix(in oklab, var(--on-dark) 70%, transparent);font-size:13px;line-height:1.8}.room-flying-cd{z-index:60;pointer-events:none;border:3px solid var(--room-case-edge);box-shadow:0 18px 50px color-mix(in oklab, var(--room-shadow) 80%, transparent), 0 0 28px color-mix(in oklab, var(--electric) 30%, transparent);border-radius:4px;transition:transform .6s cubic-bezier(.2,.7,.25,1),opacity .15s;position:fixed;overflow:hidden}.room-flying-cd img,.room-flying-cd [role=img]{object-fit:cover;width:100%;height:100%}.room-modal-backdrop{z-index:70;background:color-mix(in oklab, var(--room-shadow) 76%, transparent);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);position:fixed;inset:0}.room-modal{z-index:71;background:var(--room-panel);width:min(960px,100% - 32px);max-height:88svh;color:var(--on-dark);border:2px solid color-mix(in oklab, var(--electric) 55%, var(--room-panel));box-shadow:0 24px 90px color-mix(in oklab, var(--room-shadow) 90%, transparent);border-radius:8px;flex-direction:column;display:flex;position:fixed;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)}.room-modal__header{border-bottom:1px solid var(--hairline);background:color-mix(in oklab, var(--electric) 6%, var(--room-panel));grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px;padding:14px 22px;display:grid}.room-modal__body{overscroll-behavior:contain;padding:24px;overflow-y:auto}.room-modal__close{flex-shrink:0;width:36px;height:36px;padding:0}.room-modal__meta{border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:18px;margin:20px 0;padding:20px 0;display:grid}.room-modal__meta dt{color:var(--electric);text-transform:uppercase;letter-spacing:0;margin-bottom:5px;font-size:10px}.room-modal__meta dd{font-size:13px;line-height:1.5}.room-modal__section{border-top:1px solid var(--hairline);padding:24px 0}.room-modal__section h3{font-family:var(--font-display);font-size:20px;font-weight:700;line-height:1.3}.room-modal__section p,.room-modal__section li{color:color-mix(in oklab, var(--on-dark) 80%, transparent);margin-top:12px;font-size:14px;line-height:1.8}.room-modal__media{margin:0 0 24px}.room-media__viewport{background:var(--room-shadow);border-radius:6px;height:min(40svh,420px);position:relative;overflow:hidden}.room-media__viewport img,.room-media__viewport iframe,.room-media__viewport [role=img]{object-fit:contain;border:0;width:100%;height:100%}.room-media__controls{grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;padding:10px 0;display:grid}.room-media__caption{text-align:center;min-width:0;color:var(--on-dark);font-size:12px;line-height:1.5}.room-media__thumbs{gap:8px;padding:5px 2px 12px;display:flex;overflow-x:auto}.room-media__thumb{border:2px solid var(--hairline);background:var(--room-shadow);flex-shrink:0;width:88px;height:55px;padding:0;overflow:hidden}.room-media__thumb[aria-pressed=true]{border-color:var(--electric)}.room-media__thumb img{object-fit:cover;width:100%;height:100%}.room-flat{display:none}@media (width>=1440px){.room-wall--main .project-cd__label{font-size:12px}}@media (width<=767px){.room-scene{width:100%}.room-wall{display:none}.room-hero{grid-template-columns:minmax(0,1fr);gap:12px;padding:20px 20px 4px}.room-hero__title{font-size:25px}.room-flat{padding:12px 20px 36px;display:block}.room-flat__heading{font-family:var(--font-display);margin:24px 0 16px;font-size:18px;font-weight:700}.room-flat__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;display:grid}.room-flat__grid--side{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.room-flat .project-cd{aspect-ratio:auto;padding-bottom:4px}.room-flat .project-cd__case{aspect-ratio:1;height:auto}.room-flat .project-cd__label{background:0 0;min-height:34px;margin-top:8px;padding:0;font-size:12px;line-height:1.4;position:static}.room-flat__grid--side .project-cd__label{font-size:11px}.room-modal{width:calc(100% - 16px);max-height:94svh}.room-modal__body{padding:16px}.room-modal__header{padding:10px 16px}}@media (prefers-reduced-motion:reduce){.room-page *,.room-modal *,.room-modal{scroll-behavior:auto;transition:none;animation:none}.room-desk-light{animation:none}}.room-page{isolation:isolate;background:0 0;position:relative;overflow:hidden}.room-ambient{z-index:-1;filter:blur(70px)saturate(150%)brightness(.7);background-position:50%;background-size:cover;position:absolute;inset:-10%;transform:scale(1.15)}.room-ambient:after{content:"";background:color-mix(in oklab, var(--room-night) 45%, transparent);position:absolute;inset:0}.room-hero{border-radius:28px;max-width:1160px;margin:8px auto 28px}@media (width<=767px){.room-hero{margin:12px 12px 8px}}.room-modal{background:color-mix(in oklab, var(--room-panel) 62%, transparent);-webkit-backdrop-filter:blur(30px)saturate(180%);backdrop-filter:blur(30px)saturate(180%);border:1px solid color-mix(in oklab, var(--on-dark) 22%, transparent);box-shadow:inset 0 1px 0 color-mix(in oklab, var(--on-dark) 30%, transparent), 0 24px 90px color-mix(in oklab, var(--room-shadow) 85%, transparent);border-radius:24px}.room-modal__header{background:color-mix(in oklab, var(--on-dark) 6%, transparent)}.room-modal-backdrop{-webkit-backdrop-filter:blur(14px)saturate(140%);backdrop-filter:blur(14px)saturate(140%);background:color-mix(in oklab, var(--room-shadow) 50%, transparent)}.room-media__viewport{border-radius:16px}.room-media__thumb{border-radius:10px}.project-cd__label{-webkit-backdrop-filter:blur(10px)saturate(160%);backdrop-filter:blur(10px)saturate(160%);background:color-mix(in oklab, var(--room-shadow) 55%, transparent)}.room-fx{pointer-events:none;z-index:2;position:absolute;inset:0}.room-fx>*{display:block;position:absolute}.fx-bolt{background:radial-gradient(closest-side, color-mix(in oklab, var(--amber) 90%, var(--on-dark)), transparent);mix-blend-mode:screen;opacity:0;width:5.5%;height:14%;animation:4.2s step-end infinite fx-flash;top:41%;left:1.2%}@keyframes fx-flash{0%,to{opacity:0}62%{opacity:.9}63%{opacity:.1}65%{opacity:.75}67%{opacity:0}88%{opacity:.5}89%{opacity:0}}.fx-keyboard{clip-path:polygon(0% 62%,90% 0%,100% 34%,9% 100%);background:linear-gradient(90deg, var(--magenta), var(--amber), var(--electric), var(--violet), var(--magenta));mix-blend-mode:color-dodge;opacity:.55;background-size:300% 100%;width:9.8%;height:7%;animation:3s linear infinite fx-rgb;top:50%;left:26.6%}@keyframes fx-rgb{to{background-position:300% 0}}.fx-steam{width:2.4%;height:6.5%;top:49.5%;left:23.2%}.fx-steam i{background:color-mix(in oklab, var(--on-dark) 55%, transparent);filter:blur(3px);opacity:0;border-radius:50%;width:30%;height:60%;animation:3s ease-out infinite fx-steam;position:absolute;bottom:0;left:40%}.fx-steam i:nth-child(2){animation-delay:1s;left:15%}.fx-steam i:nth-child(3){animation-delay:2s;left:60%}@keyframes fx-steam{0%{opacity:0;transform:translateY(20%)scale(.6)}30%{opacity:.7}to{opacity:0;transform:translate(-30%,-90%)scale(1.3)}}.fx-record{width:4.5%;height:3.3%;top:43.3%;left:62.1%}.fx-record b{aspect-ratio:1;border-radius:50%;height:auto;margin:auto;position:absolute;inset:0 25%;transform:scaleY(.45)}.fx-record:before{content:"";background:conic-gradient(from 0deg, transparent 0 20%, color-mix(in oklab, var(--on-dark) 45%, transparent) 25%, transparent 30% 70%, color-mix(in oklab, var(--on-dark) 35%, transparent) 75%, transparent 80%);mix-blend-mode:screen;border-radius:50%;animation:1.8s linear infinite fx-spin;position:absolute;inset:0}@keyframes fx-spin{0%{clip-path:ellipse(50% 50%);filter:hue-rotate();transform:scaleX(1)}50%{transform:scaleX(-1)}to{transform:scaleX(1)}}.fx-notes{width:8%;height:13%;top:30%;left:62%}.fx-notes i{color:var(--amber);text-shadow:0 0 8px var(--amber);opacity:0;font-size:clamp(10px,1.4vw,20px);font-style:normal;animation:4s ease-out infinite fx-note;position:absolute;bottom:0;left:30%}.fx-notes i:nth-child(2){color:var(--electric);text-shadow:0 0 8px var(--electric);animation-delay:1s;left:55%}.fx-notes i:nth-child(3){color:var(--magenta);text-shadow:0 0 8px var(--magenta);animation-delay:2s;left:10%}.fx-notes i:nth-child(4){color:var(--violet);text-shadow:0 0 8px var(--violet);animation-delay:3s;left:70%}@keyframes fx-note{0%{opacity:0;transform:translate(0)rotate(-10deg)}15%{opacity:1}50%{transform:translate(-40%,-250%)rotate(10deg)}to{opacity:0;transform:translate(30%,-500%)rotate(-8deg)}}.fx-dog{background-image:var(--room-bg);transform-origin:50% 100%;width:11.8%;height:10.5%;-webkit-mask:radial-gradient(closest-side, var(--on-dark) 75%, transparent);-webkit-mask:radial-gradient(closest-side, var(--on-dark) 75%, transparent);-webkit-mask:radial-gradient(closest-side, var(--on-dark) 75%, transparent);mask:radial-gradient(closest-side, var(--on-dark) 75%, transparent);background-position:66.33% 92.18%;background-size:847.5% 952.4%;animation:3.4s ease-in-out infinite fx-breathe;top:82.5%;left:58.5%}@keyframes fx-breathe{0%,to{transform:scale(1)}45%{transform:scale(1.015,1.05)}}.fx-zzz{width:5%;height:9%;top:76%;left:68%}.fx-zzz i{font-style:normal;font-weight:700;font-family:var(--font-display);color:var(--on-dark);opacity:0;font-size:clamp(9px,1.1vw,16px);animation:3.4s ease-out infinite fx-z;position:absolute;bottom:0;left:0}.fx-zzz i:nth-child(2){animation-delay:1.1s}.fx-zzz i:nth-child(3){font-size:clamp(11px,1.4vw,20px);animation-delay:2.2s}@keyframes fx-z{0%{opacity:0;transform:translate(0)}20%{opacity:.85}to{opacity:0;transform:translate(140%,-220%)rotate(15deg)}}.room-desk-light{background:linear-gradient(90deg, var(--electric), var(--violet), var(--magenta), var(--electric));background-size:300% 100%;animation:5s ease-in-out infinite alternate room-light,6s linear infinite fx-rgb}@media (prefers-reduced-motion:reduce){.room-fx *,.room-fx:before,.room-character img,.project-cd__case,.room-desk-light{animation:none!important}.fx-record:before{animation:none}}.room-character__chair{opacity:0}.room-character__head{transform-origin:57% 30%;animation:.9s ease-in-out infinite fx-groove}@keyframes fx-groove{0%,to{transform:rotate(-2.5deg)}25%{transform:rotate(0)translateY(.6%)}50%{transform:rotate(2.5deg)}75%{transform:rotate(0)translateY(.6%)}}.room-character--standing .room-character__body,.room-character--standing .room-character__head{opacity:0}.room-character--standing .room-character__chair{opacity:1}.room-walker{aspect-ratio:896/1200;z-index:6;pointer-events:none;opacity:0;width:21.2%;transition:left .65s cubic-bezier(.4,0,.2,1),top .65s cubic-bezier(.4,0,.2,1),opacity .2s;position:absolute;top:31%;left:26%}.room-walker img{object-fit:contain;opacity:0;width:100%;height:100%;transform:scaleX(var(--flip,1));transition:opacity .15s;position:absolute;inset:0}.room-walker--reach,.room-walker--carry{opacity:1;animation:.33s ease-in-out infinite alternate fx-walk}.room-walker--reach .room-walker__reach,.room-walker--carry .room-walker__carry{opacity:1}@keyframes fx-walk{to{translate:0 -1.5%}}.room-flying-cd{z-index:60;transition:transform .65s cubic-bezier(.4,0,.2,1),opacity .15s}.room-wall .project-cd__case{animation:2.8s ease-in-out infinite cd-breathe}.room-wall .project-cd:nth-child(2n) .project-cd__case{animation-delay:-.9s}.room-wall .project-cd:nth-child(3n) .project-cd__case{animation-delay:-1.8s}@keyframes cd-breathe{0%,to{box-shadow:3px 5px 6px color-mix(in oklab, var(--room-shadow) 70%, transparent);transform:scale(1)}50%{box-shadow:0 0 16px color-mix(in oklab, var(--electric) 45%, transparent);transform:scale(1.045)}}.project-cd:hover .project-cd__case{animation-play-state:paused}.room-whiteboard{z-index:20;background:color-mix(in oklab, var(--on-dark) 12%, transparent);-webkit-backdrop-filter:blur(18px)saturate(170%);border:1px solid color-mix(in oklab, var(--on-dark) 28%, transparent);max-width:220px;box-shadow:0 10px 30px color-mix(in oklab, var(--room-shadow) 60%, transparent);border-radius:16px;padding:12px 16px;animation:4s ease-in-out infinite wb-float;position:absolute;bottom:3%;right:2%}@keyframes wb-float{50%{transform:translateY(-6px)}}.room-whiteboard p{font-family:var(--font-display);color:var(--on-dark);margin:0;font-size:14px;font-weight:600;line-height:1.35}.room-splash{z-index:100;background:var(--room-night);place-items:center;transition:opacity .5s,visibility .5s;display:grid;position:fixed;inset:0}.room-splash--done{opacity:0;visibility:hidden}.room-splash__logo{font-family:var(--font-display);color:var(--on-dark);font-size:clamp(48px,9vw,96px);font-weight:800;animation:1.2s ease-in-out infinite splash-pulse}@keyframes splash-pulse{50%{opacity:.5;transform:scale(.94)}}@media (width<=767px){.room-walker,.room-whiteboard{display:none}}@media (prefers-reduced-motion:reduce){.room-character__head,.room-walker,.room-splash__logo,.room-whiteboard{animation:none!important}}.room-intro-curtain{z-index:80;background:var(--room-night);pointer-events:auto;position:fixed;inset:0}.room-whiteboard{z-index:90;animation:none}.room-whiteboard--intro{text-align:center;width:min(760px,100vw - 40px);max-width:760px;padding:40px;position:fixed;inset:50% auto auto 50%;transform:translate(-50%,-50%)}.room-whiteboard--intro p{font-size:36px;line-height:1.25}.room-page--instruction .room-scene>:not(.room-whiteboard):not(.room-intro-curtain),.room-page--logo .room-scene{visibility:hidden}.room-page--ready .room-backdrop{animation:1.1s both room-arrive}body:has(.room-page--logo,.room-page--instruction) .site-nav{visibility:hidden}@keyframes room-arrive{0%{opacity:0;filter:blur(8px)}to{opacity:1;filter:blur()}}.room-modal[data-state=open]{animation:.48s cubic-bezier(.22,1,.36,1) both room-modal-in}.room-modal-backdrop[data-state=open]{animation:.4s both room-overlay-in}@keyframes room-modal-in{0%{opacity:0;filter:blur(6px);transform:translate(-50%,-46%)scale(.88)}to{opacity:1;filter:blur();transform:translate(-50%,-50%)scale(1)}}@keyframes room-overlay-in{0%{opacity:0}to{opacity:1}}.room-hotspot{z-index:7;cursor:pointer;background:0 0;border:0;border-radius:8px;height:auto;min-height:0;padding:0;position:absolute}.room-hotspot:hover{box-shadow:0 0 20px color-mix(in oklab, var(--electric) 25%, transparent);background:0 0}.room-hotspot,.room-hotspot:hover{-webkit-backdrop-filter:none!important;background:0 0!important}.room-hotspot:focus-visible{outline:2px solid var(--electric);outline-offset:3px}.room-hotspot--bolt{width:5.5%;height:15%;top:41%;left:1%}.room-activity{z-index:6;pointer-events:none;position:absolute}.room-activity img{width:100%;height:auto;display:block}.room-activity--dance{transform-origin:50% 100%;width:19%;animation:1.2s ease-in-out infinite room-dance;bottom:10%;left:43%}@keyframes room-dance{0%,to{transform:rotate(-8deg)translate(-6%)}25%{transform:rotate(0)translateY(-5%)}50%{transform:rotate(8deg)translate(6%)}75%{transform:rotate(0)translateY(-5%)}}.fx-window-stars{width:9.1%;height:29%;top:18%;left:86.6%;overflow:hidden;transform:skewY(17deg)}.fx-window-stars i{background:linear-gradient(90deg, transparent, var(--on-dark));opacity:0;width:65%;height:2px;animation:8s ease-out infinite room-shooting-star;position:absolute;top:12%;left:120%;transform:rotate(-30deg)}.fx-window-stars i:nth-child(2){animation-delay:3.1s;top:36%}.fx-window-stars i:nth-child(3){animation-delay:5.4s;top:58%}@keyframes room-shooting-star{0%,80%,to{opacity:0;translate:0}82%{opacity:1}94%{opacity:0;translate:-220% 3600%}}.fx-disco{opacity:0;transition:opacity .6s;inset:0;overflow:hidden}.room-page--disco .fx-disco{opacity:1}.fx-disco i{transform-origin:50% 0;clip-path:polygon(48% 0,52% 0,100% 100%,0 100%);background:linear-gradient(180deg, color-mix(in oklab, var(--magenta) 32%, transparent), transparent);mix-blend-mode:screen;width:40%;height:130%;animation:4s ease-in-out infinite alternate room-disco-beam;position:absolute;top:-10%;left:15%}.fx-disco i:nth-child(2){background:linear-gradient(180deg, color-mix(in oklab, var(--electric) 38%, transparent), transparent);animation-delay:-2s;left:45%}.fx-disco i:nth-child(3){background:linear-gradient(180deg, color-mix(in oklab, var(--amber) 30%, transparent), transparent);animation-delay:-1s;left:65%}@keyframes room-disco-beam{0%{transform:rotate(-28deg)}to{transform:rotate(28deg)}}.room-page--disco .room-backdrop{animation:6s ease-in-out infinite room-party-color}@keyframes room-party-color{0%,to{filter:hue-rotate(-12deg)saturate(1.2)}50%{filter:hue-rotate(25deg)saturate(1.5)}}@media (width>=768px) and (aspect-ratio>=5/3) and (aspect-ratio<=2){.site-nav--home{position:fixed}.room-scene{aspect-ratio:auto;width:100%;max-width:none;height:100svh}.room-backdrop{object-fit:fill}.room-character,.room-walker{aspect-ratio:auto;height:42.3%}.room-hero{margin-top:16px}}@media (width<=767px){.room-whiteboard--intro{padding:28px 20px;display:block}.room-whiteboard--intro p{font-size:26px}.room-hotspot--bolt{width:8%}}@media (prefers-reduced-motion:reduce){.room-page *,.room-page :before,.room-modal[data-state=open],.room-modal-backdrop[data-state=open]{transition:none!important;animation:none!important}.fx-window-stars{display:none}}
