:root{color-scheme:dark;--bg: #0b0e13;--panel: #141922;--border: #262f3b;--text: #e6edf3;--muted: #8b98a5;--accent: #4c8dff;--pos: #22c55e;--neg: #ef4444;--radius: 6px}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:15px/1.5 -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}#root{min-height:100vh}h1{font-size:18px;margin:0}h2{font-size:16px;margin:0 0 8px}h3{font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin:20px 0 8px}p{margin:8px 0}.muted{color:var(--muted)}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}.error{color:var(--neg);margin:8px 0}.pos{color:var(--pos)}.neg{color:var(--neg)}button{background:var(--panel);border:1px solid var(--border);color:var(--text);border-radius:var(--radius);padding:6px 12px;cursor:pointer;font:inherit}button:hover:not(:disabled){border-color:var(--accent)}button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:1px}button:disabled{opacity:.5;cursor:default}button.primary{background:var(--accent);border-color:var(--accent);color:#fff}button.primary:hover:not(:disabled){filter:brightness(1.1)}button.active{border-color:var(--accent);color:var(--accent)}button.danger{border-color:var(--neg);color:var(--neg)}input,textarea{background:var(--bg);border:1px solid var(--border);color:var(--text);border-radius:var(--radius);padding:6px 10px;font:inherit;width:100%}textarea{min-height:60px;resize:vertical}.row{display:flex;gap:8px;margin:8px 0;align-items:center}.row input[type=text],.row input:not([type]){flex:1}.row label{display:flex;align-items:center;gap:4px}.panel,.login-card,.sync-log,.circle-list li,.member-list li,.record-list li,.graph-svg{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius)}.login-wrap{display:grid;place-items:center;min-height:100vh;padding:16px}.login-card{padding:32px;width:360px;display:flex;flex-direction:column;gap:12px}.login-card h1{font-size:20px}.app{max-width:1000px;margin:0 auto;padding:16px}.app-header{display:flex;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid var(--border);margin-bottom:12px}.app-header nav{display:flex;gap:4px}.app-header nav button.active{border-color:var(--accent);color:var(--accent)}.app-header .spacer{flex:1}.sync-log{padding:6px 10px;margin-bottom:12px;max-height:72px;overflow:hidden}.two-col{display:grid;grid-template-columns:260px 1fr;gap:24px}.circle-list,.member-list,.record-list{list-style:none;padding:0;margin:8px 0;display:flex;flex-direction:column;gap:6px}.circle-list li,.member-list li,.record-list li{padding:6px 10px;display:flex;align-items:center;gap:8px}.circle-list li{cursor:pointer}.circle-list li.selected{border-color:var(--accent)}.circle-list li button,.member-list li button,.record-list li button{padding:2px 8px;font-size:12px}.graph-tooltip{position:absolute;pointer-events:none;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:10px 12px;max-width:300px;font-size:13px;z-index:10}.graph-tooltip h4{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin:10px 0 4px}.graph-tooltip ul{list-style:none;margin:0;padding:0}.graph-tooltip li{margin:3px 0}.graph-tooltip p{margin:2px 0}.member-list li span,.record-list li span:first-of-type{flex:1}.badge{font-size:11px;border:1px solid var(--border);border-radius:4px;padding:1px 6px;color:var(--muted)}section{margin-bottom:8px}.graph-wrap{position:relative}.graph-svg{width:100%;height:auto;touch-action:none}.graph-svg line.edge-pos{stroke:#22c55e73;stroke-width:1.5}.graph-svg line.edge-neg{stroke:#ef444473;stroke-width:1.5;stroke-dasharray:4 3}.graph-svg .node{cursor:grab}.graph-svg .node text{fill:var(--muted);font-size:11px;paint-order:stroke;stroke:var(--panel);stroke-width:3px}
