:root{--font:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--ink:#1f1f1f;--muted:#6b7280;--bg:#f3f4f6;--panel:#fff;--line:#e5e7eb;--accent:#2563eb;--danger:#dc2626;--radius:8px}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--font);color:var(--ink);background:var(--bg)}button,input,textarea,select{font:inherit}.auth{background:var(--panel);border-radius:var(--radius);gap:12px;max-width:360px;margin:10vh auto;padding:24px;display:grid}.auth-form{gap:8px;display:grid}.auth-form label{gap:4px;display:grid}.auth input{border:1px solid var(--line);border-radius:6px;padding:8px}.auth button{border:1px solid var(--line);background:var(--accent);color:#fff;cursor:pointer;border-radius:6px;padding:10px}.auth button[type=button]{background:var(--panel);color:var(--ink)}.error{color:var(--danger)}.loading{color:var(--muted);padding:24px}.sessions{gap:16px;max-width:720px;margin:0 auto;padding:24px;display:grid}.sessions-header{align-items:center;gap:12px;display:flex}.sessions-header h1{flex:1;margin:0;font-size:22px}.sessions-create{align-items:end;gap:8px;display:flex}.sessions-create label{flex:1;gap:4px;display:grid}.sessions-create input{border:1px solid var(--line);border-radius:6px;padding:8px}.sessions-list{gap:8px;margin:0;padding:0;list-style:none;display:grid}.sessions-list li{background:var(--panel);border-radius:var(--radius);justify-content:space-between;align-items:center;gap:12px;padding:12px;display:flex}.sessions-list li>div{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.sessions-actions a,.sessions-actions button{border:1px solid var(--line);background:var(--panel);color:var(--ink);cursor:pointer;border-radius:6px;padding:6px 10px;text-decoration:none}.badge{background:var(--line);border-radius:999px;padding:2px 8px;font-size:12px}.badge-final{background:#d1fae5}.muted{color:var(--muted);font-size:13px}.board-canvas{touch-action:none;-webkit-user-select:none;user-select:none;background-color:#fafafa;background-image:radial-gradient(circle,#d1d5db 1px,#0000 1px);width:100%;height:100%;position:relative;overflow:hidden}.board-space{transform-origin:0 0;width:0;height:0;position:absolute;top:0;left:0}.card{overflow-wrap:anywhere;cursor:grab;touch-action:none;border:1px solid #0000;border-radius:2px;font-size:16px;line-height:1.25;position:absolute;box-shadow:2px 3px 6px #0000002e}.card-body{text-align:center;justify-content:center;align-items:center;padding:10px;display:flex;position:absolute;inset:0;overflow:hidden}.card.is-selected{outline:2px solid var(--accent);outline-offset:2px}.card.is-editing{cursor:text}.card-text.is-placeholder{color:#1f1f1f73;font-style:italic}.card textarea{resize:none;text-align:center;width:100%;height:100%;font:inherit;color:inherit;background:0 0;border:none;outline:none;padding:0}.card-badge{color:#fff;border-radius:50%;place-items:center;width:18px;height:18px;font-size:10px;font-weight:700;display:grid;position:absolute;bottom:4px;right:4px}.card-connect-handle{background:var(--accent);cursor:crosshair;border:2px solid #fff;border-radius:50%;width:16px;height:16px;margin-top:-8px;padding:0;position:absolute;top:50%;right:-10px}.card-connect-handle:before{content:"";position:absolute;inset:-10px}.lanes-layer,.pivotal-layer{pointer-events:none;position:absolute;inset:0}.lane{background:#ffffff59;border-top:1px solid #d1d5db;border-bottom:1px solid #d1d5db;position:absolute;left:0;right:0}.lane:nth-child(2n){background:#00000006}.lane-label{pointer-events:auto;background:#ffffffeb;border-radius:6px;align-items:center;gap:6px;padding:4px 8px;font-size:14px;font-weight:600;display:flex;position:absolute;top:8px;left:8px}.lane-label button{cursor:pointer;color:var(--muted);background:0 0;border:none;padding:0 2px;font-size:16px;line-height:1}.area.bounded-context{cursor:grab;touch-action:none;background:#6b72800f;border:2px dashed #6b7280;border-radius:12px;position:absolute}.area.bounded-context.is-selected{outline:2px solid var(--accent);outline-offset:2px}.area-label{background:#fff;border-radius:6px;padding:2px 8px;font-size:14px;font-weight:600;position:absolute;top:-14px;left:8px}.area-resize{background:var(--accent);cursor:nwse-resize;border:2px solid #fff;border-radius:4px;width:16px;height:16px;padding:0;position:absolute;bottom:-8px;right:-8px}.pivotal-line{pointer-events:auto;cursor:ew-resize;touch-action:none;border-left:3px dashed #6b7280;width:0;position:absolute;top:0;bottom:0}.pivotal-line.is-selected{border-color:var(--accent)}.pivotal-label{border:1px solid var(--line);white-space:nowrap;background:#fff;border-radius:6px;padding:2px 8px;font-size:13px;position:absolute;top:12px;left:6px}.connector-layer{pointer-events:none;width:1px;height:1px;position:absolute;top:0;left:0;overflow:visible}.connector{pointer-events:auto;cursor:pointer}.connector-hit{fill:none;stroke:#0000;stroke-width:14px}.connector-line{fill:none;stroke:#374151;stroke-width:2.5px}.connector.is-selected .connector-line{stroke:var(--accent)}.connector-label{fill:#374151;paint-order:stroke;stroke:#fafafa;stroke-width:4px;font-size:13px}.connector-preview{stroke:var(--accent);stroke-width:2px;stroke-dasharray:6 4}.marquee{border:1px solid var(--accent);pointer-events:none;background:#2563eb1a;position:absolute}.palette{flex-direction:column;gap:6px;padding:8px;display:flex}.palette-item{border:1px solid var(--line);background:var(--panel);cursor:pointer;text-align:left;border-radius:6px;align-items:center;gap:8px;padding:6px 8px;font-size:13px;display:flex}.palette-item:disabled{opacity:.5;cursor:default}.palette-swatch{border:1px solid #0000;border-radius:2px;flex:none;width:22px;height:16px;box-shadow:1px 1px 2px #0003}.palette-more{color:var(--accent);cursor:pointer;text-align:left;background:0 0;border:none;padding:4px}.toolbar{background:var(--panel);border-bottom:1px solid var(--line);flex-wrap:wrap;align-items:center;gap:10px;padding:6px 12px;display:flex}.toolbar-back{color:var(--ink);font-size:18px;text-decoration:none}.toolbar-title{white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:120px;margin:0;font-size:16px;overflow:hidden}.toolbar-phase{color:var(--muted);align-items:center;gap:6px;font-size:13px;display:flex}.toolbar-group{gap:4px;display:flex}.toolbar button,.selection-toolbar button,.selection-toolbar select,.selection-toolbar input,.toolbar select{border:1px solid var(--line);background:var(--panel);color:var(--ink);cursor:pointer;border-radius:6px;padding:5px 9px;font-size:13px}.toolbar button[aria-pressed=true]{background:var(--accent);color:#fff;border-color:var(--accent)}.toolbar button:disabled{opacity:.4;cursor:default}.selection-toolbar{background:var(--panel);border:1px solid var(--line);z-index:20;border-radius:10px;flex-wrap:wrap;justify-content:center;gap:4px;max-width:calc(100% - 32px);padding:6px;display:flex;position:absolute;bottom:16px;left:50%;transform:translate(-50%);box-shadow:0 4px 16px #0000001f}.selection-toolbar .danger{color:var(--danger)}.sheet-backdrop{z-index:30;background:#0000004d;align-items:flex-end;display:flex;position:fixed;inset:0}.sheet{background:var(--panel);border-radius:16px 16px 0 0;width:100%;max-height:70vh;padding:8px 12px 24px;overflow:auto}.sheet-handle{background:var(--line);border-radius:2px;width:40px;height:4px;margin:4px auto 8px}.sheet-title{margin:0 0 8px;font-size:15px}.board-page{flex-direction:column;height:100%;display:flex}.board-body{flex:1;min-height:0;display:flex}.board-side{background:var(--panel);border-right:1px solid var(--line);width:190px;overflow:auto}.board-main{flex:1;min-width:0;min-height:0;position:relative}.phone-bar{background:var(--panel);border-top:1px solid var(--line);justify-content:space-around;gap:6px;padding:8px;display:flex}.phone-bar button{border:1px solid var(--line);background:var(--panel);border-radius:8px;flex:1;padding:10px 6px;font-size:15px}.phone-bar button[aria-pressed=true]{background:var(--accent);color:#fff}.sheet-structure{flex-wrap:wrap;gap:6px;padding:8px;display:flex}.sheet-structure button,.sheet-phase select{border:1px solid var(--line);background:var(--panel);border-radius:6px;padding:8px 10px}.sheet-phase{align-items:center;gap:8px;padding:8px;display:flex}.toast{color:#fff;z-index:40;background:#111827;border-radius:8px;align-items:center;gap:10px;padding:10px 14px;display:flex;position:fixed;bottom:72px;left:50%;transform:translate(-50%)}.toast button{color:#fff;cursor:pointer;background:0 0;border:none;font-size:16px}@media (width<=768px){.toolbar-group,.toolbar-phase{display:none}.selection-toolbar{bottom:72px}}
