:root{color:#283947;font-synthesis:none;text-rendering:optimizelegibility;font-family:Inter,ui-rounded,SF Pro Rounded,PingFang SC,Microsoft YaHei,sans-serif}*{box-sizing:border-box}html,body,#app{overscroll-behavior:none;width:100%;height:100%;margin:0;overflow:hidden}body{touch-action:none;-webkit-user-select:none;user-select:none;background:#c9edf0}button,kbd{font:inherit}button{color:inherit}#game-canvas{touch-action:none;outline:none;width:100%;height:100%;display:block;position:fixed;inset:0}.hud{z-index:3;pointer-events:none;position:fixed;inset:0}.brand-lockup{color:#2d4552;filter:drop-shadow(0 2px 9px #ffffff8c);align-items:center;gap:11px;display:flex;position:absolute;top:24px;left:28px}.brand-mark{color:#e76f51;background:#fff8e2db;border:1px solid #ffffffbd;border-radius:14px;place-items:center;width:40px;height:40px;font-size:25px;font-weight:850;display:grid;box-shadow:0 12px 28px #40616824}.brand-lockup div{gap:2px;display:grid}.brand-lockup strong{letter-spacing:.015em;font-size:17px}.brand-lockup small{color:#52717b;letter-spacing:.12em;text-transform:uppercase;font-size:10px;font-weight:700}.objective-card{-webkit-backdrop-filter:blur(16px)saturate(1.08);backdrop-filter:blur(16px)saturate(1.08);background:#fffcf1db;border:1px solid #ffffffc2;border-radius:20px;gap:6px;width:min(340px,100vw - 56px);padding:17px 19px 14px;display:grid;position:absolute;top:24px;right:28px;box-shadow:0 18px 48px #2c4c5126}.eyebrow{color:#d05f46;letter-spacing:.14em;text-transform:uppercase;font-size:10px;font-weight:850}.objective-card strong{font-size:14px;line-height:1.42}.objective-card small{color:#65808a;justify-self:end;font-size:10px;font-weight:750}.progress-track{background:#e9ddc6;border-radius:999px;height:5px;overflow:hidden}.progress-track span{border-radius:inherit;background:linear-gradient(90deg,#e76f51,#f2ba62);width:0;height:100%;transition:width .48s cubic-bezier(.2,.8,.2,1);display:block}.controls{color:#233f49bf;pointer-events:auto;align-items:center;gap:12px;font-size:10px;font-weight:700;display:flex;position:absolute;bottom:22px;right:24px}kbd{background:#fffcf1e0;border:1px solid #2d455229;border-bottom-width:2px;border-radius:7px;place-items:center;min-width:25px;min-height:24px;padding:3px 6px;font-size:9px;font-weight:850;display:inline-grid;box-shadow:0 5px 13px #3b5c631c}.controls button{color:#b9533d;cursor:pointer;background:0 0;border:0;font-size:10px;font-weight:800}.controls button:hover{text-decoration:underline}.interaction{color:#fff;cursor:pointer;pointer-events:auto;background:#283947e0;border:1px solid #ffffffb8;border-radius:14px;align-items:center;gap:10px;padding:9px 15px 9px 10px;font-size:12px;font-weight:750;transition:opacity .18s,transform .18s;display:flex;position:absolute;bottom:96px;left:50%;transform:translate(-50%);box-shadow:0 12px 28px #18343c38}.interaction kbd{color:#263944}.interaction:active{transform:translate(-50%)scale(.96)}.mobile-controls,.mobile-start-hint{display:none}.resident-labels{pointer-events:none;position:absolute;inset:0}.resident-label{text-align:center;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#fffcf1c7;border:1px solid #ffffffb8;border-radius:11px;gap:1px;min-width:72px;padding:6px 9px;transition:opacity .15s;display:grid;position:absolute;top:0;left:0;box-shadow:0 7px 18px #213f441f}.resident-label strong{color:#314c56;font-size:10px}.resident-label small{color:#6e878b;font-size:8px}.resident-label.target{background:#fff6cbe6;border-color:#f2bd62;box-shadow:0 0 0 3px #ffeea047,0 8px 21px #57441b29}.modal{z-index:10;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#44686e40;place-items:center;padding:26px;transition:opacity .3s,visibility .3s;display:grid;position:fixed;inset:0}.intro-modal{background:radial-gradient(circle at 68% 38%,#fff2b685,#0000 27%),linear-gradient(135deg,#b1e0e1e0,#e6f5ebc7)}.intro-card{background:#fffcf1e0;border:1px solid #ffffffb8;border-radius:36px;grid-template-columns:1.05fr .95fr;width:min(920px,100%);min-height:510px;display:grid;overflow:hidden;box-shadow:0 42px 100px #2f505538}.intro-copy{flex-direction:column;justify-content:center;align-items:flex-start;padding:62px;display:flex}.intro-copy h1{color:#2b4652;letter-spacing:-.065em;margin:12px 0 16px;font-size:clamp(48px,7vw,82px);line-height:.95}.intro-copy p{color:#5f747b;max-width:440px;margin:0 0 30px;font-size:14px;line-height:1.8}.intro-copy small{color:#829396;letter-spacing:.08em;margin-top:18px;font-size:9px;font-weight:750}.intro-error{color:#a33f33;max-width:420px;margin:18px 0 0;font-size:12px;line-height:1.5}.primary-button{color:#fff;cursor:pointer;background:#e76f51;border:0;border-radius:14px;min-width:134px;padding:13px 22px;font-size:13px;font-weight:800;transition:transform .16s,box-shadow .16s,background .16s;box-shadow:0 12px 22px #b44f373d}.primary-button:hover{background:#d96146;transform:translateY(-2px);box-shadow:0 16px 28px #b44f3747}.primary-button:focus-visible,.controls button:focus-visible{outline-offset:3px;outline:3px solid #26687c73}.intro-planet{background:linear-gradient(160deg,#79c4c4,#b7ded0 58%,#f7d996);min-height:430px;position:relative;overflow:hidden}.intro-planet:before,.intro-planet:after{content:"";filter:blur(2px);position:absolute}.intro-planet:before{background:#ffffffad;border-radius:50%;width:86px;height:28px;top:16%;left:12%;box-shadow:215px 92px 0 -5px #ffffff8f}.intro-planet:after{background:#fff1aec7;border-radius:50%;width:18px;height:18px;bottom:13%;right:18%;box-shadow:-155px -270px 0 -4px #ffffffb3}.mini-planet{aspect-ratio:1;background:radial-gradient(circle at 64% 28%,#f4d46c 0 5%,#0000 5.5%),radial-gradient(circle at 31% 35%,#f6edc8 0 8%,#0000 8.5%),radial-gradient(circle at 42% 66%,#4f8b62 0 18%,#0000 18.5%),radial-gradient(circle at 67% 58%,#d47a5d 0 12%,#0000 12.5%),radial-gradient(circle at 36% 32%,#9ecb77,#6aa36f 62%,#467c5a 100%);border-radius:50%;width:min(330px,70%);position:absolute;top:50%;left:50%;transform:translate(-50%,-42%);box-shadow:inset -34px -42px 65px #204c464f,0 48px 70px #1f4c4e52}.mini-planet:before{content:"";border:6px solid #f5deaea6;border-right-color:#0000;border-radius:50%;width:58%;height:25%;position:absolute;top:20%;left:21%;transform:rotate(-12deg)}.mini-moon{aspect-ratio:1;background:#fff1ba;border-radius:50%;width:34px;position:absolute;top:17%;right:17%;box-shadow:0 9px 22px #575b3540}.orbit{z-index:2;border:1px solid #ffffff61;border-radius:50%;width:78%;height:30%;position:absolute;top:50%;left:50%;transform:translate(-50%,-30%)rotate(-13deg)}.orbit-two{border-color:#ffecb04f;width:88%;height:42%;transform:translate(-50%,-35%)rotate(31deg)}.dialog-modal{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#233b4221;align-items:end}.dialog-card{background:#fffcf1f0;border:1px solid #ffffffc2;border-radius:22px;gap:13px;width:min(630px,100vw - 42px);margin-bottom:58px;padding:25px 27px 23px;display:grid;box-shadow:0 25px 65px #1f3b423d}.dialog-card p{color:#405861;white-space:pre-line;min-height:48px;margin:0;font-size:14px;line-height:1.75}.dialog-card button{justify-self:end}.toast{z-index:20;color:#fff;background:#2d444fe6;border:1px solid #ffffffb8;border-radius:14px;padding:11px 17px;font-size:11px;font-weight:750;transition:opacity .22s,transform .22s;position:fixed;top:124px;left:50%;transform:translate(-50%);box-shadow:0 14px 35px #1c373d38}.hidden{visibility:hidden!important;opacity:0!important;pointer-events:none!important}@media (pointer:coarse),(max-width:760px){.mobile-controls{display:block;position:absolute;inset:0}.joystick{bottom:max(20px, calc(env(safe-area-inset-bottom) + 12px));left:max(18px, calc(env(safe-area-inset-left) + 12px));touch-action:none;pointer-events:auto;-webkit-tap-highlight-color:transparent;background:#2139442e;border:1px solid #ffffff73;border-radius:50%;place-items:center;width:116px;height:116px;display:grid;position:absolute;box-shadow:inset 0 0 0 1px #21394414,0 10px 30px #1936401a}.joystick:before{border-radius:inherit;content:"";border:1px dashed #ffffff5c;width:70%;height:70%;position:absolute}.joystick-arrows{color:#ffffff8a;font-size:26px}.joystick-knob{will-change:transform;background:#fffcf1e0;border:1px solid #ffffffb8;border-radius:50%;width:48px;height:48px;transition:box-shadow .12s;position:absolute;box-shadow:0 7px 18px #1b394233}.joystick.active .joystick-knob{box-shadow:0 9px 22px #1b394247}.camera-hint{right:max(18px, calc(env(safe-area-inset-right) + 12px));bottom:max(20px, calc(env(safe-area-inset-bottom) + 12px));color:#233f498f;letter-spacing:.04em;font-size:9px;font-weight:750;position:absolute}.desktop-start-hint{display:none}.mobile-start-hint{display:block}.intro-card{grid-template-columns:1fr;min-height:auto}.intro-copy{min-height:min(540px,100dvh - 32px);padding:42px 34px max(42px, calc(env(safe-area-inset-bottom) + 24px))}.intro-planet{display:none}.objective-card{top:max(12px, calc(env(safe-area-inset-top) + 8px));right:max(12px, calc(env(safe-area-inset-right) + 8px));border-radius:15px;gap:4px;width:min(310px,52vw);padding:11px 13px 10px}.brand-lockup{top:max(12px, calc(env(safe-area-inset-top) + 8px));left:max(12px, calc(env(safe-area-inset-left) + 8px))}.brand-mark{border-radius:11px;width:34px;height:34px;font-size:21px}.controls{top:max(56px, calc(env(safe-area-inset-top) + 52px));bottom:auto;right:auto;left:max(14px, calc(env(safe-area-inset-left) + 8px))}.controls span{display:none}.interaction{right:max(18px, calc(env(safe-area-inset-right) + 12px));bottom:max(48px, calc(env(safe-area-inset-bottom) + 42px));background:#e76f51f0;border-radius:18px;justify-content:center;min-width:92px;min-height:56px;padding:11px 16px;font-size:13px;left:auto;transform:none;box-shadow:0 13px 28px #77372842}.interaction:active{transform:scale(.96)}.interaction kbd{display:none}.dialog-card{width:min(630px,100vw - 24px);margin-bottom:max(14px, env(safe-area-inset-bottom));padding:20px 21px 18px}.toast{top:max(104px, calc(env(safe-area-inset-top) + 92px));text-align:center;max-width:calc(100vw - 28px)}}@media (pointer:coarse) and (max-width:560px),(max-width:560px){.objective-card{top:max(62px, calc(env(safe-area-inset-top) + 58px));width:auto;left:12px;right:12px}.objective-card strong{font-size:12px}.brand-lockup small,.camera-hint{display:none}.controls{top:max(18px, calc(env(safe-area-inset-top) + 12px));right:max(12px, calc(env(safe-area-inset-right) + 8px));left:auto}.controls button{background:#fffcf1bd;border-radius:9px;padding:7px 8px}.toast{top:max(172px, calc(env(safe-area-inset-top) + 162px))}.intro-modal{padding:12px}.intro-copy h1{font-size:clamp(48px,17vw,68px)}}@media (pointer:coarse) and (max-height:520px){.intro-modal{padding:max(8px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left))}.intro-copy{min-height:calc(100dvh - 16px);padding:24px 34px}.intro-copy h1{margin:7px 0 10px;font-size:52px}.intro-copy p{margin-bottom:18px;line-height:1.55}.intro-copy small{margin-top:11px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}