@import"https://fonts.googleapis.com/css2?family=Gowun+Batang:wght@400;700&family=Noto+Sans+KR:wght@400;500;600&display=swap";:root{font-family:Noto Sans KR,sans-serif;color:#f6f0e5;background:#211e1a;font-synthesis:none;--paper: #eee8dc;--ink: #39382f;--muted: #a6a195;--line: #ffffff25;--serif: "Gowun Batang", Georgia, serif}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid #e9c889;outline-offset:6px}button{border:0}a{color:inherit;text-decoration:none}[hidden]{display:none!important}#app,#scene,.vignette{position:fixed;inset:0}#scene canvas{display:block;width:100%;height:100%;touch-action:none}.vignette{pointer-events:none;background:linear-gradient(180deg,#11100d65 0%,transparent 25%,transparent 68%,#12120eab 100%);z-index:1}body:not(.entered) .vignette{background:linear-gradient(90deg,#161712c9 0%,#16171294 27%,transparent 65%),linear-gradient(0deg,#15150fc9,transparent 20%,transparent 80%,#16161270)}.header{position:absolute;top:36px;left:44px;right:44px;display:flex;justify-content:space-between;align-items:center;z-index:5}.wordmark{font-family:var(--serif);font-size:29px;letter-spacing:.12em}.wordmark span{display:block;font-family:Noto Sans KR,sans-serif;font-size:8px;letter-spacing:.24em;margin-top:7px;color:#d1ccbd}.header-right{display:flex;align-items:center;gap:38px}.room-label{font-size:9px;letter-spacing:.16em;color:#d1cabe}.room-label i{display:inline-block;width:5px;height:5px;border-radius:50%;background:#d8c99c;margin-right:8px;box-shadow:0 0 8px #e8cc87}.text-button{font-size:11px;background:transparent;border-bottom:1px solid #e2dacc65;padding:12px 0}.text-button span{margin-left:15px;font-size:17px}.intro{position:absolute;left:8%;top:29%;z-index:4;transition:opacity .6s,transform .7s}.eyebrow{font-size:10px;letter-spacing:.21em;color:#d6c8ac}.intro h1{font:400 clamp(36px,4vw,60px)/1.42 var(--serif);letter-spacing:-.06em;margin:22px 0}.intro p{font-size:12px;line-height:2.15;color:#d4cfc2;letter-spacing:.015em}.enter-button{display:flex;justify-content:space-between;align-items:center;width:235px;background:#ece5d6;color:#39392e;padding:17px 20px;margin-top:32px;font-size:12px;border-radius:2px;transition:background .2s}.enter-button:hover{background:#fff9e9}.enter-button span{font-size:22px;line-height:1}.intro-footnote{display:block;font-size:9px;color:#b3ad9e;margin-top:17px;letter-spacing:.025em}.room-caption{position:absolute;top:151px;left:44px;z-index:3;pointer-events:none;animation:fadein 1s}.room-caption .eyebrow{font-size:8px;letter-spacing:.2em}.room-caption h1{font:400 30px var(--serif);margin:10px 0 8px;letter-spacing:-.06em}.room-caption p{font-size:10px;color:#c5bfb1}.footer{position:absolute;z-index:5;bottom:30px;left:44px;right:44px;display:flex;align-items:center;justify-content:space-between;gap:22px}.room-index{display:flex;align-items:center;gap:15px;min-width:178px}.room-index>span{font:italic 37px var(--serif);color:#d9c9ad;border-right:1px solid var(--line);padding-right:16px}.room-index>div{font-size:10px;letter-spacing:.05em}.room-index small{display:block;font-size:9px;color:#b1aa9b;margin-top:6px}.view-nav{display:flex;padding:6px;border:1px solid #cfc4aa35;border-radius:5px;gap:3px;background:#22251ed9;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 5px 30px #0002}.view-nav button{background:transparent;font-size:10px;padding:12px 17px;color:#c1bbae;border-radius:2px;white-space:nowrap;transition:.2s}.view-nav button span{font-size:16px;margin-right:7px;vertical-align:-1px}.view-nav button:hover{background:#ffffff0b}.view-nav button.active{background:#e6ddc9;color:#383c31}.utilities{display:flex;gap:9px;min-width:100px;justify-content:flex-end}.icon-button{width:37px;height:37px;border:1px solid #d9cfb64d;background:#282a2080;border-radius:50%;font:18px var(--serif);position:relative}.sound-off{position:absolute;left:9px;top:17px;width:18px;height:1px;background:#eee6d7;transform:rotate(-45deg)}.loading{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:#292b22dd;border:1px solid #dad2b82b;padding:18px 24px;font:14px var(--serif);z-index:20;transition:opacity .4s}.loading span{animation:pulse 1s infinite}.hotspot{position:absolute;z-index:3;display:flex;align-items:center;justify-content:center;width:42px;height:42px;margin:-21px 0 0 -21px;border-radius:50%;background:transparent;padding:0;transition:opacity .25s;filter:drop-shadow(0 1px 5px #0008)}body:not(.entered) #hotspots{opacity:0;pointer-events:none}.hotspot:not(#tv-hotspot){pointer-events:none}.walk-hint{position:absolute;bottom:116px;left:50%;transform:translate(-50%);font-size:9px;color:#e6e0d0a8;letter-spacing:.08em;pointer-events:none;z-index:2}.walk-hint:before{content:"✧";margin-right:9px;color:#d9c79c}#toast{position:absolute;bottom:140px;left:50%;transform:translate(-50%,15px);padding:11px 19px;background:#ece5d6;color:#414234;z-index:50;border-radius:3px;font-size:11px;opacity:0;transition:.3s;pointer-events:none}#toast.show{opacity:1;transform:translate(-50%)}dialog{color:var(--ink);background:var(--paper);border:1px solid #fff8;border-radius:4px;padding:0;box-shadow:0 24px 100px #0006;max-height:88dvh;max-width:94vw}dialog::backdrop{background:#12140fd9;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}dialog[open]{animation:fadein .3s}.modal-close{position:absolute;top:16px;right:18px;width:33px;height:33px;background:#f1ecdfdf;border:1px solid #b1ad9f55;border-radius:50%;font-size:24px;font-family:var(--serif);z-index:3;line-height:1}#memory-modal{width:1000px}.memory-layout{display:grid;grid-template-columns:58% 42%;min-height:555px}#media-stage{position:relative;min-height:480px;background:#dcd4c4;display:flex;align-items:center;justify-content:center;padding:40px}#media-stage img{display:block;max-height:62vh;max-width:100%;object-fit:contain;box-shadow:0 12px 30px #544e3c2d;border:12px solid #f6f1e6;border-bottom-width:39px;transform:rotate(-2deg)}#media-stage video{width:100%;max-height:60vh;background:#181b15}.media-controls{position:absolute;bottom:16px;left:0;right:0;display:flex;gap:19px;justify-content:center;align-items:center;font-size:10px}.media-controls button{border:1px solid #8e8b7b55;background:transparent;width:30px;height:30px;border-radius:50%;font-size:18px}.memory-copy{padding:70px 36px 35px;display:flex;flex-direction:column}.memory-copy .eyebrow,dialog>.eyebrow{color:#82846d;font-size:9px}#memory-date{font-size:10px;letter-spacing:.13em;color:#929180;margin-top:40px}#memory-title{font:400 31px/1.5 var(--serif);letter-spacing:-.06em;margin:8px 0 23px}#memory-description{font:13px/2.2 var(--serif);color:#737163;white-space:pre-line;margin:0}.memory-bottom{display:flex;justify-content:space-between;align-items:end;gap:12px;margin-top:auto;padding-top:40px}#memory-location{font-size:9px;letter-spacing:.1em;color:#858571}.memory-seal{display:flex;width:65px;height:65px;align-items:center;justify-content:center;border:1px solid #9b9e82;border-radius:50%;transform:rotate(-13deg);font:11px/1.7 var(--serif);text-align:center;color:#8b9076}.letter-paper{background:#f5efde;width:100%;max-width:400px;box-shadow:0 8px 25px #645f4425;padding:32px 28px;transform:rotate(-2deg);font:15px/2.3 var(--serif);white-space:pre-line;color:#6e6754;background-image:repeating-linear-gradient(transparent,transparent 33px,#b6ae9520 34px);background-origin:content-box}.letter-paper span{display:block;text-align:right;margin-top:15px;font-size:12px}#archive-modal{width:940px;padding:49px 45px}dialog h2{font:400 30px/1.5 var(--serif);letter-spacing:-.05em;margin:10px 0}.archive-sub{font-size:11px;color:#8b8879}.archive-filters{display:flex;gap:9px;margin:25px 0}.archive-filters button{background:transparent;color:#8b8979;border:1px solid #a09c8c55;padding:8px 14px;font-size:10px;border-radius:20px}.archive-filters button.active{background:#535c47;color:#f2eddc;border-color:#535c47}#archive-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:23px 17px}.archive-card{text-align:left;background:transparent;padding:0;color:#4c4d3e}.archive-image{position:relative;overflow:hidden;aspect-ratio:1.2;background:#d7cebb}.archive-image img{width:100%;height:100%;object-fit:cover;transition:transform .4s;filter:saturate(.75)}.archive-card:hover img{transform:scale(1.06)}.archive-image span{position:absolute;right:8px;bottom:8px;font-size:8px;padding:4px 7px;background:#f3edddd9;color:#575948}.archive-card h3{font:15px var(--serif);margin:10px 0 5px}.archive-card small{font-size:8px;letter-spacing:.08em;color:#9b9787}#help-modal{width:530px;padding:45px}.help-row{padding:18px 0;border-bottom:1px solid #a29d8835;display:flex;gap:20px;align-items:center}.help-row>span{width:140px;flex-shrink:0;font-size:10px;color:#606750}.help-row p{font-size:11px;line-height:1.9;color:#87836f;margin:0}.demo-note{font-size:9px;line-height:1.8;color:#98927f;margin-top:23px}#webgl-error{position:absolute;inset:0;z-index:100;background:#24281e;display:flex;align-items:center;justify-content:center;flex-direction:column}.mobile-move{position:absolute;left:max(24px,env(safe-area-inset-left));bottom:max(170px,calc(env(safe-area-inset-bottom) + 150px));z-index:5;text-align:center;user-select:none;-webkit-user-select:none}.mobile-zoom{position:absolute;right:max(24px,env(safe-area-inset-right));bottom:max(170px,calc(env(safe-area-inset-bottom) + 150px));z-index:5;display:flex;gap:6px}.mobile-zoom button{width:44px;height:44px;border:1px solid #e0d9c650;border-radius:8px;background:#242a20bf;color:#f8f1e4;font-size:22px;touch-action:manipulation}.mobile-zoom button:focus-visible{outline:2px solid #f8f1e4;outline-offset:2px}#joystick{position:relative;width:112px;height:112px;border:1px solid #e0d9c650;border-radius:50%;background:radial-gradient(circle,#eee5cc0a 42%,#242a205e 43%);box-shadow:inset 0 0 25px #171d2220,0 4px 20px #0002;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);touch-action:none}#joystick-thumb{position:absolute;left:50%;top:50%;width:46px;height:46px;margin:-23px;border:1px solid #f5ebcc9c;border-radius:50%;background:#e5ddc980;box-shadow:0 2px 12px #0003,inset 0 0 10px #f5ebcc2b;pointer-events:none;transition:transform .15s ease-out}#joystick.active #joystick-thumb{transition:none;background:#ede3cba6}.joystick-direction{position:absolute;font:12px Georgia,serif;color:#ede3cb85;pointer-events:none}.joystick-up{top:6px;left:50%;transform:translate(-50%)}.joystick-down{bottom:6px;left:50%;transform:translate(-50%)}.joystick-left{left:9px;top:50%;transform:translateY(-50%)}.joystick-right{right:9px;top:50%;transform:translateY(-50%)}.joystick-label{display:block;margin-top:9px;font-size:8px;letter-spacing:.08em;color:#e1d8c5a3}@keyframes fadein{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{50%{opacity:.2}}@media(min-width:1500px){.intro{left:10%}.header,.footer{left:55px;right:55px}}@media(max-width:1000px){.room-index{min-width:140px}.room-index>div{font-size:9px}.view-nav button{padding:11px 12px;font-size:9px}.utilities{min-width:80px}.footer{left:25px;right:25px;gap:10px}.header{left:27px;right:27px}.room-caption{left:27px}.memory-copy{padding:60px 25px 28px}}@media(max-width:700px){.header{top:25px;left:23px;right:23px}.wordmark{font-size:24px}.wordmark span{font-size:6px}.room-label{display:none}.text-button{font-size:10px}.header-right{gap:0}.intro{left:8%;top:29%}.intro h1{font-size:42px}.intro p{font-size:11px}.intro .eyebrow{font-size:9px}.intro-footnote{font-size:8px}.enter-button{width:220px;padding:16px 18px}.footer{left:20px;right:20px;bottom:20px;display:grid;grid-template-columns:1fr auto;row-gap:20px}.room-index{grid-column:1}.utilities{grid-column:2}.view-nav{grid-row:2;grid-column:1 / 3;justify-content:space-around;padding:5px}.view-nav button{flex:1;padding:10px 7px;font-size:9px}.view-nav button span{display:block;font-size:17px;margin:0 0 3px}.room-index>span{font-size:29px}.room-caption{top:118px;left:24px}.room-caption h1{font-size:23px}.room-caption p{font-size:9px}.walk-hint{bottom:167px;font-size:8px;white-space:nowrap}.room-index small{font-size:8px}.icon-button{height:32px;width:32px}.sound-off{left:7px;top:15px}.memory-layout{grid-template-columns:1fr;min-height:unset}#media-stage{min-height:270px;padding:25px 30px 45px}#media-stage img{max-height:35vh;border-width:8px;border-bottom-width:28px}#media-stage video{max-height:32vh}.memory-copy{padding:27px}#memory-date{margin-top:18px}#memory-title{font-size:25px;margin-bottom:12px}#memory-description{font-size:12px;line-height:1.9}.memory-bottom{padding-top:20px}.memory-seal{width:50px;height:50px;font-size:9px}.letter-paper{font-size:12px;line-height:2;padding:20px}.modal-close{top:10px;right:10px}#archive-modal{padding:38px 23px}#archive-grid{grid-template-columns:repeat(2,1fr);gap:18px 13px}dialog h2{font-size:25px}#help-modal{padding:38px 26px}.help-row{display:block}.help-row p{margin-top:10px}body:not(.entered) .vignette{background:linear-gradient(90deg,#161712c9,#16171280 65%,#16171230),linear-gradient(0deg,#15150fc9,transparent 25%)}.hotspot{width:36px;height:36px;margin:-18px 0 0 -18px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}body:not(.entered) .header,body:not(.entered) .footer{visibility:hidden;pointer-events:none}body:not(.entered) .vignette{background:none}body:not(.entered) .intro{left:50%;top:43%;width:min(90vw,540px);transform:translate(-50%,-50%);text-align:center;color:#333731}body:not(.entered) .intro .eyebrow{color:#85877e;font-size:8px;letter-spacing:.2em}body:not(.entered) .intro h1{font-size:clamp(40px,5vw,62px);margin:24px 0 30px;line-height:1.3}.intro h1 small{display:block;font:400 19px var(--serif);letter-spacing:.16em;margin-bottom:12px}body:not(.entered) .enter-button{margin:0 auto;width:230px;background:#353c35;color:#f4f2e9;justify-content:center;gap:22px;padding:16px 19px}body:not(.entered) .enter-button:hover{background:#535c50}body:not(.entered) .intro-footnote{color:#7e8278;margin-top:20px}body.entering #hotspots{visibility:hidden}.view-nav{max-width:100%;overflow-x:auto}.view-nav button{padding-inline:12px}@media(max-width:700px){.view-nav button{padding:9px 5px;font-size:8px}body:not(.entered) .intro .eyebrow{font-size:7px}body:not(.entered) .intro h1{font-size:43px}body:not(.entered) .enter-button{width:210px;font-size:11px}}body:not(.entered) .intro h1{font-size:clamp(18px,1.8vw,22px);letter-spacing:.14em;margin:0 0 38px;white-space:nowrap}body:not(.entered) .intro .entry-names{font:400 14px var(--serif);color:#62685f;letter-spacing:.12em;line-height:1.5;margin:0 0 32px}.loading{padding:0;background:transparent;border:0}.loading-spinner{display:block;width:22px;height:22px;border:1px solid #a4ab9b66;border-top-color:#6d7865;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.footer{justify-content:center}.view-nav{overflow:visible;flex-shrink:0}.view-nav button{width:42px;padding:9px 5px}.view-nav button span{margin:0}.utilities{min-width:0}#memory-modal{width:min(900px,94vw)}#media-stage{min-height:360px}.letter-paper{min-height:340px}#archive-modal{padding:40px 28px 28px}.archive-filters{margin:0 0 22px}.archive-filters button{font-size:16px;padding:6px 16px}@media(max-width:700px){.footer{display:flex;gap:10px;left:12px;right:12px;bottom:22px}.view-nav{gap:0;padding:4px}.view-nav button{width:34px;padding:8px 3px}.view-nav button span{margin:0;font-size:17px}.utilities{gap:6px}.mobile-move,.mobile-zoom{bottom:max(115px,calc(env(safe-area-inset-bottom) + 95px))}#media-stage{min-height:260px}body:not(.entered) .intro h1{font-size:18px}body:not(.entered) .intro .entry-names{font-size:12px}}#media-stage.postcard-stage{background:#e7c7b8;min-height:480px;padding:42px 30px}.postcard-sheet{display:block;width:100%;height:auto;max-height:75dvh;object-fit:contain;box-shadow:0 9px 30px #795b4426;transform:rotate(-.4deg)}@media(max-width:700px){#media-stage.postcard-stage{min-height:unset;padding:35px 15px}}#media-stage.letter-stage{background:#d6cbb7;padding:40px 30px}.letter-paper.table-letter{max-width:620px;min-height:430px;width:100%;padding:45px 42px;font-size:16px;line-height:2.1;color:#5c4d3c;overflow-wrap:anywhere;white-space:pre-wrap;background-image:none}@media(max-width:700px){.view-nav button{width:31px}#media-stage.letter-stage{padding:30px 18px}.letter-paper.table-letter{padding:32px 25px;font-size:14px;min-height:360px}}.presence-hud{position:absolute;top:25px;right:28px;z-index:6;display:flex;gap:9px;align-items:center}body:not(.entered) .presence-hud{visibility:hidden;pointer-events:none}.avatar-view{display:flex;width:42px;height:42px;align-items:center;justify-content:center;overflow:hidden;border:1px solid #ded8c552;background:#282d23c9;border-radius:50%;padding:6px 6px 0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.avatar-view[aria-pressed=true]{border-color:#ede4ca;background:#717a5966}.presence-status{height:35px;display:flex;align-items:center;gap:7px;padding:0 12px;border:1px solid #ded8c536;border-radius:22px;background:#282d23c9;color:#e9e3d3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font-size:11px}.connection-dot{width:4px;height:4px;border-radius:50%;background:#c3a271}.presence-status[data-state=connected] .connection-dot{background:#b4ce9f;box-shadow:0 0 7px #b4ce9f88}@media(max-width:700px){.presence-hud{top:20px;right:18px}.avatar-view{width:36px;height:36px}.presence-status{height:32px;font-size:10px}}.tv-video-source{position:fixed;width:1px;height:1px;left:-10000px;top:0;pointer-events:none}#tv-controls{position:fixed;inset:auto 22px 108px auto;width:340px;max-width:calc(100vw - 30px);margin:0;padding:48px 22px 22px;background:#eae4d8}#tv-controls::backdrop{background:#10160f22;-webkit-backdrop-filter:none;backdrop-filter:none}.tv-transport{display:flex;align-items:center;gap:8px}.tv-transport button{background:transparent;color:#505d47;width:25px;padding:5px 0}.tv-timeline-label{display:flex;justify-content:space-between;color:#505d47;font-size:12px}#tv-time{font-variant-numeric:tabular-nums}#tv-seek{display:block;width:100%;margin:8px 0;accent-color:#6b795b}#tv-mute{margin-left:auto}#tv-error{font-size:10px;line-height:1.7;color:#905848;margin:12px 0 0}@media(max-width:700px){#tv-controls{right:15px;bottom:95px}.view-nav button{width:27px}.footer{gap:7px}.utilities{gap:4px}}body:not(.entered) .intro{inset:0;width:auto;transform:none;color:#53434a;pointer-events:none}body:not(.entered) .intro h1{position:absolute;top:min(35%,calc(50% - 86px));inset-inline:0;margin:0;font-size:clamp(20px,2vw,25px)}body:not(.entered) .intro h1 small{margin:11px 0 0;font:700 11px/1.3 system-ui,sans-serif;letter-spacing:.13em}body:not(.entered) .enter-button{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:max-content;min-width:196px;min-height:48px;padding:12px 20px;background:linear-gradient(#f4e9e5,#e6d6d1);color:#4a3837;border:1px solid #b49b93;border-radius:3px;box-shadow:inset 0 1px #fff9f4,0 3px 9px #4e3c3022;font:400 15px/1.2 var(--serif);letter-spacing:.035em;cursor:pointer;pointer-events:auto}body:not(.entered) .enter-button:hover{background:linear-gradient(#faf0eb,#eddfda)}body:not(.entered) .enter-button:active{transform:translate(-50%,calc(-50% + 1px));box-shadow:inset 0 1px 3px #63504a33}body:not(.entered) .enter-button:focus-visible{outline:2px solid #846b64;outline-offset:4px}.sound-controls{position:absolute;top:max(25px,env(safe-area-inset-top));left:max(28px,env(safe-area-inset-left));z-index:6}body:not(.entered) .sound-controls{visibility:hidden;pointer-events:none}@media(max-width:700px){.sound-controls{top:max(20px,env(safe-area-inset-top));left:max(18px,env(safe-area-inset-left))}}.view-nav{border-radius:18px;padding:6px;gap:4px;background:#272a24e8;box-shadow:0 8px 28px #0003,inset 0 1px #ffffff0a}.view-nav button{display:grid;place-items:center;width:44px;height:44px;padding:0;border-radius:12px;color:#d8d2c4;transition:background .18s,color .18s,transform .18s}.view-nav button svg{width:22px;height:22px;pointer-events:none}.view-nav button:hover{background:#ffffff12;color:#fff7e8;transform:translateY(-2px)}.view-nav button.active{background:#e7dccc;color:#494b40;box-shadow:0 2px 8px #0002}.view-nav button:focus-visible{outline:2px solid #f0d5df;outline-offset:2px}@media(max-width:700px){.view-nav{padding:5px;gap:2px;border-radius:16px}.view-nav button{width:clamp(30px,8.5vw,40px);height:40px;border-radius:10px}.view-nav button svg{width:20px;height:20px}}@media(prefers-reduced-motion:reduce){.view-nav button{transition:none}.view-nav button:hover{transform:none}}#prop-info{padding:28px}#media-stage.media-playlist-stage{height:min(70dvh,540px);min-height:0;padding-bottom:60px}#media-stage.media-playlist-stage img,#media-stage.media-playlist-stage video{max-height:100%}
