
:root{font-family:Inter,Segoe UI,Arial,sans-serif;color:#ededf1;background:#19191e;font-synthesis:none;color-scheme:dark}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer}button,input,select,textarea{border:1px solid #414149;border-radius:10px;background:#2b2b33;color:inherit;padding:10px 13px}button:hover{background:#3a3a44}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #c9f36a;outline-offset:3px}button.active,.primary{background:#c9f36a;color:#202516;border-color:#c9f36a}.danger{color:#ff9d9d}#app{height:100dvh;min-height:420px;position:relative;overflow:hidden}.top{position:absolute;z-index:3;top:20px;left:24px;right:24px;display:flex;align-items:center;gap:12px;pointer-events:none}.top>*{pointer-events:auto}.brand{font-size:22px;font-weight:750;margin-right:12px;letter-spacing:-1px}.brand span{color:#c9f36a}.spacer{flex:1}.surface{background:#24242cee;border:1px solid #3b3b44;box-shadow:0 8px 32px #0003;border-radius:14px}.search{width:220px}.tools{position:absolute;left:24px;top:94px;padding:7px;display:flex;flex-direction:column;gap:5px;z-index:3}.tools button{border:0;text-align:left}.bottom{position:absolute;bottom:22px;left:24px;right:24px;display:flex;align-items:center;gap:12px;z-index:3;pointer-events:none}.bottom>*{pointer-events:auto}.hint{color:#a3a3b2;font-size:13px}.zoom{display:flex;align-items:center;padding:5px;gap:8px}.zoom button{border:0;background:none}.legend{display:flex;gap:16px;padding:13px 17px;font-size:13px}.legend i{display:inline-block;width:18px;height:3px;vertical-align:middle;margin-right:6px}.status{font-size:13px;color:#b8b8c5;max-width:260px}#canvas{width:100%;height:100%;touch-action:none;user-select:none;display:block;cursor:grab}#canvas.dragging{cursor:grabbing}.node{cursor:grab}.node circle.ring{fill:#292932;stroke:#555563;stroke-width:3}.node.selected circle.ring{stroke:#c9f36a;stroke-width:4}.node text{fill:#f3f3f6;font-size:15px;font-weight:600;pointer-events:none;paint-order:stroke;stroke:#19191e;stroke-width:5px;stroke-linejoin:round}.node text.sub{fill:#aaaabb;font-size:12px;font-weight:400}.edge{cursor:pointer}.edge .hit{stroke:transparent;stroke-width:20;fill:none}.edge .line{fill:none;stroke-width:2.5;pointer-events:none}.edge.selected .line{stroke-width:5}.edge text{font-size:12px;fill:#dadae5;paint-order:stroke;stroke:#19191e;stroke-width:5px;stroke-linejoin:round}.muted{opacity:.18}.panel{position:absolute;right:24px;top:88px;bottom:90px;width:320px;z-index:4;padding:22px;overflow:auto}.panel h2{font-size:21px;margin:0 0 22px}.panel label{display:block;font-size:14px;color:#bdbdca;margin:15px 0}.panel input,.panel textarea,.panel select{display:block;width:100%;margin-top:7px}.panel textarea{min-height:80px;resize:vertical}.panel .actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}.close{float:right;border:0;padding:3px 9px;background:none;font-size:23px}.empty{position:absolute;left:50%;top:43%;transform:translate(-50%,-50%);text-align:center;max-width:420px}.empty h1{font-size:32px;letter-spacing:-1px}.empty p{color:#aaaabb;line-height:1.6}.table-wrap{position:absolute;inset:90px 24px 90px 170px;overflow:auto;padding:20px;z-index:2}table{border-collapse:collapse;width:100%;font-size:14px}td,th{text-align:left;padding:14px;border-bottom:1px solid #41414d}th{color:#a6a6b5;font-weight:500}.toast{position:absolute;bottom:90px;left:50%;transform:translateX(-50%);z-index:8;padding:14px 20px;max-width:90vw}.connection{font-size:14px;line-height:1.5;color:#bdbdca}.photo-preview{width:86px;height:86px;border-radius:50%;object-fit:cover}.linktype{position:absolute;left:170px;top:94px;z-index:3;padding:12px;max-width:270px}.linktype p{font-size:13px;color:#bdbdca;margin:10px 0 0}.thinking .node .portrait{animation:breathe 2.1s ease-in-out infinite;transform-box:fill-box;transform-origin:center}.thinking .node:nth-child(3n) .portrait{animation-delay:-.7s}.thinking .node:nth-child(3n + 1) .portrait{animation-delay:-1.4s}@keyframes breathe{50%{transform:scale(1.07)}}@media(prefers-reduced-motion:reduce){.thinking .node .portrait{animation:none}}@media(max-width:760px){.top{left:12px;right:12px;top:12px;gap:6px;flex-wrap:wrap}.brand{font-size:18px;margin-right:4px}.search{width:140px}.tools{left:12px;top:118px}.tools button{font-size:13px;padding:10px}.bottom{left:12px;right:12px;bottom:12px}.legend,.hint{display:none}.panel{right:12px;left:12px;width:auto;top:112px;bottom:72px}.table-wrap{inset:116px 12px 74px 125px}.linktype{left:136px;top:118px;max-width:200px}.status{max-width:150px;font-size:12px}}

.node text.codename{fill:#c9f36a;font-size:14px;font-weight:500}.table-wrap{left:220px}.linktype{left:220px}@media(max-width:1050px){.legend,.hint{display:none}}@media(max-width:760px){.table-wrap{left:150px}.linktype{left:150px}}

/* Relationships stay distinguishable without colour perception. */
.edge .line{stroke-width:3;stroke-linecap:round;vector-effect:non-scaling-stroke}.edge.selected .line{stroke-width:5}.node text.sub{fill:#d5d5df;font-size:14px}.legend{display:grid;grid-template-columns:1fr 1fr;gap:14px 22px;position:absolute;right:0;bottom:66px;padding:16px 18px;background:#202027;border-color:#777783;font-size:15px;font-weight:600;color:#fff}.legend span{display:flex;align-items:center;gap:10px;white-space:nowrap}.legend svg{flex-shrink:0}.bottom>.hint{max-width:340px}@media(max-width:600px){.legend{gap:10px;font-size:14px;padding:12px;max-width:calc(100vw - 24px)}.legend svg{width:40px}.legend span{gap:6px}}

.coalition-line{display:none}.edge .gum{fill:#eef5ff;fill-opacity:.22;stroke:#eef5ff;stroke-opacity:.85;stroke-width:1.5;vector-effect:non-scaling-stroke;cursor:pointer}.edge.selected .gum{fill-opacity:.36;stroke:#fff;stroke-opacity:1;stroke-width:3}
button:disabled{background:#303037;color:#a6a6af;border-color:#494951;cursor:not-allowed;box-shadow:none}button:disabled:hover{background:#303037}.person-links{margin-top:24px}.person-links button{display:block;width:100%;text-align:left;margin:8px 0}

[hidden]{display:none!important}
.mobile-bar,#mobile-search,#mobile-more,.mobile-menu,.mobile-person-list,.mobile-save{display:none}
.node .tap-hit{fill:transparent;pointer-events:all}
.node>.overview-name{display:none}
.overview .node>text:not(.overview-name){display:none}
.overview .node>.overview-name{display:block;font-size:var(--overview-label-size);font-weight:650}
@media(max-width:760px){
 #app{min-height:0}
 .top{top:calc(8px + env(safe-area-inset-top));left:12px;right:12px;gap:6px;flex-wrap:nowrap;z-index:7}
 .top .brand,.top .spacer,#rename,#connect{display:none}
 .top #spaces{flex:1;min-width:0;height:46px}
 #mobile-search,#mobile-more{display:block;flex:none;height:46px;padding:8px 10px;font-size:13px}
 .top #search{display:none}
 .top.search-open #search{display:block;position:absolute;top:54px;left:0;width:100%;height:46px;z-index:8;background:#292930}
 .tools{display:none}
 .mobile-bar{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;position:absolute;left:12px;right:12px;bottom:calc(8px + env(safe-area-inset-bottom));height:60px;padding:5px;z-index:8}
 .mobile-bar button{border:0;background:transparent;padding:6px 2px;font-size:14px;min-width:0}
 .mobile-bar button.active{background:#c9f36a;color:#202516}
 #mobile-add{font-size:25px}
 .mobile-menu{display:grid;position:absolute;right:12px;top:calc(66px + env(safe-area-inset-top));width:min(260px,calc(100vw - 24px));padding:6px;gap:2px;z-index:9}
 .mobile-menu button{border:0;background:transparent;text-align:left;padding:11px 12px;font-size:14px}
 .mobile-menu p{margin:4px 8px 6px;padding:10px 4px 0;border-top:1px solid #414149;color:#b8b8c5;font-size:12px;line-height:1.4}
 .linktype{left:12px;right:12px;top:calc(66px + env(safe-area-inset-top));max-width:none;display:flex;align-items:center;gap:10px;padding:8px 10px}
 .linktype select{width:155px;flex:none;padding:8px}
 .linktype p{margin:0;font-size:12px;line-height:1.25}
 .table-wrap{inset:calc(68px + env(safe-area-inset-top)) 12px calc(78px + env(safe-area-inset-bottom)) 12px;padding:16px;background:#24242c}
 .table-wrap table{display:none}
 .table-wrap h2{margin:0 0 8px}
 .mobile-person-list{display:block}
 .mobile-person{display:grid;grid-template-columns:48px minmax(0,1fr) 16px;align-items:center;gap:12px;width:100%;min-height:72px;padding:10px 2px;text-align:left;border:0;border-bottom:1px solid #414149;border-radius:0;background:none}
 .mobile-person img,.mobile-avatar{width:44px;height:44px;border-radius:50%;object-fit:cover}
 .mobile-avatar{display:grid;place-items:center;background:#383844;color:#c9f36a;font-weight:600}
 .mobile-person strong,.mobile-person small{display:block;overflow-wrap:anywhere}
 .mobile-person strong{font-size:14px;line-height:1.35}
 .mobile-person small{color:#bdbdca;font-size:12px;margin-top:3px}
 .mobile-person .mobile-codename{color:#c9f36a}
 .mobile-no-results{color:#bdbdca}
 .panel{inset:0;width:auto;max-height:100dvh;border-radius:0;background:#24242c;z-index:12;padding:calc(20px + env(safe-area-inset-top)) 20px calc(90px + env(safe-area-inset-bottom));overflow:auto}
 .panel .close{min-width:44px;min-height:44px;margin:-8px -8px 0 0}
 .panel .actions .primary{display:none}
 .panel .mobile-save{display:block;position:fixed;left:16px;right:16px;bottom:calc(10px + env(safe-area-inset-bottom));height:52px;z-index:14}
 .panel .mobile-save:hover{background:#d8ff83}
 .panel .person-links{margin-bottom:24px}
 .bottom{left:0;right:0;bottom:0;display:block;pointer-events:none;z-index:5}
 .bottom .zoom{position:absolute;right:12px;bottom:calc(80px + env(safe-area-inset-bottom));padding:4px;gap:2px;pointer-events:auto}
 .bottom .zoom button{min-width:42px;height:42px;padding:6px;font-size:14px}
 .bottom .zoom #fit{min-width:88px}
 .bottom .zoom #scale,.bottom .hint{display:none}
 .bottom .status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 .bottom .legend{display:none;position:absolute;left:12px;right:12px;bottom:calc(138px + env(safe-area-inset-bottom));max-width:none;pointer-events:auto}
 .bottom .legend.mobile-open{display:grid}
 .table-mode .zoom{display:none}
 .toast{bottom:calc(150px + env(safe-area-inset-bottom))}
}
.access-cover{position:fixed;inset:0;z-index:100;background:#19191e;display:grid;place-items:center;padding:24px}.access-card{width:min(100%,400px);padding:28px;border:1px solid #656572;background:#26262e;border-radius:18px}.access-card h1{font-size:32px;margin:0}.access-card p{color:#ddd}.access-card label{display:block;margin:22px 0 8px}.access-card input,.access-card button{width:100%}.access-card .captcha{margin:18px 0}.access-message{min-height:24px}.access-card button:disabled{opacity:.5}

/* Drawing belongs to board coordinates and stays behind people. */
.stroke-line,.stroke-draft{fill:none;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;pointer-events:none;vector-effect:non-scaling-stroke}
.stroke-hit{fill:none;stroke:transparent;stroke-width:18;pointer-events:none;vector-effect:non-scaling-stroke}
.drawtools{position:absolute;left:220px;top:94px;z-index:6;display:flex;align-items:center;gap:10px;padding:8px 10px;max-width:min(700px,calc(100vw - 245px));font-size:13px}
.drawtools label{display:flex;align-items:center;gap:7px;white-space:nowrap}
.drawtools select{padding:8px}
.drawtools button{padding:8px;white-space:nowrap}
.drawtools span{color:#c8c8d3;line-height:1.3}
#canvas:has(.stroke-draft){cursor:crosshair}
@media(max-width:760px){
 .mobile-bar{grid-template-columns:repeat(6,minmax(0,1fr))}
 .mobile-bar button{font-size:11px;line-height:1.15;overflow-wrap:anywhere}
 .drawtools{left:12px;right:12px;top:calc(66px + env(safe-area-inset-top));max-width:none;flex-wrap:wrap;gap:6px;font-size:12px;padding:6px 8px}
 .drawtools select,.drawtools button{padding:7px;font-size:12px}
 .drawtools span{flex-basis:100%}
}

/* Collective cards share the existing node interactions. */
.collective-box{fill:#29313b;stroke:#cbd9e8;stroke-width:2;vector-effect:non-scaling-stroke}.node.selected .collective-box{stroke:#c9f36a;stroke-width:4}.node.collective text{stroke:none;pointer-events:none}.node.collective .collective-kind,.node.collective .collective-count{font-size:12px;fill:#d5d5df;font-weight:400}.node.collective .collective-title{font-size:14px;fill:#fff}.overview .node.collective text{display:block}.collective{cursor:grab}

.group-area{fill:#72d5ff;fill-opacity:.07;stroke:#72d5ff;stroke-opacity:.65;stroke-width:1.5;vector-effect:non-scaling-stroke;pointer-events:none}.group-area.active{stroke-opacity:1;fill-opacity:.12}.collective [data-group-toggle]{cursor:pointer}.collective [data-group-toggle] circle{fill:#72d5ff;stroke:#10212a;stroke-width:2}.collective [data-group-toggle] text{fill:#10212a;font-size:23px;font-weight:bold}.outside-tag{cursor:pointer}.outside-tag rect{fill:transparent;stroke:none;pointer-events:all}.node .outside-tag text{font-size:11px;font-weight:500;fill:#c8edff;stroke:#19191e;stroke-width:3px;paint-order:stroke;pointer-events:none}.outside-tag:hover text,.outside-tag:focus text{fill:#fff;text-decoration:underline}.drop-hint{fill:#fff;font-size:15px;paint-order:stroke;stroke:#19191e;stroke-width:5px}.member-picker{border:1px solid #52616c;border-radius:10px}.member-picker label{display:flex;gap:8px;align-items:center}.member-picker input{width:auto;display:inline;margin:0}.member-picker small{color:#bccbd8}@media(max-width:760px){.overview .node .outside-tag text{display:block}}

