*{box-sizing:border-box}:root{--ink:#080a0b;--paper:#e5e0d4;--blue:#526b75;--gold:#a58a5a;--line:#343a3b}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:var(--paper);font:12px/1.55 Arial,sans-serif;background-image:linear-gradient(#fff03 1px,transparent 1px),linear-gradient(90deg,#fff02 1px,transparent 1px);background-size:42px 42px}.back{position:fixed;z-index:50;top:50%;left:15px;transform:translateY(-50%);writing-mode:vertical-rl;rotate:180deg;text-decoration:none;color:#c9c2b5;border:1px solid #6f675a;background:#090b0ce8;padding:14px 9px;font:9px monospace;letter-spacing:.18em}.mast{min-height:100vh;display:flex;flex-direction:column;justify-content:flex-end;padding:9vw;position:relative;overflow:hidden;background:radial-gradient(circle at 67% 24%,#829aa327,transparent 22%),linear-gradient(105deg,#07090aea,#0d1215a8),repeating-linear-gradient(90deg,#161a1b 0 2px,#0a0c0d 2px 160px)}.mast:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(103deg,transparent 0 35px,#b7d3d70b 36px 37px,transparent 38px 72px);animation:rain 2s linear infinite}.mast:after{content:"PAINTINGS FACE THE WALL";position:absolute;right:6vw;top:8vw;color:#ffffff10;font:700 6vw Georgia;writing-mode:vertical-rl}.district{position:relative;color:#9fb0b4;font:9px monospace;letter-spacing:.25em}.mast h1{position:relative;margin:18px 0 8px;max-width:970px;font:400 clamp(60px,11vw,150px)/.78 Georgia;letter-spacing:-.06em}.mast h1 em{display:block;color:var(--gold);font-weight:400}.mast p{position:relative;max-width:540px;color:#9da4a3;font:18px/1.6 Georgia}.mast button{position:relative;width:max-content;margin-top:26px;border:1px solid var(--gold);background:var(--gold);color:#0c0c0b;padding:14px 20px;cursor:pointer;font:800 9px Arial;letter-spacing:.18em}.room{min-height:100vh;padding:36px 5vw 80px}.weather{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:14px;color:#748185;font:9px monospace;letter-spacing:.14em}.weather i{width:7px;height:7px;border-radius:50%;background:#809da7;box-shadow:0 0 18px #809da7;animation:pulse 2s infinite}#zones{display:grid;grid-template-columns:repeat(7,1fr);gap:7px;padding:18px 0 28px;overflow:auto}#zones button{min-width:145px;min-height:75px;display:grid;grid-template-columns:34px 1fr;align-items:center;gap:9px;text-align:left;border:1px solid #303738;background:linear-gradient(145deg,#111617,#080a0b);color:#a4a7a2;padding:12px;cursor:pointer;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%);transition:.25s}#zones button>b{display:grid;place-items:center;width:32px;height:32px;border:1px solid #566268;color:#8b9da2;font:11px monospace}#zones button span{font:700 9px Arial;letter-spacing:.12em}#zones button small{display:block;margin-top:5px;color:#606868;font:italic 8px Georgia;letter-spacing:.03em}#zones button:hover,#zones button.on{border-color:var(--gold);transform:translateY(-2px);color:#fff;background:linear-gradient(145deg,#282116,#0b0c0c)}#stage{min-height:660px;border:1px solid var(--line);background:#0b0e0f;overflow:hidden}.scene{min-height:660px;display:grid;grid-template-columns:1.2fr .8fr}.visual{position:relative;min-height:660px;display:grid;place-items:center;padding:36px;background:radial-gradient(circle,#526b751b,transparent 36%),#080b0c}.panel{padding:55px 44px;border-left:1px solid var(--line);background:linear-gradient(145deg,#121718,#080a0b)}.kicker{color:#82969b;font:9px monospace;letter-spacing:.2em}.panel h2{font:400 clamp(40px,5vw,72px)/.95 Georgia;margin:14px 0}.panel h2 em{color:var(--gold);font-weight:400}.panel p{color:#959b98;font:15px/1.75 Georgia}.action-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}.action-row button,.tool,.work,.dream-choice{border:1px solid #4a5050;background:#111617;color:#c8c7bf;padding:12px 14px;cursor:pointer;font:800 9px Arial;letter-spacing:.12em;transition:.2s}.action-row button:hover,.tool.on,.work:hover,.dream-choice:hover{border-color:var(--gold);background:#292116;color:#fff}.note{margin-top:20px;border-left:2px solid var(--gold);background:#a58a5a0d;padding:13px;color:#aaa499;font:12px/1.6 Georgia}.paint-wrap{display:grid;gap:10px;justify-items:center}.canvas-frame{padding:13px;background:#302a21;border:1px solid #71604a;box-shadow:0 35px 70px #000}.canvas-frame canvas{display:block;width:min(62vw,650px);height:auto;max-height:520px;touch-action:none;background:#d8d3c8;cursor:crosshair}.tools{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}.swatch{width:30px;height:30px!important;padding:0!important;border-radius:50%!important}.turned-stack{display:flex;gap:5px;height:74px}.turned-stack img{width:62px;height:72px;object-fit:cover;border:4px solid #2b251d}.work-wall{width:100%;display:grid;grid-template-columns:repeat(5,1fr);gap:14px;align-items:end}.work{height:360px;padding:10px;position:relative;overflow:hidden;background:#17191a;box-shadow:0 24px 45px #000}.work .art{position:absolute;inset:12px;background:#c9c3b6;filter:saturate(.7)}.work:nth-child(1) .art{background:radial-gradient(ellipse at 66% 48%,#b89f86 0 8%,transparent 9%),repeating-linear-gradient(12deg,#c4bdb0 0 16px,#9ba2a0 17px 18px)}.work:nth-child(2) .art{background:linear-gradient(#17191acb,#17191acb),radial-gradient(circle at 48% 34%,#bea897 0 16%,#282221 17% 28%,transparent 29%),#b8aa95}.work:nth-child(3) .art{background:radial-gradient(circle at 50% 50%,transparent 0 25%,#cbc4b7 26%),linear-gradient(122deg,#4d6871 0 37%,transparent 38%),#b5aa91}.work:nth-child(4) .art{background:repeating-linear-gradient(95deg,#111 0 18px,#d3cfbd 19px 21px)}.work:nth-child(5) .art{background:#090a0a}.work b{position:absolute;z-index:2;left:20px;bottom:20px;color:#eee;font:18px Georgia;opacity:0}.work.seen b{opacity:1}.work:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,#252728 0 8px,#1c1e1f 9px 14px);transform-origin:left;transition:.6s}.work.seen:after{transform:perspective(800px) rotateY(93deg)}.enough{position:absolute;inset:0;z-index:8;display:grid;place-items:center;background:#080a0be8;color:#d2c9ba;font:italic 42px Georgia}.dark-tray{width:min(680px,90%);aspect-ratio:4/3;border:18px solid #171c1d;background:#dedbd2;box-shadow:0 35px 70px #000;position:relative;overflow:hidden}.photo{position:absolute;inset:0;background:linear-gradient(180deg,#aeb9bb,#39464b 64%,#121617);filter:grayscale(1) contrast(.8);opacity:var(--dev,.05)}.photo:before{content:"";position:absolute;left:18%;bottom:0;width:26%;height:78%;background:linear-gradient(#596166 0 44%,#16191a 45%);clip-path:polygon(37% 0,64% 0,73% 22%,72% 100%,22% 100%,28% 22%)}.photo:after{content:"";position:absolute;right:12%;top:16%;width:25%;height:68%;border:2px solid #d9d8cd;box-shadow:inset 0 0 0 9px #252b2c;background:radial-gradient(circle at 50% 35%,#e7e4d8 0 3%,#151819 4% 12%,transparent 13%)}.mirror-wrap{width:340px;height:540px;position:relative;border:16px solid #28221b;box-shadow:0 30px 70px #000;background:linear-gradient(145deg,#6f868c,#161b1d)}.reflection{position:absolute;inset:0;display:grid;place-items:center;color:#b9c9cc;font:italic 19px Georgia}.reflection:after{content:"";width:120px;height:160px;border:8px solid #29231b;background:#d3cec2;transform:translate(30px,30px)}.cloth{position:absolute;inset:-5px;background:repeating-linear-gradient(103deg,#242729 0 16px,#191c1e 17px 32px);clip-path:polygon(0 0,100% 0,100% var(--lift,0%),0 calc(var(--lift,0%) + 18%));transition:.7s;z-index:2}.iris-hand{position:absolute;right:-70px;top:30px;width:150px;height:28px;border-radius:50%;background:#b4987f;transform:rotate(-22deg);opacity:0;z-index:3}.handdown .iris-hand{animation:hand 1.2s ease forwards}.window-frame{width:min(900px,95%);aspect-ratio:16/9;border:16px solid #202627;position:relative;overflow:hidden;background:linear-gradient(#19272d,#101718 60%,#080b0c);box-shadow:0 35px 70px #000}.city{position:absolute;inset:15% 0 0;background:repeating-linear-gradient(90deg,#0e1416 0 6%,transparent 6.2% 9%),linear-gradient(#39464a,#13191b);clip-path:polygon(0 100%,0 42%,6% 42%,6% 18%,12% 18%,12% 52%,17% 52%,17% 5%,27% 5%,27% 50%,34% 50%,34% 24%,42% 24%,42% 58%,49% 58%,49% 12%,59% 12%,59% 48%,68% 48%,68% 0,77% 0,77% 56%,84% 56%,84% 31%,91% 31%,91% 45%,100% 45%,100% 100%)}.curtain{position:absolute;inset:0;background:repeating-linear-gradient(90deg,#181b1c 0 28px,#0d1011 29px 54px);transform:translateX(var(--open,0%));transition:1.2s}.window-reflection{position:absolute;inset:0;display:grid;place-items:center;color:#a8b5b6aa;font:italic 25px Georgia;opacity:0}.window-frame.open .window-reflection{opacity:1}.desk{width:min(800px,95%);min-height:390px;background:linear-gradient(8deg,#3a281a,#1e160f);border:1px solid #7a5d3b;box-shadow:0 35px 70px #000;position:relative;transform:perspective(900px) rotateX(9deg)}.coffee{position:absolute;left:12%;top:24%;width:90px;height:90px;border:13px solid #b8b1a3;border-radius:50%;background:#1b1410}.receipt{position:absolute;left:39%;top:17%;width:150px;height:250px;background:#d8d3c6;color:#39352e;padding:18px;font:9px/1.7 monospace;transform:rotate(4deg)}.carrie-note{position:absolute;right:8%;top:23%;width:220px;min-height:180px;background:#ddd4b8;color:#29251f;padding:28px;transform:rotate(-3deg);font:italic 18px/1.5 Georgia}.dreams{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.dream-choice{min-height:180px;text-align:left}.dream-choice b{display:block;font:25px Georgia;margin-bottom:8px}.dream-overlay{position:fixed;z-index:70;inset:0;background:#050708f5;display:grid;place-items:center;padding:40px}.dream-card{width:min(900px,100%);min-height:550px;border:1px solid #5b5040;background:radial-gradient(circle,#526b7520,transparent 45%),#0b0d0e;padding:50px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}.dream-card h2{font:50px Georgia;margin:10px}.dream-card p{max-width:580px;color:#a09e96;font:16px/1.7 Georgia}.bell{font-size:110px;animation:bell 2.6s infinite}.name-input{border:0;border-bottom:1px solid #776a55;background:transparent;color:#ddd4c6;padding:12px;text-align:center;font:20px Georgia}footer{display:flex;justify-content:space-between;padding:18px 0;color:#586162;font:8px monospace;letter-spacing:.16em}footer button{border:0;background:none;color:#8a9da1;cursor:pointer;font:8px monospace}#toast{position:fixed;z-index:90;right:22px;bottom:22px;max-width:390px;border:1px solid #7d6b50;background:#0b0d0eef;padding:16px;color:#d8d0c2;font:13px Georgia}body.attn-3 .weather span:after{content:" / PIPES: HUMMING";color:#8f4b4d}body.attn-5 #stage{box-shadow:inset 0 0 90px #5d20222e}body.attn-6 .weather span:after{content:" / OCCUPANCY: 2";color:#8f4b4d}@keyframes rain{to{transform:translate(-35px,60px)}}@keyframes pulse{50%{opacity:.25}}@keyframes hand{0%{opacity:0;transform:translateX(80px) rotate(-22deg)}50%{opacity:1}100%{opacity:1;transform:translateX(-190px) rotate(-22deg)}}@keyframes bell{50%{transform:rotate(4deg)}}@media(max-width:950px){.back{top:auto;bottom:10px;left:12px;transform:none;rotate:0;writing-mode:horizontal-tb}.scene{grid-template-columns:1fr}.panel{border-left:0;border-top:1px solid var(--line)}#zones{display:flex}.work-wall{grid-template-columns:repeat(5,220px);overflow:auto}.work{height:330px}.dreams{grid-template-columns:1fr}.mast{padding:25px}.mast h1{font-size:68px}.visual{min-height:520px;padding:20px}.canvas-frame canvas{width:82vw}}