:root{
  --green:#0a7f5a;--green-dark:#075f45;--green-soft:#e9f7f1;--blue:#1976d2;--orange:#ef8b21;--purple:#8a4ecf;--red:#d64545;
  --ink:#17332a;--muted:#687a74;--line:#dce8e3;--surface:#fff;--bg:#f5faf8;--shadow:0 18px 45px rgba(17,67,51,.12);
  --radius:22px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--ink);line-height:1.6}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button{cursor:pointer}code{background:#eef4f1;padding:2px 6px;border-radius:6px}.container{width:min(1180px,calc(100% - 32px));margin-inline:auto}.narrow{width:min(760px,calc(100% - 32px))}.section{padding:64px 0}.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}.muted{color:var(--muted)}.small,small{font-size:.82rem}.optional{font-size:.78rem;color:var(--muted);font-weight:500}.eyebrow{display:inline-block;font-size:.78rem;font-weight:800;letter-spacing:.14em;color:var(--green);margin-bottom:8px}.site-header{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.92);backdrop-filter:blur(14px);border-bottom:1px solid rgba(220,232,227,.9)}.nav-wrap{min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:12px}.brand-logo{display:grid;place-items:center;width:46px;height:46px;background:linear-gradient(135deg,var(--green),#23b982);border-radius:14px;font-size:1.5rem;box-shadow:0 10px 25px rgba(10,127,90,.2)}.brand strong{display:block;font-size:1rem}.brand small{display:block;color:var(--muted);max-width:340px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nav-links{display:flex;align-items:center;gap:22px;font-weight:700;font-size:.92rem}.nav-links a:hover{color:var(--green)}.hero{padding:72px 0 56px;background:radial-gradient(circle at top left,#e2f8ee 0,transparent 35%),linear-gradient(135deg,#f8fffc 0,#edf7f3 55%,#eaf2ff 100%)}.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center}.hero-copy h1{font-size:clamp(2.5rem,5vw,5.3rem);line-height:1.02;letter-spacing:-.05em;margin:6px 0 24px}.hero-copy h1 span{color:var(--green)}.hero-copy p{font-size:1.15rem;max-width:720px;color:#49645b}.hero-badges{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}.hero-badges span{background:#fff;border:1px solid var(--line);padding:9px 13px;border-radius:999px;font-weight:700;font-size:.88rem}.start-card{padding:28px}.card-heading{display:flex;align-items:center;gap:14px;margin-bottom:22px}.card-heading h2{margin:0}.card-heading p{margin:3px 0 0;color:var(--muted)}.avatar{width:58px;height:58px;border-radius:18px;background:var(--green-soft);display:grid;place-items:center;font-size:2rem}.stack-form{display:grid;gap:16px}.stack-form label,.form-grid label{font-weight:750;font-size:.9rem}.stack-form input,.stack-form textarea,.stack-form select,.form-grid input,.form-grid textarea,.inline-form input,.inline-form select,.panel-title select{width:100%;margin-top:7px;border:1px solid #cddbd5;background:#fff;border-radius:13px;padding:12px 14px;outline:none;transition:.2s}.stack-form input:focus,.stack-form textarea:focus,.stack-form select:focus,.form-grid input:focus,.inline-form input:focus{border-color:var(--green);box-shadow:0 0 0 4px rgba(10,127,90,.1)}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:13px;padding:11px 18px;font-weight:800;transition:.2s}.btn:hover{transform:translateY(-1px)}.btn.primary{background:linear-gradient(135deg,var(--green),#12a675);color:#fff;box-shadow:0 10px 22px rgba(10,127,90,.22)}.btn.secondary{background:#eaf3ff;color:#165c9c}.btn.ghost{background:#eef4f1;color:#2b5748}.btn.light{background:#fff;color:var(--green)}.btn.big{padding:14px 18px;font-size:1rem}.btn.wide{width:100%}.btn.small{font-size:.78rem;padding:7px 10px;border-radius:9px}.danger-btn{background:#fdecec;color:#a92d2d}.button-row{display:flex;gap:10px;flex-wrap:wrap}.button-row.center{justify-content:center}.button-row.compact{gap:6px}.button-row form{margin:0}.privacy-note{margin:0;text-align:center;font-size:.78rem;color:var(--muted)}.section-heading{text-align:center;max-width:760px;margin:0 auto 34px}.section-heading.left{text-align:left;margin-left:0}.section-heading h1,.section-heading h2{font-size:clamp(2rem,4vw,3.3rem);letter-spacing:-.04em;line-height:1.1;margin:0 0 12px}.section-heading p{color:var(--muted)}.level-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.level-card{position:relative;padding:24px;border-radius:22px;color:#fff;min-height:220px;overflow:hidden;box-shadow:var(--shadow)}.level-card:after{content:"";position:absolute;width:160px;height:160px;border-radius:50%;background:rgba(255,255,255,.12);right:-55px;bottom:-65px}.level-da{background:linear-gradient(135deg,#1b82df,#49a2ef)}.level-gu{background:linear-gradient(135deg,#0a8b60,#24bd84)}.level-si{background:linear-gradient(135deg,#ed8119,#ffad4d)}.level-bu{background:linear-gradient(135deg,#7d47c7,#ab72e8)}.level-icon{font-size:2.4rem}.level-code{font-weight:900;opacity:.75;margin-top:18px}.level-card h3{font-size:1.65rem;margin:2px 0}.level-card p{margin:0;opacity:.9}.split-banner{background:linear-gradient(135deg,var(--green-dark),var(--green));color:#fff;border-radius:28px;padding:38px 42px;margin-bottom:64px;display:flex;align-items:center;justify-content:space-between;gap:24px}.split-banner .eyebrow{color:#bff3dc}.split-banner h2{margin:0;max-width:760px}.site-footer{background:#0e2d24;color:#d4e4de;padding:30px 0}.footer-grid{display:flex;align-items:center;justify-content:space-between;gap:20px}.footer-note{font-size:.85rem;opacity:.75}.alert{padding:12px 15px;border-radius:12px;margin:12px 0}.alert.success{background:#e9f8f0;color:#176b4c;border:1px solid #bde8d5}.alert.danger{background:#fff0f0;color:#9a2c2c;border:1px solid #f1c2c2}.warning-text{color:#8c5a00}.install-page{background:linear-gradient(135deg,#eaf8f2,#edf4ff);padding:40px 0}.install-card{padding:32px}.install-card h1{text-align:center;margin-bottom:0}.install-card>.muted{text-align:center}.brand-mark{margin:0 auto 14px;width:70px;height:70px;display:grid;place-items:center;border-radius:22px;background:var(--green-soft);font-size:2.2rem}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.form-grid h2{grid-column:1/-1;margin:16px 0 0;font-size:1.1rem}.form-grid .wide{grid-column:1/-1}.code-box{width:100%;font-family:ui-monospace,monospace;font-size:.82rem}.game-shell{min-height:calc(100vh - 74px);background:linear-gradient(180deg,#edf9f4,#f7faf9);padding:28px 0 72px}.game-container{max-width:900px}.game-topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.mini-link{color:var(--green);font-weight:800}.score-pill{background:#fff;border:1px solid var(--line);padding:9px 14px;border-radius:999px}.mission-track{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:16px}.mission-step{display:flex;align-items:center;justify-content:center;gap:8px;padding:10px;border-radius:14px;background:#e5eeea;color:#789087}.mission-step.active{background:var(--green);color:#fff;box-shadow:0 8px 18px rgba(10,127,90,.2)}.mission-step.done{background:#ccebdd;color:#176b4c}.progress-wrap{height:10px;background:#dfeae5;border-radius:999px;overflow:hidden;margin-bottom:18px}.progress-bar{height:100%;background:linear-gradient(90deg,var(--green),#29c18b);width:0;transition:.35s}.question-card{padding:28px}.question-meta{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:.88rem;font-weight:700}.question-meta .timer{margin-left:auto}.level-badge{display:inline-flex;align-items:center;justify-content:center;min-width:44px;padding:5px 9px;border-radius:999px;color:#fff;font-weight:900}.badge-da{background:var(--blue)}.badge-gu{background:var(--green)}.badge-si{background:var(--orange)}.badge-bu{background:var(--purple)}.question-card h1{font-size:clamp(1.45rem,3vw,2.35rem);line-height:1.25;margin:24px 0}.options-list{display:grid;gap:12px;margin-bottom:22px}.option-button{display:flex;align-items:center;gap:14px;text-align:left;width:100%;padding:15px;border:1px solid var(--line);border-radius:15px;background:#fff;color:var(--ink);font-weight:700}.option-button:hover{border-color:#9fcdbb;background:#f9fffc}.option-button.selected{border-color:var(--green);background:var(--green-soft);box-shadow:0 0 0 3px rgba(10,127,90,.08)}.option-key{flex:0 0 34px;height:34px;display:grid;place-items:center;border-radius:10px;background:#eef4f1}.feedback-overlay{position:fixed;inset:0;z-index:100;background:rgba(8,38,29,.72);display:grid;place-items:center;padding:20px}.feedback-overlay[hidden]{display:none}.feedback-card{width:min(520px,100%);background:#fff;border-radius:24px;padding:30px;text-align:center;box-shadow:0 28px 70px rgba(0,0,0,.25)}.feedback-icon,.trophy{font-size:4rem}.feedback-card h2{font-size:2rem;margin:8px 0}.feedback-card p{color:var(--muted)}.points-earned{display:inline-block;background:#e9f8f0;color:#176b4c;padding:8px 13px;border-radius:999px;font-weight:900;margin:6px 0 18px}.points-earned.zero{background:#f2f4f3;color:#66756f}.loader{width:42px;height:42px;border:4px solid #dbe8e2;border-top-color:var(--green);border-radius:50%;margin:16px auto 0;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.result-section{max-width:860px}.result-card{text-align:center;padding:38px}.result-confetti{font-size:2rem}.score-circle{width:180px;height:180px;margin:24px auto;display:flex;align-items:center;justify-content:center;border-radius:50%;background:conic-gradient(var(--green) 0 75%,#dfeae5 75%);box-shadow:inset 0 0 0 17px #fff,0 18px 38px rgba(10,127,90,.18)}.score-circle strong{font-size:3.7rem}.score-circle span{font-size:1.4rem;font-weight:900}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:26px 0}.result-stats>div{background:#f3f8f6;border-radius:14px;padding:14px}.result-stats span{display:block;color:var(--muted);font-size:.8rem}.result-stats strong{display:block;font-size:1.1rem}.filter-panel{padding:16px;margin-bottom:18px}.inline-form{display:flex;gap:10px;align-items:center}.inline-form input{margin-top:0;max-width:420px}.table-panel{overflow:hidden}.panel-title{display:flex;align-items:center;justify-content:space-between;padding:20px 22px;border-bottom:1px solid var(--line)}.panel-title h2{margin:0;font-size:1.15rem}.table-responsive{overflow:auto}.data-table{width:100%;border-collapse:collapse;min-width:760px}.data-table th,.data-table td{text-align:left;padding:14px 16px;border-bottom:1px solid #e8efec;vertical-align:middle}.data-table th{font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;color:#678078;background:#f8fbfa}.data-table td small{display:block;color:var(--muted)}.empty-state{text-align:center!important;color:var(--muted);padding:38px!important}.rank{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#edf3f0;font-weight:900}.rank-1{background:#ffe9a8}.rank-2{background:#e7edf2}.rank-3{background:#f0d2b9}.material-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.material-card{padding:24px}.material-icon{font-size:2.4rem}.material-card h2{margin:8px 0}.material-card p{color:var(--muted)}.callout{padding:20px;margin-top:18px;background:#fffdf0;border-color:#f0df9a}.auth-section{min-height:70vh;display:grid;place-items:center}.auth-card{width:min(460px,100%);padding:30px;text-align:center}.admin-section{padding-top:38px}.admin-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px}.admin-heading h1{margin:0;font-size:2.2rem}.admin-nav{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}.admin-nav a{padding:9px 13px;border-radius:10px;background:#eaf1ee;font-weight:750;font-size:.88rem}.admin-nav a.active{background:var(--green);color:#fff}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:20px}.stat-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:20px;box-shadow:0 9px 24px rgba(17,67,51,.07)}.stat-card span,.stat-card small{display:block;color:var(--muted)}.stat-card strong{display:block;font-size:2rem;margin:4px 0}.status{display:inline-flex;padding:4px 8px;border-radius:999px;background:#eef2f0;color:#687a74;font-size:.72rem;font-weight:800}.status.active{background:#e3f6ed;color:#16704f}.admin-two-col{display:grid;grid-template-columns:.85fr 1.15fr;gap:18px;align-items:start}.form-panel{padding:22px}.form-panel h2{margin-top:0}.question-admin-list{max-height:900px;overflow:auto;padding:8px 18px 18px}.admin-question-item{padding:16px 0;border-bottom:1px solid var(--line)}.admin-question-item h3{font-size:1rem;margin:9px 0 4px}.admin-question-item p{color:var(--muted);font-size:.88rem;margin:0 0 10px}.check-label{display:flex!important;align-items:center;gap:9px}.check-label input{width:auto!important;margin:0!important}.settings-panel{max-width:700px}.certificate-page{background:#eef4f1;padding:24px}.certificate-toolbar{display:flex;justify-content:center;gap:10px;margin-bottom:18px}.certificate-wrap{display:grid;place-items:center}.certificate{width:1120px;max-width:100%;aspect-ratio:1.414/1;background:#fff;padding:24px;box-shadow:0 22px 55px rgba(0,0,0,.16)}.certificate-border{height:100%;border:5px double var(--green);padding:42px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle at center,#fff 55%,#f2faf6)}.certificate-top{font-size:1.05rem;letter-spacing:.08em}.certificate-label{margin-top:22px;color:var(--green);font-weight:900;letter-spacing:.22em}.certificate h1{font-size:3.4rem;letter-spacing:.14em;margin:4px 0 18px}.certificate h2{font-family:Georgia,serif;font-size:3rem;color:var(--green);margin:8px 0;border-bottom:2px solid #cfe7dc;padding:0 26px 8px}.certificate h3{font-size:1.7rem;margin:8px 0}.school-name{font-weight:800}.certificate-score{margin:15px 0 28px;background:var(--green-soft);padding:10px 16px;border-radius:999px}.certificate-footer{display:grid;grid-template-columns:1fr 1fr 1fr;width:100%;gap:22px;margin-top:16px}.certificate-footer span{display:block;color:var(--muted);font-size:.76rem}.certificate-footer strong{display:block}.signature{border-top:1px solid #789088;padding-top:8px}.certificate-toolbar .btn{min-width:150px}@media print{body{background:#fff;padding:0}.no-print{display:none!important}.certificate{box-shadow:none;width:100%;height:auto}.certificate-wrap{display:block}@page{size:landscape;margin:0}}
@media(max-width:980px){.hero-grid,.admin-two-col{grid-template-columns:1fr}.level-grid,.stats-grid{grid-template-columns:repeat(2,1fr)}.hero-copy{text-align:center}.hero-copy p{margin-inline:auto}.hero-badges{justify-content:center}.nav-links{gap:12px}.certificate h1{font-size:2.4rem}.certificate h2{font-size:2.2rem}.certificate-border{padding:26px}}
@media(max-width:720px){.container{width:min(100% - 20px,1180px)}.section{padding:42px 0}.site-header{position:relative}.nav-wrap{align-items:flex-start;padding:12px 0;flex-direction:column}.brand small{max-width:250px}.nav-links{width:100%;overflow:auto;padding-bottom:4px}.hero{padding-top:36px}.hero-grid{gap:28px}.hero-copy h1{font-size:2.7rem}.form-row,.form-grid,.material-grid,.result-stats,.certificate-footer{grid-template-columns:1fr}.level-grid{grid-template-columns:1fr 1fr}.level-card{min-height:180px}.split-banner{margin-inline:10px;flex-direction:column;align-items:flex-start;padding:28px}.mission-step span{display:none}.question-card{padding:20px}.question-card h1{font-size:1.35rem}.inline-form{align-items:stretch;flex-direction:column}.inline-form input{max-width:none}.stats-grid{grid-template-columns:1fr 1fr}.admin-heading{align-items:flex-start}.certificate-page{padding:8px}.certificate{aspect-ratio:auto;min-height:700px}.certificate-border{padding:18px}.certificate h1{font-size:1.8rem}.certificate h2{font-size:1.8rem}.certificate-top{font-size:.8rem}}
@media(max-width:480px){.level-grid,.stats-grid{grid-template-columns:1fr}.hero-copy h1{font-size:2.25rem}.start-card,.result-card{padding:20px}.button-row .btn{width:100%}.mission-track{gap:5px}.mission-step{padding:8px 4px}.footer-grid{flex-direction:column;align-items:flex-start}.certificate{min-height:650px}.certificate h3{font-size:1.25rem}}
