:root{--bg: #0c0d11;--bg-2: #12141a;--surface: #1b1e27;--surface-2: #15181f;--line: rgba(232, 184, 109, .32);--gold: #e8b86d;--gold-deep: #c9924a;--ink: #f4f0e6;--muted: #9c9689;--quiet: #6f6a60;--teal: #2ec4b6;--danger: #d46a6a;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--font: "SF Pro Text", -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}button,input,textarea,select{font-family:inherit;font-size:14px}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}.app{height:100%;display:grid;grid-template-rows:64px 1fr;grid-template-columns:1fr}.topbar{grid-column:1 / -1;display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding:0 20px;border-bottom:1px solid rgba(244,240,230,.08);background:#0e1015}.brand{display:flex;align-items:baseline;gap:12px;min-width:0}.brand b{font-size:16px;font-weight:600;letter-spacing:.04em}.brand span{color:var(--muted);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.actions{display:flex;align-items:center;gap:8px;flex-shrink:0}.btn{height:36px;padding:0 14px;border-radius:8px;border:1px solid transparent;background:transparent;color:var(--ink)}.btn-primary{background:var(--gold);color:#1b1408;font-weight:600}.btn-primary:hover{background:#f0c782}.btn-secondary{border-color:#f4f0e629;background:transparent;color:var(--ink)}.btn-secondary:hover{border-color:var(--gold);color:var(--gold)}.btn-ghost{color:var(--muted)}.btn-ghost:hover{color:var(--ink)}.btn-danger{color:var(--danger);border-color:#d46a6a59}.btn-danger:hover{background:#d46a6a1f}.btn-sm{height:32px;padding:0 10px;font-size:13px}.stage{overflow:auto;position:relative;cursor:grab;background:radial-gradient(900px 420px at 8% 0%,rgba(232,184,109,.08),transparent 55%),radial-gradient(800px 400px at 92% 100%,rgba(46,196,182,.07),transparent 50%),var(--bg)}.stage.panning{cursor:grabbing}.board{position:relative;min-width:1560px;min-height:860px;padding:28px 40px 32px}.hero{max-width:920px}.hero-btn{display:block;width:100%;text-align:left;background:none;border:none;color:inherit;padding:0;cursor:pointer}.hero-btn:hover h1{color:var(--gold)}.kicker{color:var(--gold);letter-spacing:.28em;font-size:12px;font-weight:500}.hero h1{margin:8px 0 0;font-size:32px;line-height:1.2;font-weight:600;letter-spacing:.02em}.hero p{margin:10px 0 0;color:var(--muted);font-size:15px;line-height:1.55;max-width:820px}.canvas{position:relative;margin-top:20px;height:500px}.spine-svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.card{position:absolute;width:248px;min-height:128px;padding:16px 18px 14px;background:linear-gradient(180deg,#1d212b,#15181f);border:1px solid var(--line);border-radius:16px;box-shadow:0 16px 36px #00000061;text-align:left;color:inherit}.card:hover{border-color:#e8b86d8c}.card.selected{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold),0 16px 36px #00000061}.card.io{width:188px;background:#161920;border-color:#f4f0e629}.card.out{width:188px;background:linear-gradient(180deg,#efc37a,#d19a48);border:none;color:#1b1408}.card .tag{font-size:12px;letter-spacing:.16em;color:var(--gold);margin-bottom:8px}.card.out .tag{color:#5c3e14}.card.io .tag{color:#a8a296}.card .name{font-size:22px;font-weight:600;line-height:1.25}.card .hint{margin-top:8px;font-size:13px;color:var(--muted)}.card.out .name,.card.out .hint{color:#1b1408}.card .metric{margin-top:14px;font-size:13px;color:var(--teal)}.chip{position:absolute;z-index:2;min-width:44px;height:32px;padding:0 10px;border-radius:16px;background:var(--bg);border:1.5px solid var(--gold);color:var(--gold);font-size:13px;font-weight:600;display:flex;align-items:center;justify-content:center}.add-on-spine{position:absolute;z-index:3;width:28px;height:28px;border-radius:50%;border:1px solid var(--gold);background:var(--bg);color:var(--gold);font-size:18px;line-height:1;display:flex;align-items:center;justify-content:center;padding:0}.add-on-spine:hover{background:var(--gold);color:#1b1408}.fb{margin-top:8px;border:1px solid rgba(46,196,182,.3);border-radius:20px;background:#2ec4b60f;padding:22px 24px 18px}.fb-head{display:flex;justify-content:space-between;gap:16px;align-items:baseline}.fb h2{margin:0;font-size:18px;font-weight:600;color:var(--teal);letter-spacing:.04em}.fb .note{color:#8fbbb4;font-size:13px}.extras{margin-top:16px;display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:10px}.extra{border:1.5px dashed rgba(232,184,109,.45);border-radius:12px;padding:12px;background:#0c0d1173;text-align:left;color:inherit;min-height:112px}.extra.selected{border-color:var(--gold);background:#e8b86d14}.extra b{display:block;font-size:14px;margin-bottom:6px}.extra span{color:var(--muted);font-size:13px;line-height:1.4}.rule{margin-top:14px;color:var(--muted);font-size:14px}.fb-actions{margin-top:12px}.inspector{position:fixed;top:64px;right:0;bottom:0;width:min(360px,100%);z-index:8;border-left:1px solid rgba(244,240,230,.08);background:#101218f5;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);overflow:auto;padding:20px 20px 32px;box-shadow:-16px 0 40px #00000047}.inspector-head,.inspector>h2{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 4px}.inspector h2{margin:0;font-size:18px;font-weight:600}.inspector .lead{color:var(--muted);margin:0 0 20px;font-size:13px}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}.field span{font-size:12px;color:var(--muted)}.field em{color:var(--danger);font-style:normal}.field input,.field textarea,.field select{width:100%;border:1px solid rgba(244,240,230,.12);background:#171a22;color:var(--ink);border-radius:8px;padding:10px 12px;outline:none}.field textarea{min-height:84px;resize:vertical}.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--gold)}.row-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.inspector-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.save-hint{margin-top:24px;color:var(--quiet);font-size:12px;line-height:1.5}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%);background:#1d212b;border:1px solid var(--line);color:var(--ink);padding:10px 16px;border-radius:999px;z-index:20}.confirm{position:fixed;top:0;right:0;bottom:0;left:0;background:#08090ca3;display:grid;place-items:center;z-index:30}.confirm-box{width:min(420px,calc(100% - 32px));background:#161920;border:1px solid rgba(244,240,230,.12);border-radius:16px;padding:22px}.confirm-box h3{margin:0 0 8px;font-size:18px}.confirm-box p{margin:0 0 18px;color:var(--muted)}.confirm-actions{display:flex;justify-content:flex-end;gap:8px}@media (max-width: 980px){.app{grid-template-rows:56px 1fr}.topbar{padding:0 12px}.brand span{display:none}.inspector{top:auto;left:0;width:100%;height:46vh;border-left:none;border-top:1px solid rgba(244,240,230,.08)}.extras{grid-template-columns:repeat(2,minmax(0,1fr))}.hero h1{font-size:24px}.board{padding:24px 20px 28px}.actions .btn-secondary:nth-of-type(1){display:none}}