[hidden]{display:none!important}
:root{--paper:#eee4cc;--paper-light:#faf3df;--ink:#233f35;--muted:#7a735e;--jade:#285745;--gold:#bda36a;--red:#984b37;--serif:"Songti SC","STSong","SimSun",Georgia,serif;--sans:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;color-scheme:light;font-family:var(--sans);color:var(--ink);background:#243f36}
*{box-sizing:border-box}body{margin:0;min-width:280px;background:radial-gradient(ellipse at 50% 20%,#476458,#223c33 75%);font-size:14px;-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation}button:disabled{cursor:default;opacity:.5}button:focus-visible,canvas:focus-visible{outline:2px solid var(--red);outline-offset:4px}button svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}button{min-height:44px}h1,h2,p{margin:0}.game-shell{max-width:480px;margin:auto;padding:14px 20px 22px;min-height:100svh;background-color:var(--paper);background-image:radial-gradient(#806c4520 .6px,transparent .6px);background-size:5px 5px;box-shadow:0 0 65px #071c2859}.topbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:env(safe-area-inset-top)}.brand{display:flex;align-items:center;gap:10px}.brand-seal{font:28px var(--serif);display:grid;place-items:center;width:39px;height:42px;background:var(--red);color:#efdcaa;border:3px double #b99d65;border-radius:7px 2px;transform:rotate(-4deg)}.tools{display:flex;gap:4px}.icon-button{display:grid;place-items:center;width:44px;border:1px solid #bda36a70;border-radius:50%;background:#faf3df40}.eyebrow{font-size:12px;letter-spacing:2px;color:var(--muted)}h1{font:32px var(--serif);letter-spacing:5px;margin-top:5px}.best{text-align:right;color:var(--muted);font-size:12px}.best strong{display:block;font:25px Georgia,serif;color:var(--jade);margin-top:3px}.play-area{border-radius:20px 5px 16px 5px;border:1px solid #9f885d;overflow:hidden;box-shadow:0 5px 15px #344b3028;background:var(--paper-light)}.arena-head{display:flex;align-items:center;justify-content:space-between;background:#285745;color:#f3e8c7;padding:10px 15px;font:14px var(--serif);letter-spacing:2px}.level-label{font:12px var(--sans);letter-spacing:1px;color:#ded1ac}.scoreboard{display:flex;justify-content:space-between;align-items:center;padding:12px 17px 6px;background:linear-gradient(#fbf3df,#f2e7cc)}.scoreboard>div>span{display:block;font-size:12px;color:var(--muted)}.scoreboard strong{font:28px Georgia,serif;font-variant-numeric:tabular-nums}.scoreboard strong b{font-weight:normal}.scoreboard small{font-size:15px;color:var(--muted)}.captured{text-align:right}.shot-counter{text-align:center}#shots{display:flex;gap:7px;justify-content:center;height:25px;align-items:center}.shot-bead{width:9px;height:9px;background:var(--jade);transform:rotate(45deg);border:1px solid #658574;transition:background .2s}.shot-bead.used{background:transparent;border-color:#bbaa87}.board-wrap{position:relative;background:#e7dfc4}canvas{display:block;width:100%;height:auto;aspect-ratio:3/4;touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none}canvas:active{cursor:grabbing}.aim-strip{padding:9px 10px 12px;background:#f5ecd7;text-align:center;border-top:1px solid #bda36a66;min-height:48px}#hint{font-size:13px;color:var(--jade)}.power-track{height:3px;max-width:180px;margin:7px auto 0;background:#c8bd9e55;border-radius:3px;overflow:hidden}.power-track i{display:block;height:100%;width:0%;background:var(--red);transition:width .04s}.companion-row{display:flex;align-items:center;gap:10px;padding:14px 0 9px}.companion-row>span{font:14px var(--serif)}#companions{display:flex;gap:7px}.companion{width:44px;height:44px;min-height:44px;border-radius:50%;padding:2px;border:1px solid #b7a47e;background:#faf3df;overflow:hidden;position:relative}.companion[aria-pressed=true]{border:2px solid var(--jade);box-shadow:0 0 0 2px #eee4cc,0 0 0 3px #bda36a}.companion img{display:block;width:117.5%;height:117.5%;border-radius:0;object-fit:contain;object-position:center}.companion-row small{font-size:12px;color:var(--muted);margin-left:auto;text-align:right;max-width:90px;line-height:1.6}.actions{display:flex;gap:10px;margin-top:4px}.secondary,.primary{border-radius:12px 3px;display:flex;align-items:center;justify-content:center;gap:9px;padding:10px 14px;font-size:14px;min-height:46px}.secondary{border:1px solid #ac986d;background:#faf3df60;color:var(--jade)}.primary{border:1px solid #8a422f;background:var(--red);color:#fff2d2}.actions>button{flex:1}.celebration{position:absolute;left:0;right:0;top:37%;text-align:center;font:28px var(--serif);color:#8a412d;text-shadow:0 2px 4px #fff4d5;pointer-events:none;opacity:0;transform:translateY(10px)}.celebration.show{animation:announce 1.3s ease-out both}@keyframes announce{0%{opacity:0;transform:translateY(15px) scale(.85)}20%,70%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(-12px)}}.pause-overlay{position:absolute;inset:0;background:#eee4ccdc;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px}.pause-overlay[hidden]{display:none}.pause-overlay>span{font:30px var(--serif);letter-spacing:5px}dialog{width:calc(100% - 36px);max-width:380px;max-height:85svh;overflow:auto;padding:0;color:var(--ink);background:var(--paper-light);border:1px solid var(--gold);border-radius:20px 4px;box-shadow:0 15px 60px #152b3255}dialog::backdrop{background:#102e28a8;backdrop-filter:blur(4px)}.dialog-inner{padding:28px 25px}.dialog-inner h2{font:27px var(--serif);margin:6px 0 15px;letter-spacing:2px}.dialog-inner p,.dialog-inner li{font-size:14px;line-height:1.9}.dialog-inner ul{padding-left:20px;margin:14px 0}.dialog-inner .quiet{font-size:12px;color:var(--muted);margin:14px 0}.dialog-inner>.primary,.dialog-inner>.secondary{width:100%;margin-top:12px}.dialog-actions{display:flex;gap:10px;margin-top:20px}.dialog-actions button{flex:1}.result{text-align:center}.result-seal{display:grid;place-items:center;font:39px var(--serif);color:var(--red);width:64px;height:64px;border:3px double var(--red);border-radius:10px 3px;margin:20px auto;transform:rotate(-7deg)}.result-score strong{font:54px Georgia,serif;color:var(--jade)}.result-score span{margin-left:7px;color:var(--muted)}.record-note{color:var(--red);min-height:27px}.text-button{background:none;border:0;text-decoration:underline;text-underline-offset:4px;margin-top:6px;font-size:13px}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,10px);background:#233f35f5;color:var(--paper-light);padding:12px 18px;max-width:90%;width:max-content;border-radius:8px;opacity:0;pointer-events:none;transition:.2s;font-size:13px;z-index:20}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:360px){.game-shell{padding:10px 12px 18px}h1{font-size:29px}.companion-row{gap:7px}.companion-row small{max-width:70px}.scoreboard{padding:10px 14px 5px}.arena-head{padding:9px 12px}}
@media(min-width:760px){.game-shell{margin:20px auto;border:1px solid #8c9877;border-radius:24px 5px;min-height:0;padding:18px 24px 22px}body{padding-bottom:20px}}

/* Three distinct local skills; portraits and instructions stay visible before each shot. */
.companion-row{padding-bottom:7px}.companion{width:58px;height:67px;border:0;border-radius:8px;background:transparent;padding:3px 6px;overflow:visible;display:flex;flex-direction:column;align-items:center;gap:5px}.companion-portrait{display:grid;place-items:center;width:40px;height:40px;border:1px solid #b7a47e;border-radius:50%;overflow:visible;background:radial-gradient(circle,var(--paper-light),#dce4c8)}.companion[aria-pressed=true]{border:0;box-shadow:none;background:#2857450d}.companion[aria-pressed=true] .companion-portrait{box-shadow:0 0 0 2px var(--paper),0 0 0 3px var(--jade)}.companion-name{font:13px var(--serif);line-height:16px}.companion-row small{max-width:68px}.actions{margin-top:1px}@media(max-width:360px){#companions{gap:3px}.companion-row small{max-width:58px}}

/* v3: the board stays prominent; collection and wallet details open on demand. */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.eyebrow,.level-label{font-size:12px}h1{font-size:29px}.arena-head{letter-spacing:1px}

.shot-bead.planned{background:var(--red);border-color:#b0714b}.companion-row{padding-top:12px;gap:10px}.companion{height:auto;min-height:76px;gap:4px}.companion-portrait img{width:117.5%;height:117.5%;object-fit:contain}.companion-portrait .portrait-card{width:100%;height:100%;border-radius:50%;object-fit:cover;object-position:50% 28%}
.roster-trigger{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;margin-left:auto;width:56px;min-height:66px;background:transparent;border:0;color:var(--jade);font:14px var(--serif)}.roster-trigger svg{width:25px;height:25px}.roster-trigger:hover{background:#2857450c;border-radius:8px}

.practice-toggle{display:block;margin:12px auto 0;color:#76694d;min-height:44px;font-size:12px}.practice-mode .play-area{border-color:#a86a49}
.roster-dialog{max-width:470px;width:calc(100% - 24px);max-height:92svh;border-radius:18px 4px}.roster-head{display:flex;align-items:center;justify-content:space-between;padding:20px 18px 12px;gap:8px;border-bottom:1px solid #bda36a44}.roster-head h2{font:25px var(--serif);margin:6px 0 0;letter-spacing:2px}.roster-head .icon-button,.wallet-heading .icon-button{flex-shrink:0;font-size:25px;font-weight:300}
.wallet-heading{display:flex;justify-content:space-between;align-items:center;gap:8px}.wallet-heading h2{margin:0!important;font-size:25px}.wallet-heading{margin-bottom:16px}
@media(max-width:360px){.brand{gap:7px}.tools{gap:2px}.tools .icon-button{width:44px}.game-shell{padding-inline:10px}.companion-row{gap:7px}.companion{width:55px}.roster-head{padding-left:12px;padding-right:12px}}
.levels-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:16px 0}.level-tile{display:flex;flex-direction:column;align-items:center;gap:5px;padding:12px 3px;border:1px solid #bba77d;background:#f6edda;color:#285745;border-radius:10px;min-height:90px}.level-tile.current{border-color:#285745;box-shadow:inset 0 0 0 1px #285745}.level-tile:disabled{opacity:.4}.level-num{font:22px Georgia,serif;color:#a36b42}.level-tile strong{font-size:13px}.level-tile small{color:#9b7138;font-size:12px}

/* Cosmetic ownership never gates play. */
.companion-portrait.has-skin{outline:2px solid #bc9451;outline-offset:2px;box-shadow:0 0 9px #c4a96466}
.skin-status{margin:0 20px 5px;text-align:center;font-size:12px;letter-spacing:.1em;color:#866832}
.skin-preview{margin-top:-8px;margin-bottom:18px}.skin-preview[aria-pressed="true"]{color:#8d4a6b;background:#e7ddcb}

/* v5: learn a small roster, then celebrate earned unlocks. */
.unlock-note{padding:12px;border-block:1px solid #bba77d;color:#285745;line-height:1.8;background:#e5e8d2}.shot-bead{flex-shrink:0}#shots{max-width:160px;flex-wrap:wrap;justify-content:center}#share-dialog{max-width:min(440px,calc(100vw - 24px))}.share-inner{padding:16px}#share-canvas{display:block;width:100%;height:auto;border-radius:12px;max-height:none}.share-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:14px}.share-actions button{margin:0}#share-link{width:100%;font:14px var(--sans);padding:10px;color:var(--ink)}.share-inner>.text-button{display:block;margin:12px auto}.share-inner .quiet{font-size:12px;line-height:1.6}
/* Ten quiet chapter cards, then just twelve stages: keep the phone journey legible. */
.campaign-inner h2{margin-top:0}.campaign-continue{width:100%;margin:3px 0 10px}.chapter-back{padding:8px 0;color:#526f5c}.campaign-inner h3{font-size:19px;font-weight:500;color:#285745;margin:5px 0}.chapter-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0}.chapter-grid[hidden],#chapter-panel[hidden]{display:none}.chapter-card{position:relative;text-align:left;padding:15px 10px 12px 45px;border:1px solid #bba478;border-radius:9px;background:#f1e7cd;color:#355946;min-height:116px;font-family:inherit;cursor:pointer}.chapter-card strong,.chapter-card span:not(.chapter-seal),.chapter-card small{display:block}.chapter-card strong{font-size:16px;font-weight:500;line-height:1.5}.chapter-card .chapter-range{font-size:11px;letter-spacing:.02em;color:#7f7359;margin:4px 0}.chapter-theme{font-size:12px;color:#61715a}.chapter-card small{font-size:11px;color:#7f7359;margin-top:7px}.chapter-seal{position:absolute;left:10px;top:17px;display:grid;place-items:center;width:27px;height:30px;border:1px solid #aa8b59;color:#8d5938;border-radius:3px;font-size:20px;transform:rotate(-4deg)}.chapter-card.current{border-color:#315e48;background:#e5e5c8;box-shadow:inset 0 0 0 1px #315e4825}.chapter-card:disabled{opacity:.6;cursor:default}.chapter-card:focus-visible{outline:2px solid #984b37;outline-offset:2px}.campaign-rule{border-top:1px solid #b49b673d;padding-top:11px}.campaign-inner .levels-grid{margin:13px 0}.campaign-inner .level-tile{min-height:90px}.campaign-inner #free-play{width:100%;margin-top:6px}@media(max-width:360px){.chapter-card{padding-left:38px;padding-right:6px}.chapter-card strong{font-size:14px}.chapter-seal{left:7px;width:23px}.chapter-card small{font-size:10px}}
.level-goal{margin:2px 1px 9px;color:#827452;font-size:11px;line-height:1.6;letter-spacing:.01em}.level-goal[hidden]{display:none}

/* Player entrance: one compact masthead, with explanations opened on demand. */
.game-shell{padding:12px 16px 18px}
.topbar{padding-bottom:12px;gap:8px}.brand{gap:8px;min-width:0}.brand-seal{width:32px;height:35px;font-size:24px;flex-shrink:0}.brand h1{font:22px var(--serif);letter-spacing:2px;margin:0;white-space:nowrap}.tools{gap:2px}.tools .icon-button{border-color:transparent;background:transparent}.tools .icon-button:hover{background:#2857450c}
.play-area{border-radius:16px 4px 14px 4px}.arena-head{padding:0 4px 0 13px;min-height:44px;background:linear-gradient(105deg,#264c3f,#315e4c);border-bottom:1px solid #c9b77c70;letter-spacing:0}.level-label{font-size:12px;letter-spacing:.04em;color:#f3e8c7;font-variant-numeric:tabular-nums}.arena-info{border:0;background:transparent;color:#e2d4ad;flex-shrink:0}.arena-info svg{width:20px;height:20px}
.scoreboard{padding:6px 13px;gap:8px}.scoreboard strong{font-size:24px;line-height:1.1}.scoreboard small{font-size:13px}.shot-counter{min-width:0;flex:1}#shots{gap:5px;max-width:160px;margin:auto;min-height:22px;height:auto}.shot-bead{width:7px;height:7px}.aim-strip{padding:7px 10px;min-height:37px}.power-track{margin-top:5px;height:2px}
.companion-row{padding:11px 0 3px;gap:8px}.companion{min-height:65px;gap:5px}.roster-trigger{min-height:65px}.skill-summary{display:flex;align-items:center;gap:8px;min-height:44px;margin:0 0 8px;padding-left:2px}.skill-summary strong{font:16px var(--serif);color:var(--jade);flex:1;min-width:0}.skill-summary>span{font-size:12px;color:var(--muted);white-space:nowrap}.skill-summary .icon-button{border:0;background:transparent;flex-shrink:0}.skill-summary .icon-button svg{width:20px;height:20px}.actions{margin-top:0}
.compact-info p{line-height:1.8}.compact-info .level-goal{font-size:14px;margin:14px 0}.compact-info .best{text-align:left;border-top:1px solid #bda36a55;padding-top:12px;margin-top:16px}.compact-info .best strong{display:inline;font-size:22px;margin-left:12px}.compact-info .quiet{margin-top:12px}.compact-info .skin-status{margin:14px 0 0;text-align:left;color:#866832}
@media(max-width:360px){.game-shell{padding:10px 10px 16px}.brand{gap:6px}.brand h1{font-size:20px;letter-spacing:1px}.brand-seal{width:29px;height:32px}.tools{gap:0}.level-label{letter-spacing:0}.arena-head{padding-left:10px}.scoreboard{gap:6px}.companion-row{gap:6px}.skill-summary{gap:4px}.skill-summary strong{font-size:15px}}
@media(min-width:760px){.game-shell{padding:16px 24px 20px}}

/* A first meeting belongs to the earned result, not a second modal or a claim flow. */
#result-dialog.has-unlock{width:calc(100% - 28px);max-width:390px;max-height:94svh;border-radius:22px 5px;border-color:#c1a16a;background:#f6edd7}
.unlock-reveal{position:relative;isolation:isolate;overflow:hidden;padding:22px 24px 16px;text-align:center;background:radial-gradient(ellipse at 50% 24%,#fff7db 0%,transparent 57%),radial-gradient(#8e75431c .6px,transparent .8px);background-size:auto,5px 5px}
.unlock-reveal::before{content:"";position:absolute;z-index:-1;inset:9px;border:1px solid #bda36a75;border-radius:15px 2px;pointer-events:none}
.unlock-close{position:absolute;right:12px;top:12px;border:0;z-index:2;width:44px;height:44px;color:#84734d;background:transparent}
.unlock-close svg{width:19px;height:19px}
.unlock-kicker{font:12px var(--serif);letter-spacing:.4em;color:#887048;margin:0 32px 7px}
.unlock-announcement{font:21px var(--serif);letter-spacing:.15em;color:var(--jade)}
.unlock-stage{--marble-size:clamp(176px,29svh,236px);position:relative;display:grid;place-items:center;isolation:isolate;height:calc(var(--marble-size) + 38px);margin:10px -14px 0;padding-bottom:20px}
.unlock-stage::before{content:"";position:absolute;inset:8% 3% 10%;z-index:-1;border-radius:50%;background:radial-gradient(ellipse,#fffdf1b0,transparent 65%)}
.unlock-stage::after{content:"";position:absolute;bottom:12px;left:50%;width:calc(var(--marble-size) * .83);height:25px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(ellipse,#e6ffdf 0%,#d2ecc4aa 22%,#527d6844 49%,transparent 72%);filter:blur(3px);z-index:-1}
.unlock-marble{--marble-tint:#a7cbbc;position:relative;isolation:isolate;display:grid;place-items:center;width:var(--marble-size);height:var(--marble-size);border-radius:50%;border:1px solid #6a9f9a85;background:radial-gradient(ellipse at 30% 22%,#fffef4bb,transparent 48%),radial-gradient(ellipse at 74% 77%,#94e1ce55,transparent 55%),radial-gradient(circle at 48% 44%,#f9fff015 42%,#78b6a85c 80%,#d8ffffc4 98%);box-shadow:inset 2px 3px 5px #fffefaed,inset -6px -10px 17px #257b703c,inset 8px 5px 22px #d9fff661,0 12px 12px -7px #4a6d5e66,0 0 0 1px #ffffff65}
.unlock-marble::before{content:"";position:absolute;inset:6%;border-radius:50%;z-index:-1;background:radial-gradient(ellipse at 48% 60%,var(--marble-tint),transparent 65%);opacity:.32;filter:blur(7px)}
.unlock-marble::after{content:"";position:absolute;inset:2px;border-radius:50%;z-index:3;pointer-events:none;background:radial-gradient(ellipse at 35% 17%,#fffef487,transparent 35%),radial-gradient(ellipse at 76% 84%,#e7fff665,transparent 23%),linear-gradient(130deg,transparent 19%,#fffef326 30%,transparent 43%);box-shadow:inset 0 -3px 5px #f8fff38c,inset 3px 1px 4px #fffef2bf}
.unlock-art{position:relative;display:grid;place-items:center;width:80%;height:80%;min-height:0;min-width:0;overflow:hidden;border-radius:50%;transform:translateY(4%)}
.unlock-art::before{content:"妖";position:absolute;inset:0;display:grid;place-items:center;font:50px var(--serif);color:#779c8044;z-index:-1}
.unlock-art img{display:block;width:100%;height:100%;min-height:0;object-fit:contain;opacity:0;filter:drop-shadow(0 5px 3px #2c70683b)}
.unlock-art img.is-ready{opacity:1}
.unlock-art img.portrait-fallback{object-fit:cover;object-position:50% 30%;transform:scale(1.3);filter:none}
.unlock-art-fallback{display:grid;place-items:center;width:100%;height:100%;padding:12px;font:30px var(--serif);color:var(--jade);text-shadow:0 1px #fff8df}
.unlock-glass{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none;filter:drop-shadow(0 1px 1px #ffffff44)}
#unlock-title{margin:9px 0 8px;font:32px/1.25 var(--serif);letter-spacing:.12em;overflow-wrap:anywhere;color:#233f35}
.unlock-skill{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:9px;font:16px var(--serif)}
.unlock-skill>span{font:12px var(--sans);color:#f5edda;background:#365e4c;padding:3px 7px;border-radius:4px 1px}
.unlock-skill>strong{font-weight:400;letter-spacing:1px;color:#8d4e35}
.unlock-description{margin:9px auto 15px;max-width:290px;font-size:13px;line-height:1.8;color:#69694f;min-height:24px}
.unlock-actions{display:grid;gap:2px}.unlock-actions .primary{width:100%;font:16px var(--serif);min-height:48px;letter-spacing:1px;border:3px double #bc8f5b;background:linear-gradient(110deg,#a85b3e,#8e4734);box-shadow:0 4px 9px #984b3719}
.unlock-actions .text-button{margin:0;min-height:44px;text-decoration:none;color:#526954}.unlock-actions #unlock-results{min-height:44px;font-size:12px;color:#8c7753;text-decoration:underline}
.unlock-footnote{font-size:11px;color:#8a8068;margin-top:4px;line-height:1.6}
.unlock-pagination{display:flex;justify-content:center;align-items:center;gap:18px;margin:-3px 0 8px;color:#7f6c45;font-size:12px}
.unlock-pagination button{font-size:22px;background:transparent;border-color:#bda36a60}
.unlock-sparks{position:absolute;inset:0;pointer-events:none}.unlock-sparks i{position:absolute;left:15%;top:28%;width:5px;height:5px;background:#b89a5b;transform:rotate(45deg);opacity:0}.unlock-sparks i:nth-child(2){left:81%;top:18%}.unlock-sparks i:nth-child(3){left:88%;top:64%}.unlock-sparks i:nth-child(4){left:21%;top:80%}.unlock-sparks i:nth-child(5){left:11%;top:56%}.unlock-sparks i:nth-child(6){left:76%;top:85%}
#result-dialog[open] .unlock-reveal{animation:unlock-page .3s ease-out both}
#result-dialog[open] .unlock-marble{animation:unlock-marble .95s cubic-bezier(.18,.8,.25,1) both}
#result-dialog[open] .unlock-art>img.is-ready,#result-dialog[open] .unlock-art-fallback{animation:unlock-core .5s ease-out both}
#result-dialog[open] .unlock-glass{animation:unlock-glint 1.25s ease-out both}
#result-dialog[open] .unlock-sparks i{animation:unlock-spark 1.1s .15s ease-out both}
#result-dialog[open] .unlock-sparks i:nth-child(even){animation-delay:.3s}
@keyframes unlock-page{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes unlock-marble{0%{opacity:0;transform:translate(-30px,-28px) scale(.72) rotate(-24deg)}55%{opacity:1;transform:translate(2px,5px) scale(1.02,.97) rotate(3deg)}77%{transform:translateY(-5px) scale(.99,1.01)}100%{opacity:1;transform:none}}
@keyframes unlock-core{from{opacity:0}to{opacity:1}}
@keyframes unlock-glint{0%{opacity:0;transform:rotate(-38deg)}45%{opacity:1}100%{opacity:1;transform:none}}
@keyframes unlock-spark{0%{opacity:0;transform:translateY(20px) rotate(45deg) scale(.4)}25%{opacity:.85}100%{opacity:0;transform:translateY(-32px) rotate(90deg) scale(.6)}}
@media(max-width:360px){.unlock-reveal{padding:20px 18px 14px}#unlock-title{font-size:29px}.unlock-description{font-size:13px}}
@media(max-height:650px){.unlock-stage{--marble-size:166px}.unlock-reveal{padding-top:17px}.unlock-description{margin-bottom:8px}.unlock-actions #unlock-results{min-height:44px}}
@media(prefers-reduced-motion:reduce){#result-dialog[open] .unlock-reveal,#result-dialog[open] .unlock-art>img,#result-dialog[open] .unlock-art-fallback,#result-dialog[open] .unlock-marble,#result-dialog[open] .unlock-glass{animation:none}#result-dialog[open] .unlock-sparks{display:none}}

/* A paper-and-jade bestiary: original portraits, with motion only while selecting. */
.roster-trigger{width:86px;flex-shrink:0;white-space:nowrap}
.roster-dialog{max-width:440px;width:calc(100% - 24px);max-height:94svh;padding-bottom:12px;overflow-x:hidden;background-color:var(--paper-light);background-image:radial-gradient(#88734815 .6px,transparent .6px);background-size:4px 4px;border:1px solid #a48f60;border-radius:18px 4px 18px 4px;box-shadow:0 20px 60px #0e322d70,inset 0 0 0 5px #eee4cc80}
.roster-head{padding:13px 15px 0 21px;border:0}.roster-head h2{font-size:22px;margin:0;letter-spacing:2px}.roster-head .icon-button{border:0;background:transparent}
.beast-portrait{position:relative;display:grid;place-items:center;flex-shrink:0;isolation:isolate}
.beast-portrait img{width:100%;height:100%;object-fit:contain;pointer-events:none;-webkit-user-drag:none;position:relative;z-index:1;filter:drop-shadow(0 3px 1px #244b3220)}
.beast-portrait .portrait-card{width:100%;height:100%;object-fit:cover;object-position:50% 28%;border-radius:50%}
.companion{width:58px;min-height:68px;gap:5px;border-radius:6px}.companion .companion-portrait{width:42px;height:42px;border-radius:12px 3px;background:#dddcc0;border:1px solid #a9ac83;overflow:visible;box-shadow:inset 0 0 0 2px #f7efd9}
.companion .companion-portrait img{width:108%;height:108%}.companion[aria-pressed=true]{background:none}.companion[aria-pressed=true] .companion-portrait{background:#cad6b9;border-color:#285745;box-shadow:inset 0 0 0 2px #f7efd9,0 0 0 1px #285745}
.companion[aria-pressed=true] .companion-name{color:#285745}.companion-portrait.has-skin{outline:1px solid #b18c49;outline-offset:3px;box-shadow:none}.companion-name{font:13px/17px var(--serif)}
.marble-loader{width:320px;max-width:100%;height:218px;margin:0 auto;position:relative;user-select:none;-webkit-user-select:none}
.selection-landscape,.load-trails{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}.load-trails{z-index:2;opacity:0;transition:opacity .15s}
.load-trails path{fill:none;stroke-linecap:round;stroke-linejoin:round}#load-trail{stroke:url(#entry-ink);stroke-width:8}#load-trail-core{stroke:url(#entry-gold);stroke-width:2}
.load-control{position:absolute;left:50%;top:76px;transform:translate(calc(-50% + var(--load-dx,0px)),var(--load-lift,0px));width:124px;height:124px;min-height:124px;display:grid;place-items:center;padding:0;border:0;background:transparent;touch-action:none;transition:transform .22s cubic-bezier(.2,.8,.3,1);user-select:none;-webkit-user-select:none;z-index:3}
.load-control:disabled{opacity:1;cursor:default}.load-orb{width:124px;height:124px}.load-orb.is-locked{filter:saturate(.5);opacity:.72}.load-control:focus-visible{border-radius:50%;outline-offset:6px}
.load-spark{position:absolute;left:calc(50% - 28px);top:0;width:56px;text-align:center;font:56px/56px var(--serif);color:#b69b5e;opacity:0;pointer-events:none;z-index:4}
.load-mote{position:absolute;left:calc(50% - 2px);top:26px;width:4px;height:4px;background:#b39c5c;border-radius:1px;opacity:0;pointer-events:none}
.is-dragging .load-control{transition:none}.is-dragging .load-trails{opacity:1}
.is-loading .load-control{animation:beast-enter .48s cubic-bezier(.24,.7,.28,1) both}.is-loading .load-trails{animation:entry-trail .48s ease-out both}.is-loading .load-spark{animation:entry-glint .48s ease-out both}.is-loading .load-mote{animation:entry-mote .48s ease-out both}
@keyframes beast-enter{0%{transform:translate(calc(-50% + var(--load-dx,0px)),var(--load-lift,0px)) scale(1);opacity:1}65%{opacity:1}100%{transform:translate(-50%,-110px) scale(.12);opacity:0}}
@keyframes entry-trail{0%{opacity:1}65%{opacity:.8}100%{opacity:0}}
@keyframes entry-glint{0%,30%{opacity:0;transform:scale(.3)}65%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.4)}}
@keyframes entry-mote{0%,30%{opacity:0;transform:translate(0,0) rotate(45deg)}55%{opacity:1}100%{opacity:0;transform:translate(var(--mote-x),var(--mote-y)) rotate(130deg)}}

.load-name{text-align:center;font:25px var(--serif);letter-spacing:2px;margin:1px 15px 8px;color:#234d3c}.load-hint{text-align:center;font-size:11px;line-height:20px;color:#8b8266;letter-spacing:1px;margin-bottom:15px;min-height:20px}
.selection-rail{margin:0 16px;position:relative;border-block:1px solid #b9a37055;background:linear-gradient(90deg,#e5dec13b,#e7e1c66b,#e5dec13b);user-select:none;-webkit-user-select:none}
.marble-track{display:flex;align-items:flex-start;gap:7px;padding:11px 12px 7px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;touch-action:pan-x;min-height:106px;cursor:grab}
.marble-track::-webkit-scrollbar{display:none}.marble-track:active{cursor:grabbing}.marble-track:focus-visible{outline:1px solid #bda36a;outline-offset:3px}
.marble-option{flex:0 0 72px;width:72px;min-height:89px;padding:4px 4px 7px;display:flex;flex-direction:column;align-items:center;gap:7px;background:transparent;border:1px solid transparent;scroll-snap-align:center;border-radius:10px 3px;color:#69735b}
.tube-marble{width:53px;height:53px;border-radius:50%;background:#dedec4;transform:scale(.9);transition:transform .2s;overflow:hidden;border:1px solid #b2b39388}
.marble-option[aria-pressed=true]{color:#285745;border-color:#748f6d;background:#e0e5cb;box-shadow:inset 0 0 0 2px #f6efd9}
.marble-option[aria-pressed=true] .tube-marble{transform:scale(1);border-color:#99ac85}.marble-option.has-skin .tube-marble{outline:1px solid #b49655;outline-offset:2px}
.marble-name{font:13px/18px var(--serif);white-space:nowrap}.marble-option.is-locked .tube-marble{filter:saturate(.4);opacity:.7}
.marble-watermark{position:absolute;z-index:5;top:calc(50% - 9px);left:-12%;width:124%;text-align:center;background:#f6ecd4dc;color:#5c6e58;border-block:1px solid #fdf9e4;transform:rotate(-28deg);font:12px/18px var(--serif);letter-spacing:1px;pointer-events:none}
.load-control>.marble-watermark{left:0;width:100%;font-size:18px;line-height:26px;top:calc(50% - 13px)}
.tube-navigation{display:flex;align-items:center;justify-content:center;gap:23px;color:#918569;font-size:11px;margin-top:4px}.tube-navigation .icon-button{font-size:23px;border:0;background:transparent;color:#577154}
@media(max-width:360px){.roster-dialog{width:calc(100% - 18px)}.roster-head{padding-inline:15px 9px}.roster-trigger{width:82px;font-size:13px}.selection-rail{margin-inline:12px}.companion{width:55px}.marble-loader{width:290px;height:198px}.load-control{top:67px;width:118px;height:118px;min-height:118px}.load-orb{width:118px;height:118px}.load-name{font-size:23px}.load-spark{top:-2px}}
@media(prefers-reduced-motion:reduce){.load-control,.tube-marble,.load-trails{transition:none}.is-loading .load-control{animation:entry-fade .12s both}.is-loading .load-mote,.is-loading .load-spark,.is-loading .load-trails{animation:none;opacity:0}@keyframes entry-fade{to{opacity:0}}}

/* v7 release: ink-and-gold selection ceremony, animated upward guidance. */
.roster-dialog{background-image:radial-gradient(ellipse at 50% 35%,#fff8dfb0 5%,transparent 64%),radial-gradient(#88734815 .6px,transparent .6px);background-size:100% 100%,4px 4px;border-color:#a28d5c;box-shadow:0 20px 60px #0e322d70,inset 0 0 0 4px #e5d8b879,inset 0 0 0 5px #c3ae7952}
.roster-head{position:relative;padding-top:17px;padding-bottom:6px}.roster-head:after{content:'';position:absolute;left:22px;right:22px;bottom:0;height:1px;background:linear-gradient(90deg,#a68f595c,transparent)}.roster-head h2{display:flex;align-items:center;gap:10px;font-size:22px;letter-spacing:3px}
.roster-emblem{width:27px;height:30px;fill:none;stroke:#9d8650;stroke-width:1;flex:none}.roster-emblem circle{fill:#315f4930;stroke:#315f49}
.roster-head .icon-button{color:#6d7457}.roster-head .icon-button:hover{background:#315d4310;transform:rotate(90deg);transition:transform .2s}
.marble-loader:before{content:'';position:absolute;width:165px;height:165px;left:calc(50% - 82.5px);top:57px;border-radius:50%;background:radial-gradient(ellipse,#c5d6ab52 25%,#e2d5a72b 63%,transparent 72%);pointer-events:none}
.load-control{top:69px;width:138px;height:138px;min-height:138px}.load-orb{width:138px;height:138px}.load-orb img{filter:drop-shadow(0 5px 2px #2b4e392a)}
.selection-landscape{overflow:visible}.selection-sigils{opacity:.7}.roster-dialog[open] .selection-sigils{animation:sigil-draw .65s ease-out both}
@keyframes sigil-draw{from{opacity:0;stroke-dasharray:1 120;stroke-dashoffset:20}to{opacity:.7;stroke-dasharray:120 0;stroke-dashoffset:0}}
.load-chevrons{color:#8a9d68}.load-chevrons path{animation:guide-up 1.8s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
.load-chevrons path:nth-child(2){animation-delay:.18s}.load-chevrons path:nth-child(3){animation-delay:.36s}
@keyframes guide-up{0%,65%,100%{opacity:.22;transform:translateY(3px)}28%{opacity:1;transform:translateY(-2px)}}
.is-dragging .load-chevrons{color:#285745;filter:drop-shadow(0 1px 3px #d2b66b)}.is-loading .load-chevrons{opacity:0;transition:opacity .1s}.is-locked .load-chevrons{visibility:hidden}
.ambient-grain{position:absolute;width:3px;height:3px;border-radius:50%;background:#b59c60;pointer-events:none;opacity:0;animation:ink-grain 4.2s ease-in-out infinite}.grain-one{left:22%;top:72%;--grain-x:9px}.grain-two{left:77%;top:55%;--grain-x:-8px;animation-delay:1.4s}.grain-three{left:30%;top:40%;--grain-x:6px;animation-delay:2.7s}
@keyframes ink-grain{0%,100%{opacity:0;transform:translate(0,8px)}35%{opacity:.65}85%{opacity:0;transform:translate(var(--grain-x),-28px)}}
.entry-bloom{position:absolute;left:calc(50% - 22px);top:6px;width:44px;height:44px;border:1px solid #bda36a;border-radius:50%;pointer-events:none;opacity:0;box-shadow:0 0 0 7px #c6ad6720,inset 0 0 0 5px #c6ad6720}
.is-loading .entry-bloom{animation:seal-bloom .48s ease-out both}
@keyframes seal-bloom{0%,25%{opacity:0;transform:scale(.45)}60%{opacity:1}100%{opacity:0;transform:scale(1.8)}}
.load-name{font-size:27px;letter-spacing:3px;margin-top:3px}.load-name:after{content:'';display:block;width:25px;height:1px;background:#b49c5e;margin:9px auto 0}.load-hint{margin-top:6px;margin-bottom:14px;color:#867650}
.selection-rail{margin-inline:18px;background:linear-gradient(180deg,#c9d4b516,transparent 35%,#c7bd8a1a);border-color:#ae9c6a55}
.marble-option{transition:background .16s,border-color .16s,transform .16s}.marble-option:hover{background:#e4e5cc}.marble-option[aria-pressed=true]{border-color:#597c59;background:linear-gradient(150deg,#eff0d8,#d3dfbc);box-shadow:inset 0 0 0 2px #fbf3dc,0 2px 5px #395d3320}
.tube-marble{width:55px;height:55px;background:#d8ddbd;border-radius:12px 3px;border-color:#8d9f7375}.marble-option[aria-pressed=true] .tube-marble{background:#d2dcba;border-color:#9caf7b}.marble-option[aria-pressed=true] .marble-name{color:#204e38}
.tube-navigation .icon-button{border:1px solid #9b9f7533;width:44px;height:44px;min-height:44px;background:#f6eed650;border-radius:50%;transition:background .16s}.tube-navigation .icon-button:hover{background:#d8e1c3}.tube-navigation{gap:20px;margin-top:10px;margin-bottom:3px}
.is-background *{animation-play-state:paused!important}.roster-dialog:not([open]) *{animation-play-state:paused!important}
@media(max-width:360px){.load-control{top:67px;width:118px;height:118px;min-height:118px}.load-orb{width:118px;height:118px}.roster-head{padding-top:12px}.roster-head h2{font-size:20px;letter-spacing:2px}.load-name{font-size:24px}.selection-rail{margin-inline:12px}.marble-loader:before{width:150px;height:150px;left:calc(50% - 75px);top:51px}}
@media(prefers-reduced-motion:reduce){.load-chevrons path,.ambient-grain,.roster-dialog[open] .selection-sigils{animation:none}.load-chevrons path{opacity:.6}.ambient-grain{display:none}.is-loading .entry-bloom{animation:none}.marble-option{transition:none}}

/* The same two-line identity hierarchy as the home page: address, then count. */
.wallet-identity{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:1px;min-width:103px;min-height:44px;padding:2px 5px;border:0;border-radius:7px;background:transparent;text-align:left;line-height:1.45}
.wallet-identity strong{font:600 15px/1.45 var(--sans);color:var(--ink);white-space:nowrap}
.wallet-identity span{font:12px/1.45 var(--sans);color:var(--muted);white-space:nowrap}
.wallet-identity span.stale{opacity:.7}.wallet-identity:hover{background:#2857450c}.wallet-identity:disabled{opacity:.65}
.brand h1{font-size:18px;letter-spacing:1px}
@media(max-width:360px){.topbar .brand-seal{display:none}.topbar .brand h1{font-size:18px}.wallet-identity{min-width:100px;padding-inline:3px}}
#share-back{width:100%;margin-top:6px}

/* Preserve a compact header as translations grow; each action keeps its touch target. */
.topbar .brand{flex:1;min-width:0}.topbar .brand h1{white-space:normal;line-height:1.25;letter-spacing:.5px;overflow-wrap:anywhere}
.topbar .tools{flex-shrink:0;align-items:center}.topbar .icon-button{flex:0 0 44px;height:44px}
.topbar .wallet-identity{width:110px;min-width:0;max-width:110px;padding-inline:3px}
.wallet-identity strong,.wallet-identity span{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#language-toggle{font:600 13px var(--sans);letter-spacing:.4px}
.language-inner{padding:20px}.language-inner .wallet-heading{align-items:center;margin-bottom:14px}.language-inner h2{margin:0;letter-spacing:0}
.language-options{display:grid;grid-template-columns:1fr 1fr;gap:9px}.language-options .secondary{margin:0;min-width:0;padding:10px 8px;overflow-wrap:anywhere}
.language-options [aria-pressed=true]{background:#dbe6cf;border-color:var(--jade);box-shadow:inset 0 0 0 1px var(--jade)}
#language-status:empty{display:none}.portrait-fallback{font:20px/1.3 var(--serif);text-align:center}
html:not([lang^="zh"]) .arena-head,html:not([lang^="zh"]) .dialog-inner h2{letter-spacing:0}
html:not([lang^="zh"]) .level-label{font-size:11px;letter-spacing:0}
html:not([lang^="zh"]) .roster-head h2{font-size:20px;letter-spacing:0}
@media(max-width:440px){.topbar .brand-seal{display:none}.topbar{gap:5px}.topbar .brand h1{font-size:16px}}
@media(max-width:360px){.topbar{gap:3px}.topbar .brand h1{font-size:14px}.topbar .wallet-identity{width:99px;max-width:99px}.wallet-identity strong{font-size:13px}.wallet-identity span{font-size:11px}.topbar .tools{gap:0}}

/* Wallet benefits are a light paper panel, matching the stage/help dialogs. */
.wallet-inner{padding:24px 22px}.wallet-benefits{display:grid;gap:18px;margin:24px 0}.wallet-benefits>div{display:flex;gap:14px;align-items:flex-start}.wallet-benefits svg{width:28px;height:28px;flex:none;fill:none;stroke:var(--jade);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;margin-top:3px}.wallet-benefits p{margin:0!important;line-height:1.6!important}.wallet-benefits strong,.wallet-benefits span{display:block}.wallet-benefits strong{font:17px var(--serif);color:var(--jade);margin-bottom:4px}.wallet-benefits span{font-size:13px;color:var(--muted)}.wallet-progress-status{border-top:1px solid #bda36a55;padding-top:14px;color:var(--jade);font-size:13px!important;min-height:24px}.wallet-inner .quiet{line-height:1.65}.wallet-inner>.text-button{display:block;margin:12px auto 0}.wallet-inner>[hidden]{display:none}.topbar .brand h1{font-size:20px;letter-spacing:.3px}@media(max-width:440px){.topbar .brand h1{font-size:16px}}@media(max-width:360px){.wallet-inner{padding:22px 18px}.topbar .brand h1{font-size:14px}}