:root{color-scheme:dark;--ink:#3d3c32;--paper:#ece2cc;--cream:#f6ecd7;--muted:#a9b8b7;--gold:#ddba77;font-family:Georgia,'Times New Roman',serif;background:#142326;color:var(--cream)}
*{box-sizing:border-box}body{margin:0;min-height:100svh}button,textarea{font:inherit}button{color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:disabled{cursor:default}button:focus-visible,summary:focus-visible{outline:2px solid var(--gold);outline-offset:5px}button,summary{touch-action:manipulation}button{border:0}button[hidden],[hidden]{display:none!important}button svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.3}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}h1,h2,p{margin:0}p{line-height:1.6}
.room{width:100%;max-width:660px;height:100svh;min-height:520px;margin:auto;position:relative;overflow:hidden;isolation:isolate;background:#1a292a;box-shadow:0 0 120px #091416}
.world,.physical-objects{position:absolute;top:50%;left:50%;width:max(100%,50svh);height:max(200vw,100svh);max-height:none;aspect-ratio:1/2;transform:translate(-50%,-50%)}
@media(min-width:660px){.world,.physical-objects{height:max(1320px,100svh)}}
.world{pointer-events:none}.painting{position:absolute;inset:0;background:url('room-study.webp') 0 0/300% 100% no-repeat}.room-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(#102022a8,transparent 26%,transparent 72%,#101d20ed)}
.room-header{position:absolute;left:22px;right:22px;top:calc(28px + env(safe-area-inset-top));text-align:center;text-shadow:0 2px 15px #000c;pointer-events:none}.room-header h1{font-size:clamp(23px,6vw,32px);font-weight:400;letter-spacing:.01em}.room-header p{font-size:15px;color:#e2d6be;margin-top:9px}
.rain{position:absolute;left:21%;top:6%;width:59%;height:45%;clip-path:inset(0 round 42% 42% 0 0);opacity:.26;background-image:repeating-linear-gradient(95deg,transparent 0 29px,#d0e5e953 30px,transparent 31px 58px);background-size:83px 119px;mask-image:linear-gradient(transparent,#000 12%,#000 82%,transparent);animation:rain-slide 2.7s linear infinite}.rain-near{opacity:.18;left:23%;width:54%;background-size:67px 176px;animation-duration:4.3s;animation-delay:-1s}.window-light{position:absolute;inset:5% 14% 47% 16%;background:radial-gradient(ellipse at 60% 70%,#b9d9dd10,transparent 68%);animation:window-breathe 15s ease-in-out infinite alternate}.lamp-light{position:absolute;left:-25%;top:31%;width:65%;height:48%;background:radial-gradient(ellipse,#ffb9582b,transparent 66%);mix-blend-mode:screen;animation:lamp-breathe 7s ease-in-out infinite alternate}.kind-light{position:absolute;inset:43% 0 18% 18%;background:radial-gradient(ellipse at 65% 55%,#f7b34936,transparent 60%);opacity:0;transition:opacity 2s}.room.has-kindness .kind-light{opacity:1}.dust{position:absolute;left:7%;top:47%;width:40%;height:16%;opacity:.32;background:radial-gradient(circle at 12% 45%,#efcb88 0 1px,transparent 1.5px),radial-gradient(circle at 45% 25%,#efcb8880 0 1px,transparent 1.5px),radial-gradient(circle at 70% 72%,#efcb8880 0 1px,transparent 1.5px);animation:drift 20s ease-in-out infinite alternate}
.physical-objects{pointer-events:none}.object{position:absolute;background:none;padding:0;min-height:48px;min-width:48px;pointer-events:auto;border-radius:15px;transition:filter 1.2s}.object:focus-visible{outline:1px solid #f1ddaa;outline-offset:0}.object:hover{filter:brightness(1.13)}.sprite{position:absolute;inset:0;background-image:url('object-study.webp');background-size:200% 200%;background-repeat:no-repeat;pointer-events:none;transition:filter 1.8s}.boat{left:37%;top:63.5%;width:29%;aspect-ratio:1.5}.boat .sprite{background-position:0 0;animation:paper-sway 10s ease-in-out infinite alternate}.boat.warmed .sprite{background-position:100% 0}.envelope{left:13%;top:66%;width:27%;aspect-ratio:1.5;transform:rotate(-9deg)}.envelope .sprite{background-position:0 100%;animation:paper-sway 14s ease-in-out -4s infinite alternate}.envelope.warmed .sprite{background-position:100% 100%}.lantern{left:68%;top:53.5%;width:19%;height:13%}.flame{position:absolute;width:8%;height:22%;left:48%;top:56%;background:#ffe2a2;border-radius:60% 35% 50% 50%;box-shadow:0 0 9px 4px #f2bd59,0 0 25px 16px #ffb34d55;opacity:0;transition:opacity 2s;transform-origin:50% 100%}.lantern.warmed .flame{opacity:.95;animation:flicker 3.4s ease-in-out infinite alternate}.own-note{left:48%;top:75%;width:20%;height:8%;transform:rotate(5deg)}.folded-paper{position:absolute;inset:15% 9%;border:1px solid #bfab84;background:linear-gradient(150deg,#eee1c4 0 48%,#cabd9d 49%,#e3d4b5 51%);box-shadow:2px 4px 7px #151c1b7a;transition:box-shadow 2s}.folded-paper:after{content:'';position:absolute;left:30%;top:10%;height:80%;border-left:1px solid #a09d8c;transform:rotate(-25deg)}.own-note.warmed .folded-paper{border-color:#ffd18c;box-shadow:0 0 22px #f6c06c55,2px 4px 7px #151c1b7a}.own-note.warmed .folded-paper:after{border-color:#e6a640;box-shadow:0 0 3px #eda947}
.room-actions{position:absolute;bottom:calc(77px + env(safe-area-inset-bottom));left:22px;right:22px;display:flex;align-items:center;justify-content:space-between;gap:12px}.quiet-link{background:none;min-height:44px;padding:9px 0;font-size:14px;color:#e3d8c3;text-underline-offset:5px}.quiet-link:hover{text-decoration:underline}.door,.sound{display:inline-flex;gap:8px;align-items:center}.door{font-family:system-ui,sans-serif;font-size:12px;opacity:.85}.room-footer{position:absolute;left:22px;right:22px;bottom:calc(12px + env(safe-area-inset-bottom));display:flex;justify-content:space-between;gap:12px;align-items:center}.sound,.concept{font:11px/1.4 system-ui,sans-serif;color:#b6c1bb}.sound svg{width:18px}.concept{text-align:right}.whisper{position:absolute;left:24px;right:24px;bottom:calc(136px + env(safe-area-inset-bottom));font-size:15px;text-align:center;color:#f4ddb3;text-shadow:0 2px 8px #071517;pointer-events:none;opacity:0;transition:opacity 1s}.whisper.visible{opacity:1}
.paper-dialog{color-scheme:light;background:var(--paper);color:var(--ink);width:calc(100% - 36px);max-width:370px;max-height:calc(100dvh - 36px);border:1px solid #b5a586;border-radius:3px;padding:28px 25px 20px;box-shadow:0 14px 70px #0612148c;overflow:auto;margin:auto}.paper-dialog::backdrop{background:#0b18197a;backdrop-filter:blur(3px)}.paper-dialog[open]{animation:paper-arrive .5s ease-out}.close{position:absolute;right:5px;top:3px;width:44px;height:44px;color:#736c59;background:none;font:28px/1 system-ui,sans-serif}.eyebrow{font:10px/1.6 system-ui,sans-serif;letter-spacing:.06em;color:#776f59}.paper-dialog h2{font-size:25px;font-weight:400;line-height:1.25;margin:12px 0 20px}.paper-dialog blockquote{font-size:23px;line-height:1.5;margin:18px 0 25px;overflow-wrap:anywhere;white-space:pre-wrap}.paper-button{display:block;min-height:48px;width:100%;padding:12px 16px;border:1px solid #a69573;border-radius:3px;background:#d6c5a0;color:#343d34;font:14px/1.5 system-ui,sans-serif;box-shadow:inset 0 0 15px #f9efd633}.paper-button:hover{background:#e1d0ac}.put-down{display:block;width:100%;color:#716c5d;margin-top:6px;font-size:13px}.small{font:11px/1.6 system-ui,sans-serif;color:#7a7463}.disclosure{margin-top:15px;font-size:10px}.after{padding:12px 0 18px;font-size:17px;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere}.story-symbol{width:112px;height:75px;margin:0 auto 12px;background-size:200% 200%;background-image:url('object-study.webp');background-position:0 0}.story-symbol.envelope-art{background-position:0 100%}.story-symbol.warmed{background-position-x:100%}.story-symbol.lantern-art,.story-symbol.note-art{background:none;position:relative;height:48px;width:65px}.lantern-art:after{content:'';position:absolute;inset:4px 20px;border:1px solid #9e7d4d;border-radius:40% 40% 15% 15%;background:radial-gradient(ellipse at 50% 65%,#ffdd8c,transparent 55%);box-shadow:0 0 20px #d3a35644}.note-art:after{content:'';position:absolute;inset:6px 4px;border:1px solid #aa9c7a;background:linear-gradient(150deg,#f3e7c9 48%,#b9ab8d 49%,#dfd2b1 51%);transform:rotate(-5deg)}textarea{resize:vertical;background:#f7edd947;color:var(--ink);border:0;border-bottom:1px solid #ac9f80;border-radius:0;display:block;width:100%;padding:12px 1px;font:16px/1.6 Georgia,serif;min-height:90px;max-height:180px;margin:10px 0 14px}textarea::placeholder{color:#89816c;opacity:1}textarea:focus{outline:1px solid #a99363;outline-offset:5px}#leave-form .small{margin-bottom:21px}.about-dialog p{font-size:14px;line-height:1.7;margin:12px 0}.about-dialog .eyebrow{font-size:10px}.about-dialog details{border-top:1px solid #b8ac91;margin-top:20px;padding-top:8px;font:14px/1.7 system-ui,sans-serif}.about-dialog summary{cursor:pointer;padding:10px 0;min-height:44px}.about-dialog details p{font-family:system-ui,sans-serif}.about-dialog .reset{color:#6f6856;font:11px/1.5 system-ui,sans-serif;margin-top:14px;text-decoration:underline;text-align:left}.about-dialog #reset-status{font:11px/1.4 system-ui,sans-serif;min-height:0}.about-dialog strong{font-weight:400;color:#4b4d3f}
.outside{position:fixed;inset:0;z-index:4;background:#122125;display:grid;place-items:center;padding:26px;overflow:hidden;animation:paper-arrive 1.2s ease-out}.outside-rain{position:absolute;inset:-20%;opacity:.16;background:repeating-linear-gradient(100deg,transparent 0 47px,#c9d9db33 48px,transparent 49px 111px);background-size:126px 180px;animation:rain-slide 3s linear infinite}.doorway-glow{position:absolute;left:50%;top:13%;width:min(60vw,240px);height:78%;transform:translateX(-50%);background:linear-gradient(90deg,#dba35609,#f6ca792e,#dba35609);filter:blur(22px);border-radius:45% 45% 0 0}.threshold-copy{z-index:1;text-align:center;max-width:290px}.threshold-copy .eyebrow{color:#bbb4a0}.threshold-copy h2{font-size:30px;font-weight:400;margin:20px 0}.threshold-copy>p:not(.eyebrow){font-size:16px;color:#c0c7bd;margin-bottom:24px}.threshold-copy .paper-button{margin:36px auto 25px;max-width:190px}.threshold-copy .small{font:11px/1.7 system-ui,sans-serif!important;color:#a3afa9!important}.no-script{position:fixed;bottom:120px;padding:20px;background:#142326;color:#eee}
@keyframes rain-slide{from{background-position:0 -119px}to{background-position:-9px 119px}}@keyframes lamp-breathe{from{opacity:.63}to{opacity:1}}@keyframes window-breathe{from{opacity:.25}to{opacity:.7}}@keyframes drift{from{transform:translate(0,0)}to{transform:translate(6px,-12px)}}@keyframes paper-sway{from{transform:translateY(0) rotate(-.4deg)}to{transform:translateY(-1px) rotate(.5deg)}}@keyframes flicker{from{transform:scale(.9,1);filter:brightness(.95)}to{transform:scale(1,1.05);filter:brightness(1.08)}}@keyframes paper-arrive{from{opacity:0;translate:0 5px}to{opacity:1;translate:0 0}}
@media(min-aspect-ratio:4/3){.room{max-width:520px}.world,.physical-objects{width:max(100%,50svh);height:1040px}.room-header{top:26px}}
@media(max-height:600px){.room-header{top:16px}.room-header h1{font-size:23px}.room-header p{font-size:13px;margin-top:5px}.room-actions{bottom:66px}.room-footer{bottom:6px}.whisper{bottom:117px}}
@media(max-height:480px) and (orientation:landscape){.room{height:700px}.world,.physical-objects{width:100%;height:1040px}.room-header{top:18px}.room-actions{bottom:75px}.room-footer{bottom:12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
body.paused *{animation-play-state:paused!important}
.own-note{left:34%;width:18%}.door{margin-left:auto}
.room-actions{pointer-events:none}.room-actions button{pointer-events:auto}
.rain{--rain-step:119px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='83' height='119' viewBox='0 0 83 119'%3E%3Cpath d='M12 0l-1 18M42 39l-1 13M71 67l-1 21M24 100l-1 9' fill='none' stroke='%23c2dce1' stroke-width='.7' stroke-linecap='round'/%3E%3C/svg%3E")}.rain-near{--rain-step:176px}
@keyframes rain-slide{from{background-position:0 0}to{background-position:0 var(--rain-step,180px)}}
.footer-links{display:flex;gap:16px;align-items:center}.footer-links .quiet-link{font:11px/1.4 system-ui,sans-serif;color:#b6c1bb}.form-error{font:12px/1.6 system-ui,sans-serif;color:#79513c;overflow-wrap:anywhere;margin:12px 0}.form-error:empty{display:none}#owner-actions{display:flex;justify-content:space-between;gap:15px;margin:7px 0}#owner-actions .quiet-link,.report{font:11px/1.5 system-ui,sans-serif;color:#756b57}.report{display:block;margin:auto}#suggestions{font:13px/1.6 system-ui,sans-serif;margin:0 0 18px}#suggestions summary{min-height:44px;padding:10px 0;color:#716854;cursor:pointer}#suggestions .small{margin-bottom:8px}.phrase{display:block;width:100%;min-height:44px;text-align:left;background:#e1d4b9;color:#4b4c3e;margin:4px 0;padding:8px 10px;border-radius:2px;font:13px/1.5 Georgia,serif}.paper-button:disabled{opacity:.6}#private-link{font:16px/1.5 system-ui,sans-serif;width:100%;min-height:48px;border:1px solid #ac9f80;background:#f7edd9;color:#4a4d40;margin:18px 0;padding:10px}#receipt-status{margin-top:12px;min-height:18px}
