:root{color-scheme:dark;--bg:#050814;--fg:#f3ece3;--muted:#a2a8b5;--subtle:#6e7990;--accent:#cde8db;--warm:#f2ce9b;--line:rgba(202,222,227,.18);--glass:rgba(8,16,34,.75);--font-serif:'Noto Serif CJK KR','Nanum Myeongjo','Apple SD Gothic Neo','Malgun Gothic',serif;--font-ui:system-ui,-apple-system,'Malgun Gothic',sans-serif}
*{box-sizing:border-box}html,body{margin:0;width:100%;min-height:100%;}html{background:var(--bg);scroll-behavior:smooth}body{font-family:var(--font-serif);color:var(--fg);overflow-x:hidden;-webkit-font-smoothing:antialiased}button,a{font:inherit}button{cursor:pointer;touch-action:manipulation}button:disabled{cursor:not-allowed;opacity:.5}a{color:inherit}button:focus-visible,a:focus-visible{outline:2px solid #cde8db;outline-offset:5px}::selection{background:rgba(242,206,155,.35);color:#fff}.skip-link{position:fixed;top:-70px;left:16px;z-index:999;color:#fff;background:#0b2340;padding:12px 18px}.skip-link:focus{top:12px}
#world{position:fixed;inset:0;display:block;width:100%;height:100%;z-index:0;touch-action:pan-y;background:#050814}#vignette{position:fixed;inset:0;z-index:1;pointer-events:none;background:radial-gradient(ellipse at 50% 53%,transparent 10%,rgba(2,6,17,.07) 41%,rgba(2,6,17,.75) 100%)}#whisper-layer{position:fixed;inset:0;z-index:5;pointer-events:none;overflow:hidden}.whisper{position:absolute;top:0;left:0;max-width:min(540px,78vw);font-size:clamp(12px,1.1vw,15px);line-height:1.85;letter-spacing:.1em;text-align:center;color:#f8e6c8;text-shadow:0 0 22px #a88354;animation:whisper-rise 6.8s ease both;white-space:normal}.spark-phrase{position:absolute;font-family:var(--font-serif);font-size:12px;white-space:nowrap;color:#ffe2b0;text-shadow:0 0 20px #d0a66b;animation:phrase-rise 2.5s ease forwards}.whisper.fade-away{opacity:0}@keyframes whisper-rise{0%{opacity:0;filter:blur(5px);transform:translateY(8px)}22%{opacity:.9;filter:blur(0)}80%{opacity:.7}100%{opacity:0;transform:translateY(-38px)}}@keyframes phrase-rise{0%{opacity:0;transform:translate(-50%,2px)}17%{opacity:1}100%{opacity:0;transform:translate(-50%,-64px)}}
#quiet-message{position:fixed;z-index:6;bottom:182px;left:50%;transform:translate(-50%,12px);width:max-content;max-width:80vw;text-align:center;font-size:12px;letter-spacing:.13em;color:#e1d3bc;text-shadow:0 0 24px #b78c5b;opacity:0;pointer-events:none;transition:opacity 1.5s ease,transform 1.5s ease}#quiet-message.visible{opacity:.8;transform:translate(-50%,0)}
.header{position:fixed;z-index:10;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:clamp(20px,3vw,42px) clamp(20px,4.6vw,76px);pointer-events:none}.header>*{pointer-events:auto}.identity{display:flex;align-items:center;gap:12px;text-decoration:none}.logo-glyph{display:inline-flex;color:var(--warm);width:38px;height:38px}.logo-glyph svg{width:100%;height:100%}.identity-name{font-size:22px;letter-spacing:.06em;font-weight:500}.identity-english{margin-left:8px;font-family:var(--font-ui);font-size:10px;letter-spacing:.14em;font-weight:450;color:#b2c2c9}.top-controls{display:flex;align-items:center;gap:7px}.control-button{border:1px solid rgba(185,215,220,.17);border-radius:999px;color:#d0d8d7;background:rgba(13,23,43,.56);padding:11px 15px;display:flex;align-items:center;gap:8px;font-family:var(--font-ui);font-size:11px;letter-spacing:.06em;backdrop-filter:blur(13px);transition:background .2s,border-color .2s,transform .2s;min-height:42px}.control-button:hover,.control-button[aria-pressed=true]{background:rgba(40,63,75,.76);border-color:rgba(197,230,222,.56)}.btn-symbol{color:var(--warm);font-size:19px;line-height:1}
main{position:relative;isolation:isolate;z-index:2;min-height:100svh;min-height:100dvh;pointer-events:none;display:flex;flex-direction:column;align-items:center}main button,main a{pointer-events:auto}.eyebrow{padding-top:clamp(122px,15vh,154px);display:flex;align-items:center;justify-content:center;gap:14px;letter-spacing:.36em;font-family:var(--font-ui);font-size:10px;color:#96a2b0}.eyebrow-rule{display:block;width:28px;height:1px;background:rgba(172,199,207,.33)}.intro{width:min(900px,calc(100% - 32px));text-align:center;margin-top:clamp(26px,3.8vh,51px);pointer-events:none}.intro h1{font-weight:350;margin:0;font-size:clamp(24px,3.05vw,45px);line-height:1.67;letter-spacing:-.035em;text-shadow:0 4px 40px #050914}.intro h1 em{display:block;font-style:normal;color:#eed8b8;font-weight:350}.intro .lead{font-size:clamp(12px,1.05vw,15px);line-height:2.1;letter-spacing:.04em;color:#a4b4b9;margin:14px 0 0}.orb-instruction{position:absolute;top:51.4%;left:50%;width:min(50vh,470px);height:min(50vh,470px);transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;opacity:.45}.orbit-ring{position:absolute;inset:0;border:1px solid rgba(195,224,223,.1);border-radius:50%;box-shadow:0 0 50px rgba(100,175,175,.04)}.orbit-tick{position:absolute;top:0;left:50%;width:2px;height:7px;background:rgba(211,231,221,.55);transform:translateX(-50%)}.side-note{position:absolute;top:46%;left:clamp(24px,6.2vw,100px);transform:translateY(-50%);display:flex;flex-direction:column;gap:19px;font-size:12px;line-height:2.1;letter-spacing:.16em;color:rgba(202,219,224,.54);pointer-events:none}.side-numeral{font-family:var(--font-ui);font-size:10px;letter-spacing:.3em;color:rgba(205,224,219,.38)}.side-line{width:1px;height:48px;background:linear-gradient(rgba(204,220,220,.5),transparent)}
.hud{position:absolute;right:clamp(24px,5.9vw,100px);top:44%;width:156px;display:flex;flex-direction:column;gap:18px;pointer-events:none}.hud-top{font-size:10px;color:#b4cbd1;letter-spacing:.025em;display:flex;align-items:center;gap:7px;white-space:nowrap}.status-light,.pulse-dot{width:6px;height:6px;flex:0 0 auto;border-radius:50%;background:#b3e5c9;box-shadow:0 0 10px #9ce0bf}.hud-measures{display:grid;grid-template-columns:1fr;gap:10px}.hud-measures div{display:flex;align-items:baseline;gap:10px}.hud-measures strong{font:300 23px/1.3 var(--font-ui);font-variant-numeric:tabular-nums;color:#e3e8e5;min-width:60px}.hud-measures span{font-size:11px;letter-spacing:.03em;color:#889aab}.hud-measures i{width:110px;height:1px;background:linear-gradient(to right,rgba(206,232,224,.2),transparent)}
.action-bar{margin-top:auto;width:100%;display:flex;align-items:center;flex-direction:column;gap:16px;padding:24px 20px max(30px,env(safe-area-inset-bottom));text-align:center;pointer-events:none}.action-hint{font-size:12px;color:#b4c3c2;letter-spacing:.05em;display:flex;align-items:center;gap:9px;min-height:20px}.mobile-star-indicator{display:none;font:12px var(--font-ui);white-space:nowrap;color:#e5ca9e}.mobile-star-indicator strong{font-weight:500}.action-buttons{display:flex;align-items:center;justify-content:center;gap:11px;pointer-events:auto}.button-primary,.button-outline{min-height:48px;padding:12px 24px;border-radius:2px;letter-spacing:.05em;font:500 12px/1.4 var(--font-ui);transition:transform .2s,border-color .2s,background .2s;display:inline-flex;align-items:center;justify-content:center;gap:11px}.button-primary{border:1px solid #d7e3d8;background:#d7e3d8;color:#172330;box-shadow:0 5px 35px rgba(200,222,208,.14)}.button-primary:hover{background:#f0f5e9;transform:translateY(-2px)}.button-outline{border:1px solid rgba(208,223,225,.38);background:rgba(10,19,34,.43);color:#e2e7e6;backdrop-filter:blur(10px)}.button-outline:hover{border-color:#d7e3d8;background:rgba(56,75,80,.47);transform:translateY(-2px)}.button-primary span,.button-outline span{font-size:18px;line-height:1;color:inherit}.subtle-disclaimer{font:400 10px/1.7 var(--font-ui);max-width:730px;letter-spacing:.01em;color:#65788d;margin:0}.toast{position:fixed;bottom:164px;left:50%;z-index:100;transform:translateX(-50%) translateY(9px);padding:12px 20px;background:#162a35;border:1px solid rgba(197,223,206,.28);font:12px/1.5 var(--font-ui);color:#e6f2e8;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;max-width:85vw;text-align:center}.toast.visible{opacity:1;transform:translateX(-50%) translateY(0)}
.dialog{color:#eff1e8;width:min(600px,calc(100vw - 30px));max-height:min(840px,calc(100dvh - 30px));padding:30px clamp(22px,5vw,44px) 34px;border:1px solid rgba(216,233,223,.21);background:linear-gradient(140deg,#111d2c,#0b1424 75%,#111827);box-shadow:0 20px 90px #000c;overflow:auto;overscroll-behavior:contain}.dialog::backdrop{background:rgba(3,8,17,.77);backdrop-filter:blur(8px)}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:20px}.dialog-eyebrow{font:10px var(--font-ui);letter-spacing:.2em;color:#b9c2bb}.close-button{border:1px solid rgba(211,222,216,.23);background:transparent;border-radius:50%;color:#dce1df;width:40px;height:40px;font:26px/1 var(--font-ui)}.close-button:hover{background:#223644}.dialog h2{font-size:clamp(21px,3.3vw,30px);font-weight:350;line-height:1.75;margin:0}.dialog h2 em{font-weight:350;color:#e8cda9;font-style:normal}.dialog-description{color:#a8b8ba;font-size:12px;line-height:2.05;max-width:480px;margin:13px 0 24px}.poem-card{min-height:242px;border:1px solid rgba(214,228,215,.17);background:radial-gradient(ellipse at 50% 0%,rgba(97,137,140,.11),transparent 75%),rgba(3,9,19,.4);text-align:center;padding:18px 20px 25px}.poem-ornament{color:#edd4aa}.poem-text{color:#f3e8d5;white-space:pre-line;font-size:clamp(13px,2vw,16px);line-height:2.3;letter-spacing:.035em;margin:14px 0}.poem-meta{font:10px/1.7 var(--font-ui);color:#8499a6;letter-spacing:.07em}.dialog-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px}.dialog-actions button{flex:1 1 170px}.memory-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:20px 0}.memory-grid div{min-height:99px;border:1px solid var(--line);padding:17px 10px;text-align:center;display:flex;flex-direction:column;justify-content:center;gap:10px}.memory-grid span{font:10px/1.6 var(--font-ui);color:#9baeb8}.memory-grid strong{font:300 24px var(--font-ui);font-variant-numeric:tabular-nums;color:#f1ddbd}.memory-extra{font-size:12px;color:#a5afb0;line-height:1.8}.danger{color:#eac6bb}.confirm-message{border:1px solid rgba(245,172,151,.25);background:rgba(150,77,77,.09);font:12px/2 var(--font-ui);padding:15px;color:#f1dfdb}.inline-confirm,.inline-cancel{margin:10px 12px 0 0;border:1px solid #a98f88;background:#302227;color:#ffe2da;padding:9px 14px}.inline-cancel{background:transparent;border-color:#61717b;color:#dae3e7}.noscript-message{position:fixed;z-index:50;bottom:50px;left:50%;transform:translateX(-50%);padding:15px;background:#132338;max-width:90vw;font:13px var(--font-ui)}
@media(max-height:740px) and (min-width:760px){.eyebrow{padding-top:90px}.intro{margin-top:12px}.intro h1{font-size:clamp(22px,2.5vw,34px)}.intro .lead{margin-top:6px}.action-bar{padding-bottom:18px;gap:9px}.hud{top:48%}}@media(max-width:820px){.header{padding:19px 21px}.identity-english{font-size:9px}.top-controls{gap:5px}.control-button{padding:10px 11px}.control-label{display:none}.control-button .btn-symbol{font-size:20px}.side-note,.hud{display:none}.eyebrow{padding-top:clamp(109px,15vh,140px)}.intro{margin-top:clamp(27px,4vh,42px)}.intro h1{font-size:clamp(23px,4.3vw,34px)}.intro .lead{font-size:12px}.orb-instruction{top:54%;width:min(53vh,85vw);height:min(53vh,85vw)}}
@media(max-width:560px){.header{padding:16px 16px}.identity{gap:5px}.logo-glyph{width:31px;height:31px}.identity-name{font-size:20px}.identity-english{font-size:8px;margin-left:3px;letter-spacing:.04em}.eyebrow{padding-top:116px;font-size:9px;letter-spacing:.16em}.eyebrow-rule{width:14px}.intro{margin-top:30px;width:calc(100% - 32px)}.intro h1{font-size:clamp(22px,5.7vw,30px);line-height:1.65}.intro .lead{font-size:11px;line-height:1.9;margin-top:13px}.intro .lead br{display:none}.orb-instruction{top:53.5%;width:min(75vw,37vh);height:min(75vw,37vh)}.action-bar{gap:10px;padding-bottom:max(22px,env(safe-area-inset-bottom));padding-left:14px;padding-right:14px}.action-hint{font-size:11px;gap:6px;letter-spacing:0}.mobile-star-indicator{display:inline-block;margin-left:3px}.action-buttons{width:100%;max-width:420px;gap:8px}.action-buttons button{flex:1;padding:11px 8px;font-size:11px;min-height:48px}.subtle-disclaimer{font-size:9px;line-height:1.55;max-width:320px}.dialog{padding:23px 20px}.dialog h2{font-size:22px}.dialog-actions{flex-direction:column}.memory-grid{gap:5px}.memory-grid div{padding:12px 5px}.memory-grid span{font-size:9px}.memory-grid strong{font-size:20px}#quiet-message{bottom:183px}}@media(max-width:370px){.identity-english{display:none}.eyebrow{padding-top:102px}.intro{margin-top:20px}.intro h1{font-size:22px}.intro .lead{margin-top:8px}.action-bar{gap:7px}.subtle-disclaimer{font-size:8px}}@media(max-height:670px) and (max-width:820px){.eyebrow{padding-top:90px}.intro{margin-top:16px}.intro h1{font-size:22px}.intro .lead{margin-top:6px;font-size:10px}.orb-instruction{top:52%}.action-bar{gap:6px;padding-bottom:12px}.subtle-disclaimer{display:none}#quiet-message{bottom:115px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
body.manual-reduced .whisper,body.manual-reduced .spark-phrase{animation:none!important;opacity:.9}body.manual-reduced .whisper{animation:whisper-rise 6.8s ease both!important}
