:root{--bg:#f4f6f9;--surface:#fff;--text:#16202c;--muted:#5b6878;--primary:#1e3a5f;--primary-text:#fff;--border:#dde3ea;--correct:#2e8b57;--wrong:#c0392b;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}:root[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#0f1722;--surface:#1a2533;--text:#e8eef5;--muted:#9aa8b8;--primary:#f2b632;--primary-text:#16202c;--border:#2a3646;--learn:#5b9bff;--unseen:#2f3b4c;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}:root[data-theme=dark]{--bg:#0f1722;--surface:#1a2533;--text:#e8eef5;--muted:#9aa8b8;--primary:#f2b632;--primary-text:#16202c;--border:#2a3646;--learn:#5b9bff;--unseen:#2f3b4c;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%}body{background:var(--bg);color:var(--text);overscroll-behavior:none;margin:0}.screen{max-width:480px;min-height:100%;padding:calc(env(safe-area-inset-top) + 16px) calc(env(safe-area-inset-right) + 16px) calc(env(safe-area-inset-bottom) + 16px) calc(env(safe-area-inset-left) + 16px);flex-direction:column;gap:16px;margin:0 auto;display:flex}.spacer{flex:1}h1{margin:8px 0 4px;font-size:2rem}h2{margin:0 0 4px;font-size:1.15rem}.muted{color:var(--muted);margin:0}.card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:16px}.flag-frame{aspect-ratio:3/2;justify-content:center;align-items:center;display:flex}.flag-frame img{object-fit:contain;filter:drop-shadow(0 0 1px #00000073);width:100%;height:100%}.gallery{grid-template-columns:repeat(2,1fr);gap:12px;display:grid}.gallery-item{background:var(--surface);border:1px solid var(--border);border-radius:12px;flex-direction:column;gap:8px;margin:0;padding:10px;display:flex}.gallery-item figcaption{flex-direction:column;gap:2px;font-size:.9rem;display:flex}.gallery-item .muted{font-size:.8rem}.topbar{justify-content:space-between;align-items:center;display:flex}.flag-display{max-height:40vh;margin-top:8px}.result{font-weight:600}.result.correct{color:var(--correct)}.result.wrong{color:var(--wrong)}.prompt{text-align:center;margin:0;font-size:1.1rem}.options{gap:10px;display:grid}.btn{font:inherit;border:1px solid var(--border);cursor:pointer;background:var(--surface);width:100%;min-height:52px;color:var(--text);border-radius:14px;padding:12px 16px;font-size:1.05rem}.btn:disabled{opacity:.55;cursor:default}.btn-primary{background:var(--primary);color:var(--primary-text);border-color:#0000;font-weight:600}.btn-option{background:var(--surface);color:var(--text);text-align:left}.btn-option:disabled{opacity:1}.btn-option.correct{border-color:var(--correct);background:color-mix(in srgb, var(--correct) 18%, var(--surface))}.btn-option.wrong{border-color:var(--wrong);background:color-mix(in srgb, var(--wrong) 18%, var(--surface))}.btn-link{font:inherit;color:var(--primary);cursor:pointer;background:0 0;border:none;padding:8px 0;font-size:1.05rem}:root{--learn:#2f6fd6;--unseen:#d5dbe3}.text-correct{color:var(--correct)}.text-wrong{color:var(--wrong)}.hint{text-align:center;margin-top:-8px;font-size:.85rem}.btn-row{gap:10px;display:flex}.btn-row>.btn{flex:1}.btn-danger{background:var(--wrong);color:#fff;border-color:#0000;font-weight:600}.stack{flex-direction:column;gap:12px;display:flex}.stack p{margin:0}.progress{flex-direction:column;gap:10px;display:flex}.progress-bar{background:var(--unseen);border-radius:7px;height:14px;display:flex;overflow:hidden}.seg{min-width:2px;display:block}.seg-unseen{background:var(--unseen)}.seg-l1{background:color-mix(in srgb, var(--learn) 25%, var(--unseen))}.seg-l2{background:color-mix(in srgb, var(--learn) 50%, var(--unseen))}.seg-l3{background:color-mix(in srgb, var(--learn) 75%, var(--unseen))}.seg-l4{background:var(--learn)}.seg-mastered{background:var(--correct)}.progress-legend{flex-wrap:wrap;gap:4px 14px;font-size:.9rem;display:flex}.progress-legend span{align-items:center;gap:6px;display:inline-flex}.dot{border-radius:50%;width:10px;height:10px;display:inline-block}.round-typed .flag-display{max-height:28vh}.text-correct.prompt{font-weight:600}.typed-form{flex-direction:column;gap:10px;display:flex}.text-input{font:inherit;border:1px solid var(--border);background:var(--surface);min-height:52px;color:var(--text);border-radius:14px;width:100%;padding:12px 14px;font-size:1.15rem}.text-input:focus{outline:2px solid var(--primary);outline-offset:1px}.feedback{font:inherit;border:1px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer;border-radius:14px;flex-direction:column;align-items:center;gap:4px;width:100%;padding:12px;display:flex}.feedback-given{font-size:1rem;text-decoration:line-through}.feedback-correct{font-size:1.3rem;font-weight:700}.copy{text-align:center;flex-direction:column;align-items:center;gap:4px;display:flex}.copy-name{font-size:1.3rem}.checkpoint-list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.checkpoint-row{background:var(--surface);border:1px solid var(--border);border-radius:12px;align-items:center;gap:12px;padding:8px 12px;display:flex}.flag-thumb{flex:none;width:48px}.checkpoint-name{flex:1}.level{white-space:nowrap;font-size:.9rem;font-weight:600}.table-wrap{overflow-x:auto}.debug-table{border-collapse:collapse;width:100%;font-size:.85rem}.debug-table th,.debug-table td{border-bottom:1px solid var(--border);text-align:right;padding:6px 4px}.debug-table th:first-child,.debug-table td:first-child{text-align:left}.debug-table tr.muted td{color:var(--muted)}.typo-note{color:var(--muted);margin-top:2px;font-size:.85rem;font-weight:400;display:block}.small{font-size:.85rem}.override{align-self:center;font-size:.95rem}.stats{justify-content:space-between;margin:0;display:flex}.stats div{flex-direction:column;gap:2px;display:flex}.stats dt{color:var(--muted);font-size:.8rem}.stats dd{margin:0;font-size:1.15rem;font-weight:600}.stats small{font-size:.8rem;font-weight:400}.continent-count{text-align:right;font-size:.85rem}.progress-bar-compact{border-radius:4px;height:8px}.choice{flex-direction:column;gap:6px;display:flex}.segmented{border:1px solid var(--border);border-radius:12px;display:flex;overflow:hidden}.segmented button{font:inherit;border:none;border-left:1px solid var(--border);background:var(--surface);min-height:44px;color:var(--text);cursor:pointer;flex:1}.segmented button:first-child{border-left:none}.segmented button.selected{background:var(--primary);color:var(--primary-text);font-weight:600}.center{text-align:center}.update-banner{background:color-mix(in srgb, var(--primary) 14%, var(--surface));border:1px solid var(--border);border-radius:12px;justify-content:space-between;align-items:center;gap:12px;padding:4px 4px 4px 14px;display:flex}.update-banner .btn-link{padding:8px 10px;font-weight:600}.region-select{justify-content:space-between;align-items:center;gap:12px;display:flex}.region-select select{font:inherit;border:1px solid var(--border);background:var(--surface);min-height:44px;color:var(--text);border-radius:12px;flex:1;max-width:14em;padding:8px 12px;font-size:1rem}.continent-list,.flag-list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.continent-row{font:inherit;width:100%;color:var(--text);text-align:left;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:10px;grid-template-columns:7.5em 1fr auto;align-items:center;gap:10px;padding:8px 10px;font-size:.9rem;display:grid}.continent-row.selected{border-color:var(--primary);background:color-mix(in srgb, var(--primary) 10%, var(--surface))}.continent-count{text-align:right;white-space:nowrap;font-size:.85rem}.flag-row,.pair-row{align-items:center;gap:10px;font-size:.95rem;display:flex}.flag-row-name{flex:1}.flag-row-meta{white-space:nowrap}.pair-arrow{color:var(--muted)}.pair-text{flex:1;font-size:.9rem}.pick-prompt{margin-top:8px;font-size:1.25rem}.pick-grid{grid-template-columns:repeat(2,1fr);gap:12px;display:grid}.pick-grid.pick-3{grid-template-columns:repeat(3,1fr)}.pick-option{font:inherit;border:2px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer;border-radius:14px;flex-direction:column;align-items:center;gap:6px;padding:10px;display:flex}.pick-option .flag-frame{width:100%}.pick-option:disabled{cursor:default}.pick-option.correct{border-color:var(--correct);background:color-mix(in srgb, var(--correct) 14%, var(--surface))}.pick-option.wrong{border-color:var(--wrong);background:color-mix(in srgb, var(--wrong) 14%, var(--surface))}.pick-label{text-align:center;font-size:.9rem;font-weight:600}.pick-option.correct .pick-label{color:var(--correct)}.pick-option.wrong .pick-label{color:var(--wrong)}.btn-small{font:inherit;border:1px solid var(--border);background:var(--surface);min-height:36px;color:var(--primary);cursor:pointer;border-radius:10px;flex:none;padding:6px 12px;font-size:.85rem;font-weight:600}.btn-small:disabled{opacity:.45;cursor:default}.title{flex-wrap:wrap;align-items:baseline;gap:0 10px;display:flex}.byline{color:var(--muted);white-space:nowrap;font-size:.95rem;font-weight:400}.text-input.input-correct{outline:2px solid var(--correct);border-color:var(--correct)}.carry-note{text-align:center;color:var(--muted);margin:0;font-size:.85rem}.topbar-sticky{z-index:2;background:var(--bg);margin:calc(-1 * (env(safe-area-inset-top) + 16px)) calc(-1 * (env(safe-area-inset-right) + 16px)) 0 calc(-1 * (env(safe-area-inset-left) + 16px));padding:calc(env(safe-area-inset-top) + 16px) calc(env(safe-area-inset-right) + 16px) 10px calc(env(safe-area-inset-left) + 16px);border-bottom:1px solid var(--border);flex-direction:column;gap:8px;display:flex;position:sticky;top:0}.filters{gap:10px;display:flex}.filters select{font:inherit;border:1px solid var(--border);background:var(--surface);min-height:44px;color:var(--text);border-radius:12px;flex:1;min-width:0;padding:8px 10px;font-size:1rem}.moved-banner{background:color-mix(in srgb, var(--primary) 14%, var(--surface));border:1px solid var(--border);border-radius:12px;padding:12px 14px}.moved-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.moved-head .btn-link{padding:4px 6px;font-weight:600}.moved-banner p{margin:0}.moved-banner a:not(.btn){color:var(--primary);font-weight:600}.moved-steps{margin:0;padding-left:1.4em}.moved-banner a.btn{justify-content:center;align-items:center;text-decoration:none;display:flex}.collection-switcher{align-self:flex-start}.collection-switcher button{padding:0 18px}.discipline-head{color:inherit;font:inherit;text-align:left;cursor:pointer;background:0 0;border:none;justify-content:space-between;align-items:baseline;gap:12px;padding:0;display:flex}.discipline-head h2,.discipline-title{margin:0}.with-tabbar .screen{padding-bottom:calc(env(safe-area-inset-bottom) + 16px + 56px)}.tabbar{z-index:3;background:var(--surface);border-top:1px solid var(--border);padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);justify-content:center;display:flex;position:fixed;bottom:0;left:0;right:0}.tabbar button{max-width:160px;min-height:52px;font:inherit;color:var(--muted);cursor:pointer;background:0 0;border:none;flex:1;font-size:.9rem}.tabbar button.selected{color:var(--primary);font-weight:600}
