:root{--gold:#ffe9b0;--gold-deep:#d4af37;--gold-dark:#8b6914;--paper:#f5ecd8;--paper-dim:#f5ecd89e;--paper-faint:#f5ecd85c;--panel:#181424e0;--panel-soft:#18142499;--line:#f5ecd81f;--line-strong:#ffe9b057;--glow:0 0 30px #ffe9b0cc;--soft-red:#ff8a8a;--serif:"Noto Serif SC", "Source Han Serif SC", "Songti SC", "STSong", "SimSun", Georgia, serif;--blur:blur(28px) saturate(1.2);--shadow:0 20px 60px #00000080}*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:100%;color:var(--paper);font-family:var(--serif);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;touch-action:none;background:#181424;overflow:hidden}#app,#app canvas{width:100%;height:100%;display:block;position:fixed;top:0;bottom:0;left:0;right:0}#app canvas{touch-action:none;outline:none}#ui{pointer-events:none;z-index:10;position:fixed;top:0;bottom:0;left:0;right:0}#ui button,.interactive{pointer-events:auto}button{color:inherit;cursor:pointer;letter-spacing:2px;background:0 0;border:none;font-family:inherit}.glass{background:var(--panel);-webkit-backdrop-filter:var(--blur);border:1px solid var(--line);box-shadow:var(--shadow)}.hud{top:calc(14px + env(safe-area-inset-top));letter-spacing:2px;white-space:nowrap;border-radius:999px;align-items:center;gap:14px;max-width:calc(100vw - 24px);padding:9px 20px;font-size:14px;display:flex;position:absolute;left:50%;transform:translate(-50%)}.hud .sep{background:var(--line-strong);width:1px;height:14px}.hud .coins{color:var(--gold);text-shadow:var(--glow);font-variant-numeric:tabular-nums}.hud .stars{pointer-events:auto;font-size:inherit;letter-spacing:inherit;color:#b8e0ff;text-shadow:0 0 18px #b8e0ffb3;font-variant-numeric:tabular-nums;padding:0 2px}.hud .stars.gain{animation:1.6s ease-out star-gain}@keyframes star-gain{0%{text-shadow:0 0 4px #fff,0 0 26px #b8e0ff}to{text-shadow:0 0 18px #b8e0ffb3}}.hud .level{align-items:center;gap:8px;display:flex}.hud .bar{background:var(--line);border-radius:3px;width:56px;height:3px;overflow:hidden}.hud .bar i{background:linear-gradient(90deg, var(--gold-dark), var(--gold));height:100%;transition:width .8s;display:block}.hud .clock{color:var(--paper-dim)}.right-actions{top:calc(18px + env(safe-area-inset-top));right:calc(16px + env(safe-area-inset-right));flex-direction:column;align-items:flex-end;gap:10px;display:flex;position:absolute}.right-actions button{color:var(--paper);letter-spacing:3px;background:var(--panel-soft);-webkit-backdrop-filter:var(--blur);border:1px solid var(--line);border-radius:999px;padding:4px 12px;font-size:12px}.right-actions button:hover{color:var(--gold)}.whisper{text-align:center;letter-spacing:4px;width:max-content;max-width:min(86vw,560px);color:var(--gold);text-shadow:0 0 24px #ffe9b0a6,0 1px 10px #18142499;opacity:0;font-size:17px;font-style:italic;line-height:1.7;transition:opacity 1.4s,transform 1.4s;position:absolute;top:19%;left:50%;transform:translate(-50%,6px)}.whisper.show{opacity:1;transform:translate(-50%)}.whisper:before{content:"";z-index:-1;filter:blur(4px);background:radial-gradient(closest-side,#18142480,#18142438 60%,#0000);position:absolute;top:-18px;bottom:-18px;left:-40px;right:-40px}.toasts{left:50%;bottom:calc(150px + env(safe-area-inset-bottom));flex-direction:column-reverse;align-items:center;gap:8px;width:max-content;max-width:calc(100vw - 32px);display:flex;position:absolute;transform:translate(-50%)}.toast{letter-spacing:2px;text-align:center;opacity:0;border-radius:16px;padding:8px 18px;font-size:13px;transition:opacity .8s,transform .8s;transform:translateY(8px)}.toast.show{opacity:1;transform:none}.float{letter-spacing:2px;white-space:nowrap;color:var(--paper);background:var(--panel-soft);text-shadow:0 0 12px #ffe9b080;border-radius:12px;padding:3px 10px;font-size:13px;animation:1.9s ease-out forwards float-up;position:absolute;transform:translate(-50%,-100%)}@keyframes float-up{0%{opacity:0;transform:translate(-50%,-80%)}15%{opacity:1}70%{opacity:1}to{opacity:0;transform:translate(-50%,-100%)translateY(-38px)}}.menu{left:50%;bottom:calc(16px + env(safe-area-inset-bottom));border-radius:999px;gap:2px;padding:6px 10px;display:flex;position:absolute;transform:translate(-50%)}.menu button{letter-spacing:2px;min-width:50px;color:var(--paper-dim);border-radius:999px;flex-direction:column;align-items:center;gap:1px;padding:6px 8px;font-size:12px;transition:color .4s,background .4s;display:flex;position:relative}.menu button .sym{color:var(--gold);opacity:.8;font-size:17px;line-height:1.1}.menu button.active,.menu button:hover{color:var(--paper);background:#ffe9b014}.menu button.active .sym{opacity:1;text-shadow:var(--glow)}.menu button .dot{background:var(--gold);width:6px;height:6px;box-shadow:0 0 8px var(--gold);border-radius:50%;display:none;position:absolute;top:5px;right:11px}.menu button.has-dot .dot{display:block}.chip-row{left:50%;bottom:calc(92px + env(safe-area-inset-bottom));gap:8px;display:flex;position:absolute;transform:translate(-50%)}.chip{letter-spacing:2px;color:var(--paper-dim);white-space:nowrap;border-radius:999px;padding:6px 16px;font-size:12px}.chip b{color:var(--gold);font-weight:400}.chip.mode{border-color:var(--line-strong);color:var(--gold)}.chip.snow{color:#dfeaff}.panel{left:50%;bottom:calc(92px + env(safe-area-inset-bottom));opacity:0;visibility:hidden;pointer-events:auto;border-radius:20px;flex-direction:column;width:min(620px,100vw - 20px);max-height:min(56vh,520px);transition:transform .6s cubic-bezier(.2,.7,.2,1),opacity .6s,visibility 0s linear .6s;display:flex;position:absolute;transform:translate(-50%,24px)}.panel.open{opacity:1;visibility:visible;transition-delay:0s;transform:translate(-50%)}.panel header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:baseline;padding:16px 22px 10px;display:flex}.panel header h2{letter-spacing:6px;color:var(--gold);text-shadow:var(--glow);font-size:16px;font-weight:400}.panel header .sub{color:var(--paper-faint);letter-spacing:2px;margin-left:12px;font-size:12px}.panel header .close{color:var(--paper-dim);padding:0 4px;font-size:18px}.panel .body{overscroll-behavior:contain;touch-action:pan-y;padding:14px 18px 18px;overflow-y:auto}.panel .body::-webkit-scrollbar{width:4px}.panel .body::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:4px}.section-title{letter-spacing:4px;color:var(--paper-faint);margin:6px 4px 10px;font-size:12px}.section-title:not(:first-child){margin-top:18px}.note{color:var(--paper-faint);letter-spacing:1.5px;margin:4px 4px 10px;font-size:12px;line-height:1.8}.empty{text-align:center;color:var(--paper-faint);letter-spacing:3px;padding:26px 0;font-size:13px;font-style:italic}.grid{grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:10px;display:grid}.card{border:1px solid var(--line);text-align:left;letter-spacing:1.5px;background:#ffe9b008;border-radius:14px;flex-direction:column;gap:3px;padding:12px 12px 10px;font-size:12px;transition:border-color .4s,background .4s;display:flex;position:relative}.card:hover:not(:disabled){border-color:var(--line-strong)}.card.selected{border-color:var(--gold-deep);background:#ffe9b017;box-shadow:inset 0 0 22px #ffe9b01f}.card:disabled{opacity:.45;cursor:default}.card .name{color:var(--paper);letter-spacing:3px;font-size:14px}.card .sym{font-size:18px}.card .meta{color:var(--paper-dim)}.card .tag{color:var(--gold);letter-spacing:1px;font-size:11px;position:absolute;top:10px;right:10px}.row{border-bottom:1px solid var(--line);letter-spacing:1.5px;align-items:center;gap:12px;padding:10px 6px;font-size:13px;display:flex}.row:last-child{border-bottom:none}.row .sym{text-align:center;width:22px;color:var(--gold);font-size:17px}.row .main{flex:1;min-width:0}.row .main .name{color:var(--paper);letter-spacing:3px}.row .main .meta{color:var(--paper-faint);margin-top:2px;font-size:11.5px}.row .count{color:var(--gold);font-variant-numeric:tabular-nums}.row .meta .short{color:var(--soft-red)}.btn{border:1px solid var(--line-strong);color:var(--gold);letter-spacing:2px;white-space:nowrap;border-radius:14px;padding:6px 14px;font-size:12px;transition:background .4s,border-color .4s}.btn:hover:not(:disabled){background:#ffe9b01a}.btn:disabled{opacity:.35;cursor:default}.btn.primary{color:#fff4d8;background:linear-gradient(135deg,#8b69148c,#d4af3759);border-color:#f5e6a880}.btn.ghost{border-color:var(--line);color:var(--paper-dim)}.actions{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.toolbar{justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px;display:flex}.progress{background:var(--line);border-radius:3px;height:3px;margin-top:6px;overflow:hidden}.progress i{background:linear-gradient(90deg, var(--gold-dark), var(--gold));height:100%;display:block}.land-grid{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.land-grid .card{text-align:center;align-items:center;gap:6px}.land-swatch{border:1px solid var(--line);border-radius:6px;width:38px;height:16px}.bottle{text-align:center;padding:10px 0 6px}.bottle .big{color:var(--gold);text-shadow:var(--glow);letter-spacing:4px;font-variant-numeric:tabular-nums;font-size:44px}.bottle .jar{color:var(--paper-dim);letter-spacing:3px;margin-bottom:14px;font-size:13px}.achieve .stars{color:var(--gold);letter-spacing:2px;font-size:11px}.seg{background:#f5ecd80d;border-radius:14px;gap:6px;width:max-content;margin:0 0 12px;padding:3px;display:flex}.seg button{letter-spacing:3px;color:var(--paper-dim);border-radius:11px;padding:5px 16px;font-size:12px}.seg button.on{color:var(--gold);text-shadow:var(--glow);background:#ffe9b01f}.bug-icon{filter:drop-shadow(0 0 6px #ffe9b059);display:inline-flex}.bug-icon.unknown{filter:grayscale()brightness(.55);opacity:.45}.const-icon{filter:drop-shadow(0 0 6px #b8d8ff80);display:inline-flex}.bug-card{align-items:flex-start}.grid:has(.bug-card){grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.bug-card .desc{color:var(--paper-faint);margin-top:2px;font-size:11.5px;line-height:1.6}.bug-card.unknown .name{color:var(--paper-faint)}.row .sym .bug-icon{vertical-align:middle}.achieve.done .name{color:var(--gold);text-shadow:var(--glow)}.achieve:not(.done){opacity:.72}.boat-ride{left:50%;bottom:calc(18px + env(safe-area-inset-bottom));opacity:0;visibility:hidden;pointer-events:auto;border-radius:20px;align-items:center;gap:14px;width:min(440px,100vw - 24px);padding:12px 14px 12px 22px;transition:transform .6s cubic-bezier(.2,.7,.2,1),opacity .6s,visibility 0s linear .6s;display:flex;position:absolute;transform:translate(-50%,24px)}.boat-ride.open{opacity:1;visibility:visible;transition-delay:.5s;transform:translate(-50%)}.boat-ride .main{flex:1;min-width:0}.boat-ride h2{letter-spacing:6px;color:var(--gold);text-shadow:var(--glow);font-size:15px;font-weight:400}.boat-ride .hint{color:var(--paper-faint);letter-spacing:1px;margin-top:3px;font-size:11px}.boat-ride .btn{flex:none;padding:8px 20px}.menu,.chip-row,.right-actions .cam{transition:opacity .5s}.riding .menu,.riding .chip-row,.riding .right-actions .cam{opacity:0!important;pointer-events:none!important}.fishing{left:50%;bottom:calc(92px + env(safe-area-inset-bottom));opacity:0;visibility:hidden;pointer-events:auto;border-radius:20px;width:min(440px,100vw - 24px);padding:16px 22px 18px;transition:transform .6s cubic-bezier(.2,.7,.2,1),opacity .6s,visibility 0s linear .6s;position:absolute;transform:translate(-50%,24px)}.fishing.open{opacity:1;visibility:visible;transition-delay:0s;transform:translate(-50%)}.fishing header{justify-content:space-between;align-items:baseline;margin-bottom:16px;display:flex}.fishing h2{letter-spacing:6px;color:var(--gold);text-shadow:var(--glow);font-size:16px;font-weight:400}.fishing .hint{color:var(--paper-faint);letter-spacing:2px;font-size:11px}.fishing .track{border:1px solid var(--line);background:#f5ecd814;border-radius:12px;height:12px;margin:0 8px;position:relative}.fishing .zone{background:linear-gradient(90deg,#d4af3759,#ffe9b0bf,#d4af3759);border-radius:12px;position:absolute;top:-1px;bottom:-1px;box-shadow:0 0 16px #ffe9b073}.fishing .dot{background:radial-gradient(circle,#fff8ec 0%,#ffe9b0 45%,#ffe9b000 72%);border-radius:50%;width:18px;height:18px;margin-top:-9px;margin-left:-9px;position:absolute;top:50%;box-shadow:0 0 18px #ffe9b0e6}.fishing .result{text-align:center;letter-spacing:3px;min-height:24px;color:var(--paper-dim);margin:16px 4px 12px;font-size:14px}.fishing .result b{text-shadow:var(--glow);font-weight:400}.fishing.won .result{color:var(--paper)}.fishing .actions{justify-content:center}.fishing .hook{min-width:120px;padding:8px 18px;font-size:13px}.loader{pointer-events:auto;cursor:pointer;z-index:50;background:radial-gradient(at 50% 70%,#5a3a6af2,#181424fa 70%);flex-direction:column;justify-content:center;align-items:center;gap:16px;transition:opacity 1.6s;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}.loader.hide{opacity:0;pointer-events:none}.loader .mark{color:var(--gold);text-shadow:var(--glow);font-size:34px;animation:3.2s ease-in-out infinite breathe}.loader h1{letter-spacing:14px;text-indent:14px;color:var(--paper);font-size:30px;font-weight:400}.loader .tag{letter-spacing:8px;text-indent:8px;color:var(--gold);opacity:.8;font-size:13px}.loader .away{text-align:center;letter-spacing:2px;max-width:80vw;color:var(--paper-dim);min-height:26px;font-size:13px;font-style:italic;line-height:2}.loader .start{letter-spacing:6px;color:var(--paper-dim);margin-top:18px;font-size:13px;animation:3.2s ease-in-out infinite breathe}@keyframes breathe{0%,to{opacity:.55}50%{opacity:1}}@media (max-width:520px){.hud{letter-spacing:1px;gap:10px;padding:8px 14px;font-size:12.5px}.hud .bar{width:36px}.right-actions{top:calc(62px + env(safe-area-inset-top))}.menu{padding:5px 6px}.menu button{letter-spacing:1px;min-width:44px;padding:5px;font-size:11px}.whisper{letter-spacing:2px;font-size:15px}.grid{grid-template-columns:repeat(2,1fr)}}
