*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;overflow:hidden}html{touch-action:manipulation}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;background:#6fa8bd;color:#241c1a}:root{--sat: var(--safe-area-inset-top, env(safe-area-inset-top, 0px));--sab: var(--safe-area-inset-bottom, env(safe-area-inset-bottom, 0px));--ui: 1;--ink: #241c1a;--card: #fffcf2;--card-shade: #f2e8d3;--violet: #6b478c;--hot: #e6494a;--annot: #c93c33}#app{position:relative;width:100%;max-width:min(100vw,52vh);height:100%;margin:0 auto;overflow:hidden;background:#8fd3e8}#stage{position:absolute;inset:0;width:100%;height:100%;display:block}#topbar{position:absolute;top:calc(var(--sat) + 52px);left:0;right:0;height:calc(52px * var(--ui));display:flex;align-items:center;justify-content:space-between;padding:0 calc(14px * var(--ui));z-index:3}.chip{width:calc(44px * var(--ui));height:calc(44px * var(--ui));border:calc(3px * var(--ui)) solid var(--ink);border-radius:calc(14px * var(--ui));background:var(--card);box-shadow:calc(3px * var(--ui)) calc(3px * var(--ui)) 0 #241c1a42;font-size:calc(19px * var(--ui));line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--ink);font-weight:800;transition:transform .12s}.chip:active{transform:scale(.9) translate(2px,2px)}#plaque{padding:calc(7px * var(--ui)) calc(20px * var(--ui));background:var(--card);border:calc(3px * var(--ui)) solid var(--ink);box-shadow:calc(3px * var(--ui)) calc(3px * var(--ui)) 0 #241c1a42;transform:rotate(-1.5deg);clip-path:polygon(2% 6%,98% 0%,100% 92%,96% 100%,3% 97%,0% 12%);font-size:calc(21px * var(--ui));font-weight:900;letter-spacing:calc(3px * var(--ui))}#bubble-band{position:absolute;top:calc(var(--sat) + 52px + 62px * var(--ui));left:0;right:0;height:calc(74px * var(--ui));display:flex;align-items:center;justify-content:center;padding:0 calc(18px * var(--ui));pointer-events:none;z-index:3}#bubble{position:relative;max-width:100%;padding:calc(10px * var(--ui)) calc(16px * var(--ui));background:var(--card);border:calc(3px * var(--ui)) solid var(--ink);border-radius:calc(16px * var(--ui));box-shadow:calc(3px * var(--ui)) calc(3px * var(--ui)) 0 #241c1a42;font-size:calc(15px * var(--ui));font-weight:700;line-height:1.35;text-align:center;transform-origin:center bottom;animation:pop .22s cubic-bezier(.2,1.4,.4,1)}#bubble:after{content:"";position:absolute;bottom:calc(-9px * var(--ui));left:50%;width:calc(14px * var(--ui));height:calc(14px * var(--ui));background:var(--card);border-right:calc(3px * var(--ui)) solid var(--ink);border-bottom:calc(3px * var(--ui)) solid var(--ink);transform:translate(-50%) rotate(45deg)}@keyframes pop{0%{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}.hidden{display:none!important}#bottom{position:absolute;left:0;right:0;bottom:calc(var(--sab) + 8px);display:flex;flex-direction:column;gap:calc(14px * var(--ui));z-index:3}#propbar{display:flex;justify-content:center;gap:calc(12px * var(--ui));padding:0 calc(12px * var(--ui))}.prop{flex:1 1 0;max-width:calc(60px * var(--ui));padding:calc(7px * var(--ui)) 0 calc(5px * var(--ui));background:var(--card);border:calc(3px * var(--ui)) solid var(--ink);border-radius:calc(16px * var(--ui));box-shadow:calc(3px * var(--ui)) calc(3px * var(--ui)) 0 #241c1a42;display:flex;flex-direction:column;align-items:center;gap:calc(2px * var(--ui));cursor:pointer;transition:transform .12s;color:var(--ink)}.prop:active{transform:scale(.9) translate(2px,2px)}.prop-icon svg{width:calc(26px * var(--ui));height:calc(26px * var(--ui));display:block}.prop-name{font-size:calc(11px * var(--ui));font-weight:800}#btn-mute svg{width:calc(24px * var(--ui));height:calc(24px * var(--ui));display:block}#btn-mic svg{width:calc(36px * var(--ui));height:calc(36px * var(--ui));display:block}#dock{display:flex;align-items:center;justify-content:space-between;padding:0 calc(18px * var(--ui))}.pill{min-width:calc(66px * var(--ui));padding:calc(9px * var(--ui)) calc(12px * var(--ui));background:var(--card);border:calc(3px * var(--ui)) solid var(--ink);border-radius:calc(14px * var(--ui));box-shadow:calc(3px * var(--ui)) calc(3px * var(--ui)) 0 #241c1a42;font-size:calc(14px * var(--ui));font-weight:800;color:var(--ink);cursor:pointer;transition:transform .12s}.pill:active{transform:scale(.92) translate(2px,2px)}#btn-play{background:var(--violet);color:#fff;font-size:calc(16px * var(--ui));padding:calc(11px * var(--ui)) calc(18px * var(--ui))}@keyframes nudge{0%,86%,to{transform:none}90%{transform:scale(1.07)}95%{transform:scale(.98)}}#btn-play.nudge{animation:nudge 5s ease-in-out infinite}#btn-best{display:flex;flex-direction:column;align-items:center;gap:calc(1px * var(--ui));padding:calc(6px * var(--ui)) calc(10px * var(--ui));background:#fffcf2d1;box-shadow:calc(2px * var(--ui)) calc(2px * var(--ui)) 0 #241c1a33}#btn-best b{font-size:calc(13px * var(--ui));font-weight:900}#btn-best i{font-style:normal;font-size:calc(10px * var(--ui));font-weight:700;color:#9a8d84}@media(prefers-reduced-motion:reduce){#btn-play.nudge{animation:none}}#micwrap{display:flex;flex-direction:column;align-items:center;gap:calc(6px * var(--ui))}#btn-mic{width:calc(72px * var(--ui));height:calc(72px * var(--ui));border-radius:50%;border:calc(4px * var(--ui)) solid var(--ink);background:var(--card);box-shadow:calc(4px * var(--ui)) calc(4px * var(--ui)) 0 #241c1a42;font-size:calc(30px * var(--ui));line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .12s,background .2s}#btn-mic:active{transform:scale(.92) translate(2px,2px)}#btn-mic.recording{background:var(--hot);animation:pulse 1s infinite}#btn-mic.playing{background:var(--violet)}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.07)}}#mic-label{font-size:calc(13px * var(--ui));font-weight:800;padding:calc(3px * var(--ui)) calc(10px * var(--ui));background:#fffcf2e6;border:calc(2px * var(--ui)) solid var(--ink);border-radius:calc(10px * var(--ui))}#toast{position:absolute;left:0;right:0;top:42%;margin:0 auto;width:fit-content;z-index:99;max-width:84%;padding:calc(10px * var(--ui)) calc(18px * var(--ui));background:#241c1aeb;color:#fffcf2;font-size:calc(15px * var(--ui));font-weight:800;text-align:center;border-radius:calc(12px * var(--ui));pointer-events:none;animation:pop .18s ease-out}#hud{position:absolute;top:calc(var(--sat) + 52px);left:0;right:0;display:flex;flex-direction:column;align-items:center;gap:calc(8px * var(--ui));padding:0 calc(24px * var(--ui));z-index:3;pointer-events:none}#hud-score{display:flex;align-items:baseline;gap:calc(5px * var(--ui));font-size:calc(30px * var(--ui));font-weight:900;color:var(--ink);text-shadow:0 calc(2px * var(--ui)) 0 rgba(255,252,242,.9)}#hud-score em{font-size:calc(12px * var(--ui));font-style:normal;font-weight:800}#hud-prompt{padding:calc(9px * var(--ui)) calc(26px * var(--ui));background:var(--violet);color:#fff;border:calc(3px * var(--ui)) solid var(--ink);border-radius:calc(16px * var(--ui));box-shadow:calc(3px * var(--ui)) calc(3px * var(--ui)) 0 #241c1a4d;font-size:calc(26px * var(--ui));font-weight:900;letter-spacing:calc(3px * var(--ui));animation:pop .2s cubic-bezier(.2,1.4,.4,1)}#hud-bar{width:100%;max-width:calc(240px * var(--ui));height:calc(10px * var(--ui));background:#fffcf2bf;border:calc(2.5px * var(--ui)) solid var(--ink);border-radius:calc(6px * var(--ui));overflow:hidden}#hud-bar-fill{display:block;width:100%;height:100%;background:var(--hot);transform-origin:left center}.sheet{position:absolute;inset:0;background:#241c1a8c;display:flex;align-items:center;justify-content:center;padding:calc(var(--sat) + 52px) calc(24px * var(--ui)) calc(var(--sab) + 24px * var(--ui));z-index:10;animation:fade .18s}@keyframes fade{0%{opacity:0}to{opacity:1}}.sheet-x{position:absolute;top:calc(var(--sat) + 52px);right:calc(14px * var(--ui));width:calc(38px * var(--ui));height:calc(38px * var(--ui));border-radius:50%;border:calc(3px * var(--ui)) solid var(--ink);background:var(--card);color:var(--ink);font-size:calc(22px * var(--ui));line-height:1;font-weight:700;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:2;box-shadow:calc(2px * var(--ui)) calc(2px * var(--ui)) 0 #241c1a59;transition:transform .12s}.sheet-x:active{transform:scale(.9)}.about-card{width:100%;max-height:82%;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;background:var(--card);border:calc(3px * var(--ui)) solid var(--ink);border-radius:calc(20px * var(--ui));box-shadow:calc(4px * var(--ui)) calc(4px * var(--ui)) 0 #241c1a66;padding:calc(22px * var(--ui))}.about-card h1{font-size:calc(21px * var(--ui));margin-bottom:calc(10px * var(--ui))}.about-card h2{font-size:calc(15px * var(--ui));margin:calc(16px * var(--ui)) 0 calc(6px * var(--ui));color:var(--violet)}.about-card h2.first{margin-top:0}.about-card p{font-size:calc(13.5px * var(--ui));line-height:1.65;margin-bottom:calc(6px * var(--ui));color:#4a3f3a}.fortune-card{position:relative;width:100%;background:var(--card);border:calc(3px * var(--ui)) solid var(--ink);border-radius:calc(20px * var(--ui));box-shadow:calc(5px * var(--ui)) calc(5px * var(--ui)) 0 #241c1a66;padding:calc(30px * var(--ui)) calc(24px * var(--ui)) calc(22px * var(--ui));text-align:center;animation:pop .3s cubic-bezier(.2,1.4,.4,1)}.fortune-seal{position:absolute;top:calc(-16px * var(--ui));left:50%;transform:translate(-50%);width:calc(38px * var(--ui));height:calc(38px * var(--ui));background:var(--hot);color:#fff;border:calc(3px * var(--ui)) solid var(--ink);border-radius:calc(10px * var(--ui));font-size:calc(19px * var(--ui));font-weight:900;display:flex;align-items:center;justify-content:center}.fortune-first{display:inline-block;background:var(--annot);color:#fff;font-size:calc(12px * var(--ui));font-weight:800;letter-spacing:calc(2px * var(--ui));padding:calc(3px * var(--ui)) calc(10px * var(--ui));border:calc(2px * var(--ui)) solid var(--ink);border-radius:calc(7px * var(--ui));transform:rotate(-2.5deg);margin-bottom:calc(8px * var(--ui))}.fortune-title{font-size:calc(30px * var(--ui));font-weight:900;letter-spacing:calc(4px * var(--ui));color:var(--violet);margin-bottom:calc(12px * var(--ui))}.fortune-body{font-size:calc(15px * var(--ui));font-weight:600;line-height:1.7;color:#4a3f3a;padding:0 calc(6px * var(--ui))}.fortune-foot{margin-top:calc(16px * var(--ui));padding-top:calc(12px * var(--ui));border-top:calc(2px * var(--ui)) dashed var(--card-shade);font-size:calc(11px * var(--ui));letter-spacing:calc(1px * var(--ui));color:#9a8d84}.result-score{display:flex;flex-direction:column;align-items:center;margin:calc(4px * var(--ui)) 0 calc(12px * var(--ui))}.result-score span{font-size:calc(64px * var(--ui));font-weight:900;line-height:1;color:var(--ink)}.result-score em{font-style:normal;font-size:calc(11px * var(--ui));font-weight:800;letter-spacing:calc(2px * var(--ui));color:#9a8d84;margin-top:calc(4px * var(--ui))}#lang-row{display:flex;gap:calc(6px * var(--ui));margin:0 0 calc(14px * var(--ui))}.lang{flex:1;padding:calc(6px * var(--ui)) calc(4px * var(--ui));border:calc(2px * var(--ui)) solid var(--ink);border-radius:calc(10px * var(--ui));background:var(--card-shade);color:var(--ink);font-size:calc(11.5px * var(--ui));font-weight:800;cursor:pointer;transition:transform .12s}.lang.on{background:var(--violet);color:#fff}.lang:active{transform:scale(.94)}.map-hint{display:block;margin:calc(10px * var(--ui)) auto 0;border:0;background:none;color:var(--violet);font-size:calc(12px * var(--ui));font-weight:700;text-decoration:underline;text-underline-offset:calc(3px * var(--ui));cursor:pointer}.emblem-wrap{position:relative;margin-top:calc(18px * var(--ui));padding-top:calc(16px * var(--ui));border-top:calc(2px * var(--ui)) dashed var(--card-shade);display:flex;justify-content:center}.emblem{width:calc(84px * var(--ui));height:auto;display:block}.emblem path,.emblem circle{stroke:#9a8d84;fill:none;stroke-width:3.8px;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1 2;stroke-dashoffset:1.02px;animation:emblem-draw 2.6s cubic-bezier(.4,0,.2,1) forwards;animation-play-state:paused}.emblem-wrap.play path,.emblem-wrap.play circle{animation-play-state:running}.emblem .petal{fill:var(--card)}.emblem .vein{stroke-width:2.3px;opacity:.32}.emblem .flower path{animation-delay:.2s}.emblem .stemp{animation-delay:1s}.emblem .center path,.emblem .center circle{animation-delay:1.4s}.emblem .leaf path{animation-delay:1.5s}.emblem .budp path{animation-delay:1.8s}.emblem .dot{fill:#9a8d84;stroke:none;opacity:0;animation:emblem-appear 1.2s 2.2s forwards;animation-play-state:paused}@keyframes emblem-draw{to{stroke-dashoffset:0}}@keyframes emblem-appear{to{opacity:1}}@media(prefers-reduced-motion:reduce){.emblem path,.emblem circle,.emblem .dot{stroke-dashoffset:0;opacity:1;animation:none}.emblem .vein{opacity:.32}}.credit{margin-top:calc(10px * var(--ui));font-size:calc(11.5px * var(--ui))!important;letter-spacing:calc(.5px * var(--ui));color:#9a8d84!important;text-align:center}.egg-bubble{position:absolute;bottom:calc(100% - 10px * var(--ui));left:50%;width:min(100%,320px * var(--ui));padding:calc(14px * var(--ui)) calc(18px * var(--ui));background:#fffcf2e6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(36,28,26,.1);border-radius:calc(14px * var(--ui));box-shadow:0 calc(10px * var(--ui)) calc(30px * var(--ui)) #241c1a29;font-family:Songti SC,STSong,SimSun,serif;font-size:calc(11px * var(--ui))!important;line-height:2;letter-spacing:calc(.5px * var(--ui));color:#241c1ad1!important;text-align:center;transform:translate(-50%) translateY(calc(6px * var(--ui)));opacity:0;pointer-events:none;transition:opacity .3s ease,transform .3s ease;z-index:2}.egg-bubble.show{opacity:1;transform:translate(-50%) translateY(0);pointer-events:auto}.credit-mark{display:block;font-family:Georgia,Times New Roman,serif;font-size:calc(12px * var(--ui));letter-spacing:calc(4px * var(--ui));text-indent:calc(4px * var(--ui));text-transform:uppercase}.credit-cn{display:block;margin-top:calc(5px * var(--ui));font-family:Songti SC,STSong,SimSun,serif;font-size:calc(10px * var(--ui));letter-spacing:calc(5px * var(--ui));text-indent:calc(5px * var(--ui))}.credit-site{display:block;margin-top:calc(6px * var(--ui));font-size:calc(9px * var(--ui));letter-spacing:calc(2px * var(--ui));text-indent:calc(2px * var(--ui));opacity:.72}#zonemap{width:100%;display:block;margin:calc(8px * var(--ui)) 0;border:calc(3px * var(--ui)) solid var(--ink);border-radius:calc(14px * var(--ui));background:var(--card-shade)}#zonelegend{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:calc(5px * var(--ui)) calc(10px * var(--ui));margin-bottom:calc(4px * var(--ui))}#zonelegend li{display:flex;align-items:center;gap:calc(6px * var(--ui));font-size:calc(12.5px * var(--ui));font-weight:700;color:#4a3f3a}#zonelegend b{flex:none;width:calc(18px * var(--ui));height:calc(18px * var(--ui));border-radius:50%;background:var(--annot);color:#fff;border:calc(2px * var(--ui)) solid var(--ink);font-size:calc(11px * var(--ui));display:flex;align-items:center;justify-content:center}#about-tabs{display:flex;border:calc(2.5px * var(--ui)) solid var(--ink);border-radius:calc(12px * var(--ui));overflow:hidden;margin-bottom:calc(14px * var(--ui))}.atab{flex:1;padding:calc(8px * var(--ui)) calc(4px * var(--ui));border:none;background:var(--card-shade);color:var(--ink);font-size:calc(13px * var(--ui));font-weight:800;cursor:pointer}.atab+.atab{border-left:calc(2.5px * var(--ui)) solid var(--ink)}.atab.on{background:var(--violet);color:#fff}.share-card{text-align:center}#share-preview{width:100%;max-width:calc(220px * var(--ui));margin:calc(12px * var(--ui)) auto 0;display:block;border:calc(3px * var(--ui)) solid var(--ink);border-radius:calc(12px * var(--ui));-webkit-touch-callout:default;-webkit-user-select:auto;user-select:auto}#share-tip{margin-top:calc(10px * var(--ui));font-size:calc(12px * var(--ui));color:#9a8d84;min-height:calc(16px * var(--ui))}.sheet-actions{display:flex;gap:calc(10px * var(--ui));margin-top:calc(18px * var(--ui))}.btn-primary,.btn-ghost{flex:1;margin-top:calc(18px * var(--ui));padding:calc(12px * var(--ui));border:calc(3px * var(--ui)) solid var(--ink);border-radius:calc(14px * var(--ui));font-size:calc(15px * var(--ui));font-weight:800;cursor:pointer;width:100%;transition:transform .12s;color:var(--ink)}.sheet-actions .btn-primary,.sheet-actions .btn-ghost{margin-top:0}.btn-primary{background:var(--violet);color:#fff}.btn-ghost{background:var(--card-shade)}.btn-primary:active,.btn-ghost:active{transform:scale(.96)}
