:root{color-scheme:light;--bg:#f3f1e9;--paper:#fffef8;--ink:#193b43;--muted:#687e7f;--line:#cdd8d3;--blue:#235e69;--lime:#dce9b5;--red:#ad493d;--gold:#e7b85a}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--bg);font:14px/1.65 "Segoe UI","Microsoft YaHei",sans-serif}button,select,input{font:inherit}button,select{color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:6px;min-height:42px;padding:8px 13px}button{cursor:pointer}button:hover{border-color:var(--blue);background:#eaf0e5}button:disabled{opacity:.45;cursor:default}:focus-visible{outline:3px solid #a77515;outline-offset:3px}a{color:inherit;text-decoration:none}header{max-width:1450px;padding:22px 4%;margin:auto;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}header a{font-size:12px;letter-spacing:2px}header button{background:none;border:none;font-size:12px}main{max-width:1450px;padding:0 4%;margin:auto}.intro{padding:40px 0 32px}.eyebrow{font-size:10px;letter-spacing:2.5px;font-weight:600;color:var(--blue);margin:0 0 12px}h1{font-size:42px;letter-spacing:3px;line-height:1.35;margin:0 0 12px;font-weight:500}h1 span{font-weight:300;color:#a6bcb5;margin:0 10px}h1 small{font-size:18px;letter-spacing:1px}.intro>p:last-child{color:var(--muted);margin:0}.workspace{display:grid;grid-template-columns:220px minmax(0,1fr);gap:35px;align-items:start}h2{font-size:23px;font-weight:500;margin:0 0 10px}h3{font-size:16px;font-weight:600;margin:0}.lessons{padding:20px 0}.lessons h2{font-size:20px}.lessons>#progress{font-size:12px;color:var(--muted)}nav{display:grid;gap:6px;margin-top:24px}.lesson{display:flex;gap:12px;align-items:center;text-align:left;background:none;border-color:transparent;font-size:13px;padding:12px}.lesson .number{font-family:Georgia,serif;font-size:16px;color:var(--muted)}.lesson .done{margin-left:auto}.lesson.active{background:var(--lime);border-color:#bdcd91}.definitions{margin-top:32px;border-top:1px solid var(--line);padding-top:22px;font-size:12px;color:var(--muted)}.definitions b{font-size:11px;color:var(--ink)}.definitions small{font-size:11px}.work{padding:28px;background:var(--paper);border:1px solid var(--line);border-radius:12px;box-shadow:0 15px 45px #173b4310}.lesson-head{display:flex;justify-content:space-between;gap:15px}.lesson-head p:last-child{color:var(--muted);font-size:13px;margin:0}.lesson-head .eyebrow{font-size:9px;margin-bottom:5px}#badge{white-space:nowrap;align-self:start;background:#e6ede9;border-radius:30px;padding:5px 12px;font-size:11px}details{margin:20px 0;background:#eef2e8;padding:12px 16px;border-radius:7px;font-size:12px}summary{cursor:pointer;font-weight:600}details p{margin:8px 0 0;color:var(--muted)}.live{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:23px 0 4px}#switches{display:flex;gap:10px}.switch{width:83px;display:flex;align-items:center;justify-content:space-between;background:#eef1ec;font-size:14px}.switch.on{background:var(--lime);border-color:#96af63}.switch strong{font:24px Georgia,serif}.beacon{display:flex;gap:12px;align-items:center}.beacon span{font-size:45px;color:#9ab0ac;line-height:1}.beacon span.on{color:#a57619;text-shadow:0 0 20px #efc55b88}.beacon small{display:block;color:var(--muted);font-size:10px}.beacon strong{font:24px Georgia,serif}#live-status{font-size:12px;color:var(--muted);min-height:20px;margin:8px 0 18px}.schematic{background:#153b44;border-radius:9px;padding:16px;color:#c3d4cf;overflow:hidden}#diagram svg{display:block;width:100%;max-height:500px;min-height:160px}.schematic p{font-size:10px;margin:10px 0 0;text-align:center;color:#b4c8c4}.builder-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:25px 0 12px}#node-count{font-size:11px;color:var(--muted);font-weight:400}.history{display:flex;gap:6px}.history button{font-size:11px;padding:6px 10px;min-height:36px}.palette{display:flex;gap:7px;flex-wrap:wrap}.palette button{font-size:12px}.nodes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}.node{border:1px solid var(--line);border-radius:7px;padding:13px;background:#f7f8f0}.node-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.node-head b{font-size:12px}.node-head button{font-size:10px;min-height:30px;padding:3px 7px;border:0;background:none;color:var(--red)}.node label{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:7px 0;font-size:11px}.node select{width:70%;min-width:0;padding:6px;font-size:12px}.empty{color:var(--muted);font-size:12px;grid-column:1/-1;margin:8px 0}.output-label{display:flex;align-items:center;gap:15px;background:#eaf0de;padding:14px;border-radius:6px;margin:15px 0;font-size:13px}.output-label select{flex:1;min-width:0}.actions{display:flex;gap:9px;flex-wrap:wrap;margin:16px 0}.actions button{font-size:12px}.primary{background:var(--blue);border-color:var(--blue);color:#fff}.primary:hover{background:#164c57;color:#fff}.results{border-top:1px solid var(--line);margin-top:25px;padding-top:22px}.results>p{color:var(--muted);font-size:12px}.results.pass{border-top-color:#91ad57}.results.fail #result-title{color:var(--red)}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;font-size:12px;text-align:center}th{background:#e9eee4;font-weight:500}td,th{padding:9px;border-bottom:1px solid var(--line)}tr.bad td{background:#fff0e8;color:var(--red)}#result-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}#result-actions button{font-size:11px}footer{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);padding:25px 0;margin-top:20px}.warning{background:#fff0d6;border:1px solid #bf9854;padding:16px;border-radius:7px;margin-bottom:20px}.warning p{margin-top:0}.warning button{font-size:12px;margin-right:10px}dialog{background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:12px;width:min(520px,calc(100% - 30px));max-height:90dvh;overflow:auto;padding:25px}dialog::backdrop{background:#153b44b8}.dialog-head{display:flex;justify-content:space-between;align-items:start}.dialog-head button{border:0;background:none}dialog p{font-size:13px}.muted{color:var(--muted);font-size:12px}.contrast{display:flex;justify-content:space-between;align-items:center;padding:13px 0;border-bottom:1px solid var(--line)}.contrast input{width:22px;height:22px;accent-color:var(--blue)}.danger{color:var(--red);background:none;border:0;padding-left:0;font-size:12px}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);max-width:90%;background:var(--blue);color:#fff;padding:12px 20px;border-radius:8px;font-size:12px;z-index:5}#toast:empty{display:none}[hidden]{display:none!important}.high{--ink:#052631;--muted:#35565c;--line:#819894}.high button{border-width:2px}@media(max-width:900px){.workspace{grid-template-columns:180px minmax(0,1fr);gap:20px}.work{padding:20px}.nodes{grid-template-columns:1fr}h1 small{display:block;margin-top:10px}h1 span{display:none}}
@media(max-width:650px){header{padding:15px 5%}header a{font-size:9px;letter-spacing:1px}header button{font-size:10px}main{padding:0 5%}.intro{padding:26px 0 10px}h1{font-size:34px}h1 small{font-size:14px}.intro>p:last-child{font-size:12px}.eyebrow{font-size:8px;letter-spacing:2px}.workspace{display:block}.lessons{padding:12px 0 20px}.lessons>.eyebrow,.lessons>h2,.definitions{display:none}.lessons>#progress{margin:0 0 10px;font-size:10px}nav{grid-template-columns:repeat(7,1fr);gap:4px;margin:0}.lesson{padding:6px 3px;justify-content:center;border-color:var(--line);position:relative;min-height:40px}.lesson .name{display:none}.lesson .number{font-size:13px}.lesson .done{position:absolute;right:2px;top:0;font-size:8px}.work{padding:18px 13px}.lesson-head{gap:8px}.lesson-head h2{font-size:22px}.lesson-head p:last-child{font-size:12px}#badge{font-size:9px;padding:4px 7px}.live{gap:8px}#switches{gap:5px}.switch{width:59px;padding:6px 8px;font-size:12px}.switch strong{font-size:21px}.beacon{gap:5px}.beacon span{font-size:30px}.beacon strong{font-size:20px}details{padding:10px;font-size:11px}.schematic{padding:8px}.schematic p{font-size:9px}.palette{gap:5px}.palette button{flex:1 1 45%;font-size:11px;padding:6px}#diagram svg{min-height:130px}.history button{padding:5px 7px}.builder-head h3{font-size:14px}.node{padding:12px}.actions button{font-size:11px}th,td{padding:7px 5px}footer{display:block}footer span{display:block;margin:5px 0}}