:root{--bg: #edf0f4;--surface: #ffffff;--sunk: #f5f7fa;--ink: #18202b;--muted: #5a6576;--line: #d4dae3;--accent: #3346a8;--accent-soft: #e3e7f8;--accent-ink: #ffffff;--gold: #b98411;--pass: #1d7f48;--pass-soft: #e1f2e8;--warn: #9a6a12;--warn-soft: #f6edd9;--fail: #be3a30;--fail-soft: #f8e3e1;--font-display: "Bricolage Grotesque", ui-sans-serif, system-ui, sans-serif;--font-body: "IBM Plex Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;--r-panel: 12px;--r-ctl: 8px;--r-pill: 999px;--pad-panel: 20px;--ctl-h: 40px;--gutter: max(16px, env(safe-area-inset-left));--gutter-r: max(16px, env(safe-area-inset-right));--code-size: 13px;color-scheme:light}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg: #11151b;--surface: #192029;--sunk: #141920;--ink: #e5e9ef;--muted: #98a3b3;--line: #2b3441;--accent: #8fa1ff;--accent-soft: #252d52;--accent-ink: #10142a;--gold: #e2b44a;--pass: #5bc98c;--pass-soft: #17301f;--warn: #e4b455;--warn-soft: #33290f;--fail: #ff8278;--fail-soft: #3a1e1c;color-scheme:dark}}:root[data-theme=dark]{--bg: #11151b;--surface: #192029;--sunk: #141920;--ink: #e5e9ef;--muted: #98a3b3;--line: #2b3441;--accent: #8fa1ff;--accent-soft: #252d52;--accent-ink: #10142a;--gold: #e2b44a;--pass: #5bc98c;--pass-soft: #17301f;--warn: #e4b455;--warn-soft: #33290f;--fail: #ff8278;--fail-soft: #3a1e1c;color-scheme:dark}@media(max-width:640px){:root{--pad-panel: 14px;--code-size: 14px}}*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;text-size-adjust:100%}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:15px;line-height:1.55;overflow-x:hidden;-webkit-font-smoothing:antialiased}h1,h2,h3{font-family:var(--font-display);line-height:1.2;text-wrap:balance;margin:0}p{margin:0}a{color:var(--accent)}code,pre,kbd,textarea.code{font-family:var(--font-mono)}button,input,select,textarea{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.tnum{font-variant-numeric:tabular-nums}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.muted{color:var(--muted)}@media(max-width:640px){input,select,textarea{font-size:16px}}@media(hover:none){.kbd-hint{display:none!important}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}code,pre,kbd,textarea,.codebox,.editor,table.results{font-variant-ligatures:none;font-feature-settings:"liga" 0,"calt" 0}.shell{max-width:1280px;margin:0 auto;padding:16px var(--gutter-r) 48px var(--gutter);display:flex;flex-direction:column;gap:14px;min-width:0}.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-panel);padding:var(--pad-panel);min-width:0}.stack{display:flex;flex-direction:column;gap:14px;min-width:0}.row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}.app-header{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.logo{font-family:var(--font-display);font-weight:700;font-size:1.5rem;color:var(--ink);text-decoration:none;letter-spacing:-.01em;white-space:nowrap}.logo .br{color:var(--accent)}.brand{display:flex;align-items:baseline;gap:10px;min-width:0}.brand .sub{color:var(--muted);font-size:13px}.stats{display:flex;gap:6px;flex-wrap:wrap;align-items:center}.stat{display:inline-flex;align-items:baseline;gap:5px;border:1px solid var(--line);background:var(--surface);border-radius:var(--r-pill);padding:4px 11px;font-size:13px;color:var(--muted);white-space:nowrap}.stat b{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}.stat.streak b{color:var(--gold)}.nav-link{font-size:13px;color:var(--muted);text-decoration:none;padding:4px 6px;border-radius:6px}.nav-link:hover,.nav-link.router-link-active{color:var(--accent)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:var(--ctl-h);padding:0 14px;border-radius:var(--r-ctl);border:1px solid var(--line);background:var(--surface);color:var(--ink);font-weight:500;font-size:14px;cursor:pointer;text-decoration:none;white-space:nowrap;transition:background-color .15s,border-color .15s}.btn:hover{border-color:var(--muted)}.btn:disabled{opacity:.55;cursor:not-allowed}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:600}.btn.primary:hover{filter:brightness(1.08)}.btn.ghost{background:transparent;border-color:transparent}.btn.ghost:hover{background:var(--sunk)}.btn.danger{color:var(--fail)}.btn.ai{border:1px dashed var(--accent);color:var(--accent);background:transparent}.btn.ai:hover{background:var(--accent-soft)}.btn.icon{width:var(--ctl-h);padding:0;font-size:18px}.btn.sm{min-height:32px;padding:0 10px;font-size:13px}kbd,.kbd{font-family:var(--font-mono);font-size:11px;border:1px solid var(--line);border-bottom-width:2px;border-radius:4px;padding:0 4px;color:var(--muted);background:var(--sunk)}.btn.primary kbd{background:transparent;color:inherit;border-color:color-mix(in srgb,var(--accent-ink) 45%,transparent)}.spinner{width:14px;height:14px;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.field{display:flex;flex-direction:column;gap:4px;min-width:0}.field>span{font-size:13px;color:var(--muted);font-weight:500}.select,.input{width:100%;min-height:var(--ctl-h);border:1px solid var(--line);border-radius:var(--r-ctl);background-color:var(--sunk);padding:0 12px;min-width:0}.select{appearance:none;-webkit-appearance:none;padding-right:34px;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 17px) 55%,calc(100% - 12px) 55%;background-size:5px 5px;background-repeat:no-repeat;text-overflow:ellipsis;cursor:pointer}.select:focus,.input:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 1px var(--accent)}.chip{display:inline-flex;align-items:center;background:var(--accent-soft);color:var(--accent);border-radius:var(--r-pill);padding:2px 10px;font-size:13px;font-weight:500;white-space:nowrap}.tag{display:inline-flex;align-items:center;gap:4px;border-radius:var(--r-pill);padding:2px 9px;font-size:12px;font-weight:600;white-space:nowrap;background:var(--accent-soft);color:var(--accent)}.tag.mudah{background:var(--pass-soft);color:var(--pass)}.tag.sedang{background:var(--warn-soft);color:var(--warn)}.tag.sulit{background:var(--fail-soft);color:var(--fail)}.tag.done{background:var(--pass);color:#fff}:root[data-theme=dark] .tag.done{color:#0e1a13}@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .tag.done{color:#0e1a13}}.tag.new{background:transparent;border:1px dashed var(--accent);color:var(--accent)}.tag.updated{background:var(--warn-soft);color:var(--warn);border:1px dashed var(--warn)}.pill{display:inline-block;border-radius:var(--r-pill);padding:1px 9px;font-size:12px;font-weight:600}.pill.pass{background:var(--pass-soft);color:var(--pass)}.pill.fail{background:var(--fail-soft);color:var(--fail)}.pill.info{background:var(--sunk);color:var(--muted);border:1px solid var(--line);font-weight:500}.config-head{display:flex;align-items:center;gap:10px;width:100%;background:none;border:0;padding:0;cursor:pointer;text-align:left;min-height:28px}.config-head h2{font-size:1rem;font-family:var(--font-body);font-weight:600}.config-head .chips{display:flex;gap:6px;flex-wrap:wrap;flex:1;min-width:0}.chev{transition:transform .2s;color:var(--muted);flex:none}.chev.open{transform:rotate(180deg)}.config-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:16px}.config-extra{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:12px;margin-top:12px}.picker{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:8px;align-items:center}.picker .select{min-height:44px;background-color:var(--surface);font-weight:500}.picker .btn{min-height:44px}.picker .btn.icon{width:44px}.picker-note{font-size:13px;color:var(--muted);margin-top:6px}.work{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:14px;align-items:start}.work>.problem{position:sticky;top:12px;max-height:calc(100vh - 24px);overflow:auto}.problem-title{font-size:1.55rem;font-weight:700;margin:10px 0 8px}.desc{max-width:65ch}.section-label{font-size:13px;font-weight:600;color:var(--muted);margin:0 0 6px}.codebox{background:var(--sunk);border:1px solid var(--line);border-radius:var(--r-ctl);padding:10px 12px;font-family:var(--font-mono);font-size:var(--code-size);line-height:1.6;overflow-x:auto;white-space:pre;margin:0;tab-size:4}.case-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}.case-list li{background:var(--sunk);border:1px solid var(--line);border-radius:var(--r-ctl);padding:7px 10px;font-family:var(--font-mono);font-size:var(--code-size);overflow-x:auto;white-space:nowrap}.case-list .arrow{color:var(--muted);margin:0 6px}.details{border:1px solid var(--line);border-radius:var(--r-ctl);background:var(--surface)}.details>summary{list-style:none;min-height:44px;display:flex;align-items:center;gap:8px;padding:0 12px;cursor:pointer;font-weight:600;font-size:14px}.details>summary::-webkit-details-marker{display:none}.details>summary:before{content:"▸";color:var(--muted);transition:transform .2s;display:inline-block}.details[open]>summary:before{transform:rotate(90deg)}.details>summary .count{margin-left:auto;font-weight:500;color:var(--muted);font-size:13px}.details-body{padding:0 12px 12px;display:flex;flex-direction:column;gap:10px;min-width:0}.warn-note{background:var(--warn-soft);color:var(--warn);border-radius:var(--r-ctl);padding:8px 10px;font-size:13px}.hints{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.hints li{display:flex;gap:10px;align-items:flex-start}.hints .num{flex:none;width:22px;height:22px;border-radius:50%;background:var(--accent-soft);color:var(--accent);font-size:12px;font-weight:600;display:grid;place-items:center;margin-top:1px}.prose{max-width:68ch;font-size:15px}.prose h2{font-size:1.05rem;margin:14px 0 6px}.prose h2:first-child{margin-top:0}.prose p,.prose ul,.prose ol{margin:0 0 8px}.prose ul,.prose ol{padding-left:1.3em}.prose code{font-size:.9em;background:var(--sunk);border:1px solid var(--line);border-radius:4px;padding:0 4px}.prose pre{background:var(--sunk);border:1px solid var(--line);border-radius:var(--r-ctl);padding:10px 12px;overflow-x:auto}.prose pre code{border:0;padding:0;background:none}.workbench-head{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin-bottom:10px}.filename{font-family:var(--font-mono);font-size:13px;font-weight:500}.editor{display:flex;background:var(--sunk);border:1px solid var(--line);border-radius:var(--r-ctl);overflow:hidden;min-height:280px;max-height:60vh;transition:border-color .15s}.editor:focus-within{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.editor .gutter{flex:none;padding:10px 8px 10px 10px;text-align:right;color:var(--muted);opacity:.6;font-family:var(--font-mono);font-size:var(--code-size);line-height:1.6;user-select:none;overflow:hidden;border-right:1px solid var(--line);font-variant-numeric:tabular-nums}.editor textarea{flex:1;min-width:0;border:0;outline:none;resize:none;background:transparent;padding:10px 12px;font-family:var(--font-mono);font-size:var(--code-size);line-height:1.6;white-space:pre;overflow:auto;tab-size:4;color:var(--ink)}.editor-hint{font-size:12px;color:var(--muted);margin-top:6px}.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;align-items:center}.actions .spacer{flex:1}.summary{border:1px solid var(--line);border-radius:var(--r-ctl);padding:12px 14px;display:flex;flex-direction:column;gap:8px}.summary.allpass{background:var(--pass-soft);border-color:color-mix(in srgb,var(--pass) 40%,transparent)}.summary.error{background:var(--fail-soft);border-color:color-mix(in srgb,var(--fail) 40%,transparent)}.summary .score{font-family:var(--font-display);font-weight:700;font-size:1.9rem;line-height:1;font-variant-numeric:tabular-nums}.summary .msg{font-size:14px}.strip{display:flex;gap:3px;height:14px}.strip span{flex:1;border-radius:3px;background:var(--fail)}.strip span.ok{background:var(--pass)}.fatal{font-family:var(--font-mono);font-size:var(--code-size);color:var(--fail);white-space:pre-wrap;word-break:break-word;margin:0}.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-ctl)}table.results{width:100%;border-collapse:collapse;font-size:var(--code-size)}table.results th{background:var(--sunk);color:var(--muted);font-size:12px;font-weight:600;text-align:left;padding:7px 10px;border-bottom:1px solid var(--line);white-space:nowrap}table.results td{padding:7px 10px;border-bottom:1px solid var(--line);vertical-align:top;font-family:var(--font-mono)}table.results tr:last-child td{border-bottom:0}table.results td.status{font-family:var(--font-body);white-space:nowrap}table.results td .err{color:var(--fail)}.logs{max-height:200px;overflow:auto}.mistakes{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:6px}.mistakes li{border:1px solid var(--line);border-radius:var(--r-ctl);padding:8px 10px;font-size:14px}.mistakes li.hit{border-color:var(--fail);background:var(--fail-soft)}.mistakes .meta{display:block;font-size:12px;color:var(--muted);margin-top:2px}.answer{width:100%;min-height:110px;border:1px solid var(--line);border-radius:var(--r-ctl);background:var(--sunk);padding:10px 12px;font-family:var(--font-mono);font-size:var(--code-size);line-height:1.6;resize:vertical}.answer:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.verdict h3{font-size:1.3rem}.verdict.ok h3{color:var(--pass)}.verdict.bad h3{color:var(--fail)}.empty{text-align:center;padding:32px 16px;color:var(--muted)}.progress-bar{height:6px;background:var(--line);border-radius:var(--r-pill);overflow:hidden}.progress-bar>span{display:block;height:100%;background:var(--accent);transition:width .3s}.skeleton{background:linear-gradient(90deg,var(--sunk),var(--line),var(--sunk));background-size:200% 100%;animation:shimmer 1.2s linear infinite;border-radius:6px;height:14px}@keyframes shimmer{to{background-position:-200% 0}}.toast{position:fixed;left:50%;bottom:max(20px,env(safe-area-inset-bottom));transform:translate(-50%);background:var(--ink);color:var(--bg);padding:9px 16px;border-radius:var(--r-pill);font-size:14px;z-index:50;max-width:calc(100vw - 32px)}.footer{text-align:center;font-size:13px;color:var(--muted);padding-top:8px}@media(max-width:1023px){.work{grid-template-columns:minmax(0,1fr)}.work>.problem{position:static;max-height:none;overflow:visible}.config-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:640px){.shell{padding-top:12px;gap:12px}.brand .sub{display:none}.problem-title{font-size:1.35rem}.picker{grid-template-columns:auto minmax(0,1fr) auto}.picker .random{grid-column:1 / -1}.actions .btn.primary,.actions .btn.wide-mobile{width:100%;min-height:44px}.actions .spacer{display:none}.config-extra{grid-template-columns:minmax(0,1fr)}.table-wrap{border:0;overflow:visible}table.results,table.results tbody,table.results tr,table.results td{display:block;width:100%}table.results thead{display:none}table.results tr{border:1px solid var(--line);border-radius:var(--r-ctl);margin-bottom:8px;padding:6px 0}table.results td{border:0;display:grid;grid-template-columns:96px minmax(0,1fr);gap:8px;padding:4px 10px;overflow-wrap:anywhere}table.results td:before{content:attr(data-label);font-family:var(--font-body);font-size:12px;color:var(--muted);font-weight:600}}@media(max-width:380px){.config-grid{grid-template-columns:minmax(0,1fr)}}
