:root{--green:#123f2b;--green2:#1d6a48;--green3:#2b8a5c;--gold:#d3ad4a;--gold2:#f0d47c;--ink:#17241d;--muted:#66736c;--line:#dfe8e2;--bg:#f4f8f5;--white:#fff;--soft:#eaf4ee;--shadow:0 18px 50px rgba(18,63,43,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--bg);line-height:1.55}.wrap{width:min(1080px,calc(100% - 32px));margin:auto}a,button{-webkit-tap-highlight-color:transparent}.topbar{background:var(--green);color:#fff}.topbar-inner{min-height:62px;display:flex;align-items:center;justify-content:space-between;gap:16px}.brand,.topnav a{color:#fff;text-decoration:none}.brand{font-weight:900}.topnav{display:flex;gap:14px}.topnav a{font-size:.82rem;opacity:.92}.hero{padding:58px 0 44px;background:linear-gradient(135deg,#082c20,#123f2b 58%,#1d6a48);color:#fff;overflow:hidden}.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:34px;align-items:end}.eyebrow,.section-kicker{display:block;color:#77d39f;font-size:.68rem;font-weight:950;letter-spacing:.11em}.hero h1{margin:8px 0 10px;font-size:clamp(2.4rem,5vw,4rem);line-height:.98;letter-spacing:-2px}.hero h1 span{color:var(--gold2)}.hero p{max-width:720px;margin:0;color:#d4e5db;font-size:.96rem}.hero-note{padding:18px;border:1px solid rgba(240,212,124,.34);border-radius:18px;background:rgba(3,28,20,.34);box-shadow:0 16px 44px rgba(0,0,0,.14)}.hero-note strong{color:var(--gold2)}.hero-note p{margin:5px 0 0;font-size:.76rem;line-height:1.5}.content{padding:28px 0 56px}.state-card,.summary-card,.mission-panel,.next-card{border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:var(--shadow)}.state-card{display:flex;align-items:center;gap:14px;padding:22px}.state-card[hidden]{display:none!important}.state-card p{margin:3px 0 0;color:var(--muted);font-size:.82rem}.loader{width:32px;height:32px;border:3px solid #d8e9df;border-top-color:var(--green2);border-radius:50%;animation:spin .8s linear infinite}.state-error{border-color:#efcaca;background:#fff8f8}.state-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:#fde7e7;color:#a73636;font-weight:900}@keyframes spin{to{transform:rotate(360deg)}}.summary-card{padding:26px;background:linear-gradient(145deg,#fff,#fbfdfb 65%,#f7fbf8)}.summary-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.summary-head h2{margin:5px 0 4px;font-size:1.55rem}.summary-head p{margin:0;color:var(--muted);font-size:.82rem}.level-badge,.panel-chip,.next-badge{display:inline-flex;align-items:center;justify-content:center;min-height:28px;padding:5px 9px;border-radius:999px;background:#fff1bd;color:#775900;font-size:.64rem;font-weight:950;letter-spacing:.07em;white-space:nowrap}.points-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:22px}.point-box{padding:16px;border:1px solid #e0e9e3;border-radius:15px;background:#fbfcfb}.point-box span{display:block;color:var(--muted);font-size:.68rem;font-weight:850}.point-box strong{display:block;margin-top:4px;color:var(--green);font-size:1.65rem}.point-box.accent{border-color:#d9c575;background:#fffaf0}.point-box.accent strong{color:#8a6700}.point-box.total{background:linear-gradient(135deg,#123f2b,#1d6a48);border-color:#123f2b}.point-box.total span{color:#cfe5d7}.point-box.total strong{color:#fff}.progress-block{margin-top:18px}.progress-copy{display:flex;justify-content:space-between;gap:12px;font-size:.8rem}.progress-copy span{color:var(--green2);font-weight:900}.progress-track{height:10px;margin-top:9px;overflow:hidden;border-radius:999px;background:#e8efea}.progress-track span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--green2),#39a86f);transition:width .35s ease}.mission-panel{margin-top:16px;padding:22px}.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.panel-head h3{margin:4px 0 0;font-size:1.18rem}.panel-intro{margin:8px 0 16px;color:var(--muted);font-size:.78rem}.mission-list{display:grid;gap:10px}.mission-item{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:center;padding:14px;border:1px solid #e2eae5;border-radius:15px;background:#fbfcfb}.mission-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:13px;background:#eef3ef;color:#66776d;font-size:1.1rem;font-weight:950}.mission-copy strong{display:block;font-size:.84rem}.mission-copy p{margin:3px 0 0;color:var(--muted);font-size:.7rem;line-height:1.4}.mission-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:7px}.mission-points,.mission-status{display:inline-flex;align-items:center;min-height:23px;padding:3px 7px;border-radius:999px;font-size:.58rem;font-weight:950}.mission-points{background:#fff1bd;color:#775900}.mission-status{background:#eef2ef;color:#6b766f}.mission-action{min-width:112px;min-height:38px;padding:8px 11px;border:1px solid var(--green2);border-radius:10px;background:#fff;color:var(--green2);font:inherit;font-size:.68rem;font-weight:950;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}.mission-item.is-completed{border-color:#cce3d4;background:#f6fbf8}.mission-item.is-completed .mission-icon{background:#dff2e6;color:#17653f}.mission-item.is-completed .mission-status{background:#dff2e6;color:#17653f}.mission-item.is-claimable{border-color:#dec66f;background:#fffaf0}.mission-item.is-claimable .mission-action{background:var(--green);color:#fff;border-color:var(--green)}.mission-item.is-locked{opacity:.76}.mission-item.is-locked .mission-action{border-color:#d4ddd7;color:#8a958f;background:#f3f6f4;cursor:not-allowed}.next-card{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:14px;align-items:center;margin-top:16px;padding:20px;border-style:dashed}.next-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:#eef3f7;color:#527083;font-size:1.15rem}.next-card h3{margin:4px 0 4px}.next-card p{margin:0;color:var(--muted);font-size:.78rem}.next-badge{background:#eef3f7;color:#526d7c}.toast{position:fixed;left:50%;bottom:24px;z-index:30;transform:translateX(-50%);width:min(92vw,520px);padding:13px 16px;border-radius:13px;background:#123f2b;color:#fff;box-shadow:0 18px 50px rgba(0,0,0,.2);font-size:.78rem;font-weight:800}.toast.is-error{background:#8f3131}.page-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:9px 14px;border:1px solid var(--green);border-radius:11px;text-decoration:none;font-size:.78rem;font-weight:900}.btn.primary{background:var(--green);color:#fff}.btn.outline{background:#fff;color:var(--green)}footer{border-top:1px solid var(--line);background:#fff;padding:26px 0;color:var(--muted);font-size:.78rem}.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:18px}.footer-inner div{display:grid}.footer-inner strong{color:var(--ink)}
@media(max-width:820px){.hero-grid{grid-template-columns:1fr}.summary-head{flex-direction:column;gap:10px}.level-badge{align-self:flex-start}.next-card{grid-template-columns:44px minmax(0,1fr)}.next-badge{grid-column:2;justify-self:start}.footer-inner{align-items:flex-start;flex-direction:column}}
@media(max-width:620px){.wrap{width:min(100% - 20px,1080px)}.topbar-inner{min-height:58px;align-items:flex-start;padding:12px 0}.topnav{gap:8px;flex-wrap:wrap;justify-content:flex-end}.hero{padding:44px 0 32px}.hero h1{font-size:2.65rem}.content{padding:20px 0 44px}.summary-card,.mission-panel{padding:18px;border-radius:17px}.points-grid{grid-template-columns:1fr 1fr}.point-box.total{grid-column:1/-1}.mission-item{grid-template-columns:40px minmax(0,1fr)}.mission-icon{width:40px;height:40px}.mission-action{grid-column:2;width:100%}.next-card{padding:16px}.page-actions{display:grid}.btn{width:100%}}

.next-card-active{text-decoration:none;color:inherit;border-style:solid;border-color:#c9dfd1;background:linear-gradient(145deg,#fff,#f5fbf7)}.next-card-active:hover{border-color:#8fc4a3}.next-card-active .next-icon{background:#e2f2e8;color:#17653f}.next-card-active .next-badge{background:#e2f2e8;color:#17653f}