:root{color-scheme:dark;font-family:system-ui,-apple-system,sans-serif;background:#0b0c0e;color:#f4f5f6}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;min-height:100vh}
button,input{font:inherit}
button{cursor:pointer}
.topbar{border-bottom:1px solid #272a30;background:#111316}
.topbar-inner{max-width:1360px;margin:auto;min-height:58px;padding:0 24px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{font-weight:680;font-size:17px;letter-spacing:-.02em}
.main-nav{align-self:stretch;display:flex;align-items:stretch;gap:20px}
.main-nav button{border:0;border-bottom:2px solid transparent;background:none;color:#aeb3bb;padding:2px 3px 0;font-size:14px}
.main-nav button:hover{color:#fff}
.main-nav button[aria-current="page"]{border-bottom-color:#5ee7c4;color:#fff;font-weight:650}
.topbar-right{display:flex;align-items:center;gap:20px;color:#aeb3bb;font-size:13px}
.text-button{border:0;background:none;color:#c7cbd2;padding:8px 0}
.text-button:hover{text-decoration:underline;color:#fff}
.layout{max-width:1360px;margin:0 auto;padding:24px;display:grid;grid-template-columns:225px minmax(0,1fr);gap:32px}
.filters{border-right:1px solid #272a30;padding:2px 24px 0 0}
.filters-heading h1{font-size:17px;margin:0 0 4px;font-weight:650}
.filters-heading p{font-size:13px;color:#aeb3bb;margin:0}
.filter-options{margin-top:20px;display:flex;flex-direction:column;gap:2px}
.filter-option{min-height:43px;padding:8px 10px;display:flex;align-items:center;gap:9px;border-radius:7px;cursor:pointer;color:#d9dce1;font-size:14px}
.filter-option:hover{background:#181b1f}
.filter-option:has(input:checked){background:#20252a;color:#fff}
.filter-option.world{font-weight:650;margin-bottom:10px;border-bottom:1px solid #272a30;border-radius:7px 7px 0 0;padding-bottom:14px}
.filter-option input{accent-color:#5ee7c4;width:16px;height:16px;margin:0;cursor:pointer}
.filter-option span{flex:1;display:flex;justify-content:space-between;gap:8px}
.filter-option .count{flex:0;color:#9ba1aa;font-size:12px}
.territory-option{border-top:1px solid #272a30;margin-top:8px;padding-top:12px}
.study{min-width:0}
.study-heading{display:flex;justify-content:space-between;align-items:center;margin:2px 0 12px;color:#aeb3bb;font-size:13px}
#card-progress{color:#f4f5f6;font-weight:620}
.card{background:#15171b;border:1px solid #34383e;border-radius:8px;overflow:hidden;outline:none;cursor:pointer}
.card:focus-visible,.filter-option:has(input:focus-visible),button:focus-visible{outline:2px solid #5ee7c4;outline-offset:2px}
.card.revealed{cursor:default}
.image-area{position:relative;background:#101215;min-height:280px;display:flex;align-items:center;justify-content:center}
.image-area img{display:block;max-width:100%;width:auto;height:auto;max-height:min(69vh,850px);object-fit:contain}
.image-loading{position:absolute;inset:0;display:grid;place-items:center;background:#101215;color:#b7bdc5;font-size:14px}
.image-loading[hidden]{display:none}
.answer{padding:16px 20px;display:flex;align-items:baseline;justify-content:space-between;gap:16px;border-top:1px solid #34383e;background:#1a1d21}
.answer[hidden]{display:none}
.answer strong{font-size:clamp(23px,3vw,36px);font-weight:700;letter-spacing:-.025em}
.answer span{font-size:15px;color:#b8bec6;text-align:right}
.controls{margin-top:16px;display:flex;justify-content:center}
.controls button{min-height:46px;padding:10px 16px;border:1px solid #454b52;border-radius:7px;background:#20252a;color:#f4f5f6;font-size:14px;font-weight:600}
.controls button:hover{background:#2b3238}
.controls .primary-button{min-width:210px;background:#5ee7c4;border-color:#5ee7c4;color:#06231c}
.controls .primary-button:hover{background:#82eed2}
kbd{font-family:inherit;font-weight:500;font-size:11px;color:inherit;opacity:.7;margin-left:7px}
.grades{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.grades[hidden]{display:none}
.grades button[data-grade="again"]{border-color:#855353}
.grades button[data-grade="easy"]{border-color:#43806b}
.study-note{margin:15px 0 0;text-align:center;color:#9ba1aa;font-size:12px;line-height:1.5}
footer{max-width:1360px;margin:24px auto 0;padding:12px 24px 22px;color:#757c85;font-size:11px}
footer a{color:#aeb3bb}
.stats-layout{max-width:1060px;margin:0 auto;padding:28px 24px 12px}
.stats-heading h1{font-size:23px;letter-spacing:-.025em;margin:0 0 5px}
.stats-heading p{font-size:13px;line-height:1.5;color:#aeb3bb;margin:0}
.stats-heading a{display:inline-block;margin-top:12px;color:#5ee7c4;font-size:13px;text-decoration:none}
.stats-heading a:hover{text-decoration:underline}
.stats-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:28px 0 36px;border-top:1px solid #34383e;border-bottom:1px solid #34383e}
.stats-summary>div{padding:20px 18px;border-right:1px solid #34383e}
.stats-summary>div:first-child{padding-left:0}
.stats-summary>div:last-child{border-right:0}
.stats-summary dt{color:#aeb3bb;font-size:13px;line-height:1.4}
.stats-summary dd{margin:8px 0 0;font-size:27px;font-weight:680;letter-spacing:-.025em;white-space:nowrap}
.stats-section{margin:0 0 32px}
.stats-section h2{font-size:17px;font-weight:650;margin:0 0 13px}
.table-scroll{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{padding:12px 14px;text-align:left;border-bottom:1px solid #292d33}
th:first-child,td:first-child{padding-left:0}
th{color:#aeb3bb;font-size:12px;font-weight:550}
td{color:#e9eaed}
td:not(:first-child),th:not(:first-child){text-align:right}
.stats-bottom{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.compact-list{margin:0;border-top:1px solid #292d33}
.compact-list>div{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid #292d33;font-size:14px}
.compact-list dt{color:#c5c9cf}
.compact-list dd{margin:0;font-variant-numeric:tabular-nums;font-weight:650}
.stats-footnote{margin:0 0 24px;color:#8e959e;font-size:12px;line-height:1.5}
.city-section{border-top:1px solid #34383e;padding-top:28px}
.city-controls{display:grid;grid-template-columns:minmax(190px,2fr) minmax(130px,1fr) minmax(130px,1fr) auto;align-items:end;gap:12px;margin:18px 0 22px}
.city-controls label{display:flex;flex-direction:column;gap:6px;font-size:12px;color:#aeb3bb}
.city-controls input[type="search"],.city-controls select{height:39px;width:100%;border:1px solid #42474e;border-radius:6px;background:#15171b;color:#f4f5f6;padding:0 11px;font-size:14px}
.city-controls input:focus-visible,.city-controls select:focus-visible{outline:2px solid #5ee7c4;outline-offset:2px}
.city-controls .studied-only{height:39px;display:flex;flex-direction:row;align-items:center;gap:7px;white-space:nowrap;font-size:13px;color:#e0e2e6;cursor:pointer}
.city-controls .studied-only input{width:16px;height:16px;margin:0;accent-color:#5ee7c4}
.city-list-heading,.city-row{display:grid;grid-template-columns:minmax(0,1.8fr) 80px 100px 120px;gap:14px;align-items:start}
.city-list-heading{padding:0 0 10px;border-bottom:1px solid #34383e;color:#aeb3bb;font-size:12px}
.city-list-heading span:not(:first-child){text-align:right}
.city-row{padding:12px 0;border-bottom:1px solid #292d33;font-size:14px}
.city-identity strong{display:block;font-weight:630}
.city-identity span{display:block;margin-top:2px;color:#9da3ac;font-size:12px}
.city-value{text-align:right;font-variant-numeric:tabular-nums}
.city-value .mobile-label{display:none}
.city-value .mobile-label{margin-right:3px}
.city-grades{grid-column:1/-1;color:#9da3ac;font-size:12px;margin-top:-3px}
.city-empty{padding:22px 0;color:#aeb3bb;font-size:14px}
.city-list-footer{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:13px;color:#9da3ac;font-size:12px}
.city-list-footer button{border:1px solid #454b52;border-radius:6px;background:#20252a;color:#f4f5f6;padding:8px 12px;font-size:13px}
.city-list-footer button:hover{background:#2b3238}
@media(max-width:800px){.layout{display:block;padding:16px}.filters{border-right:0;border-bottom:1px solid #272a30;padding:0 0 12px;margin-bottom:16px}.filters-heading{display:flex;justify-content:space-between;gap:12px;align-items:baseline}.filter-options{margin-top:10px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}.filter-option{min-height:40px}.filter-option.world{margin:0;border:0;border-radius:7px}.image-area{min-height:220px}.image-area img{max-height:63vh}.study-note{margin-top:12px}}
@media(max-width:520px){.topbar-inner{padding:0 16px}.brand{font-size:14px}.topbar-right{gap:8px;font-size:12px}.text-button{font-size:12px}.filter-options{grid-template-columns:repeat(2,minmax(0,1fr))}.filter-option{padding:7px}.study-heading{margin-bottom:8px}.image-area{min-height:180px}.image-area img{max-height:55vh}.answer{padding:12px;display:block}.answer span{display:block;text-align:left;margin-top:2px;font-size:13px}.grades{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.controls button{min-height:43px;padding:7px 10px}.study-note{font-size:11px}}
@media(max-width:800px){.stats-layout{padding:22px 16px}.stats-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.stats-summary>div:nth-child(2){border-right:0}.stats-summary>div:nth-child(n+3){border-top:1px solid #34383e}.stats-summary>div:nth-child(3){padding-left:0}.stats-bottom{gap:24px}}
@media(max-width:800px){.city-controls{grid-template-columns:repeat(2,minmax(0,1fr))}.city-controls .studied-only{align-self:end}.city-list-heading,.city-row{grid-template-columns:minmax(0,1.5fr) 65px 85px 110px;gap:8px}}
@media(max-width:520px){.topbar-inner{flex-wrap:wrap;min-height:0;padding-top:10px}.topbar-right{margin-left:auto}.main-nav{order:3;width:100%;height:42px;gap:20px}.stats-heading h1{font-size:21px}.stats-summary{margin:22px 0 30px}.stats-summary>div{padding:15px 10px}.stats-summary dd{font-size:21px}.stats-bottom{display:block}table{font-size:12px}th,td{padding:10px 3px;white-space:nowrap}th{font-size:11px}}
@media(max-width:520px){.city-controls{gap:10px}.city-controls label:first-child{grid-column:1/-1}.city-controls .studied-only{grid-column:1/-1;height:auto;margin:4px 0}.city-list-heading{display:none}.city-row{grid-template-columns:minmax(0,1fr) auto;gap:6px 12px}.city-identity{grid-column:1}.city-reviews{grid-column:2}.city-success{grid-column:1;text-align:left}.city-last{grid-column:2}.city-grades{grid-column:1/-1;margin-top:2px}.city-value .mobile-label{display:inline;color:#9da3ac;font-weight:400}.city-list-footer{align-items:flex-start}}
