/* Org Chart & Family Tree Maker — toolbar, pannable chart canvas and edit/style/data side panel. */
.ot-hero{background:radial-gradient(circle at 92% 18%,#4fa3ff33,transparent 38%),linear-gradient(120deg,#13263f,#1f2142 75%)}
.ot{--a:#4fa3ff}.ot-frame{border:1px solid var(--usp-line,#3a3352);border-radius:16px;background:#171b26;margin-top:14px;overflow:hidden;display:flex;flex-direction:column;color:#e4e8ef}
.ot-top{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:8px 10px;background:#1e2331;border-bottom:1px solid #323a4d}
.ot-group{display:flex;gap:4px;align-items:center;flex-wrap:wrap}.ot-right{margin-left:auto}
.ot .ot-btn{min-height:32px;padding:4px 10px;font-size:.84rem;border-radius:8px;background:#171b26;border:1px solid #3a4359;color:#e4e8ef;display:inline-flex;align-items:center;gap:4px;cursor:pointer;white-space:nowrap}
.ot .ot-btn.usp-primary{background:var(--a);color:#04213f;border-color:transparent;font-weight:700}.ot .ot-btn[aria-pressed=true]{background:#2c3550;border-color:#8ab}.ot .ot-btn.small{min-height:26px;padding:1px 8px;font-size:.78rem}.ot .ot-btn.danger{color:#ff9a9a}.ot .ot-btn:disabled{opacity:.45;cursor:default}
.ot-seg{display:inline-flex;border:1px solid #3a4359;border-radius:9px;overflow:hidden}.ot .ot-seg button{min-height:32px;padding:3px 11px;font-size:.84rem;background:#171b26;border:0;color:#cbd3e1;border-radius:0;white-space:nowrap}.ot .ot-seg button[aria-pressed=true]{background:var(--a);color:#04213f;font-weight:700}
.ot .ot-top input[type=search]{height:32px;min-height:0;width:170px;padding:2px 8px;font-size:.84rem;background:#10131b;border:1px solid #3a4359;color:#e4e8ef;border-radius:8px}
.ot-body{display:grid;grid-template-columns:minmax(0,1fr) 300px;height:min(76vh,800px);min-height:480px}
.ot-stage{position:relative;overflow:hidden;background:#f4f6fa;touch-action:none;cursor:grab;outline:none;min-width:0}.ot-stage.panning{cursor:grabbing}.ot-stage:focus-visible{box-shadow:inset 0 0 0 2px var(--a)}
#otSvg{width:100%;height:100%;display:block;user-select:none}
.ot-node{cursor:pointer}.ot-node.drag{opacity:.75;pointer-events:none}.ot-node.drop rect.card{stroke:#2ecc71!important;stroke-width:3!important}
.ot-tog{cursor:pointer}
.ot-hint{position:absolute;left:10px;bottom:8px;font:12px system-ui;color:#5b6475;background:#ffffffd0;padding:3px 8px;border-radius:7px;pointer-events:none}.ot-hint:empty{display:none}
.ot-panel{background:#171b26;border-left:1px solid #323a4d;display:flex;flex-direction:column;min-height:0}
.ot-tabs{display:flex;gap:2px;padding:6px 6px 0;border-bottom:1px solid #323a4d}.ot .ot-tabs button{min-height:32px;padding:3px 10px;font-size:.82rem;border-radius:8px 8px 0 0;background:none;border:0;color:#aab3c5}.ot .ot-tabs button[aria-selected=true]{background:#232a3b;color:#fff;font-weight:700}
.ot-pane{flex:1;overflow:auto;padding:10px 12px 16px}
.ot-pane h4{margin:12px 0 6px;font:700 .72rem system-ui;color:var(--a);text-transform:uppercase;letter-spacing:.06em}.ot-pane h4:first-child{margin-top:2px}
.ot-f{display:grid;grid-template-columns:84px minmax(0,1fr);gap:6px;align-items:center;font-size:.8rem;color:#cbd3e1;margin:5px 0}
.ot .ot-pane input:not([type=checkbox]):not([type=color]):not([type=range]),.ot .ot-pane select,.ot .ot-pane textarea{width:100%;box-sizing:border-box;height:30px;min-height:0;padding:2px 8px;font-size:.82rem;background:#10131b;border:1px solid #3a4359;color:#e4e8ef;border-radius:7px}
.ot .ot-pane textarea{height:auto;min-height:90px;font:12px/1.45 ui-monospace,monospace;padding:6px 8px}
.ot .ot-pane input[type=checkbox]{width:16px;height:16px;accent-color:var(--a);margin:0}.ot .ot-pane input[type=color]{width:42px;height:28px;padding:0;border:1px solid #3a4359;border-radius:6px;background:none}.ot .ot-pane input[type=range]{width:100%;accent-color:var(--a)}
.ot-chk{display:flex;gap:7px;align-items:center;font-size:.8rem;color:#cbd3e1;margin:6px 0;cursor:pointer}
.ot-row{display:flex;flex-wrap:wrap;gap:4px;margin:8px 0}
.ot-hintp{font-size:.76rem;color:#9aa4b8;line-height:1.5;margin:6px 0}
.ot-photo{display:flex;gap:8px;align-items:center}.ot-photo img{width:44px;height:44px;border-radius:50%;object-fit:cover;background:#10131b}
.ot-themes{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.ot .ot-themes button{min-height:44px;border-radius:8px;border:2px solid transparent;font-size:.72rem;padding:2px;color:#111;cursor:pointer}.ot .ot-themes button[aria-pressed=true]{border-color:var(--a);box-shadow:0 0 0 2px #fff4}
.ot-frame .usp-status:empty{display:none}.ot-frame .usp-status{margin:0;padding:6px 12px}
.ot-dlg{position:fixed;inset:0;margin:auto;height:fit-content;max-height:92vh;overflow:auto;box-sizing:border-box;border:1px solid var(--a,#4fa3ff);border-radius:14px;background:#171b26;color:#e4e8ef;padding:16px 18px;width:min(420px,94vw)}.ot-dlg::backdrop{background:#000a}.ot-dlg h3{margin:0 0 10px;padding-right:36px}.ot .ot-x{position:absolute;top:10px;right:10px;width:32px;height:32px;min-height:0;padding:0;border-radius:8px;background:#10131b;border:1px solid #3a4359;color:#e4e8ef;font-size:16px;cursor:pointer}.ot-dlg .ot-f select{width:100%;height:32px;min-height:0;padding:2px 8px;background:#10131b;border:1px solid #3a4359;color:#e4e8ef;border-radius:7px}.ot-dlg .ot-actions{display:flex;justify-content:flex-end;gap:6px;margin-top:14px}
.ot-frame:fullscreen,.ot-frame.ot-full{position:fixed;inset:0;z-index:1000;margin:0;border:0;border-radius:0}.ot-frame:fullscreen .ot-body,.ot-frame.ot-full .ot-body{flex:1;height:auto}
@media(max-width:900px){.ot-hint{display:none}.ot-body{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(340px,58vh) auto;height:auto}.ot-panel{border-left:0;border-top:1px solid #323a4d}.ot-right{margin-left:0}.ot .ot-top input[type=search]{width:140px}
 .ot-frame:fullscreen,.ot-frame.ot-full{overflow-y:auto;display:block}.ot-frame:fullscreen .ot-body,.ot-frame.ot-full .ot-body{flex:none;height:auto}}