: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 a{font-size:.86rem;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);font-size:1rem}.hero-note p{margin:5px 0 0;font-size:.76rem;line-height:1.5;color:#dbe8df}.content{padding:28px 0 56px}.state-card,.summary-card,.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,#ffffff,#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-hero{display:flex;align-items:center;gap:16px;margin-top:24px;padding:20px;border:1px solid #e4d18f;border-radius:17px;background:linear-gradient(135deg,#fffaf0,#fff)}.points-orb{width:56px;height:56px;flex:0 0 56px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(145deg,#f8d96f,#c79c2e);color:#4d3b07;font-size:1.5rem;font-weight:950;box-shadow:0 10px 24px rgba(170,128,25,.18)}.points-hero span{display:block;color:#776b49;font-size:.72rem;font-weight:850}.points-hero strong{display:block;color:#463509;font-size:1.7rem;line-height:1.1}.points-hero strong b{font-size:2.45rem}.points-hero small{display:block;margin-top:4px;color:#7d704d;font-size:.74rem;font-weight:750}.progress-block{margin-top:20px}.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}.progress-block p{margin:8px 0 0;color:var(--muted);font-size:.74rem}.content-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:16px;margin-top:16px}.panel{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;line-height:1.5}.milestone-list,.level-list{display:grid;gap:8px}.milestone-item,.level-item{display:grid;align-items:center;gap:10px;padding:11px;border:1px solid #e3ebe6;border-radius:13px;background:#fbfcfb}.milestone-item{grid-template-columns:32px minmax(0,1fr) auto}.milestone-check{width:32px;height:32px;display:grid;place-items:center;border-radius:10px;background:#f0f3f1;color:#8b9690;font-weight:950}.milestone-copy strong,.level-item strong{display:block;font-size:.78rem}.milestone-copy small,.level-item small{display:block;margin-top:2px;color:var(--muted);font-size:.68rem;line-height:1.35}.milestone-points{font-size:.72rem;font-weight:950;color:#88700e}.milestone-item.is-done{border-color:#cde2d4;background:#f7fbf8}.milestone-item.is-done .milestone-check{background:#dff2e6;color:#17653f}.milestone-item.is-done .milestone-points{color:#17653f}.level-item{grid-template-columns:34px minmax(0,1fr) auto}.level-number{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:#eef3ef;color:#6f7d75;font-weight:950}.level-state{font-size:.57rem;font-weight:950;color:#89948e;letter-spacing:.04em}.level-item.is-reached .level-number{background:#e2f1e7;color:#17653f}.level-item.is-current{border-color:#dec66f;background:#fffaf0}.level-item.is-current .level-number{background:linear-gradient(145deg,#f4d36b,#bd922a);color:#4b3805}.level-item.is-current .level-state{color:#775900}.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}.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)}.btn[hidden]{display:none!important}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,.content-grid{grid-template-columns:1fr}.hero-note{max-width:540px}.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:560px){.wrap{width:min(100% - 20px,1080px)}.topbar-inner{min-height:58px}.hero{padding:44px 0 32px}.hero h1{font-size:2.7rem}.content{padding:20px 0 44px}.summary-card,.panel{padding:18px;border-radius:17px}.points-hero{padding:15px}.points-orb{width:48px;height:48px;flex-basis:48px}.points-hero strong b{font-size:2rem}.milestone-item{grid-template-columns:30px minmax(0,1fr) auto}.level-item{grid-template-columns:32px minmax(0,1fr)}.level-state{grid-column:2;justify-self:start}.next-card{padding:16px}.page-actions{display:grid}.btn{width:100%}}

.points-breakdown{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:10px}.points-breakdown>div{padding:10px 12px;border:1px solid #e1e9e4;border-radius:12px;background:#fbfcfb}.points-breakdown span{display:block;color:var(--muted);font-size:.62rem;font-weight:850}.points-breakdown strong{display:block;margin-top:2px;color:var(--green);font-size:.9rem}.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}@media(max-width:560px){.points-breakdown{grid-template-columns:1fr 1fr}.points-breakdown>div:last-child{grid-column:auto}}