:root{color-scheme:dark;--bg:#101725;--panel:#192337;--line:#344158;--text:#eff4fc;--muted:#b0bfd3;--blue:#85b9ff;--gold:#f4cb75;--red:#ffb0b8;--green:#96e3be}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.7 'Apple SD Gothic Neo','Malgun Gothic',sans-serif}a{color:var(--blue);text-underline-offset:4px}button,input,select,textarea{font:inherit;color:inherit;background:#101a2b;border:1px solid var(--line);border-radius:7px;padding:9px 13px}button{cursor:pointer}button:hover:not(:disabled){border-color:var(--blue);background:#2b3f60}button:disabled{opacity:.5;cursor:default}button.primary:hover:not(:disabled){background:#b7d7ff}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:3px}header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 4vw;border-bottom:1px solid var(--line)}.brand{color:var(--text);font-size:24px;font-weight:800;text-decoration:none;line-height:1.3}.brand span{color:var(--gold);margin-right:8px}.brand small{display:block;font-size:12px;color:var(--muted);font-weight:400;margin:5px 0 0 36px}.shell{display:grid;grid-template-columns:210px minmax(0,1fr);max-width:1600px;margin:auto;min-height:80vh}nav{padding:28px 16px;border-right:1px solid var(--line)}nav a{display:block;text-decoration:none;padding:11px 14px;border-radius:7px;color:var(--muted);margin:4px 0}nav a[aria-current=page]{background:#2b3f60;color:#deecff}.navnote{border-top:1px solid var(--line);padding:24px 14px;margin-top:28px;font-size:13px;color:var(--muted)}main{padding:34px 4vw;min-width:0}h1{font-size:34px;line-height:1.35;letter-spacing:-1px;margin:5px 0 15px}h2{font-size:21px;line-height:1.4;margin:0 0 15px}h3{font-size:18px;margin:0 0 12px}p{margin:8px 0 20px;max-width:76ch}.muted,small{color:var(--muted)}.row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:24px;min-width:0}.grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(260px,1fr);gap:22px;margin-top:26px}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;margin-top:22px}.tag{display:inline-block;color:var(--gold);font-size:13px;border:1px solid #716348;border-radius:20px;padding:3px 11px;white-space:nowrap}.primary{background:var(--blue);color:#10213b;border-color:var(--blue);font-weight:700}.code,textarea.code{font:16px/1.8 Consolas,Menlo,monospace;tab-size:4;white-space:pre;overflow:auto}.code{padding:20px;background:#0c1320;border:1px solid var(--line);border-radius:8px;color:#e1eafa}.editor{display:block;width:100%;resize:vertical;min-height:250px;white-space:pre;overflow:auto}.file{font-size:13px;color:var(--muted);margin:16px 0 7px}.hint{border-left:3px solid var(--gold);padding:14px 18px;background:#263247;margin-top:18px}.success{color:var(--green)}.error{color:var(--red)}.list{list-style:none;padding:0}.list li{border-bottom:1px solid var(--line);padding:15px 0}.list li:last-child{border:0}.filters{display:flex;gap:14px;flex-wrap:wrap;padding:18px 0}.filters label{display:flex;align-items:center;gap:8px}.metric{display:flex;gap:36px;flex-wrap:wrap;margin:20px 0}.metric strong{display:block;color:var(--gold);font-size:30px;line-height:1.2}.metric small{font-size:13px}table{border-collapse:collapse;width:100%}th,td{padding:12px 8px;border-bottom:1px solid var(--line);text-align:left;overflow-wrap:anywhere}.tablewrap{overflow:auto}.choices{display:grid;gap:10px;margin-top:20px}.choices button{text-align:left;padding:14px}details{margin:18px 0}summary{cursor:pointer;color:var(--blue);padding:6px 0}label.block{display:block;margin-top:16px}label.block input,label.block textarea{display:block;width:100%;margin-top:8px}.word{font:36px/1.4 Consolas,Menlo,monospace;overflow-wrap:anywhere;margin:18px 0}.badge{display:inline-block;background:#2d3e59;border-radius:6px;padding:4px 10px;margin:4px;font-size:14px}.progress{height:7px;background:var(--line);border-radius:5px;overflow:hidden;margin:10px 0}.progress span{display:block;height:100%;background:var(--gold)}.lesson{margin:18px 0}.lesson p{max-width:75ch}.small{font-size:13px;color:var(--muted)}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#e5efff;color:#11213b;border-radius:9px;max-width:90vw;padding:12px 22px;box-shadow:0 5px 25px #0007;display:none;z-index:10}footer{padding:24px 4vw;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}.skip{position:absolute;top:-100px;left:10px;background:var(--bg);z-index:20;padding:10px}.skip:focus{top:10px}.typing-display .good{color:var(--green)}.typing-display .bad{background:#6a2936;color:#fff}.typing-display .remaining{color:#aab8cc}#typeInput{min-height:150px;width:100%}#output{white-space:pre-wrap;overflow-wrap:anywhere;max-height:360px;overflow:auto}input[type=file]{max-width:100%}button.danger{color:var(--red)}@media(max-width:1100px){.grid{grid-template-columns:1fr}.shell{grid-template-columns:185px 1fr}main{padding:28px}.panel{padding:20px}}@media(max-width:700px){header{padding:18px;align-items:flex-start;flex-direction:column}.shell{display:block}nav{display:flex;overflow:auto;border:0;border-bottom:1px solid var(--line);padding:8px;gap:4px}nav a{white-space:nowrap;font-size:14px;padding:10px}.navnote{display:none}main{padding:22px 16px}h1{font-size:27px}.panel{padding:18px}.metric{gap:22px}.code,textarea.code{font-size:14px}.filters label{flex:1;min-width:140px}.filters select{max-width:100%}table{font-size:13px}header select{padding:5px 9px}.cards{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.typing-columns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;margin-top:20px}.typing-reference,.typing-input{height:470px;margin:0;font:15px/1.9 Consolas,Menlo,monospace;white-space:pre;overflow:auto}.typing-reference{position:relative;padding:14px 8px}.typing-input{width:100%;padding:14px;resize:vertical;tab-size:4;min-height:240px}.typing-line{display:flex;min-height:28.5px}.line-number{width:35px;flex-shrink:0;color:#91a2ba;text-align:right;padding-right:12px;user-select:none}.current-line{background:#243652}.typing-reference .good{color:#96e3be}.typing-reference .bad{color:#fff;background:#7b2b3a}.typing-reference .remaining{color:#aab8cc}.typing-reference .caret{border-left:2px solid #f4cb75}.line-return{opacity:.65;padding-left:4px}@media(max-width:850px){.typing-columns{grid-template-columns:1fr}.typing-reference{height:260px}.typing-input{height:290px}}
.typing-columns>div{min-width:0}@media(max-width:850px){.typing-columns{grid-template-columns:minmax(0,1fr)}}
.lesson-detail{border-top:1px solid var(--line);padding:12px 0}.lesson-detail summary{font-size:18px;font-weight:600}.lesson-detail h3{margin-top:25px}.lesson-detail li{margin:8px 0}.order-block{border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:16px}.order-block .code{margin:0}.order-block .actions{margin-top:8px}
.problem-toolbar{align-items:center}.problem-toolbar label{margin:0}.problem-toolbar button{margin:0}@media(max-width:700px){.problem-toolbar label{flex:0 0 auto;min-width:0}}
.assignment-panel{margin-top:26px;padding:32px 36px}.assignment-panel h2{font-size:27px;line-height:1.5;letter-spacing:-.5px;max-width:34ch}.assignment-panel h3{font-size:21px;margin:30px 0 13px;color:#dce9ff}.assignment-panel p,.assignment-rules li{font-size:18px;line-height:1.95;max-width:76ch}.assignment-story p{margin:12px 0 20px}.assignment-goal{border-left:4px solid var(--blue);padding:12px 20px;background:#22344e;color:#f0f6ff;font-weight:600}.assignment-rules ol{padding-left:28px}.assignment-rules li{padding:5px 0 10px 8px}.assignment-examples{border-top:1px solid var(--line);margin-top:25px;padding-top:2px}.assignment-example{margin-top:22px}.assignment-example h4{font-size:17px;margin:0 0 12px}.example-pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px}.example-pair>div{min-width:0}.example-pair .code,.example-transcript{font-size:17px;line-height:1.8;white-space:pre-wrap;overflow-wrap:anywhere}.assignment-file{font-size:14px!important;color:var(--muted)}.assignment-panel .small{font-size:14px;line-height:1.7}.assignment-workspace{margin-top:24px}.assignment-panel .hint{margin-top:24px}@media(max-width:700px){.assignment-panel{padding:22px 20px}.assignment-panel h2{font-size:24px}.assignment-panel p,.assignment-rules li{font-size:17px;line-height:1.9}.assignment-panel h3{font-size:20px}.example-pair{grid-template-columns:minmax(0,1fr)}.example-pair .code,.example-transcript{font-size:15px}.assignment-goal{padding:12px 14px}}
.problem-toolbar{padding:12px 0}#problemChoice{max-width:100%}.assignment-story{margin-top:22px}
.report{width:min(560px,calc(100% - 32px));background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:12px;padding:24px}.report::backdrop{background:rgba(5,9,17,.72)}.report h2{margin-top:0}.report-check{margin-top:16px}.report-check input{padding:0;accent-color:var(--blue)}.linkish{background:none;border:0;padding:0;color:var(--blue);text-decoration:underline;text-underline-offset:4px}.linkish:hover:not(:disabled){background:none}
.test-title{margin:22px 0 6px;font-size:17px}.test-results pre{margin:0;white-space:pre-wrap;font:13px/1.5 Consolas,Menlo,monospace}.test-results td{vertical-align:top}.test-results tr.fail td:last-child{color:var(--red);font-weight:700}.test-results tr.pass td:last-child{color:var(--green)}#errorJump button{margin-top:10px;border-color:var(--gold)}.trace{margin-top:22px;border-top:1px solid var(--line);padding-top:6px}.trace h3{margin:12px 0}.trace h4{margin:14px 0 6px;font-size:14px;color:var(--muted)}#traceSlider{width:100%;margin-top:14px;padding:0;accent-color:var(--gold)}.trace-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:18px;margin-top:12px}.trace-code{max-height:420px;overflow:auto;padding:12px 8px}.trace-code span{display:block;padding:0 8px;border-radius:5px;white-space:pre}.trace-code span.current{background:#3a3214;outline:1px solid var(--gold)}.trace-code i{display:inline-block;width:2.4em;color:var(--muted);font-style:normal;user-select:none}.trace-vars th,.trace-vars td{font:14px/1.5 Consolas,Menlo,monospace;padding:6px 8px}.trace-vars tr.changed td,.trace-vars tr.changed th{color:var(--gold);font-weight:700}@media (max-width:760px){.trace-grid{grid-template-columns:1fr}}
.rec-list{list-style:none;padding:0;margin:14px 0 0}.rec-list li{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px 14px;padding:12px 0;border-top:1px solid var(--line)}.rec-list li>div{flex:1;min-width:0}.rec-list li .tag{margin-right:6px}.unit-progress{padding:14px 0;border-top:1px solid var(--line)}.unit-progress .progress{margin:8px 0}
.key-chips{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0 4px}.key-chip{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:8px;padding:8px 12px;background:#101a2b}.key-chip kbd,.hint kbd{font:18px/1.2 Consolas,Menlo,monospace;color:var(--gold);background:#0c1320;border:1px solid var(--line);border-radius:5px;padding:2px 8px;min-width:1.6em;text-align:center;display:inline-block}#ownLoader ul{padding-left:20px;margin:0 0 8px}#ownPaste{min-height:160px}
