:root{color-scheme:dark;--bg:#10131c;--side:#12151f;--panel:#191d29;--hover:#202536;--raised:#222738;--ink:#edf0fa;--muted:#9aa3b9;--faint:#78839d;--line:#2a3042;--accent:#a49aff;--accent-bg:#252340;--mint:#6ee0bd;--amber:#edc383;--blue:#91baff;--shadow:0 16px 50px #0002}
html[data-theme=light]{color-scheme:light;--bg:#f5f6fb;--side:#fff;--panel:#fff;--hover:#f0f1f9;--raised:#eceef7;--ink:#20243a;--muted:#606a81;--faint:#6a748b;--line:#dfe3ef;--accent:#6453ce;--accent-bg:#eeeafd;--mint:#157e60;--amber:#946311;--blue:#3468ad;--shadow:0 16px 45px #242b5010}
*{box-sizing:border-box}body{margin:0;font:14px/1.55 ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--ink)}button,input,select,textarea{font:inherit;color:inherit}button,a,input,select,textarea,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.4;cursor:not-allowed}a{color:inherit;text-decoration:none}button{transition:background .16s,border-color .16s,transform .16s}button:hover:not(:disabled){filter:brightness(1.1)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:4px}h1,h2,h3,p{margin:0}button{border:0}button,.button{touch-action:manipulation}svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}button svg{pointer-events:none}.skip{position:fixed;top:-100px;left:20px;z-index:10;background:var(--accent);color:var(--bg);padding:12px}.skip:focus{top:10px}.sidebar{position:fixed;inset:0 auto 0 0;width:252px;background:var(--side);border-right:1px solid var(--line);display:flex;flex-direction:column;padding:29px 19px 0;z-index:5}.brand{display:flex;gap:12px;align-items:center;font-size:25px;letter-spacing:-1px;font-weight:750;padding:0 8px 34px}.brand-light{font-weight:400;color:var(--muted)}.brand small{font-size:9px;display:block;letter-spacing:2.2px;color:var(--faint);font-weight:600;margin-top:3px}.brand-mark{font-size:27px;color:#d0c9ff;background:linear-gradient(140deg,#7162df,#4a419a);width:38px;height:41px;text-align:center;line-height:40px;border:1px solid #b4aaff50;border-radius:11px;box-shadow:0 4px 20px #6554c526}.nav-label{font-size:10px;letter-spacing:1.65px;color:var(--faint);font-weight:700;margin:0 12px 12px}.main-nav{display:grid;gap:4px}.main-nav button{display:flex;align-items:center;gap:10px;width:100%;padding:11px 12px;background:none;color:var(--muted);text-align:left;border-radius:8px;font-size:13px}.main-nav button.active{color:var(--accent);background:var(--accent-bg);font-weight:600}.nav-icon{font-size:20px;width:19px;line-height:1}.nav-count{margin-left:auto;font:11px ui-monospace,monospace;background:var(--raised);padding:1px 5px;border-radius:4px}.path-label{margin-top:29px;display:flex;justify-content:space-between}.topic-nav{overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--line) transparent;flex:1;padding-bottom:20px}.topic-nav button{display:flex;align-items:center;gap:10px;text-align:left;padding:9px 11px;background:transparent;color:var(--muted);width:100%;font-size:12px;border-radius:7px}.topic-nav button:hover{background:var(--hover)}.topic-nav button.active{background:var(--accent-bg);color:var(--accent)}.topic-nav .topic-num{font:10px ui-monospace,monospace;color:var(--faint)}.topic-nav .topic-pct{margin-left:auto;font-size:10px;min-width:24px;text-align:right}.topic-dot{width:5px;height:5px;border-radius:50%;background:var(--line)}.topic-dot.started{background:var(--mint)}.sidebar-bottom{border-top:1px solid var(--line);display:flex;gap:11px;padding:19px 7px 22px;align-items:center}.sidebar-bottom strong{font-size:11px;font-weight:500}.sidebar-bottom small{font-size:10px;display:block;color:var(--faint)}.local-symbol{font-size:25px;color:var(--accent)}.shell{margin-left:252px}.topbar{height:75px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:0 38px;gap:12px}.breadcrumb{display:flex;align-items:center;gap:16px;font-size:12px;color:var(--faint)}.breadcrumb strong{font-weight:500;color:var(--muted)}.separator{color:var(--line)}.top-actions{display:flex;gap:17px;align-items:center}.save-state{font-size:11px;color:var(--muted)}.icon-button{background:transparent;width:34px;height:34px;display:inline-grid;place-items:center;border:1px solid var(--line);border-radius:7px;font-size:20px;color:var(--muted)}.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:10px 15px;border-radius:7px;background:var(--panel);border:1px solid var(--line);font-size:12px;font-weight:550;white-space:nowrap}.small-button{padding:8px 11px;font-size:11px}.primary{background:#aaa0fa;border-color:#b8afff;color:#201a45;box-shadow:0 3px 16px #9a8cf515}.secondary{background:var(--panel);color:var(--ink)}main{max-width:1550px;margin:auto;padding:32px 38px 0}.heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:27px}.eyebrow{font-size:9px;letter-spacing:1.8px;font-weight:700;color:var(--accent);margin-bottom:8px}h1{font-size:clamp(24px,2.5vw,35px);font-weight:640;letter-spacing:-1.3px;line-height:1.3}h1 span{color:var(--accent)}.heading p{color:var(--muted);font-size:12px;margin-top:8px}.mobile-br{display:none}.panel{background:var(--panel);border:1px solid var(--line);border-radius:11px}.stats{display:grid;grid-template-columns:1.2fr repeat(3,1fr);gap:14px}.stat{padding:18px 19px;min-height:148px;position:relative}.stat-label{display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:11px;gap:5px}.stat-icon{display:grid;place-items:center;width:26px;height:26px;background:color-mix(in srgb,currentColor 9%,transparent);border-radius:7px;font-size:16px}.mint{color:var(--mint)}.violet{color:var(--accent)}.amber{color:var(--amber)}.blue{color:var(--blue)}.stat-value{display:flex;gap:9px;align-items:baseline;margin:4px 0 9px}.stat-value strong{font-size:33px;letter-spacing:-1.3px;font-weight:600;font-variant-numeric:tabular-nums}.stat-value>span{font-size:11px;color:var(--faint)}.mini-track{height:4px;background:var(--line);border-radius:4px;overflow:hidden}.mini-track i{display:block;height:100%;background:var(--accent);transition:width .3s}.stat-foot{display:flex;justify-content:space-between;color:var(--faint);font-size:9px;margin-top:8px;gap:5px}.stat-foot.bottom{margin-top:16px}.stat-button{text-align:left;color:inherit}.practice-strip{display:flex;align-items:center;gap:18px;padding:21px 23px;margin:19px 0 32px;background:linear-gradient(110deg,var(--accent-bg),var(--panel) 80%);position:relative;overflow:hidden}.practice-strip:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--accent)}.practice-glyph{width:48px;height:48px;display:grid;place-items:center;color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent);border:1px solid color-mix(in srgb,var(--accent) 20%,transparent);border-radius:11px;font:17px ui-monospace,monospace}.practice-info{flex:1;min-width:0}.practice-info .eyebrow{margin-bottom:3px;font-size:9px}.practice-info h2{font-size:17px;font-weight:550;letter-spacing:-.3px}.practice-info p{font-size:11px;color:var(--muted);margin-top:4px}.library-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.library-heading h2{font-size:21px;font-weight:600;letter-spacing:-.5px}.library-heading p{font-size:11px;color:var(--faint);margin-top:4px}.catalog-label{border:1px solid var(--line);border-radius:5px;padding:4px 8px;font:10px ui-monospace,monospace;color:var(--muted)}.view-tabs{display:flex;gap:26px;border-bottom:1px solid var(--line);margin-top:19px}.view-tabs button{border:0;background:transparent;color:var(--muted);padding:12px 0;font-size:12px;position:relative}.view-tabs button.selected{color:var(--accent)}.view-tabs button.selected:after{content:"";position:absolute;bottom:-1px;height:2px;background:var(--accent);left:0;right:0}.view-tabs span{font:10px ui-monospace,monospace;background:var(--raised);padding:2px 5px;margin-left:4px;border-radius:4px}.filter-panel{margin-top:19px;padding:14px}.search-row{display:flex;gap:17px;align-items:center}.searchbox{display:flex;align-items:center;gap:10px;flex:1;border:1px solid var(--line);background:var(--bg);border-radius:7px;padding:0 12px}.searchbox>span{font-size:23px;color:var(--faint)}input[type=search]{width:100%;min-width:0;border:0;background:transparent;outline:none;height:38px;font-size:12px}.searchbox:focus-within{outline:2px solid var(--accent);outline-offset:2px}input::placeholder{color:var(--faint)}kbd{font:11px ui-monospace,monospace;padding:0 5px;border:1px solid var(--line);border-radius:3px;color:var(--faint)}.sort-label{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:10px}.sort-label select{border:0;background:var(--panel);font-size:11px;max-width:155px;padding:7px}.filters{display:flex;align-items:end;flex-wrap:wrap;gap:9px;margin-top:12px}.filters label{display:grid;gap:4px;color:var(--faint);font-size:9px;flex:1;min-width:90px}.filters select{width:100%;background:var(--panel);border:1px solid var(--line);padding:7px 8px;border-radius:5px;font-size:10px;color:var(--muted)}.filters .check-filter{display:flex;gap:5px;align-items:center;font-size:10px;min-width:fit-content;flex:0;white-space:nowrap;height:33px}input[type=checkbox]{accent-color:var(--accent);width:14px;height:14px;margin:0}.result-bar{display:flex;justify-content:space-between;align-items:center;margin:15px 0;color:var(--faint);font-size:11px}.result-bar strong{color:var(--ink);font-weight:500}.text-button{background:transparent;color:var(--muted);font-size:11px;padding:3px}.text-button:hover{color:var(--accent)}.list-heading{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1.25px;font-weight:600;color:var(--faint);padding:0 18px 10px}.problem{margin-bottom:8px;overflow:hidden;transition:border-color .2s}.problem:hover{border-color:color-mix(in srgb,var(--accent) 40%,var(--line))}.problem-main{display:flex;align-items:center;padding:16px 17px;gap:15px}.order{color:var(--faint);font:11px ui-monospace,monospace;min-width:25px}.problem-body{min-width:0;flex:1}.problem-title{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.problem-title h3{font-size:13px;font-weight:550;letter-spacing:-.1px}.problem-title a:hover{color:var(--accent)}.external{font-size:11px;color:var(--faint);margin-left:5px}.badges{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:6px;color:var(--faint);font-size:10px}.platform{display:flex;align-items:center;gap:5px;color:var(--muted)}.platform-symbol{font:10px ui-monospace,monospace;color:var(--amber)}.dot-sep{color:var(--faint)}.badge{font-size:9px;padding:2px 7px;border-radius:4px;white-space:nowrap}.difficulty-easy{color:var(--mint);background:color-mix(in srgb,var(--mint) 10%,transparent)}.difficulty-medium{color:var(--amber);background:color-mix(in srgb,var(--amber) 10%,transparent)}.difficulty-hard{color:#f092ab;background:#b753741a}html[data-theme=light] .difficulty-hard{color:#ae3057}.priority-essential{color:var(--accent);background:var(--accent-bg)}.priority-other{color:var(--faint);border:1px solid var(--line)}.problem-controls{display:flex;gap:7px;align-items:center}.status-select{font-size:10px;border:1px solid var(--line);border-radius:6px;background:var(--bg);padding:8px;width:113px}.status-select.done{color:var(--mint)}.status-select.in-progress{color:var(--accent)}.toggle-button{background:transparent;color:var(--faint);height:32px;width:30px;border-radius:6px;font-size:19px;display:grid;place-items:center}.toggle-button[aria-pressed=true]{background:var(--accent-bg);color:var(--accent)}.problem-details{border-top:1px solid var(--line);padding:0 17px 0 57px}.problem-details>summary{cursor:pointer;list-style:none;font-size:10px;color:var(--faint);padding:8px 0}.problem-details>summary::-webkit-details-marker{display:none}.problem-details>summary:before{content:'＋';padding-right:7px}.problem-details[open]>summary:before{content:'−'}.details-content{padding:6px 0 17px;display:grid;gap:13px;color:var(--muted);font-size:12px}.details-content h4{font-size:11px;color:var(--ink);margin:0 0 3px}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.detail-grid p{font-size:11px}.detail-grid a,.aliases a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}.hint{background:var(--bg);border:1px solid var(--line);padding:9px 12px;border-radius:6px}.hint summary{cursor:pointer;color:var(--accent);font-size:11px}.hint p{margin-top:8px}.note-label{display:grid;gap:6px;font-size:11px}.notes{resize:vertical;min-height:75px;width:100%;background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:10px;font-size:12px}.timestamp{font-size:10px;color:var(--faint)}.pagination{display:flex;justify-content:space-between;gap:10px;align-items:center;margin:20px 0 28px;font-size:11px;color:var(--muted)}.pagination>div{display:flex;gap:7px}.pagination .button{font-size:10px;padding:7px 12px}footer{border-top:1px solid var(--line);padding:20px 0 25px;display:flex;justify-content:space-between;gap:10px;font-size:10px;color:var(--faint)}footer button{font-size:10px!important}.empty{text-align:center;padding:55px 20px}.empty-symbol{font-size:35px;color:var(--accent);margin-bottom:9px}.empty h3{font-size:18px}.empty p{color:var(--muted);font-size:12px;margin:8px 0 18px}.toast{position:fixed;bottom:24px;left:calc(50% + 100px);transform:translateX(-50%) translateY(90px);background:var(--ink);color:var(--bg);padding:11px 20px;border-radius:9px;font-size:12px;box-shadow:var(--shadow);z-index:20;transition:transform .2s;max-width:90vw}.toast.show{transform:translateX(-50%) translateY(0)}dialog{background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:15px;width:min(570px,calc(100% - 30px));padding:26px;max-height:85vh;box-shadow:0 30px 150px #0008}dialog::backdrop{background:#080b15b8;backdrop-filter:blur(4px)}.dialog-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:15px}.dialog-head h2{font-size:22px;letter-spacing:-.7px}dialog p{font-size:13px;color:var(--muted);margin:12px 0}dialog strong{color:var(--ink)}.dialog-section{padding-top:17px;margin-top:19px;border-top:1px solid var(--line)}.dialog-section h3{font-size:14px}.import-mode{display:grid;gap:7px;margin-top:9px;font-size:12px;color:var(--muted)}.import-mode select{background:var(--bg);border:1px solid var(--line);padding:9px;border-radius:6px;width:100%}.danger{color:#e990a5;border-color:#a84c6d66}.danger-section h3{color:#e990a5}.mobile-menu,.mobile-close{display:none}.storage-warning{color:var(--amber)}.flash{outline:2px solid var(--accent);outline-offset:3px}
@media(min-width:1600px){body{font-size:16px}.problem-title h3{font-size:15px}.problem-main{padding:20px}.badges{font-size:12px}.badge{font-size:11px}.topic-nav button{font-size:14px}.stat-label{font-size:13px}.heading p{font-size:14px}.sidebar{width:270px}.shell{margin-left:270px}}
@media(max-width:1200px){.sidebar{width:220px;padding-left:12px;padding-right:12px}.shell{margin-left:220px}main{padding:26px 24px 0}.topbar{padding:0 24px}.stats{gap:10px}.stat{padding:14px}.stat-label{font-size:10px}.stat-foot{font-size:9px}.stat-foot span:last-child{display:none}.filters{gap:8px}.filters label{min-width:100px}.filters .check-filter{flex:0}.problem-main{gap:10px}.order{display:none}.problem-details{padding-left:17px}.priority-other{display:none}}
@media(max-width:950px){.stats{grid-template-columns:repeat(2,1fr)}.stat{min-height:136px}.heading{align-items:flex-start}.heading .button{margin-top:18px}.top-actions{gap:9px}.save-state{display:none}.search-row{flex-wrap:wrap;gap:9px}.searchbox{flex-basis:100%}.sort-label{margin-left:auto}.problem-main{align-items:flex-start;flex-wrap:wrap}.problem-body{flex-basis:calc(100% - 30px)}.problem-controls{margin-top:3px;width:100%}.status-select{flex:1}.list-heading span:last-child{display:none}.priority-other{display:inline}.practice-strip{padding:18px;gap:13px}.practice-glyph{display:none}footer{flex-wrap:wrap}.catalog-label{display:none}.view-tabs{gap:20px}}
@media(max-width:720px){.sidebar{transform:translateX(-100%);width:268px;box-shadow:0 0 0 100vmax #0000;transition:transform .2s,box-shadow .2s}.sidebar.open{transform:translateX(0);box-shadow:0 0 0 100vmax #0008}.shell{margin-left:0}.mobile-menu{display:inline-grid}.mobile-close{display:block;position:absolute;right:12px;top:13px;background:transparent;color:var(--muted);font-size:11px}.brand{padding-top:15px}.topbar{height:64px;padding:0 17px}.breadcrumb{gap:10px}.breadcrumb>span:first-of-type,.breadcrumb .separator{display:none}.top-actions{gap:8px}.small-button span{font-size:10px}main{padding:24px 17px 0}.heading{position:relative;margin-bottom:22px}.heading h1{font-size:26px;letter-spacing:-.9px}.mobile-br{display:block}.heading .eyebrow{font-size:8px;letter-spacing:1.3px}.heading p{font-size:11px;max-width:240px}.heading .button{position:absolute;right:0;bottom:0;padding:6px 8px;font-size:10px}.stats{gap:9px}.stat-label{font-size:11px}.stat{padding:14px;min-height:136px}.stat-value strong{font-size:30px}.stat-foot{font-size:9px}.practice-strip{margin-bottom:26px;flex-wrap:wrap}.practice-info h2{font-size:16px}.practice-strip .button{padding:9px 12px;font-size:11px}.practice-info{min-width:160px}.library-heading h2{font-size:20px}.view-tabs{gap:22px}.view-tabs button{font-size:11px}.view-tabs span{font-size:9px}.filter-panel{padding:12px}.filters{display:grid;grid-template-columns:1fr 1fr}.filters label{min-width:0}.filters select{font-size:12px;padding:8px}.filters .check-filter{font-size:11px}.filters>label:nth-child(5){grid-column:1/-1}.filters>label{font-size:10px}.sort-label,.sort-label select{font-size:11px}.searchbox input{font-size:12px}.problem-main{padding:15px}.problem-title h3{font-size:14px}.badges{font-size:11px;gap:6px}.badge{font-size:10px}.problem-controls{gap:9px}.status-select{font-size:12px}.toggle-button{width:34px;height:34px}.problem-details>summary{font-size:11px;padding:10px 0}.detail-grid{grid-template-columns:1fr}.toast{left:50%}footer{font-size:10px;padding-bottom:22px}footer>span:last-child{display:none}.pagination .button{font-size:11px}.topic-nav button{font-size:13px}.topic-nav .topic-pct{font-size:11px}}
@media(max-width:380px){.heading .button{position:static;margin-top:10px}.heading{display:block}.stats{gap:7px}.stat{padding:12px}.stat-label{font-size:10px}.stat-icon{width:21px;height:21px}.view-tabs{gap:15px}.top-actions .small-button{padding:7px}.breadcrumb strong{font-size:11px}.practice-strip .button{width:100%}}
/* Readable working text, while keeping labels and metadata visually secondary. */
.topic-nav button{font-size:13px}.main-nav button{font-size:14px}.stat-label{font-size:12px}.stat-foot{font-size:11px}.stat-value>span{font-size:12px}.heading p{font-size:14px}.practice-info p,.library-heading p{font-size:12px}.button{font-size:13px}.problem-title h3{font-size:15px}.badges{font-size:11px}.badge{font-size:10px}.status-select{font-size:12px;width:125px}.filters label{font-size:11px}.filters select{font-size:12px}.filters .check-filter{font-size:11px}.searchbox input{font-size:13px}.sort-label,.sort-label select{font-size:12px}.problem-details>summary{font-size:11px}.result-bar{font-size:12px}.detail-grid p{font-size:12px}.notes,.details-content{font-size:13px}.sidebar-bottom strong{font-size:12px}.sidebar-bottom small{font-size:11px}.view-tabs button{font-size:13px}.topbar .small-button{font-size:12px}
@media(max-width:1200px){.filters{align-items:end}.filters label{min-width:115px}.filters .check-filter{min-width:fit-content}.stat-label{font-size:11px}.stat-foot{font-size:10px}}
@media(max-width:720px){.filters label{min-width:0}.view-tabs{gap:17px}.view-tabs button{font-size:12px}.heading p{font-size:12px;max-width:220px}.problem-title h3{font-size:14px}.status-select{width:auto}.topbar .small-button{font-size:11px}.stat-value>span{font-size:11px}.stat-foot{font-size:10px}.practice-strip .button{font-size:12px}.heading .button{font-size:10px}.heading{padding-bottom:5px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media(min-width:951px){.topbar{height:64px}main{padding-top:25px}.heading{margin-bottom:22px}.stat{min-height:130px;padding:13px 17px}.stat-value{margin:2px 0 6px}.stat-value strong{font-size:30px}.stat-foot.bottom{margin-top:9px}.practice-strip{padding:15px 21px;margin:15px 0 23px}.view-tabs{margin-top:12px}.filter-panel{margin-top:14px}.library-heading h2{font-size:20px}}
@media(max-width:720px){.stat{min-height:112px;padding:11px 13px}.stat-label{font-size:10px}.stat-value{margin:0 0 3px}.stat-value strong{font-size:27px}.stat-foot.bottom{margin-top:6px}.stat-foot{font-size:9px}.stat-icon{width:23px;height:23px}.practice-strip{padding:14px;margin:15px 0 23px;gap:11px}.practice-info .eyebrow{letter-spacing:1px;font-size:8px}.practice-info h2{font-size:14px}.practice-info p{font-size:11px}.heading{margin-bottom:18px}.practice-info{min-width:145px}}
