:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;color:#edf0ff;background:#080a12;font-synthesis:none;text-rendering:optimizeLegibility;--panel: rgba(19, 23, 39, .78);--line: rgba(255,255,255,.09);--muted: #9299b8;--purple: #8b5cf6;--cyan: #22d3ee}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at 15% -5%,rgba(91,33,182,.24),transparent 32%),radial-gradient(circle at 85% 10%,rgba(8,145,178,.12),transparent 28%),#080a12}button,select,textarea{font:inherit}button{color:inherit}button:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}.shell{width:min(1180px,calc(100% - 40px));margin-inline:auto}.glass{background:var(--panel);border:1px solid var(--line);box-shadow:0 20px 70px #00000038;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}header{height:72px;padding:0 max(20px,calc((100% - 1180px)/2));display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:#080a12c7;position:sticky;top:0;z-index:20;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.brand{border:0;background:none;display:flex;align-items:center;gap:11px;cursor:pointer;font-size:17px}.brand span{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;color:#071016;background:linear-gradient(135deg,var(--cyan),#a7f3d0);font-weight:900;font-family:monospace}header nav{display:flex;gap:20px;color:var(--muted);font-size:14px}.hero{min-height:560px;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:70px;padding-block:80px 60px}.eyebrow{color:#a78bfa;letter-spacing:.18em;font-size:12px;font-weight:800}.hero h1{font-size:clamp(44px,6vw,76px);line-height:1.06;letter-spacing:-.055em;margin:18px 0 24px}.hero h1 em{font-style:normal;background:linear-gradient(90deg,#c4b5fd,#67e8f9);-webkit-background-clip:text;color:transparent}.hero p{color:#afb5ce;font-size:18px;line-height:1.75;max-width:640px}.hero-actions{display:flex;gap:12px;margin-top:32px}.primary,.secondary{border-radius:12px;padding:12px 18px;border:1px solid transparent;font-weight:750;cursor:pointer;transition:.2s ease}.primary{color:#fff;background:linear-gradient(135deg,#7c3aed,#4f46e5);box-shadow:0 12px 32px #6366f140}.primary:hover{transform:translateY(-1px);filter:brightness(1.12)}.primary:disabled{opacity:.45;cursor:not-allowed;transform:none}.secondary{background:#ffffff0b;border-color:var(--line)}.secondary:hover{background:#ffffff16}.terminal-card{border-radius:20px;overflow:hidden;transform:rotate(1deg)}.terminal-head{height:48px;display:flex;align-items:center;gap:7px;padding:0 18px;background:#ffffff06;border-bottom:1px solid var(--line);color:var(--muted);font:12px monospace}.terminal-head i{width:9px;height:9px;border-radius:50%;background:#fb7185}.terminal-head i:nth-child(2){background:#fbbf24}.terminal-head i:nth-child(3){background:#34d399}.terminal-head span{margin-left:auto}.terminal-card pre{margin:0;padding:28px;font:14px/2 monospace;overflow:auto}.terminal-card b{color:#c4b5fd}.terminal-card .number{color:#67e8f9}.terminal-card .comment{color:#64748b}.muted{color:#3f4964}.terminal-status{display:flex;justify-content:space-between;padding:14px 22px;border-top:1px solid var(--line);color:#34d399;font-size:12px}.terminal-status strong{color:#fbbf24}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:110px}.metric{border-radius:16px;padding:22px;display:flex;flex-direction:column;gap:7px}.metric strong{font-size:30px}.metric span{color:var(--muted);font-size:13px}.library{padding-bottom:100px}.section-title{display:flex;align-items:end;justify-content:space-between;margin-bottom:26px}.section-title h2{font-size:38px;margin:8px 0 0}.filters{display:flex;gap:10px}select{color:#e9eaff;background:#121625;border:1px solid var(--line);border-radius:10px;padding:11px 38px 11px 13px}.challenge-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.challenge-card{color:inherit;text-align:left;border-radius:17px;padding:20px;cursor:pointer;min-height:240px;display:flex;flex-direction:column;transition:.2s ease}.challenge-card:hover{transform:translateY(-3px);border-color:#8b5cf680;background:#191c30eb}.card-top,.card-foot{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:12px}.challenge-card h3{font-size:19px;margin:18px 0 8px}.challenge-card p{color:#a7aec7;font-size:14px;line-height:1.6;margin:0 0 15px}.card-foot{margin-top:auto;padding-top:18px;border-top:1px solid var(--line)}.card-foot strong{color:#c4b5fd}.level-badge{display:inline-flex;align-items:center;padding:5px 9px;border:1px solid color-mix(in srgb,var(--level-color) 48%,transparent);color:var(--level-color);background:color-mix(in srgb,var(--level-color) 10%,transparent);border-radius:999px;font-size:11px;font-weight:800}.tags{display:flex;gap:6px;flex-wrap:wrap}.tags span{padding:4px 7px;border-radius:6px;background:#ffffff0d;color:#8f97b6;font-size:11px}.reset-row{text-align:center;margin-top:32px}.text-button{border:0;background:none;cursor:pointer;color:#aeb5d0;padding:8px}.text-button:hover{color:#fff}.text-button.danger{color:#fb7185}.practice{padding-block:28px 100px}.practice-head{display:grid;grid-template-columns:160px 1fr 80px;align-items:center;gap:18px;color:var(--muted);font-size:13px}.session-progress{height:5px;border-radius:99px;background:#181c2d;overflow:hidden}.session-progress span{display:block;height:100%;background:linear-gradient(90deg,var(--purple),var(--cyan));transition:width .3s}.challenge-heading{padding:50px 0 30px}.challenge-heading>div:first-child{display:flex;align-items:center;gap:10px}.category{color:var(--muted);font-size:12px}.challenge-heading h1{font-size:clamp(31px,5vw,52px);letter-spacing:-.04em;margin:14px 0 10px}.challenge-heading p{color:#a8afc7;max-width:760px;line-height:1.7}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px;align-items:start}.workspace-main{display:grid;gap:18px}.workspace aside{display:grid;gap:14px;position:sticky;top:92px}.code-panel{border:1px solid var(--line);border-radius:17px;background:#0d101b;overflow:hidden;box-shadow:0 28px 80px #00000047}.code-toolbar{display:flex;justify-content:space-between;padding:13px 17px;border-bottom:1px solid var(--line);color:#7d86a8;font:12px monospace}.code-panel pre{margin:0;padding:13px 0;overflow:auto}.code-line{display:flex;width:100%;border:0;background:none;text-align:left;font:14px/1.8 SFMono-Regular,Consolas,monospace;cursor:pointer;padding:0 18px 0 0;white-space:pre;min-width:max-content}.code-line:hover{background:#8b5cf614}.code-line.selected{background:#22d3ee1c;box-shadow:inset 3px 0 #22d3ee}.code-line.revealed{background:#f43f5e1f;box-shadow:inset 3px 0 #fb7185}.line-number{width:55px;text-align:right;padding-right:18px;color:#46506d;-webkit-user-select:none;user-select:none}.code-line code{color:#dce1f7}.answer-block{border-radius:17px;padding:22px}.answer-section{display:grid;gap:9px;margin-bottom:19px}.answer-section label{font-size:13px;font-weight:750}.selected-answer{border:1px dashed rgba(34,211,238,.32);background:#22d3ee0e;color:#67e8f9;border-radius:10px;padding:11px 13px;font-size:13px}.answer-section textarea{min-height:280px;resize:vertical;color:#dce1f7;background:#0d101b;border:1px solid var(--line);border-radius:12px;padding:15px;font:13px/1.65 SFMono-Regular,Consolas,monospace}.answer-section select{width:100%}.submit{width:100%;padding:14px}.hint-card,.mini-stats{border-radius:17px;padding:18px}.aside-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.aside-title span{font-weight:800}.aside-title small{color:#fbbf24}.hint{border-top:1px solid var(--line);padding:13px 0;color:#505875}.hint.visible{color:#bec5dc}.hint strong{font-size:12px}.hint p{font-size:13px;line-height:1.55;margin:6px 0 0}.full{width:100%;margin-top:8px}.mini-stats>div{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line);color:var(--muted);font-size:12px}.mini-stats>div:last-child{border:0}.mini-stats strong{color:#fff}.result-card{display:grid;grid-template-columns:150px 1fr;gap:24px;border:1px solid;border-radius:18px;padding:25px;background:#121625f0}.result-card.success{border-color:#34d39959}.result-card.partial{border-color:#fbbf2459}.score-ring{width:128px;height:128px;border-radius:50%;display:grid;place-content:center;text-align:center;border:8px solid rgba(139,92,246,.24);background:#0d101b}.score-ring strong{font-size:37px}.score-ring span{color:var(--muted);font-size:10px}.result-content h2{font-size:27px;margin:2px 0 14px}.result-content h3{font-size:14px;margin:22px 0 9px}.result-content>p{color:#b1b8d0;line-height:1.75}.check-list{display:flex;gap:8px;flex-wrap:wrap}.check-list span{padding:7px 9px;border-radius:8px;font-size:12px}.check-list .ok{color:#6ee7b7;background:#10b98117}.check-list .no{color:#fda4af;background:#f43f5e17}.solution-code{background:#090b14;border:1px solid var(--line);border-radius:12px;padding:15px;overflow:auto;color:#d9def3;font:13px/1.65 monospace}.result-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:24px}footer{display:flex;justify-content:space-between;padding:28px max(20px,calc((100% - 1180px)/2));border-top:1px solid var(--line);color:#646d8d;font-size:12px}@media(max-width:900px){.hero{grid-template-columns:1fr;gap:30px;padding-top:60px}.terminal-card{transform:none}.challenge-grid{grid-template-columns:repeat(2,1fr)}.workspace{grid-template-columns:1fr}.workspace aside{position:static;grid-template-columns:1fr 1fr}.metrics{grid-template-columns:repeat(2,1fr)}}@media(max-width:620px){.shell{width:min(100% - 24px,1180px)}header{height:62px;padding:0 12px}.brand strong{font-size:14px}header nav span:first-child{display:none}.hero{min-height:auto;padding:48px 0}.hero h1{font-size:43px}.hero p{font-size:16px}.hero-actions{flex-direction:column}.metrics{margin-bottom:75px}.section-title{align-items:start;gap:18px;flex-direction:column}.filters{width:100%}.filters select{width:50%}.challenge-grid{grid-template-columns:1fr}.practice-head{grid-template-columns:100px 1fr 45px}.challenge-heading{padding-top:35px}.workspace aside{grid-template-columns:1fr}.result-card{grid-template-columns:1fr}.score-ring{width:100px;height:100px}.result-actions{flex-direction:column}.result-actions button{width:100%}footer{flex-direction:column;gap:8px}.code-line{font-size:12px}.line-number{width:42px;padding-right:12px}}