@import url("https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;600&family=Syne:wght@600;800&display=swap");:root{color-scheme:dark;font-family:DM Sans,sans-serif;background:#101315;color:#f4f0e7}*{box-sizing:border-box}body,html{margin:0;min-height:100%;overflow:hidden}button{font:inherit}.boot-loader{display:grid;min-height:100vh;place-items:center;background:#101315}.studio-shell{position:relative;min-height:100svh;overflow:hidden;touch-action:pan-y;background:radial-gradient(circle at 50% 20%,#273033 0,#101315 55%)}.canvas-wrap{position:absolute;inset:0}.studio-header{position:absolute;z-index:5;top:0;left:0;right:0;display:flex;align-items:flex-start;justify-content:space-between;padding:max(clamp(1rem,3vw,2.5rem),env(safe-area-inset-top)) max(clamp(1rem,3vw,2.5rem),env(safe-area-inset-right)) 1rem max(clamp(1rem,3vw,2.5rem),env(safe-area-inset-left));pointer-events:none}.studio-header p{margin:0 0 .4rem;color:#b8f2cb;font-size:.72rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase}.studio-header h1{margin:0;font:800 clamp(1.6rem,4vw,3.8rem)/.95 Syne,sans-serif;letter-spacing:-.04em}.studio-header button{pointer-events:auto;border:1px solid #ffffff30;border-radius:999px;background:#101315b8;color:#f4f0e7;padding:.7rem 1rem;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);cursor:pointer}.room-label{width:9rem;border:1px solid #ffffff24;border-radius:1rem;padding:.7rem;background:#101315d9;color:#f4f0e7;text-align:left;opacity:.65;transition:opacity .25s,transform .25s,border-color .25s;cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.room-label.active,.room-label:hover{opacity:1;transform:translateY(-4px);border-color:#b8f2cb88}.room-label small,.room-label span{display:block}.room-label span{font:800 1rem Syne,sans-serif}.room-label small{margin-top:.25rem;color:#c5c9c7;line-height:1.25}.story-card{position:absolute;z-index:5;left:max(clamp(1rem,3vw,2.5rem),env(safe-area-inset-left));bottom:max(7.2rem,calc(6.2rem + env(safe-area-inset-bottom)));width:min(20rem,calc(100vw - 2rem));padding:1rem 1.15rem;border:1px solid #ffffff24;border-radius:1.25rem;background:#101315ba;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);pointer-events:none}.story-card span{color:#b8f2cb;font-size:.72rem;letter-spacing:.15em}.story-card h2{margin:.25rem 0;font:800 1.45rem Syne,sans-serif}.story-card p{margin:0;color:#c5c9c7}.outfit-picker{position:absolute;z-index:6;right:max(clamp(1rem,3vw,2.5rem),env(safe-area-inset-right));bottom:max(7.2rem,calc(6.2rem + env(safe-area-inset-bottom)));display:flex;gap:.45rem;margin:0;padding:.55rem;border:1px solid #ffffff24;border-radius:1rem;background:#101315ba;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.outfit-picker legend{padding:0 .35rem;color:#b8f2cb;font-size:.65rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase}.outfit-picker button{display:grid;place-items:center;grid-gap:.25rem;gap:.25rem;min-width:2.7rem;border:1px solid transparent;border-radius:.65rem;background:transparent;color:#aeb5b2;padding:.35rem;cursor:pointer}.outfit-picker button.selected{border-color:#b8f2cb;background:#ffffff12;color:#fff}.outfit-picker i{width:1.35rem;height:1.35rem;border:2px solid #ffffff55;border-radius:50%;background:#4d79a8}.outfit-picker span{font-size:.6rem}.outfit-picker .outfit-black i{background:#18191c}.outfit-picker .outfit-blue i{background:#4c76bb}.outfit-picker .outfit-brown i{background:#75513d}.scroll-progress{position:absolute;z-index:5;right:max(clamp(1rem,3vw,2.5rem),env(safe-area-inset-right));top:50%;display:flex;flex-direction:column;gap:.5rem;transform:translateY(-50%);pointer-events:none}.scroll-progress i{width:.35rem;height:1.4rem;border-radius:999px;background:#ffffff28;transition:height .3s,background .3s}.scroll-progress i.active{height:3rem;background:#b8f2cb}.controls{position:absolute;z-index:6;bottom:max(3.2rem,calc(2.4rem + env(safe-area-inset-bottom)));left:50%;display:flex;max-width:calc(100vw - 2rem);overflow-x:auto;border:1px solid #ffffff24;border-radius:999px;background:#101315d9;padding:.35rem;transform:translateX(-50%);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.controls button{flex:0 0 auto;border:0;border-radius:999px;background:transparent;color:#aeb5b2;padding:.65rem .9rem;cursor:pointer}.controls button.selected{background:#f4f0e7;color:#101315;font-weight:600}.controls button:disabled{opacity:.25;cursor:not-allowed}.hint{z-index:5;bottom:max(.85rem,env(safe-area-inset-bottom));left:50%;width:max-content;max-width:calc(100vw - 2rem);margin:0;transform:translateX(-50%);color:#8d9692;font-size:.72rem;text-align:center}.hint,.loader{position:absolute}.loader{z-index:10;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#101315}.loader span{color:#9ca5a1;text-transform:uppercase;letter-spacing:.18em;font-size:.7rem}.loader strong{margin:.5rem 0;font:800 3rem Syne,sans-serif}.loader div{width:min(16rem,70vw);height:3px;background:#ffffff18}.loader i{display:block;height:100%;background:#b8f2cb;transition:width .2s}@media(max-width:700px){.studio-header h1{max-width:12rem}.studio-header button{font-size:.75rem}.story-card{bottom:max(7.4rem,calc(6.4rem + env(safe-area-inset-bottom)))}.outfit-picker{top:max(9.6rem,calc(8.6rem + env(safe-area-inset-top)));right:max(1rem,env(safe-area-inset-right));bottom:auto}.outfit-picker span{position:absolute;width:1px;height:1px;overflow:hidden}.room-label{display:none}}@media(max-height:500px){.studio-header{padding:.75rem max(1rem,env(safe-area-inset-right)) .5rem max(1rem,env(safe-area-inset-left))}.studio-header p{font-size:.6rem}.studio-header h1{font-size:1.45rem}.studio-header button{padding:.5rem .75rem;font-size:.7rem}.story-card{left:max(1rem,env(safe-area-inset-left));bottom:max(6.2rem,calc(5.2rem + env(safe-area-inset-bottom)));width:17rem;padding:.65rem .85rem}.story-card h2{font-size:1.1rem}.story-card p{font-size:.75rem}.outfit-picker{top:4.6rem;right:max(1rem,env(safe-area-inset-right));bottom:auto;padding:.35rem}.outfit-picker button{min-width:2.25rem;padding:.25rem}.outfit-picker span{position:absolute;width:1px;height:1px;overflow:hidden}.room-label{display:none}.controls{bottom:max(2.25rem,calc(1.5rem + env(safe-area-inset-bottom)))}.hint{bottom:max(.35rem,env(safe-area-inset-bottom))}}@media(prefers-reduced-motion:reduce){*,:after,:before{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important}}:root{--night:#070711;--panel:rgba(9,9,24,.82);--panel-solid:#0d0d1d;--text:#f8f7ff;--muted:#b9b5cf;--cyan:#00f5ff;--magenta:#ff2bd6;--lime:#b7ff00;--violet:#8b5cf6}.boot-loader,:root,body{background:var(--night);color:var(--text)}.studio-shell{background:radial-gradient(circle at 18% 18%,rgba(0,245,255,.16),transparent 30%),radial-gradient(circle at 82% 28%,rgba(255,43,214,.14),transparent 32%),radial-gradient(circle at 50% 90%,rgba(139,92,246,.15),transparent 38%),var(--night)}.outfit-picker legend,.story-card span,.studio-header p{color:var(--cyan);text-shadow:0 0 14px rgba(0,245,255,.7)}.studio-logo{display:block;width:clamp(12rem,27vw,24rem);height:auto;margin-bottom:.65rem;filter:drop-shadow(0 0 12px rgb(0 245 255/22%))}.studio-header h1{background:linear-gradient(105deg,var(--text) 10%,var(--cyan) 50%,var(--magenta));-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 16px rgb(0 245 255/18%))}.controls,.outfit-picker,.room-label,.story-card,.studio-header button{border-color:rgba(0,245,255,.24);background:var(--panel);box-shadow:inset 0 0 18px rgb(139 92 246/8%),0 0 24px rgb(0 245 255/7%)}.studio-header button:focus-visible,.studio-header button:hover{border-color:var(--magenta);box-shadow:0 0 20px rgba(255,43,214,.35)}.room-label.active,.room-label:hover{border-color:var(--cyan);box-shadow:0 0 22px rgba(0,245,255,.28)}.controls button,.hint,.room-label small,.story-card p{color:var(--muted)}.story-card h2{text-shadow:0 0 18px rgba(255,43,214,.24)}.outfit-picker button.selected{border-color:var(--magenta);background:rgba(255,43,214,.13);box-shadow:0 0 15px rgba(255,43,214,.25)}.controls button.selected{background:linear-gradient(120deg,var(--cyan),var(--lime));color:#05050b;box-shadow:0 0 22px rgba(0,245,255,.38)}.loader i,.scroll-progress i.active{background:linear-gradient(var(--cyan),var(--magenta));box-shadow:0 0 16px var(--cyan)}button:focus-visible{outline:2px solid var(--lime);outline-offset:3px}.studio-footer{position:absolute;z-index:5;right:max(1rem,env(safe-area-inset-right));bottom:max(.7rem,env(safe-area-inset-bottom));left:max(1rem,env(safe-area-inset-left));display:flex;align-items:center;justify-content:space-between;gap:1rem;color:var(--muted);font-size:.68rem;pointer-events:none}.studio-footer .copyright,.studio-footer .hint{position:static;width:auto;max-width:none;margin:0;transform:none;color:inherit;text-align:left}.copyright{display:flex;gap:.75rem;letter-spacing:.03em}.footer-stack{color:var(--cyan);opacity:.78}@media (prefers-contrast:more){.controls,.outfit-picker,.room-label,.story-card,.studio-header button{border-color:var(--cyan);background:var(--panel-solid)}}@media (max-width:700px){.studio-logo{width:10.5rem;margin-bottom:.5rem}.studio-footer{justify-content:center}.footer-stack,.studio-footer .hint{display:none}}@media (max-height:500px){.studio-logo{width:9.5rem;margin-bottom:.25rem}.studio-footer{bottom:max(.3rem,env(safe-area-inset-bottom))}.footer-stack,.studio-footer .hint{display:none}}