:root{--bg: #f3f5ff;--panel: #ffffff;--ink: #232842;--muted: #7a8099;--line: #e1e5f5;--brand: #6c5ce7;--brand-2: #00b894;--warn: #fdcb6e;--danger: #ff7675;--add: #d9f7e4;--del: #ffe0e0;--radius: 14px;font-family:Segoe UI,system-ui,-apple-system,Microsoft JhengHei,PingFang TC,sans-serif;color:var(--ink)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0;background:var(--bg)}button{font:inherit;cursor:pointer}.muted{color:var(--muted)}.small{font-size:12px}.pad{padding:14px}.splash{height:100%;display:grid;place-items:center;font-size:56px}.error{background:#ffecec;color:#b33;padding:8px 12px;border-radius:10px;margin:8px 0;font-size:14px}.bi{display:inline-flex;flex-direction:column;line-height:1.25}.bi .zh,.bi-inline .zh{color:var(--muted);font-size:.86em}.bi-inline .zh{margin-left:2px}.btn{border:1px solid var(--line);background:#fff;border-radius:10px;padding:6px 12px;transition:transform .08s,box-shadow .12s}.btn:hover{box-shadow:0 2px 8px #6c5ce722}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.primary{background:var(--brand);color:#fff;border-color:var(--brand)}.btn.good{background:var(--brand-2);color:#fff;border-color:var(--brand-2)}.btn.bad{background:#fff;color:#c0392b;border-color:#f2b8b5}.btn.tiny{padding:2px 8px;font-size:12px;border-radius:8px}.btn.big{padding:12px 22px;font-size:18px;border-radius:14px}.join-wrap{height:100%;display:grid;place-items:center;background:radial-gradient(circle at 20% 20%,#dfe4ff,transparent 40%),radial-gradient(circle at 80% 80%,#d5f7ee,transparent 40%)}.join-card{width:380px;background:#fff;padding:28px;border-radius:24px;box-shadow:0 20px 60px #6c5ce733;display:flex;flex-direction:column;gap:12px;text-align:center}.join-card h1{margin:0}.join-card .logo{font-size:56px}.join-card label{display:flex;flex-direction:column;gap:4px;text-align:left;font-size:14px}.join-card input{padding:12px;border:2px solid var(--line);border-radius:12px;font-size:18px}.join-card input:focus{outline:none;border-color:var(--brand)}.ws{height:100%;display:grid;grid-template-columns:300px minmax(380px,1fr) 400px;grid-template-rows:48px 1fr;grid-template-areas:"top top top" "left center right";gap:8px;padding:8px}.ws.compact{grid-template-columns:0 minmax(380px,1fr) 400px}.topbar{grid-area:top;display:flex;align-items:center;gap:12px;background:var(--panel);border-radius:var(--radius);padding:0 14px;box-shadow:0 2px 10px #00000010}.topbar .spacer{flex:1}.topbar .xp{background:#fff4d6;padding:3px 10px;border-radius:99px;font-size:13px}.left{grid-area:left;display:flex;flex-direction:column;gap:8px;min-height:0;overflow:auto}.center{grid-area:center;display:flex;flex-direction:column;gap:8px;min-height:0;min-width:0}.right{grid-area:right;background:var(--panel);border-radius:var(--radius);display:flex;flex-direction:column;min-height:0;box-shadow:0 2px 10px #00000010}.card{background:var(--panel);border-radius:var(--radius);padding:12px;box-shadow:0 2px 10px #00000010}.preview{flex:3;min-height:200px;display:flex;flex-direction:column;background:var(--panel);border-radius:var(--radius);overflow:hidden;box-shadow:0 2px 10px #00000010}.preview-bar{display:flex;align-items:center;gap:8px;padding:6px 10px;background:#eef0fb;border-bottom:1px solid var(--line)}.preview-bar .dots{display:flex;gap:4px}.preview-bar .dots i{width:10px;height:10px;border-radius:50%;background:#ff7675}.preview-bar .dots i:nth-child(2){background:#fdcb6e}.preview-bar .dots i:nth-child(3){background:#55efc4}.preview-bar select{border:1px solid var(--line);border-radius:8px;padding:3px 6px;background:#fff}.live-dot{margin-left:auto;color:#e17055;font-size:12px;animation:pulse 1s infinite}.live-dot:before{content:"● "}@keyframes pulse{50%{opacity:.35}}.preview-frame{flex:1;border:0;width:100%;background:#fff}.editor-pane{flex:2;min-height:150px;display:flex;flex-direction:column;background:var(--panel);border-radius:var(--radius);overflow:hidden;box-shadow:0 2px 10px #00000010}.editor-pane.collapsed{flex:0 0 auto;min-height:0}.tabs{display:flex;gap:2px;background:#eef0fb;padding:4px 6px 0;align-items:center}.tabs button{border:0;background:transparent;padding:6px 12px;border-radius:8px 8px 0 0;color:var(--muted)}.tabs button.on{background:#fff;color:var(--ink);font-weight:600}.tabs .spacer{flex:1}.cm-host{flex:1;min-height:0;overflow:hidden}.cm-host .cm-editor{height:100%}.peek{padding:24px;text-align:center;color:var(--muted)}.filetree{background:var(--panel);border-radius:var(--radius);padding:10px;box-shadow:0 2px 10px #00000010}.ft-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.filetree ul{list-style:none;margin:0;padding:0}.filetree li{display:flex;justify-content:space-between;align-items:center;padding:5px 8px;border-radius:8px;cursor:pointer;font-size:14px}.filetree li:hover{background:#f1f3ff}.filetree li.on{background:#e6e2ff;font-weight:600}.filetree .ft-actions{display:none}.filetree li:hover .ft-actions{display:inline}.filetree .ft-actions button{border:0;background:transparent;padding:0 3px}.chg{color:#e17055;font-style:normal;font-size:10px}.console{height:100%;display:flex;flex-direction:column;font-family:Consolas,monospace;font-size:13px}.console-head{display:flex;justify-content:space-between;padding:6px 10px;border-bottom:1px solid var(--line);font-family:inherit}.console-body{flex:1;overflow:auto;padding:8px 10px}.cl{padding:2px 0;white-space:pre-wrap}.cl.error{color:#c0392b}.cl.warn{color:#b7791f}.mission{background:var(--panel);border-radius:var(--radius);padding:12px;box-shadow:0 2px 10px #00000010}.mission h3{margin:0 0 4px}.mission .story{background:#f6f3ff;padding:8px 10px;border-radius:10px;font-size:14px;margin:8px 0}.steps{list-style:none;padding:0;margin:8px 0;display:flex;flex-direction:column;gap:4px}.steps li{display:flex;gap:8px;align-items:center;padding:6px 8px;border-radius:10px;font-size:14px;background:#f7f8fe;cursor:pointer}.steps li.cur{background:#e6e2ff;font-weight:600}.steps li.done{background:#e1f8ec}.checks{margin:8px 0;padding:0;list-style:none;font-size:13px}.checks li{padding:2px 0}.checks .ok{color:#1e8e5a}.checks .no{color:#999}.scaffold{background:#fffbe6;border:1px dashed #e5c84a;padding:8px;border-radius:10px;font-size:13px;white-space:pre-wrap;margin:8px 0}.hintbox{background:#eefaf6;border-radius:10px;padding:8px;margin:6px 0;font-size:13px}.badges-row{display:flex;flex-wrap:wrap;gap:6px}.badge-chip{background:#fff4d6;border-radius:99px;padding:3px 10px;font-size:12px}.badge-chip.off{filter:grayscale(1);opacity:.45}.pop{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:#0006;z-index:50}.pop .box{background:#fff;padding:24px 32px;border-radius:22px;text-align:center;max-width:440px;animation:bounce .4s}.pop .big:not(.btn){font-size:64px}@keyframes bounce{0%{transform:scale(.6)}70%{transform:scale(1.06)}to{transform:scale(1)}}.chat-head{display:flex;align-items:center;gap:6px;padding:8px 10px;border-bottom:1px solid var(--line)}.modes{display:flex;background:#eef0fb;border-radius:10px;padding:2px}.modes button{border:0;background:transparent;padding:4px 10px;border-radius:8px;font-size:13px}.modes button.on{background:#fff;box-shadow:0 1px 4px #0002;font-weight:600}.modes button:disabled{opacity:.35;cursor:not-allowed}.chat-log{flex:1;overflow:auto;padding:10px;display:flex;flex-direction:column;gap:10px;min-height:0}.msg{max-width:94%;padding:8px 12px;border-radius:14px;font-size:14px;line-height:1.45;white-space:pre-wrap;word-break:break-word}.msg.user{align-self:flex-end;background:var(--brand);color:#fff;border-bottom-right-radius:4px}.msg.ai{align-self:flex-start;background:#f1f3ff;border-bottom-left-radius:4px}.msg.sys{align-self:center;background:#fff7dc;font-size:12px}.msg code{background:#0001;padding:0 4px;border-radius:4px}.chat-input{border-top:1px solid var(--line);padding:8px;display:flex;flex-direction:column;gap:6px;position:relative}.chat-input textarea{resize:none;border:2px solid var(--line);border-radius:12px;padding:8px 10px;font:inherit;min-height:64px}.chat-input textarea:focus{outline:none;border-color:var(--brand)}.chat-row{display:flex;gap:6px;align-items:center}.chat-row .spacer{flex:1}.chips{display:flex;flex-wrap:wrap;gap:4px}.chip{background:#eef0fb;border-radius:99px;padding:2px 8px;font-size:12px}.mention-pop{position:absolute;bottom:100%;left:8px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 6px 20px #0002;padding:4px;z-index:10;max-height:200px;overflow:auto}.mention-pop button{display:block;width:100%;text-align:left;border:0;background:transparent;padding:4px 10px;border-radius:6px}.mention-pop button:hover,.mention-pop button.on{background:#e6e2ff}.activity{display:flex;gap:10px;align-items:center;padding:8px 12px;background:linear-gradient(90deg,#efeaff,#e6fbf4);border-radius:14px;font-size:13px}.activity .robot{font-size:28px;animation:wobble 1s infinite}@keyframes wobble{0%,to{transform:rotate(-6deg)}50%{transform:rotate(6deg) translateY(-2px)}}.stages{display:flex;gap:4px;margin-top:2px}.stages span{font-size:11px;padding:1px 7px;border-radius:99px;background:#fff8;color:var(--muted)}.stages span.on{background:var(--brand);color:#fff}.stages span.past{background:#c9f1e2;color:#1e8e5a}.toolline{font-size:12px;color:var(--muted);padding:2px 6px}.plan{background:#f6f3ff;border-radius:14px;padding:10px}.plan ol{margin:6px 0;padding-left:0;list-style:none;display:flex;flex-direction:column;gap:4px}.plan li{display:flex;gap:6px;align-items:center;background:#fff;border-radius:10px;padding:4px 8px;font-size:13px}.plan li input[type=text]{flex:1;border:1px solid transparent;border-radius:6px;padding:2px 4px;font:inherit;background:transparent}.plan li input[type=text]:focus{border-color:var(--brand);outline:none;background:#fff}.plan li.done{background:#e1f8ec}.plan li.cur{outline:2px solid var(--brand)}.ask-card{background:#fff7dc;border-radius:14px;padding:10px}.ask-card .opts{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}.review{background:#fffdf5;border:2px solid #f6d365;border-radius:14px;padding:8px}.review-head{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.review-head .spacer{flex:1}.rfile{margin-top:6px;background:#fff;border-radius:10px;overflow:hidden;border:1px solid var(--line)}.rfile-head{display:flex;align-items:center;gap:6px;padding:4px 8px;background:#f1f3ff;font-size:13px;cursor:pointer}.rfile-head .spacer{flex:1}.diff{font-family:Consolas,monospace;font-size:12px}.dl{padding:0 8px;white-space:pre-wrap;word-break:break-all}.dl.add{background:var(--add)}.dl.del{background:var(--del);text-decoration:line-through;text-decoration-color:#e17055aa}.dl.same{color:#889}.dblock{position:relative;border-left:3px solid transparent}.dblock.chg{border-left-color:#e17055;margin:2px 0}.dblock .bact{display:flex;gap:4px;padding:2px 8px;background:#fff3e0}.quiz{background:#eef6ff;border-radius:12px;padding:10px;margin-top:8px}.quiz .opts{display:flex;flex-direction:column;gap:4px;margin-top:6px}.quiz .opts button.right{background:#c9f1e2}.quiz .opts button.wrong{background:#ffd9d9}.timeline{padding:10px;display:flex;flex-direction:column;gap:6px;overflow:auto;height:100%}.cp{display:flex;align-items:center;gap:8px;background:#f7f8fe;padding:6px 10px;border-radius:10px;font-size:13px}.cp .spacer{flex:1}.t-wrap{max-width:1200px;margin:0 auto;padding:20px}.t-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}.sc{background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 2px 10px #0001;display:flex;flex-direction:column}.sc.locked{outline:3px solid var(--danger)}.sc-frame{width:100%;height:170px;border:0;background:#fff;pointer-events:none}.sc-body{padding:8px 10px;font-size:13px;display:flex;flex-direction:column;gap:4px}.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.row .spacer{flex:1}.field{display:flex;flex-direction:column;gap:3px;font-size:13px}.field input,.field textarea,.field select{border:1px solid var(--line);border-radius:8px;padding:6px 8px;font:inherit}table.t{width:100%;border-collapse:collapse;font-size:13px}table.t td,table.t th{padding:6px 8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}@media(max-width:1100px){.ws{grid-template-columns:240px 1fr 340px}}@media print{.no-print{display:none!important}}a.btn{text-decoration:none;color:inherit;display:inline-block}
