:root{color-scheme:light;font-family:Aptos,Segoe UI,Microsoft YaHei,Noto Sans CJK SC,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;--paper: #f4e6c8;--paper-light: #fff3dc;--paper-dark: #e8d3ac;--ink: #493d35;--muted-ink: #6e6155;--rust: #8f4c3c;--rust-light: #c98265;--sea: #78a5a0;--sea-deep: #365f65;--sand: #f1d09e;--outline: #604d40;--shadow: rgba(54, 44, 36, .2)}*{box-sizing:border-box}html,body,#game-shell{width:100%;height:100%;height:100dvh;margin:0;overflow:hidden}body{color:var(--ink);background:#c7d1c4;overscroll-behavior:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}button,select,input{font:inherit}button{color:inherit;cursor:pointer;touch-action:manipulation}button:focus-visible,select:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid #316b6d;outline-offset:3px}[hidden]{display:none!important}#game-shell{display:grid;place-items:center;padding:0}#game-frame{position:relative;width:min(100vw,1720px);height:min(100dvh,970px);overflow:hidden;isolation:isolate;background:#eecfa0;box-shadow:0 18px 68px #273a3638}#game-container,#game-container canvas{position:absolute;inset:0;display:block;width:100%;height:100%;touch-action:none}#game-container canvas{image-rendering:auto}.three-game-canvas{z-index:1;pointer-events:none;outline:none}.screen-grain{position:absolute;z-index:2;inset:0;pointer-events:none;opacity:.06;background-image:repeating-linear-gradient(92deg,transparent 0 5px,rgba(73,61,53,.1) 5px 6px);mix-blend-mode:multiply}.screen-panel{position:absolute;z-index:30;color:var(--ink)}.loading-screen{inset:0;display:grid;place-content:center;justify-items:center;gap:16px;padding:24px;background:var(--paper);text-align:center}.loading-screen p{margin:0;font-size:20px;font-weight:700}.loading-screen small{color:var(--muted-ink);font-size:14px}.journal-button{position:absolute;right:max(76px,calc(env(safe-area-inset-right) + 58px));bottom:max(16px,env(safe-area-inset-bottom));pointer-events:auto}.touch-layout .journal-button{top:max(70px,calc(env(safe-area-inset-top) + 58px));right:max(18px,env(safe-area-inset-right));bottom:auto}.journal-screen{position:absolute;inset:0;z-index:40;display:grid;place-items:center;padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));background:#24332e6b;touch-action:pan-y}.journal-panel{display:flex;flex-direction:column;width:100%;max-width:880px;height:min(86dvh,760px);max-height:100%;min-height:0;overflow:hidden;border:2px solid var(--outline);border-radius:20px;background:var(--paper);box-shadow:0 15px 45px var(--shadow)}.journal-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 24px 12px}.journal-heading h2{margin:0 0 6px;font:700 30px/1.2 Georgia,Songti SC,SimSun,serif}.journal-heading p{margin:0;color:var(--muted-ink);font-size:14px}.journal-heading .icon-button{flex:0 0 48px}.journal-nav{display:flex;gap:8px;padding:0 24px 14px;border-bottom:1px solid var(--paper-dark)}.journal-nav button{flex:1;min-width:0;min-height:48px;padding:8px;border:1px solid var(--outline);border-radius:10px;background:var(--paper-light);color:var(--ink);font-size:15px;font-weight:700}.journal-nav button[aria-pressed=true]{color:var(--paper-light);background:var(--sea-deep);border-color:var(--sea-deep)}.journal-content{flex:1;min-height:0;overflow-y:auto;padding:8px 24px 20px;overscroll-behavior:contain;touch-action:pan-y;scrollbar-color:var(--rust) var(--paper-dark)}.journal-content:focus-visible{outline:3px solid var(--sea-deep);outline-offset:-3px}.journal-card{padding:18px 0;border-bottom:1px solid var(--paper-dark)}.journal-card:last-child{border-bottom:0}.journal-card h3{margin:0 0 6px;font-size:19px}.journal-card p{max-width:68ch;margin:8px 0 0;font-size:16px;line-height:1.7;white-space:pre-line;overflow-wrap:anywhere}.journal-card .journal-card-state{color:var(--rust);font-size:14px;font-weight:700}.journal-card[data-complete=true] .journal-card-state{color:var(--sea-deep)}.journal-card-collection{display:grid;grid-template-columns:76px minmax(0,1fr);column-gap:16px;align-items:start}.journal-card-collection h3,.journal-card-collection p{grid-column:2}.journal-stamp{grid-column:1;grid-row:1 / span 3;display:grid;place-items:center;width:76px;min-height:94px;border:1px solid var(--outline);border-radius:4px;background:var(--paper-light)}.journal-stamp img{display:block;width:52px;height:64px;object-fit:contain}.journal-stamp-empty{border-style:dashed;color:var(--muted-ink);background:transparent;font-size:14px}.journal-footer{margin:0;padding:12px 24px;border-top:1px solid var(--paper-dark);color:var(--muted-ink);font-size:13px}body.font-large .journal-card p{font-size:18px}@media(max-width:720px){.journal-button{right:max(68px,calc(env(safe-area-inset-right) + 58px));bottom:max(9px,env(safe-area-inset-bottom))}.touch-layout .journal-button{right:max(10px,env(safe-area-inset-right));top:max(67px,calc(env(safe-area-inset-top) + 58px))}.journal-panel{height:100%}.journal-heading{padding:14px 14px 10px}.journal-heading h2{font-size:26px}.journal-nav{padding:0 14px 12px;gap:6px}.journal-nav button{font-size:14px;padding:6px}.journal-content{padding:0 14px 16px}.journal-footer{padding:10px 14px}}@media(max-height:480px)and (orientation:landscape){.journal-panel{height:100%}.journal-heading{padding:10px 18px}.journal-heading h2{font-size:23px}.journal-nav{padding-bottom:8px}.journal-footer{padding-block:6px}}.title-screen,.modal-panel,.settings-panel,.ending-screen{border:2px solid var(--outline);border-radius:26px 22px 28px 21px;background:radial-gradient(ellipse at 12% 0%,rgba(255,255,255,.5),transparent 45%),repeating-linear-gradient(0deg,rgba(116,87,59,.025) 0 1px,transparent 1px 7px),var(--paper);box-shadow:0 10px #493d352e,0 20px 45px var(--shadow)}.title-screen{top:50%;left:clamp(22px,7vw,126px);width:min(430px,calc(100vw - 36px));padding:clamp(22px,4vh,40px) clamp(22px,4vw,42px) 22px;transform:translateY(-50%) rotate(-1deg);text-align:center}.title-stamp{width:74px;height:74px;margin:0 auto 13px;display:grid;place-items:center}.title-stamp img{display:block;width:100%;height:100%;filter:drop-shadow(0 3px 2px rgba(73,61,53,.18))}.eyebrow{margin:0 0 7px;color:var(--rust);font-size:12px;font-weight:800;letter-spacing:.16em}h1,h2,p{margin-top:0}h1{margin-bottom:7px;font-family:Georgia,Songti SC,SimSun,serif;font-size:clamp(44px,6vw,64px);font-weight:700;letter-spacing:.08em;line-height:1.08}h1 span{display:block;color:var(--rust);font-size:.78em;letter-spacing:.2em}.title-copy{margin-bottom:19px;color:var(--muted-ink);font-size:16px;letter-spacing:.04em}.title-actions{display:grid;gap:8px}.button{min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:12px;border:2px solid transparent;border-radius:15px 12px 16px;padding:10px 18px;font-weight:750;letter-spacing:.04em;transition:background-color .18s ease,box-shadow .18s ease,transform .18s ease,color .18s ease}.button:hover{transform:translateY(-2px)}.button:active{transform:translateY(1px) scale(.985)}.button:disabled{cursor:not-allowed;opacity:.48;transform:none}.button-primary{color:#fff8e8;border-color:#7e483a;background:var(--rust);box-shadow:0 4px #754737}.button-primary:hover{background:#954f3f}.button-primary span{font-size:20px}.button-quiet{color:var(--ink);border-color:#493d3533;background:#fff9ea6b}.button-quiet:hover{border-color:var(--rust);background:#fff9ead1}.title-footer{display:flex;justify-content:space-between;gap:12px;margin-top:20px;color:var(--muted-ink);font-size:11px}.hud{position:absolute;z-index:10;inset:0;pointer-events:none;padding:max(16px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left))}.hud-top{display:grid;grid-template-columns:minmax(190px,250px) minmax(235px,1fr) minmax(180px,240px);align-items:start;gap:12px;max-width:1060px;margin:0 auto}.hud-card{color:var(--ink);border:1.5px solid rgba(73,61,53,.62);border-radius:15px 13px 16px 12px;background:#faeed7ed;box-shadow:0 4px #493d3526;backdrop-filter:blur(6px)}.tide-card{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:8px;min-height:64px;padding:8px 10px}.tide-icon{width:36px;height:36px;display:grid;place-items:center;border:2px solid var(--sea-deep);border-radius:50%;color:var(--sea-deep);font-size:23px;background:#d7e3d4}.tide-copy,.tide-clock{display:grid;gap:1px}.hud-label{color:var(--muted-ink);font-size:11px;font-weight:700}.tide-copy strong{font-size:16px}.tide-clock{text-align:right;font-variant-numeric:tabular-nums}.tide-clock b{font-size:16px}.tide-clock span{color:var(--muted-ink);font-size:10px}.tide-card.warning{border-color:#a74937;box-shadow:0 0 0 2px #a749372b,0 4px #493d3526}.tide-card.tide-high .tide-icon{color:#7d4a3d;border-color:#9d5542;background:#f2cfaa}.route-card{min-height:64px;display:grid;align-content:center;padding:8px 17px;text-align:center}.route-card strong{font-size:17px}.objective-hint{color:var(--muted-ink);font-size:12px}.mail-card{min-height:64px;display:grid;grid-template-columns:auto 1fr;align-items:center;column-gap:8px;padding:7px 11px}.mail-card>.hud-label{grid-column:1 / -1}.mail-card strong{font-size:22px;line-height:1;font-variant-numeric:tabular-nums}.mail-card strong i{color:var(--muted-ink);font-size:14px;font-style:normal}.mail-dots{display:flex;gap:4px;justify-content:flex-end}.mail-dot{width:10px;height:13px;border:1px solid #7c6654;border-radius:3px 3px 1px 1px;background:#dfceb0;transform:rotate(2deg)}.mail-dot.delivered{border-color:#6b8c7b;background:var(--sea)}.hud-bottom{position:absolute;left:max(18px,env(safe-area-inset-left));right:max(18px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));display:flex;align-items:center;gap:10px;padding-right:116px}.place-card{min-height:46px;display:flex;align-items:center;gap:8px;padding:7px 12px}.place-mark{color:var(--rust);font-size:22px;font-weight:800}.place-card b{font-size:13px}.place-card i{color:var(--muted-ink);font-size:10px;font-style:normal}.collect-card{min-height:42px;display:flex;align-items:center;gap:14px;padding:5px 12px;border:1px solid rgba(73,61,53,.5);border-radius:13px;color:var(--ink);background:#faeed7e6;font-size:13px}.collect-card span{display:inline-flex;gap:5px;align-items:center}.shell-mark{color:#a96557;font-size:20px;font-style:normal}.stamp-mark{color:var(--sea-deep);font-size:17px;font-style:normal}.icon-button{width:48px;height:48px;display:grid;place-items:center;border:1.5px solid var(--outline);border-radius:50%;color:var(--ink);background:var(--paper);font-size:20px;font-weight:800;transition:transform .16s ease,background-color .16s ease}.icon-button:hover{transform:scale(1.06);background:var(--paper-light)}.pause-button{position:absolute;right:max(18px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));pointer-events:auto}.tutorial-card{position:absolute;z-index:12;left:50%;bottom:max(88px,calc(env(safe-area-inset-bottom) + 82px));width:min(520px,calc(100% - 36px));display:flex;align-items:end;justify-content:space-between;gap:20px;padding:17px 18px 15px 21px;border:1.5px solid rgba(73,61,53,.68);border-radius:17px 21px 15px 19px;color:var(--ink);background:#faeed7f7;box-shadow:0 6px #493d352b,0 15px 35px #2d38312e;transform:translate(-50%);pointer-events:auto;backdrop-filter:blur(9px)}.tutorial-card[hidden]{display:none}.tutorial-copy{display:grid;gap:4px;min-width:0}.tutorial-kicker{color:var(--rust);font-size:10px;font-weight:800;letter-spacing:.13em}.tutorial-copy strong{font-family:Georgia,Songti SC,serif;font-size:19px}.tutorial-copy p{max-width:335px;margin:0;color:var(--muted-ink);font-size:13px;line-height:1.55}.tutorial-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto}.tutorial-actions button{min-height:44px;border-radius:11px;font:inherit;font-size:12px;font-weight:750;cursor:pointer}.tutorial-skip{padding:0 10px;border:1px solid transparent;color:var(--muted-ink);background:transparent}.tutorial-skip:hover{border-color:#493d353d;color:var(--ink)}.tutorial-next{padding:0 13px;border:1.5px solid var(--sea-deep);color:#fff8e8;background:var(--sea-deep);box-shadow:0 3px #2a4a4c3b}.tutorial-next span{margin-left:5px;font-size:16px}.tutorial-next:hover{background:#294f55}.dialogue-screen{position:absolute;z-index:16;inset:0;display:grid;place-items:center;padding:max(18px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));background:#24332e38;pointer-events:auto;backdrop-filter:blur(3px)}.dialogue-screen[hidden]{display:none}.dialogue-panel{width:min(490px,100%);padding:23px 25px 20px;border:1.5px solid rgba(73,61,53,.74);border-radius:18px 23px 17px 21px;color:var(--ink);background:#faeed7fa;box-shadow:0 7px #493d3530,0 18px 48px #26302a47;pointer-events:auto}.dialogue-kicker{color:var(--rust);font-size:10px;font-weight:800;letter-spacing:.16em}.dialogue-panel h2{margin:5px 0 10px;font-family:Georgia,Songti SC,serif;font-size:24px}.dialogue-panel p{min-height:48px;margin:0 0 17px;color:var(--muted-ink);font-size:15px;line-height:1.75;white-space:pre-line}.dialogue-close{min-height:48px;padding:0 16px;border:1.5px solid var(--sea-deep);border-radius:12px;color:#fff8e8;background:var(--sea-deep);font:inherit;font-size:13px;font-weight:750;cursor:pointer}.dialogue-close:hover{background:#294f55}.dialogue-close span{margin-left:7px;font-size:17px}.zone-banner{position:absolute;top:24%;left:50%;display:grid;gap:2px;min-width:min(420px,calc(100vw - 36px));padding:13px 21px 16px;border:1.5px solid rgba(73,61,53,.55);border-radius:12px 20px 14px 18px;color:var(--ink);background:#faeed7eb;box-shadow:0 5px #493d352b;text-align:center;opacity:0;transform:translate(-50%,8px);transition:opacity .26s ease,transform .26s ease}.zone-banner.visible{opacity:1;transform:translate(-50%)}.zone-banner span{color:var(--rust);font-size:10px;letter-spacing:.18em}.zone-banner b{font-family:Georgia,Songti SC,serif;font-size:23px}.zone-banner i{color:var(--muted-ink);font-size:12px;font-style:normal}.toast{position:absolute;left:50%;bottom:max(82px,calc(env(safe-area-inset-bottom) + 74px));max-width:min(520px,calc(100vw - 34px));padding:10px 18px;border:1.5px solid rgba(73,61,53,.7);border-radius:13px;color:var(--ink);background:#faeed7f5;box-shadow:0 4px #493d3529;font-size:14px;line-height:1.4;text-align:center;opacity:0;pointer-events:none;transform:translate(-50%,8px);transition:opacity .2s ease,transform .2s ease}.toast.visible{opacity:1;transform:translate(-50%)}.toast.alert{border-color:#9f523f;color:#713b30}.subtitles-off .toast{display:none}.modal-panel{top:50%;left:50%;width:min(380px,calc(100vw - 32px));display:grid;gap:9px;padding:30px;text-align:center;transform:translate(-50%,-50%)}.modal-panel h2,.settings-panel h2,.ending-screen h2{margin:0;font-family:Georgia,Songti SC,SimSun,serif;font-size:34px;line-height:1.2}.modal-subtitle{margin:0 0 8px;color:var(--muted-ink);line-height:1.55}.complete-panel{padding-top:25px}.complete-mark{color:var(--rust);font-size:40px;line-height:1}.settings-panel{top:50%;left:50%;width:min(690px,calc(100vw - 28px));max-height:min(88dvh,790px);overflow-y:auto;padding:clamp(17px,3vw,28px);transform:translate(-50%,-50%);overscroll-behavior:contain;touch-action:pan-y}.settings-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:17px}.settings-heading .eyebrow{margin-bottom:4px}.settings-heading h2{font-size:30px}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px}.settings-grid label{display:grid;gap:6px;min-height:58px;color:var(--muted-ink);font-size:13px;font-weight:700}.settings-grid select,.settings-grid input[type=range]{width:100%;min-height:48px;border:1px solid rgba(73,61,53,.55);border-radius:10px;padding:7px 10px;color:var(--ink);background:var(--paper-light)}.settings-grid select{cursor:pointer}.settings-grid label{min-width:0}.settings-grid select{min-width:0;font-size:16px}.settings-grid input[type=range]{min-height:48px;padding:0 4px;accent-color:var(--rust)}.toggle-setting{display:flex!important;flex-direction:row;align-items:center;justify-content:space-between;padding:7px 2px}.toggle-setting input{width:23px;height:23px;accent-color:var(--sea-deep)}.range-setting{position:relative;grid-template-columns:1fr auto;align-items:center}.range-setting input{grid-column:1 / -1}.range-setting span{color:var(--ink);font-variant-numeric:tabular-nums}.settings-footer{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;margin-top:15px}.settings-footer .button{flex:1 1 135px;min-height:48px;padding-inline:11px;font-size:13px}.bindings-grid{display:flex;flex-wrap:wrap;gap:6px;margin-top:11px}.binding-chip{min-height:48px;border:1px solid rgba(73,61,53,.4);border-radius:9px;padding:5px 9px;color:var(--ink);background:#fff9ea9e;font-size:11px}.binding-chip:hover,.binding-chip.awaiting{border-color:var(--rust);background:#f8d7b4}.rebind-status{min-height:20px;margin:6px 0 0;color:var(--rust);font-size:12px}.ending-screen{top:50%;left:50%;width:min(540px,calc(100vw - 32px));padding:clamp(25px,5vw,48px);text-align:center;transform:translate(-50%,-50%) rotate(.5deg)}.ending-screen h2{margin-bottom:12px;font-size:clamp(33px,6vw,48px)}.ending-screen>p:not(.eyebrow){max-width:390px;margin:0 auto 17px;color:var(--muted-ink);line-height:1.75}.ending-seal{width:78px;height:78px;display:grid;place-items:center;margin:0 auto 18px;border:3px double var(--rust);border-radius:50%;color:var(--rust);font-family:Georgia,serif;font-size:23px;transform:rotate(-9deg)}.ending-stats{margin:0 0 17px;color:var(--muted-ink);font-size:13px}.ending-coast{position:relative;margin:12px 0 18px;overflow:hidden;border:1px solid var(--outline);border-radius:12px;background:var(--sea-deep)}.ending-coast img{display:block;width:100%;height:clamp(130px,27vh,220px);object-fit:cover;opacity:.65}.ending-lights{position:absolute;inset:auto 6% 10px;display:flex;justify-content:space-between;gap:6px}.ending-lights span{display:flex;flex-direction:column;align-items:center;gap:7px;color:#fff9ec;font-size:12px;text-shadow:0 1px 3px #294c50}.ending-lights span:before{content:"";width:10px;height:14px;border:2px solid #fff3cf;border-radius:6px 6px 2px 2px;background:#4a5f58;transition:background .7s,box-shadow .7s}.ending-screen[data-lights="1"] .ending-lights span:nth-child(-n+1):before,.ending-screen[data-lights="2"] .ending-lights span:nth-child(-n+2):before,.ending-screen[data-lights="3"] .ending-lights span:nth-child(-n+3):before,.ending-screen[data-lights="4"] .ending-lights span:nth-child(-n+4):before,.ending-screen[data-lights="5"] .ending-lights span:before{background:#ffe0a0;box-shadow:0 0 18px 7px #ffe0a0a6}.ending-line{min-height:3.5em;font-size:16px}.ending-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:16px}.ending-actions .button{flex:1 1 180px;min-height:48px}.collection-rewards{text-align:left}.collection-reward{margin:0;padding:12px 0;border-bottom:1px solid var(--paper-dark);font-size:16px;line-height:1.65;overflow-wrap:anywhere}.collection-reward strong,.collection-reward span{display:block}.collection-reward strong{color:var(--muted-ink);font-size:15px}.collection-reward[data-unlocked=true] strong{color:var(--sea-deep)}.collection-reward span{margin-top:4px}#journal-reward-panel{padding-top:20px;border-top:2px solid var(--outline)}#journal-reward-panel h3{margin:0 0 8px}#journal-keepsake,#ending-keepsake{margin-top:14px;text-decoration:none;min-height:48px}@media(prefers-reduced-motion:reduce){.ending-lights span:before{transition:none}}.touch-controls{position:absolute;z-index:15;inset:auto 0 0;display:flex;align-items:end;justify-content:space-between;padding:0 max(20px,env(safe-area-inset-right)) max(17px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));pointer-events:none;touch-action:none}.stick-wrap{display:grid;justify-items:center;gap:5px;color:#493d35bf;font-size:11px;font-weight:700;text-shadow:0 1px 4px rgba(255,245,220,.8);pointer-events:auto}.stick-base{width:132px;height:132px;position:relative;display:grid;place-items:center;border:2px solid rgba(73,61,53,.32);border-radius:50%;background:rgba(244,230,200,var(--stick-opacity,.72));box-shadow:inset 0 3px 11px #493d3521,0 4px 12px #2d322b1f;touch-action:none}.stick-base:before,.stick-base:after{content:"";position:absolute;background:#493d3529}.stick-base:before{width:70%;height:1px}.stick-base:after{width:1px;height:70%}.stick-knob{z-index:1;width:53px;height:53px;border:2px solid rgba(73,61,53,.7);border-radius:50%;background:#e7b989;box-shadow:0 3px #493d3538,inset 0 3px 4px #ffffff52;transform:translate(0);will-change:transform}.touch-actions{display:grid;grid-template-columns:repeat(2,66px);grid-template-rows:repeat(2,66px);gap:9px;pointer-events:auto}.touch-button{width:66px;height:66px;display:grid;place-content:center;gap:1px;border:2px solid rgba(73,61,53,.62);border-radius:50%;color:var(--ink);background:rgba(244,230,200,var(--button-opacity,.88));box-shadow:0 4px #493d353b,inset 0 2px 5px #ffffff73;font-size:20px;font-weight:850;line-height:1;user-select:none;touch-action:none}.touch-button small{font-size:10px;font-weight:700}.touch-button:active,.touch-button.pressed{transform:translateY(3px) scale(.97);box-shadow:0 1px #493d3533}.jump-touch{background-color:rgba(226,181,128,var(--button-opacity,.88))}.interact-touch{background-color:rgba(145,182,165,var(--button-opacity,.88))}.orientation-note{display:none}.orientation-note.visible{position:absolute;z-index:16;top:max(179px,calc(env(safe-area-inset-top) + 170px));left:50%;display:block;max-width:calc(100vw - 36px);padding:7px 12px;border:1px solid rgba(73,61,53,.55);border-radius:10px;color:var(--ink);background:#faeed7e6;font-size:12px;text-align:center;pointer-events:none;transform:translate(-50%)}#fps-counter{position:absolute;right:0;bottom:8px;color:#fff9e9;font:11px/1.4 ui-monospace,Cascadia Mono,monospace;text-shadow:0 1px 3px rgba(0,0,0,.75)}#fps-counter[hidden]{display:none}body[data-color-assist=high-contrast]{--ink: #2b211c;--muted-ink: #45392f;--outline: #30271f}body[data-color-assist=blue-yellow] .hud-card,body[data-color-assist=blue-yellow] .settings-panel,body[data-color-assist=blue-yellow] .screen-panel{filter:saturate(1.25) hue-rotate(8deg)}body.font-large{font-size:18px}body.font-large .hud-label,body.font-large .objective-hint,body.font-small{font-size:14px}@media(max-width:720px){#game-frame{width:100vw;height:100dvh}.title-screen{left:50%;width:min(390px,calc(100vw - 28px));padding:22px 23px 18px;transform:translate(-50%,-50%) rotate(-.7deg)}.title-stamp{width:62px;height:62px;margin-bottom:8px}.title-actions{gap:6px}.title-footer{margin-top:14px;font-size:10px}.hud{padding:max(9px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(9px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left))}.hud-top{grid-template-columns:minmax(0,1fr) minmax(92px,auto);gap:6px;max-width:540px}.tide-card{grid-column:1;min-height:51px;grid-template-columns:30px 1fr auto;gap:6px;padding:5px 7px;border-radius:11px}.tide-icon{width:29px;height:29px;font-size:18px}.hud-label{font-size:10px}.tide-copy strong,.tide-clock b{font-size:13px}.tide-clock span{font-size:9px}.route-card{grid-column:1 / -1;grid-row:2;min-height:48px;padding:4px 9px;border-radius:11px}.route-card strong{font-size:14px}.objective-hint{font-size:10px}.mail-card{grid-column:2;grid-row:1;min-height:51px;grid-template-columns:1fr auto;column-gap:3px;padding:4px 7px;border-radius:11px}.mail-card>.hud-label{grid-column:1 / -1}.mail-card strong{font-size:18px}.mail-card strong i{font-size:12px}.mail-dot{width:6px;height:10px}.mail-dots{gap:2px}.hud-bottom{left:max(10px,env(safe-area-inset-left));right:max(10px,env(safe-area-inset-right));bottom:max(9px,env(safe-area-inset-bottom));gap:6px}.place-card{min-height:39px;gap:5px;padding:5px 8px;border-radius:11px}.place-card b{max-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}.place-card i{font-size:9px}.collect-card{min-height:36px;gap:9px;padding:4px 8px;font-size:11px}.pause-button{right:max(10px,env(safe-area-inset-right));bottom:max(9px,env(safe-area-inset-bottom));width:48px;height:48px;font-size:17px}.toast{bottom:max(158px,calc(env(safe-area-inset-bottom) + 145px));font-size:13px}.zone-banner{top:28%}.tutorial-card{bottom:max(150px,calc(env(safe-area-inset-bottom) + 138px));width:min(520px,calc(100% - 24px));gap:11px;padding:13px 12px 12px 15px}.tutorial-copy strong{font-size:17px}.tutorial-copy p{font-size:12px}.tutorial-actions{gap:4px}.tutorial-skip{padding:0 6px}.tutorial-next{padding:0 10px}.touch-controls{padding:0 max(13px,env(safe-area-inset-right)) max(13px,env(safe-area-inset-bottom)) max(13px,env(safe-area-inset-left))}.stick-base{width:116px;height:116px}.stick-knob{width:47px;height:47px}.touch-actions{grid-template-columns:repeat(2,60px);grid-template-rows:repeat(2,60px);gap:8px}.touch-button{width:60px;height:60px}.settings-panel{width:calc(100vw - 18px);max-height:calc(100dvh - 18px - env(safe-area-inset-top) - env(safe-area-inset-bottom));padding:15px;border-radius:20px}.settings-heading h2{font-size:26px}.settings-grid{gap:8px 10px}.settings-grid label{font-size:12px}.settings-grid select{min-height:48px;font-size:16px}.settings-footer{gap:6px}.settings-footer .button{flex-basis:calc(50% - 6px);font-size:12px}.modal-panel{width:min(360px,calc(100vw - 28px));padding:25px 20px}.modal-panel h2{font-size:29px}}@media(max-width:390px)and (orientation:portrait){.title-screen{padding-top:16px}.title-screen h1{font-size:46px}.touch-actions{grid-template-columns:repeat(2,54px);grid-template-rows:repeat(2,54px);gap:8px}.touch-button{width:54px;height:54px;font-size:18px}.stick-base{width:105px;height:105px}.stick-knob{width:43px;height:43px}.place-card i{display:none}.title-stamp{display:grid;width:48px;height:48px;margin-bottom:5px}.title-screen{padding-top:14px}}@media(max-height:480px)and (orientation:landscape){.title-screen{left:max(20px,env(safe-area-inset-left));width:330px;padding:14px 20px 12px;transform:translateY(-50%)}.title-stamp{display:none}.title-screen h1{font-size:40px}.title-copy{margin-bottom:10px;font-size:14px}.title-actions{gap:4px}.button{min-height:48px;padding-block:6px}.title-footer{margin-top:9px}.hud-top{grid-template-columns:minmax(140px,190px) minmax(0,1fr) minmax(90px,140px);gap:6px;max-width:1060px}.tide-card,.route-card,.mail-card{grid-column:auto;grid-row:auto;min-height:51px;min-width:0}.tide-card{grid-template-columns:27px 1fr auto;gap:5px;padding:5px 7px}.tide-icon{width:26px;height:26px;font-size:17px}.tide-copy strong,.tide-clock b{font-size:13px}.hud-label{font-size:10px}.route-card{padding:5px 8px}.route-card strong{font-size:14px}.objective-hint{font-size:11px}.mail-card{padding:5px 7px}.mail-dots{display:none}.touch-controls{padding-bottom:max(5px,env(safe-area-inset-bottom))}.stick-base{width:95px;height:95px}.stick-knob{width:40px;height:40px}.touch-actions{grid-template-columns:repeat(2,52px);grid-template-rows:repeat(2,52px);gap:8px}.touch-button{width:52px;height:52px}.tutorial-card{top:max(79px,calc(env(safe-area-inset-top) + 67px));bottom:auto;width:min(480px,calc(100% - 32px));padding:10px 14px;gap:10px}.tutorial-copy strong{font-size:16px}.tutorial-copy p{font-size:12px}.mail-card strong{white-space:nowrap;font-size:17px}.hud-bottom{bottom:6px}}.title-screen,.modal-panel,.ending-screen{top:calc(50% + (env(safe-area-inset-top) - env(safe-area-inset-bottom))/2);max-height:calc(100% - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y}.modal-panel,.settings-panel,.ending-screen{left:calc(50% + (env(safe-area-inset-left) - env(safe-area-inset-right))/2);max-width:calc(100% - 24px - env(safe-area-inset-left) - env(safe-area-inset-right))}.settings-panel{top:calc(50% + (env(safe-area-inset-top) - env(safe-area-inset-bottom))/2)}.dialogue-screen{z-index:20}.dialogue-panel{max-height:100%;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y}.hud-card,.route-card strong,.objective-hint{min-width:0;overflow-wrap:anywhere}.touch-layout .hud-top{margin-right:60px}.touch-layout .pause-button{top:max(12px,env(safe-area-inset-top));bottom:auto}.touch-layout .hud-bottom{left:50%;right:auto;width:max-content;max-width:calc(100% - 340px);padding-right:0;justify-content:center;transform:translate(-50%)}.touch-layout .place-card{min-width:0}.touch-layout .place-card b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.touch-layout .place-card i{display:none}.touch-layout .collect-card{flex-shrink:0}.touch-layout .tutorial-card{bottom:max(180px,calc(env(safe-area-inset-bottom) + 168px))}.touch-layout .toast{bottom:max(182px,calc(env(safe-area-inset-bottom) + 170px))}.touch-layout:has(.tutorial-card:not([hidden])) .toast,.hud:has(.tutorial-card:not([hidden])) .zone-banner,.touch-layout:has(.tutorial-card:not([hidden])) .orientation-note{display:none}@media(max-width:600px)and (orientation:portrait){.touch-layout .hud-top{grid-template-columns:minmax(0,1fr) 84px}.touch-layout .mail-dots{display:none}.touch-layout .pause-button{top:max(9px,env(safe-area-inset-top))}.touch-layout .hud-bottom{position:static;margin-top:8px;width:auto;max-width:none;justify-content:space-between;transform:none}.orientation-note.visible{position:static;width:fit-content;margin:8px auto 0;transform:none}.touch-layout .tutorial-card{flex-direction:column;align-items:stretch}.tutorial-actions{justify-content:flex-end}.zone-banner{top:30%}.settings-footer .button{flex-basis:100%}}@media(max-height:480px)and (orientation:landscape){.touch-layout .tutorial-card{bottom:auto;width:min(480px,calc(100% - 260px))}.touch-layout .hud-bottom{max-width:calc(100% - 280px);bottom:max(8px,env(safe-area-inset-bottom))}.touch-layout .place-card{padding:4px 7px;min-height:36px}.touch-layout .place-card b{max-width:110px;font-size:11px}.touch-layout .collect-card{min-height:36px;font-size:11px;gap:8px;padding:4px 7px}.touch-layout .toast{bottom:max(66px,calc(env(safe-area-inset-bottom) + 54px));max-width:calc(100% - 290px);font-size:12px}.zone-banner{top:23%;padding:8px 14px}.zone-banner b{font-size:18px}.zone-banner i{font-size:11px}.modal-panel{gap:6px;padding:16px 22px}.modal-panel h2{font-size:26px}.modal-panel .modal-subtitle{margin-bottom:0}.title-footer{flex-wrap:wrap;gap:4px}}@media(max-width:600px)and (max-height:480px)and (orientation:landscape){.touch-layout .hud-top{margin-right:54px;grid-template-columns:140px minmax(0,1fr) 76px}.mail-card strong{font-size:16px}.touch-layout .tutorial-card{flex-direction:column;align-items:stretch;gap:6px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
