:root { color-scheme: dark; font-family: Manrope, ui-sans-serif, system-ui, sans-serif; background:#071923; color:#f1f7f7; }
* { box-sizing: border-box; }
body { margin:0; min-width:320px; background:radial-gradient(circle at 78% -10%, #174652 0, transparent 38%), #071923; }
button { font:inherit; }
.app { max-width:1500px; margin:0 auto; padding:38px 30px 32px; }
.topbar { display:flex; align-items:flex-end; justify-content:space-between; gap:25px; margin-bottom:30px; }
.eyebrow { color:#73dbad; font:500 11px 'DM Mono', monospace; letter-spacing:.12em; text-transform:uppercase; margin:0 0 8px; }
h1 { font-size:clamp(28px, 4vw, 43px); line-height:1.02; letter-spacing:-.055em; margin:0; }
.law-link { color:inherit; text-decoration:none; }.law-link:hover { color:#9af0c0; text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:5px; }
.subtitle { margin:9px 0 0; color:#93acb4; font-size:14px; }
.scenario { display:flex; align-items:center; gap:9px; color:#b4c8ca; font:12px 'DM Mono', monospace; }
.live-dot { width:8px; height:8px; border-radius:99px; background:#72e5ad; box-shadow:0 0 0 5px #72e5ad20; }
.workspace { display:grid; grid-template-columns:minmax(0, 1fr) 310px; gap:22px; align-items:start; }
.pitch-card, .panel { border:1px solid #234450; background:#0b222e; border-radius:18px; overflow:hidden; box-shadow:0 20px 55px #0000002e; }
.pitch-head { display:flex; justify-content:space-between; align-items:center; padding:14px 17px 12px; border-bottom:1px solid #1c3c48; }
.pitch-title { font-size:13px; font-weight:700; }
.hint { color:#809aa3; font:11px 'DM Mono', monospace; }
.pitch-wrap { position:relative; padding:15px; background:#09202b; }
.pitch { display:block; width:100%; height:auto; border-radius:10px; overflow:hidden; cursor:crosshair; touch-action:none; user-select:none; }
.draggable-node { cursor:grab; }
.draggable-node:hover { filter:drop-shadow(0 0 6px rgba(255,217,105,.35)); }
.legend { display:flex; flex-wrap:wrap; gap:13px; padding:13px 17px; background:#0d2733; color:#9db4b9; font-size:11px; }
.legend span { display:flex; align-items:center; gap:6px; }
.swatch { width:9px; height:9px; border-radius:50%; display:inline-block; }.coral{background:#ff765e}.blue{background:#62b4ff}.white{background:#eef6f4}.line{width:16px;height:2px;border-radius:0;background:#ffd969}
.sidebar { display:flex; flex-direction:column; gap:14px; }
.panel { padding:18px; }
.panel h2 { font-size:13px; letter-spacing:-.01em; margin:0 0 13px; }.panel p { color:#91a8ae; font-size:12px; line-height:1.55; margin:0; }
.score { position:relative; background:linear-gradient(145deg,#163842,#0c2b34); border-color:#2b5d62; min-height:122px; }
.score-label { font:500 10px 'DM Mono',monospace; letter-spacing:.11em; text-transform:uppercase; color:#93bcb2; }
.verdict { font-size:22px; letter-spacing:-.045em; font-weight:800; margin:7px 0 4px; }.yes{color:#ff8d73}.no{color:#75e1ad}.neutral{color:#e6f0ee}
.status-note { max-width:245px; }
.team-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.team-button,.tool-button,.small-button { border:1px solid #31505a; background:#102d38; color:#dce9e6; border-radius:9px; min-height:40px; cursor:pointer; transition:.15s ease; }
.team-button:hover,.tool-button:hover,.small-button:hover { border-color:#7fa7a8; transform:translateY(-1px); }
.team-button.active { color:#fff; border-color:#ffe1a3; background:#594b32; }
.team-button { text-align:left; padding:11px 12px; font-weight:700; font-size:12px; }
.team-button small{display:block;color:#91a9ad;font-weight:500;font-size:10px;margin-top:2px}
.tool-stack { display:grid; gap:8px; }
.tool-stack.primary-tools { grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); }
.tool-button { padding:12px 12px; text-align:center; font-size:12px; white-space:normal; min-height:44px; }
.tool-button.active { border-color:#82e0b1; background:#164239; color:#c8f9e0; }
.tool-button.danger { color:#ffad9d; }
.share-panel { padding:18px 18px 22px; background:#071b24; border-top:1px solid #19414e; display:flex; justify-content:center; }
.share-button { width:100%; max-width:320px; border:1px solid #76f0b6; background:linear-gradient(180deg,#2cffc6 0%,#14a27e 100%); color:#05251f; border-radius:14px; padding:16px 20px; font:600 15px Manrope, sans-serif; cursor:pointer; box-shadow:0 18px 40px rgba(23, 154, 121, 0.18); transition:.18s ease; display:inline-flex; align-items:center; justify-content:center; gap:10px; }
.share-button:hover { transform:translateY(-1px); box-shadow:0 22px 45px rgba(23, 154, 121, 0.26); }
.selection { padding:12px 12px; border-radius:10px; background:#071b24; border:1px solid #1e414b; margin:14px 0; font:11px 'DM Mono',monospace; color:#a9c2c2; }
.selection strong{color:#f4f7ec;font-weight:500}
.divider { border:0; border-top:1px solid #1d3d47; margin:16px 0; }
.rules { display:grid; gap:9px; margin-top:12px; }
.rule { display:flex; align-items:center; gap:9px; color:#9db2b6; font-size:11px; }
.rule b{width:20px;height:20px;border:1px solid #31515a;border-radius:50%;display:grid;place-items:center;color:#d5e9e4;font:10px 'DM Mono',monospace}
.panel-section { padding:14px 0; border-bottom:1px solid #193540; }
.panel-section:last-child { border-bottom:none; }
.panel-section h3 { margin:0 0 12px; color:#86a8ae; font:500 11px 'DM Mono',monospace; letter-spacing:.12em; text-transform:uppercase; }
.intent-copy { margin:0 0 14px; color:#9bb0b6; line-height:1.65; }
.intent-summary { display:grid; gap:8px; margin:0 0 12px; }
.intent-item { display:flex; justify-content:space-between; align-items:center; padding:12px 14px; border:1px solid #1f4f5d; border-radius:16px; background:#08232d; }
.intent-label { color:#7ba2ad; font:11px 'DM Mono',monospace; letter-spacing:.11em; text-transform:none; margin-right:12px; }
.intent-value { color:#f1f7f7; font-weight:700; }
.player-outcome-tag { font-size:7px; fill:#ffd969; }
.scenario-steps { display:grid; gap:10px; margin:0 0 12px; }
.scenario-step { display:grid; gap:6px; padding:14px 12px; border:1px solid #1f4f5d; border-radius:16px; background:#08232d; }
.scenario-step small { color:#7fa9b0; }
.scenario-step strong { color:#e7f5f0; }
.outcome-title { margin:0 0 10px; color:#89a5aa; font:500 10px 'DM Mono',monospace; letter-spacing:.1em; }
.outcome-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:8px; margin-bottom:14px; }
.outcome-button { border:1px solid #2d4c57; background:#0d2733; color:#b2c5c7; border-radius:10px; padding:12px 10px; font:11px Manrope, sans-serif; cursor:pointer; text-align:center; min-height:46px; white-space:normal; }
.outcome-button.active { background:#493f25; border-color:#ffe07b; color:#fff1bf; }
.footer-note { color:#668188; font-size:10px; text-align:center; margin-top:15px; }
@media (max-width: 1000px) { .workspace{grid-template-columns:1fr}.sidebar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.score{grid-column:span 2} }
@media (max-width: 620px) { .app{padding:24px 14px}.topbar{align-items:flex-start;flex-direction:column;margin-bottom:20px}.sidebar{display:flex}.score{min-height:0}.pitch-wrap{padding:8px}.hint{display:none} }