/* Modern local workspace. One visual system for navigation, forms, lists and dialogs. */
:root {
 --bg:#ffffff;--surface:#ffffff;--surface-alt:#f8f9fb;--sunken:#f1f3f6;--sidebar-bg:#f8f9fb;
 --ink:#20242c;--muted:#626c7a;--subtle:#687281;--line:#e7eaf0;--border-strong:#cdd3dd;
 --blue:#2563eb;--blue-hover:#1d4ed8;--blue-soft:#edf3ff;--on-primary:#ffffff;--focus:#2563eb;
 --red:#ac2828;--red-bg:#fceeee;--amber:#99500e;--amber-bg:#fff2e3;--green:#396342;--green-bg:#edf5ef;
 --graph-line:#bcc8d7;--backdrop:#17223685;--shadow:0 16px 48px #1422381a;--shadow-soft:0 4px 18px #1422380d;
 --toast-bg:#243147;--toast-ink:#ffffff;
 --sans:"MiSans",-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
 --text-xs:.75rem;--text-sm:.8125rem;--text-base:.9375rem;--text-lg:1rem;--text-xl:1.25rem;--text-section:1.125rem;--text-title:1.75rem;
 --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;
 --radius:10px;--radius-input:6px;--radius-pill:6px;--header-offset:80px;--sidebar-width:216px;
 --dur-press:100ms;--dur-fast:180ms;--dur-base:240ms;--dur-graph:300ms;--ease-out:cubic-bezier(.22,1,.36,1);
 color-scheme:light;font-family:var(--sans);font-size:16px;background:var(--bg);color:var(--ink);
}
:root[data-theme=dark]{
 --bg:#17191d;--surface:#1c1f25;--surface-alt:#22262d;--sunken:#2a3039;--sidebar-bg:#1c1f25;
 --ink:#e8edf5;--muted:#b0bccd;--subtle:#a5b2c5;--line:#384455;--border-strong:#5d6d82;
 --blue:#8bb4ff;--blue-hover:#adcaff;--blue-soft:#26354f;--on-primary:#10203c;--focus:#8bb4ff;
 --red:#ffaaa7;--red-bg:#492b32;--amber:#efbe86;--amber-bg:#3d3227;--green:#a1d8b3;--green-bg:#263d34;
 --graph-line:#697b91;--backdrop:#080e1cb8;--shadow:0 16px 48px #00000045;--shadow-soft:0 4px 18px #00000025;
 --toast-bg:#dbe7f7;--toast-ink:#182334;color-scheme:dark;
}
html{scrollbar-gutter:stable}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:var(--text-base);font-synthesis:none;-webkit-font-smoothing:antialiased}
body:has(dialog[open]){overflow:hidden}
::selection{background:var(--blue-soft);color:var(--ink)}
h1,h2,h3{letter-spacing:0;text-wrap:pretty}
h1{font-family:var(--sans);font-size:var(--text-title);font-weight:700;line-height:1.3}
h2{font-family:var(--sans);font-size:var(--text-section);font-weight:700;line-height:1.4}
h3{font-size:var(--text-lg);font-weight:600}
button,a,summary,input,textarea,select{outline-offset:3px}
:where(button,a,summary,input,textarea,select):focus-visible{outline:2px solid var(--focus)}
button{transition:none}
/* The app sidebar is stable; only the work area changes between pages. */
.layout{display:block;min-height:100vh}
.sidebar{width:var(--sidebar-width);height:100dvh;position:fixed;inset:0 auto 0 0;z-index:10;display:flex;flex-direction:column;align-items:stretch;padding:24px 14px 18px;gap:0;border:0;border-right:1px solid var(--line);background:var(--sidebar-bg)}
.brand{padding:0 5px;gap:9px;flex:none;align-items:center}
.brandmark{width:30px;height:32px;border-radius:8px;background:var(--blue);color:var(--on-primary);box-shadow:0 1px 2px #15285516}
.brandmark svg{width:19px;height:19px}
.brand-title strong{font-family:var(--sans);font-size:15px;font-weight:650;letter-spacing:-.02em;color:var(--ink)}
.brand small{display:block;font-size:10px;letter-spacing:.04em;line-height:1.6;color:var(--muted);margin-top:3px}
.nav{display:flex;flex-direction:column;justify-content:flex-start;flex:none;gap:5px;overflow:visible;min-width:0;margin-top:38px}
.nav button{flex:none;display:flex;align-items:center;gap:11px;min-height:42px;padding:10px 12px;font-size:var(--text-base);line-height:1.5;border-radius:6px;color:var(--muted);white-space:nowrap;text-align:left}
.nav button svg{display:block;width:18px;height:18px;stroke-width:1.7;flex:none}
.nav button.active{background:var(--blue-soft);color:var(--blue);font-weight:600}
.nav button:hover{background:var(--sunken);color:var(--ink)}
.nav button.active:hover{background:var(--blue-soft);color:var(--blue)}
.nav .count{display:inline-grid;place-items:center;font-size:11px;min-width:20px;height:20px;color:var(--muted);margin-left:auto;opacity:1;font-variant-numeric:tabular-nums}
.nav button.active .count{color:var(--blue)}
.nav .count:empty{display:none}
.utility-menu{position:relative;flex:none;margin-top:28px;padding-top:18px;border-top:1px solid var(--line)}
.utility-menu>summary{display:flex;align-items:center;gap:11px;list-style:none;cursor:pointer;padding:10px 12px;min-height:42px;border:0;border-radius:6px;font-size:var(--text-sm);color:var(--muted);white-space:nowrap}
.utility-menu>summary::-webkit-details-marker{display:none}
.utility-menu>summary svg{width:18px;height:18px}
.utility-menu>summary::after{content:"⌄";margin-left:auto;font-size:14px}
.utility-menu[open]>summary,.utility-menu>summary:hover{background:var(--sunken);color:var(--ink)}
.side-bottom{position:absolute;left:0;top:calc(100% + 6px);width:256px;max-width:calc(100vw - 28px);max-height:calc(100dvh - 370px);overflow:auto;display:grid;gap:2px;margin:0;padding:6px;background:var(--surface);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow)}
.side-bottom button{display:flex;align-items:center;gap:10px;font-size:var(--text-sm);min-height:38px;padding:9px 10px;color:var(--ink);border-radius:5px}
.side-bottom button:hover{background:var(--surface-alt)}
.side-bottom button svg{width:17px;height:17px}
.theme-picker{border-top:1px solid var(--line);padding:12px 10px 6px;display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:var(--text-sm);color:var(--muted)}
.theme-picker select{width:auto;min-height:32px;font-size:var(--text-xs);padding:5px 8px}
.local-label{display:flex;align-items:center;gap:7px;font-size:11px;padding:20px 12px 0;margin-top:auto;color:var(--muted);line-height:1.6;border:0}
.local-label i{background:var(--green);flex-shrink:0;width:6px;height:6px;border-radius:50%}
.workspace{width:calc(100% - var(--sidebar-width));max-width:1480px;padding:0 36px 48px;margin:0 0 0 var(--sidebar-width);min-width:0}
.workspace-topline{position:sticky;top:0;z-index:5;display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:58px;margin:0 -36px 0;padding:0 36px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--bg) 93%,transparent);backdrop-filter:blur(16px);font-size:var(--text-xs);color:var(--muted)}
.breadcrumb{display:flex;align-items:center;gap:10px}.breadcrumb svg{width:15px;height:15px}.breadcrumb b{font-weight:500;color:var(--ink)}.breadcrumb-separator{color:var(--border-strong)}
.workspace-date{font-variant-numeric:tabular-nums;font-size:11px}
.topbar{padding:30px 0 24px;margin:0;gap:24px;align-items:center}
.topbar h1{font-size:var(--text-title);letter-spacing:-.035em;line-height:1.25;font-weight:650}
.eyebrow{display:none}
.subtitle{font-size:var(--text-sm);line-height:1.7;color:var(--muted);margin-top:8px;max-width:680px}
.section-tabs{display:flex;gap:var(--space-6);border-bottom:1px solid var(--line);margin:0 0 var(--space-6)}
.section-tabs button{position:relative;padding:0 2px var(--space-3);color:var(--muted);font-size:var(--text-base);font-weight:500;white-space:nowrap}
.section-tabs button[aria-current=page]{color:var(--blue);font-weight:600}
.section-tabs button[aria-current=page]::after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;background:var(--blue)}
.actions{gap:var(--space-2);flex-wrap:wrap}
.btn{border-radius:var(--radius-input);background:var(--surface);border-color:var(--line);min-height:36px;padding:8px 13px;font-size:var(--text-base);line-height:1.4;color:var(--ink);box-shadow:none}
.btn:hover{background:var(--sunken);border-color:var(--border-strong)}
.btn.primary{background:var(--blue);border-color:var(--blue);box-shadow:none;color:var(--on-primary)}
.btn.primary:hover{background:var(--blue-hover);border-color:var(--blue-hover)}
.btn.small{min-height:32px;font-size:var(--text-xs);padding:6px 10px}
.btn.quiet{background:transparent;border-color:transparent;color:var(--muted)}
.btn.danger{color:var(--red);border-color:var(--red)}
.icon-button{width:38px;height:38px;border-radius:var(--radius-input);color:var(--muted)}
.icon-button:hover{background:var(--blue-soft)}
.small-text{font-size:var(--text-sm);line-height:1.6}
.muted,.secondary{color:var(--muted)}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:none}
.panel-head{padding:var(--space-5) var(--space-6);gap:var(--space-4);border-color:var(--line)}
.panel-head h2{font-size:var(--text-section)}
.panel-head p{font-size:var(--text-sm);color:var(--muted);margin-top:var(--space-1)}
.panel-body{padding:var(--space-5) var(--space-6)}
.avatar{background:var(--sunken);color:var(--blue);border:1px solid var(--line);border-radius:9px;width:36px;height:36px;font-family:var(--sans);font-size:14px;flex:none}
.person-cell{min-width:0;max-width:100%;gap:var(--space-3);text-align:left;white-space:normal}
.person-cell>span:last-child{min-width:0;overflow-wrap:anywhere}
.person-name{font-size:var(--text-base);color:var(--ink);font-weight:600;line-height:1.6}
.secondary{font-size:var(--text-xs);line-height:1.6;margin-top:3px}
.badge{display:inline-flex;align-items:center;gap:5px;font-size:var(--text-xs);line-height:1.5;padding:3px 8px;border-radius:var(--radius-pill);background:var(--sunken);color:var(--muted);white-space:normal;overflow-wrap:anywhere}
.badge.green{background:var(--green-bg);color:var(--green)}
.badge.red{background:var(--red-bg);color:var(--red)}
.badge.amber{background:var(--amber-bg);color:var(--amber)}
.badge.green::before,.badge.red::before,.badge.amber::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor;flex:none}
.tag-group{gap:6px;flex-wrap:wrap}
.toolbar{gap:var(--space-4);margin-bottom:var(--space-4);align-items:center}
.toolbar .search{max-width:480px;min-width:0;flex:1}
.search input{border-radius:var(--radius-input);background:var(--surface);font-size:var(--text-base);min-height:42px;padding-left:38px}
.search svg{top:13px;color:var(--subtle)}
.toolbar select{max-width:175px;font-size:var(--text-sm);min-height:42px;background:var(--surface)}
.filters{gap:var(--space-2)}
input,select,textarea{border-color:var(--border-strong);background:var(--surface);border-radius:var(--radius-input);color:var(--ink);font-size:var(--text-base);min-width:0}
input::placeholder,textarea::placeholder{color:var(--subtle)}
input:focus,textarea:focus,select:focus{border-color:var(--focus);box-shadow:none}
input[type=checkbox],input[type=radio]{accent-color:var(--blue)}
table{white-space:normal;table-layout:fixed;width:100%}
th{background:var(--surface-alt);font-size:var(--text-xs);font-weight:500;padding:12px 16px;color:var(--muted);border-color:var(--line);white-space:normal}
td{padding:16px 14px;font-size:var(--text-base);border-color:var(--line);overflow-wrap:anywhere}
td.wrap{min-width:0;max-width:none;line-height:1.7}
tbody tr:hover{background:var(--surface-alt)}
.people-table th:nth-child(1){width:19%}.people-table th:nth-child(2){width:14%}.people-table th:nth-child(3){width:28%}.people-table th:nth-child(4){width:12%}.people-table th:nth-child(5){width:18%}.people-table th:nth-child(6){width:9%}
.people-summary p{font-size:var(--text-sm);line-height:1.65;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:var(--muted)}
.people-summary p+p{margin-top:5px}.people-summary b{font-weight:500;color:var(--ink);margin-right:6px}
.table-date{font-variant-numeric:tabular-nums;font-size:var(--text-sm);color:var(--muted)}
.table-footer{padding:var(--space-3) var(--space-4);font-size:var(--text-xs);color:var(--muted);background:var(--surface-alt);border-color:var(--line)}
.empty{padding:40px var(--space-6);text-align:center}
.empty .empty-icon{background:var(--sunken);color:var(--blue);width:42px;height:42px;border-radius:var(--radius);margin-bottom:var(--space-4)}
.empty h3{font-family:var(--sans);font-size:var(--text-section);font-weight:600;color:var(--ink)}
.empty p{font-size:var(--text-base);max-width:440px;line-height:1.8;color:var(--muted)}
.empty .actions{margin-top:var(--space-5)}
.demo-banner{font-size:var(--text-sm);background:var(--blue-soft);border-color:var(--line);color:var(--muted);border-radius:var(--radius-input);margin-bottom:var(--space-5)}
/* People directory and biography cards share data, but have distinct reading layouts. */
.font-credit{font-size:11px;color:var(--muted);margin:8px 12px 4px}.font-credit a{color:inherit;text-underline-offset:3px}
.workspace[data-page=people] .topbar h1{font-size:32px;font-weight:600;letter-spacing:-.02em}
.people-toolbar{align-items:center;gap:16px;margin-bottom:28px}.people-toolbar .search{flex:1;max-width:560px}.people-toolbar .search input{height:46px;font-size:14px;border-radius:8px}.people-toolbar .filters{gap:12px}.people-result-count{font-size:12px;color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.people-view-switch{display:flex;gap:3px;padding:4px;background:var(--sunken);border-radius:8px}
.people-view-switch button{display:flex;align-items:center;gap:7px;min-height:34px;padding:7px 12px;font-size:13px;border-radius:5px;color:var(--muted);white-space:nowrap}.people-view-switch svg{width:15px;height:15px}
.people-view-switch button[aria-pressed=true]{background:var(--surface);color:var(--ink);box-shadow:0 1px 3px #14223814;font-weight:600}
.people-card-workspace{display:grid;grid-template-columns:200px minmax(0,1fr);gap:36px;margin-top:28px;align-items:start}
.people-card-directory{padding-right:8px;min-width:0}
.people-directory-heading{display:flex;justify-content:space-between;align-items:center;padding:10px 12px 18px;font-size:13px;color:var(--muted)}.people-directory-heading span{font-variant-numeric:tabular-nums;font-size:12px}
.people-card-directory nav{display:grid;gap:6px;max-height:540px;overflow-y:auto;scrollbar-width:thin;padding:3px}
.people-card-directory nav button{display:flex;align-items:center;gap:12px;padding:14px 10px;text-align:left;border-radius:8px;min-width:0;color:var(--muted);border:1px solid transparent}.people-card-directory nav button:hover{background:var(--surface-alt)}.people-card-directory nav button[aria-current]{color:var(--blue);background:var(--blue-soft);border-color:var(--line)}
.people-card-directory .avatar{width:34px;height:34px;border:0;border-radius:50%;background:var(--surface);font-size:14px;color:inherit;flex:none}.people-card-directory nav button>span:last-child{min-width:0}.people-card-directory strong,.people-card-directory small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.people-card-directory strong{font-size:14px;font-weight:600;color:var(--ink)}.people-card-directory small{font-size:12px;margin-top:4px}
.people-stack-browser{min-width:0;width:100%;max-width:700px;margin-inline:auto}
.people-deck-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 28px 20px 0}.people-deck-toolbar>.small-text{font-size:13px}
.people-deck-controls{display:flex;align-items:center;gap:8px}.people-deck-position{font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums;margin-right:8px}
.people-deck-controls .icon-button{border:1px solid var(--border-strong);background:var(--surface);width:38px;height:38px;border-radius:50%;color:var(--ink);opacity:1}.people-deck-controls .icon-button svg{width:17px;height:17px}.people-deck-controls [data-deck-step="-1"] svg{transform:rotate(180deg)}.people-deck-controls button:disabled{opacity:.3;cursor:default}
.people-stack-stage{padding:3px 28px 38px 0;overflow:clip;overflow-clip-margin:14px}
.people-card-deck{display:grid;position:relative;isolation:isolate;cursor:grab;touch-action:pan-y;outline-offset:5px;border-radius:16px}.people-card-deck:focus-visible{outline:2px solid var(--focus)}.people-card-deck.is-dragging{cursor:grabbing;user-select:none;-webkit-user-select:none}
.people-card{grid-area:1/1;display:flex;flex-direction:column;min-width:0;min-height:530px;padding:30px 34px 24px;border:1px solid #2f4864;border-radius:16px;background:#19304b;color:#f6f9ff;box-shadow:0 18px 36px #14223818;transform-origin:50% 90%;overflow:hidden}
.people-card[data-depth="0"]{z-index:3}.people-card[data-depth="1"]{z-index:2;transform:translate(12px,12px) rotate(1deg) scale(.99);background:#d6e1ef;border-color:#c4d1e1;box-shadow:none}.people-card[data-depth="2"]{z-index:1;transform:translate(24px,24px) rotate(2deg) scale(.98);background:#e9edf4;border-color:#dce3ed;box-shadow:none}.people-card[inert]>*{visibility:hidden}
.people-card-kicker{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:12px;color:#b6c7db;margin-bottom:27px}.people-card-kicker .badge{background:#ffffff10;border:1px solid #ffffff26;color:#e7eff9;font-size:12px;max-width:65%;padding:5px 11px;border-radius:30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.people-card-heading{display:block;min-width:0}.people-card-title{color:#fff;text-align:left;max-width:100%;display:block}.people-card-title:hover{color:#d7e7ff}.people-card-title .person-name{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;font-size:40px;font-weight:600;line-height:1.3;letter-spacing:-.025em;color:inherit}.people-card-alias{font-size:14px;color:#b6c7db;margin-top:8px;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.people-card-role{font-size:15px;line-height:1.7;color:#c0cfe0;margin-top:15px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.people-card-notes{display:grid;gap:18px;margin:27px 0 25px;padding-top:23px;border-top:1px solid #ffffff22;flex:1;align-content:start}.people-card-notes h3{font-size:12px;color:#aebfd3;font-weight:400;margin-bottom:8px}.people-card-notes p{font-size:16px;line-height:1.85;color:#f6f9ff;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;white-space:pre-wrap;overflow-wrap:anywhere}.people-card-notes section+section p{font-size:14px;color:#c0cfe0;-webkit-line-clamp:2}
.people-card-meta{display:grid;grid-template-columns:1fr 1fr auto;gap:14px;padding:20px 0;border-top:1px solid #ffffff22}.people-card-meta span{font-size:11px;color:#aebfd3}.people-card-meta strong{display:block;margin-top:7px;color:#f6f9ff;font-size:20px;font-weight:600;font-variant-numeric:tabular-nums}.people-card-meta small{font-size:11px;color:#aebfd3;font-weight:400}.people-card-meta span:last-child strong{font-size:13px;line-height:29px}
.people-card>footer{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:3px;flex-wrap:nowrap}.people-card>footer>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.people-card>footer>.badge{background:#ffffff10;color:#c8d8eb;font-size:11px;border:0;padding:0}.people-card>footer .btn{color:#19304b;border:0;background:#f6f9ff;font-size:13px;padding:9px 16px;border-radius:7px;margin-left:auto;flex:none;font-weight:600}.people-card>footer .btn:hover{background:#dce9fc}.people-card>footer .btn svg{width:15px;height:15px}
.people-stack-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-right:28px;min-height:32px}.people-stack-bottom>.small-text{font-size:12px}
.people-stack-dots{display:flex;align-items:center;gap:2px}.people-stack-dots button{display:grid;place-items:center;min-width:24px;min-height:32px;border-radius:4px;padding:0 4px}.people-stack-dots span{display:block;width:6px;height:6px;background:var(--border-strong);border-radius:8px}.people-stack-dots button[aria-pressed=true] span{width:20px;background:var(--blue)}
.people-record-list{border-top:1px solid var(--line)}.people-record-list ul{list-style:none;margin:0;padding:0}.people-record-list-head,.person-record{display:grid;grid-template-columns:minmax(185px,1fr) minmax(220px,1.3fr) minmax(140px,.7fr) 56px;gap:24px;align-items:start}.people-record-list-head{font-size:12px;color:var(--muted);padding:16px 18px;background:var(--surface-alt);border-bottom:1px solid var(--line)}
.person-record{position:relative;padding:24px 18px;border-bottom:1px solid var(--line)}.person-record:hover{background:var(--surface-alt)}.person-record-identity{min-width:0}.person-record .person-cell{gap:12px;align-items:center;text-align:left;max-width:100%}.person-record .avatar{width:42px;height:42px;font-size:18px;border:0;border-radius:50%;background:var(--blue-soft);color:var(--blue)}.person-record .person-cell>span:last-child{min-width:0}.person-record .person-name{font-size:17px;font-weight:600;line-height:1.5;overflow-wrap:anywhere}.person-record .secondary{font-size:12px;color:var(--muted);margin-top:3px;overflow-wrap:anywhere}.person-record-relation{margin:11px 0 0 54px}.person-record-relation .badge{font-size:11px;padding:3px 8px;background:var(--surface-alt);border:1px solid var(--line);max-width:100%;white-space:normal;overflow-wrap:anywhere}.person-record-role{margin:9px 0 0 54px;font-size:12px;line-height:1.7;color:var(--muted);overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.person-record-summary{display:grid;gap:12px;padding-top:3px;min-width:0}.person-record-summary p{display:grid;grid-template-columns:54px minmax(0,1fr);gap:10px;align-items:baseline;font-size:13px;line-height:1.85}.person-record-summary span{font-size:11px;color:var(--muted)}.person-record-summary b{font-weight:400;color:var(--ink);overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.person-record-history{font-size:12px;line-height:1.8;padding-top:3px;min-width:0;color:var(--muted)}.person-record-history p{white-space:nowrap}.person-record-history strong{font-weight:600;font-size:15px;color:var(--ink)}.person-record-history i{font-style:normal;color:var(--border-strong);margin:0 5px}.person-record-history>span{display:block;font-size:11px;margin-top:10px}.person-record-history>.badge{width:fit-content;margin-top:12px;white-space:normal}.person-record-actions{display:flex;flex-direction:column;gap:6px}.person-record-actions .btn{padding:5px 10px;font-size:12px;min-height:32px}.person-record-actions .btn:first-child{background:var(--blue-soft);color:var(--blue);border-color:transparent}
@media(max-width:1100px){.people-card-workspace{grid-template-columns:1fr;gap:0}.people-card-directory{display:none}.people-stack-browser{max-width:640px}.people-record-list-head{display:none}.person-record{grid-template-columns:minmax(180px,.9fr) minmax(220px,1.1fr) 60px;gap:14px 24px}.person-record-history{grid-column:2;grid-row:2;display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:0}.person-record-history>span{margin:0}.person-record-history>.badge{margin:0}.person-record-actions{grid-column:3;grid-row:1/3}.person-record-identity{grid-row:1/3}}
@media(max-width:760px){.workspace[data-page=people] .topbar{position:relative;display:block}.workspace[data-page=people] .topbar h1{font-size:28px}.workspace[data-page=people] .topbar>.actions{position:absolute;right:0;top:24px}.workspace[data-page=people] .subtitle{padding-top:5px}.people-toolbar{gap:12px;margin-bottom:22px}.people-toolbar .search{width:100%;max-width:none}.people-toolbar .filters{width:100%;display:flex;gap:10px}.people-toolbar .filters select{flex:1;max-width:180px;font-size:13px}.people-result-count{margin-left:auto}.people-card-workspace{margin-top:22px}.people-stack-stage{padding-right:22px;padding-bottom:32px}.people-card{padding:24px 24px 20px;min-height:500px;border-radius:13px}.people-card[data-depth="1"]{transform:translate(9px,10px) rotate(1deg) scale(.99)}.people-card[data-depth="2"]{transform:translate(18px,20px) rotate(2deg) scale(.98)}.people-card-kicker{margin-bottom:24px;font-size:11px}.people-card-kicker .badge{font-size:11px;padding:4px 8px}.people-card-title .person-name{font-size:32px}.people-card-role{font-size:14px;margin-top:12px}.people-card-notes{margin:23px 0 20px;gap:18px;padding-top:20px}.people-card-notes p{font-size:15px}.people-card-notes section+section p{font-size:13px}.people-card-meta{gap:12px;padding:18px 0}.people-card-meta strong{font-size:18px}.people-card-meta span:last-child strong{font-size:12px}.people-deck-toolbar{margin-right:22px}.people-deck-toolbar>.small-text{font-size:12px}.people-stack-bottom{margin-right:22px;flex-wrap:wrap}.people-stack-bottom>.small-text{font-size:11px}.people-stack-dots button{min-height:36px}.person-record{grid-template-columns:minmax(0,1fr) auto;padding:22px 4px;gap:18px 12px}.person-record-identity{grid-row:1;grid-column:1}.person-record-actions{grid-column:2;grid-row:1;flex-direction:row;align-self:start}.person-record-summary{grid-row:2;grid-column:1/-1;padding:0}.person-record-history{grid-row:3;grid-column:1/-1;font-size:12px}.person-record .person-name{font-size:18px}.person-record-role{margin-left:54px}.person-record-summary p{grid-template-columns:54px minmax(0,1fr);font-size:14px}.person-record-summary span{font-size:12px}.person-record-history>span{margin-left:auto}}
@media(max-width:410px){.people-card{padding:22px 20px 18px}.people-card-title .person-name{font-size:28px}.people-card-meta{grid-template-columns:1fr 1fr auto;gap:9px}.people-card-meta span{font-size:10px}.people-card-meta span:last-child strong{font-size:11px}.person-record-actions{flex-direction:column}.people-toolbar .filters{gap:8px}.people-view-switch button{padding:7px 10px}}
/* About me: a compact directory and one continuous, fully expanded document. */
.self-editor-layout,.self-reader-layout{display:grid;grid-template-columns:minmax(0,1fr) 172px;gap:32px;align-items:start;max-width:1120px;margin:0 auto}
.self-outline{grid-column:2;grid-row:1;position:sticky;top:var(--header-offset);background:transparent;border:0;padding:var(--space-2) 0;min-width:0}
.self-outline-head{padding:0 var(--space-3) var(--space-4);border-bottom:1px solid var(--line);margin-bottom:var(--space-2)}
.self-outline h2{font-family:var(--sans);font-size:var(--text-base);color:var(--ink)}
.self-outline-head p{font-size:var(--text-xs);color:var(--muted);margin-top:var(--space-2)}
.self-outline-head strong{font-size:var(--text-lg);color:var(--ink);font-weight:600;margin-right:3px}
.self-outline progress{width:100%;display:block;height:4px;border:0;border-radius:var(--radius-pill);margin-top:var(--space-3);background:var(--line);color:var(--blue)}
.self-outline progress::-webkit-progress-bar{background:var(--line);border-radius:var(--radius-pill)}
.self-outline progress::-webkit-progress-value{background:var(--blue);border-radius:var(--radius-pill)}
.self-outline progress::-moz-progress-bar{background:var(--blue)}
.self-outline nav{display:grid;gap:var(--space-1)}
.self-outline nav button{min-height:36px;width:100%;display:flex;gap:var(--space-2);align-items:center;text-align:left;padding:8px 10px;border-radius:var(--radius-input);line-height:1.5;color:var(--muted);font-size:var(--text-xs)}
.self-outline nav button>span{font-size:var(--text-xs);color:var(--subtle);flex:none}
.self-outline nav button:hover{background:var(--sunken);color:var(--ink)}
.self-outline nav button[aria-current]{background:transparent;color:var(--blue);font-weight:600;box-shadow:inset 2px 0 var(--blue);border-radius:0}
.self-outline-foot{font-size:var(--text-xs);color:var(--muted);line-height:1.8;margin:var(--space-4) var(--space-3) 0;padding-top:var(--space-4);border-top:1px solid var(--line)}
.self-card-form{grid-column:1;grid-row:1;width:100%;max-width:none;min-width:0;margin:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}
.self-card-intro{padding:22px 24px;border-bottom:1px solid var(--line);background:var(--surface-alt);border-radius:var(--radius) var(--radius) 0 0}
.self-card-intro h2{font-family:var(--sans);font-weight:650;font-size:20px;line-height:1.4;letter-spacing:0;color:var(--ink);margin-bottom:var(--space-4)}
.self-card-intro .self-sincerity{font-size:var(--text-sm);font-weight:700;line-height:1.8;margin:var(--space-1) 0;color:var(--red);text-align:center}
.self-card-intro p:not(.self-sincerity){font-size:var(--text-sm);color:var(--muted);margin:var(--space-3) 0 0}
.self-paper-section{border:0;border-bottom:1px solid var(--line);background:transparent;border-radius:0;padding:var(--space-5) var(--space-6) var(--space-6);margin:0;scroll-margin-top:var(--header-offset);outline:none}
.self-section-heading{gap:10px;margin-bottom:20px;align-items:center}
.self-section-number{background:var(--blue-soft);color:var(--blue);display:grid;width:26px;height:26px;border-radius:6px;font-family:var(--sans);font-size:11px;font-weight:600}
.self-section-heading h3{font-family:var(--sans);font-size:var(--text-lg);font-weight:650;line-height:1.5;color:var(--ink)}
.self-entry-grid{gap:var(--space-4) var(--space-5)}
.self-entry label,.self-choice-field legend{font-size:var(--text-base);font-weight:600;color:var(--ink);line-height:1.6}
.self-entry input,.self-entry textarea{border:1px solid var(--border-strong);background:var(--surface);border-radius:var(--radius-input);min-height:38px;padding:7px 10px;font-size:var(--text-base);line-height:1.6;color:var(--ink)}
.self-entry textarea{min-height:64px;resize:vertical}
.self-entry .self-writing-guide+input,.self-entry .self-writing-guide+textarea,.self-entry input:focus,.self-entry textarea:focus{background:var(--surface)}
.self-writing-guide{background:var(--surface-alt);border:0;border-radius:var(--radius-input);padding:var(--space-2) var(--space-3);margin:6px 0 var(--space-2);color:var(--muted)}
.self-entry .self-writing-guide p,.self-writing-guide li{font-size:var(--text-sm);line-height:1.65;color:inherit}
.self-writing-guide ul{padding-left:18px;margin:var(--space-1) 0 0;columns:2;column-gap:24px}.self-writing-guide li{break-inside:avoid}.self-writing-guide li{margin:1px 0}
.self-choices{gap:var(--space-2)}
.self-entry .self-choice{background:var(--surface);border-color:var(--border-strong);border-radius:var(--radius-input);min-height:38px;padding:7px;font-size:var(--text-base);color:var(--muted)}
.self-entry .self-choice:has(input:checked){background:var(--blue-soft);border-color:var(--focus);color:var(--ink)}
.self-entry .self-choice input[type=radio],.self-entry .self-confirmation input[type=checkbox]{width:17px;height:17px;min-height:17px;accent-color:var(--blue)}
.self-entry .self-confirmation{font-size:var(--text-base);font-weight:400}.self-required{color:var(--red)}
.self-entry p{color:var(--muted);font-size:var(--text-sm)}
.self-save-bar{bottom:0;border:0;border-top:1px solid var(--line);background:var(--surface);border-radius:0 0 var(--radius) var(--radius);padding:var(--space-3) var(--space-4);margin:0;box-shadow:0 -5px 16px #20242c06;z-index:3;flex-wrap:wrap;backdrop-filter:blur(16px)}
.self-save-bar span{font-size:var(--text-xs);color:var(--muted)}
.self-save-bar .actions{gap:var(--space-2);flex-shrink:1;margin-left:auto;width:auto}
.self-save-bar .btn{font-size:var(--text-sm);padding:10px 12px}
.self-bmi{background:var(--surface-alt);border-color:var(--line);border-radius:var(--radius-input);padding:var(--space-3) var(--space-4)}
.self-bmi-result strong{font-family:var(--sans);font-size:26px;color:var(--ink)}
.self-bmi .self-bmi-note{font-size:var(--text-xs);color:var(--muted)}
.self-reader{grid-column:1;grid-row:1;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);overflow:hidden}
.self-reader-layout .self-history{grid-column:2;grid-row:1;position:sticky;top:var(--header-offset);background:transparent;color:var(--ink);border:0;border-radius:0;max-height:calc(100dvh - var(--header-offset) - 20px);overflow:auto}
.self-history .panel-head{padding:var(--space-2) var(--space-3) var(--space-4);border-color:var(--line)}
.self-history .panel-head h2{font-family:var(--sans);font-size:var(--text-base)}
.self-history .panel-head p{color:var(--muted);font-size:var(--text-xs)}
.self-history .panel-body{display:block;padding:var(--space-2) 0}
.self-history-item{padding:var(--space-3);gap:var(--space-1);border-radius:var(--radius-input);color:var(--muted)}
.self-history-item strong,.self-history-item small{font-size:var(--text-xs);font-weight:400;color:inherit}
.self-history-item.active{background:var(--blue-soft);color:var(--blue)}
.self-history-item:hover{background:var(--sunken)}
.self-card-tabs{margin:0;padding:0 var(--space-6);gap:var(--space-6);border-color:var(--line);background:var(--surface-alt)}
.self-card-tabs button{font-size:var(--text-base);padding:var(--space-3) 0}
.self-readable-fields>div{padding:var(--space-3) 0;border-color:var(--line)}
.self-readable-fields dt{font-size:var(--text-sm);color:var(--muted)}
.self-readable-fields dd{font-size:var(--text-base);color:var(--ink);line-height:1.8}
.self-reader .self-stats{border:1px solid var(--line);border-radius:var(--radius-input);gap:0;margin-top:var(--space-4);overflow:hidden}
.self-reader .stat{background:var(--surface);padding:var(--space-4);border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0}
.self-reader .stat:nth-child(2n){border-right:0}.self-reader .stat:nth-last-child(-n+2){border-bottom:0}
.self-reader .stat-value{font-family:var(--sans);font-size:28px;margin:var(--space-2) 0 0;color:var(--ink)}
.self-stats .stat[aria-pressed=true]{background:var(--blue-soft)}
.stat-top{font-size:var(--text-sm);color:var(--muted)}.self-comparison-note{font-size:var(--text-xs);color:var(--muted)}
/* Graph, table and events share the same status vocabulary. */
.relation-summary{font-size:var(--text-sm);gap:var(--space-6);color:var(--muted);margin:0 0 var(--space-5)}
.relation-summary strong{font-size:var(--text-xl);color:var(--ink);font-variant-numeric:tabular-nums}
.relation-controls{background:var(--surface);padding:var(--space-4) var(--space-6);border-color:var(--line)}
.relation-controls label{font-size:var(--text-xs);color:var(--muted)}
.relation-controls select{min-height:42px;font-size:var(--text-sm);background:var(--surface)}
.graph-canvas{background-color:var(--surface);background-image:radial-gradient(var(--line) .8px,transparent .8px);background-size:24px 24px}
.relationship-graph{height:440px}
.graph-my-edge path{stroke:var(--graph-line)}
.graph-label{fill:var(--muted);stroke:var(--surface);font-size:12px}
.graph-me circle{fill:var(--blue);stroke:var(--surface)}.graph-me text{fill:var(--on-primary)}
.graph-person rect{fill:var(--surface);stroke:var(--border-strong);rx:9px}
.graph-person:hover rect,.graph-person:focus-visible rect,.graph-person.selected rect,.graph-person.graph-related rect{fill:var(--blue-soft);stroke:var(--focus)}
.graph-name{fill:var(--ink)}.graph-sub{fill:var(--muted);font-size:11px}
.graph-link .graph-connection{stroke:var(--green)}.graph-link .graph-label{fill:var(--green)}
.graph-link.uncertain .graph-connection{stroke:var(--amber)}.graph-link.uncertain .graph-label{fill:var(--amber)}
.arrow-confirmed{fill:var(--green)}.arrow-uncertain{fill:var(--amber)}
.graph-muted{opacity:.48}.graph-link.graph-related .graph-connection{stroke-width:3}
.graph-legend{font-size:var(--text-xs);border-color:var(--line);background:var(--surface-alt);padding:var(--space-3) var(--space-6)}
.legend-self{border-color:var(--graph-line)!important}.legend-confirmed{border-color:var(--green)!important}.legend-uncertain{border-color:var(--amber)!important}
.relation-tabs{gap:var(--space-5)}.relation-tabs button{font-size:var(--text-base);min-height:36px}
.relation-table-tools{border-color:var(--line);background:var(--surface-alt);padding:var(--space-4) var(--space-6)}
.relation-table-tools .small-text{font-size:var(--text-xs)}.relation-row-link{font-size:var(--text-sm)}
.relationship-table table{min-width:0}.relation-cell{min-width:0!important;max-width:none!important}
.events-table th:nth-child(1){width:11%}.events-table th:nth-child(2){width:19%}.events-table th:nth-child(3){width:10%}.events-table th:nth-child(4){width:24%}.events-table th:nth-child(5){width:10%}.events-table th:nth-child(6){width:18%}.events-table th:nth-child(7){width:8%}
.relationship-table th:nth-child(1){width:19%}.relationship-table th:nth-child(2){width:17%}.relationship-table th:nth-child(3){width:27%}.relationship-table th:nth-child(4){width:11%}.relationship-table th:nth-child(5){width:13%}.relationship-table th:nth-child(6){width:13%}
.relationship-table table:has(th:nth-child(7)) th:nth-child(1),.relationship-table table:has(th:nth-child(7)) th:nth-child(3){width:19%}
.relationship-table table:has(th:nth-child(7)) th:nth-child(2){width:7%}.relationship-table table:has(th:nth-child(7)) th:nth-child(4){width:13%}.relationship-table table:has(th:nth-child(7)) th:nth-child(5){width:11%}.relationship-table table:has(th:nth-child(7)) th:nth-child(6){width:23%}.relationship-table table:has(th:nth-child(7)) th:nth-child(7){width:8%}
/* Modal: fixed header/footer and one scrolling content region. */
dialog{background:var(--surface);border-color:var(--line);border-radius:var(--radius);box-shadow:var(--shadow);color:var(--ink)}
dialog::backdrop{background:var(--backdrop);backdrop-filter:blur(3px)}
#dialog{overflow:hidden;max-height:90dvh;width:820px;max-width:calc(100vw - 32px)}
.modal-shell{display:flex;flex-direction:column;max-height:calc(90dvh - 2px);min-height:0}
.modal-shell>form{display:contents}
.modal-head{padding:var(--space-5) var(--space-6);background:var(--surface);border-color:var(--line);position:static;flex:none}
.modal-head h2{font-family:var(--sans);font-size:20px;color:var(--ink)}
.modal-head p{font-size:var(--text-sm);line-height:1.6;color:var(--muted);margin-top:6px}
.modal-body{padding:var(--space-6);overflow-y:auto;overscroll-behavior:contain;min-height:0;flex:1}
.modal-body>p{font-size:var(--text-base)}
.modal-footer{padding:var(--space-3) var(--space-6);background:var(--surface-alt);border-color:var(--line);position:static;flex:none;gap:var(--space-2);flex-wrap:wrap}
.field label .muted{color:var(--red)}
.field label,.form-section summary{font-size:var(--text-base);color:var(--ink)}
.field small,.form-section small{font-size:var(--text-xs);color:var(--muted);line-height:1.7}
.field input,.field textarea,.field select{padding:10px 12px;font-size:var(--text-base);min-height:42px;background:var(--surface);border-color:var(--border-strong);border-radius:var(--radius-input);max-width:100%}
.field textarea{min-height:84px;line-height:1.7;resize:vertical}.field{min-width:0}
.form-grid,.subform{gap:var(--space-5)}.form-section{border-color:var(--line)}
.form-error{font-size:var(--text-sm);color:var(--red);max-width:100%}
.discard-confirm{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:var(--space-2);width:100%;border-bottom:1px solid var(--line);padding-bottom:var(--space-3);margin-bottom:var(--space-2)}
.discard-confirm p{font-size:var(--text-sm);margin-right:auto;color:var(--ink)}
.detail-top{gap:var(--space-3);margin-bottom:var(--space-4)}
.detail-top .avatar{width:52px;height:52px;font-size:26px;border-radius:50%}
.detail-top h2{font-size:26px}.detail-sub{font-size:var(--text-base);color:var(--muted)}
.detail-stats{border:1px solid var(--line);background:var(--surface-alt);border-radius:var(--radius-input);margin:var(--space-4) 0 var(--space-6);padding:0;overflow:hidden}
.detail-stats>div{padding:var(--space-4);border-right:1px solid var(--line)}.detail-stats>div:last-child{border:0}
.detail-stats span{font-size:var(--text-xs);color:var(--muted)}.detail-stats strong{font-family:var(--sans);color:var(--ink);font-size:22px;font-variant-numeric:tabular-nums}
.detail-item dt,.timeline-source{color:var(--muted);font-size:var(--text-xs)}.detail-item dd,.timeline-item p{font-size:var(--text-base);line-height:1.8}
.detail-grid{gap:var(--space-5) var(--space-6)}
.timeline-item{border-color:var(--line)}.timeline-title h3{font-family:var(--sans);font-size:var(--text-section)}
.timeline-follow{background:var(--surface-alt);border-radius:var(--radius-input);font-size:var(--text-sm);color:var(--muted)}
.timeline-meta{color:var(--muted);font-size:var(--text-xs)}.timeline-item .impact{color:var(--muted)}
.export-options{gap:var(--space-6)}.export-options h3{font-family:var(--sans);font-size:var(--text-section)}.export-options p{font-size:var(--text-sm);color:var(--muted)}
.transfer-code{font-size:var(--text-sm);line-height:1.7;background:var(--surface-alt);border-color:var(--border-strong)}
.backup-history li{font-size:var(--text-sm);border-color:var(--line)}
#toast{background:var(--toast-bg);color:var(--toast-ink);border-radius:var(--radius-input);font-size:var(--text-base);box-shadow:var(--shadow);transition:none}
/* Gifts retain individual records, including later feedback. */
.gift-editor{border-top:1px solid var(--line);padding-top:var(--space-5)}
.gift-section-head{margin-bottom:var(--space-4)}.gift-section-head h3{margin-bottom:6px}
.gift-entry{min-width:0;border:1px solid var(--line);border-radius:var(--radius-input);padding:var(--space-4);margin:0 0 var(--space-4);background:var(--surface-alt)}
.gift-entry legend{padding:0 6px;color:var(--muted);font-size:var(--text-xs)}
.gift-entry-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4)}
.gift-entry .field{min-width:0}.gift-entry .field label{font-size:var(--text-sm)}
.gift-entry textarea{min-height:76px;resize:vertical}
.gift-entry [data-remove-gift]{margin-top:var(--space-2);padding-left:0}
.gift-person-name{font-size:var(--text-lg);font-weight:600;margin-bottom:var(--space-4)}
.gift-table table{width:100%;min-width:0}.gift-table td.wrap{white-space:pre-wrap;overflow-wrap:anywhere}
.gift-table.with-person th:nth-child(1){width:12%}.gift-table.with-person th:nth-child(2){width:13%}.gift-table.with-person th:nth-child(3){width:19%}.gift-table.with-person th:nth-child(4){width:22%}.gift-table.with-person th:nth-child(5){width:24%}.gift-table.with-person th:nth-child(6){width:10%}
.gift-table.person-history th:nth-child(1){width:15%}.gift-table.person-history th:nth-child(2){width:16%}.gift-table.person-history th:nth-child(3),.gift-table.person-history th:nth-child(4){width:28%}.gift-table.person-history th:nth-child(5){width:13%}
.gift-empty{padding:var(--space-6)}.gift-recipients{margin-top:var(--space-8)}.gift-recipients>h2{margin-bottom:var(--space-4)}
.gift-recipient{display:grid;grid-template-columns:minmax(140px,1fr) minmax(0,3fr) auto;gap:var(--space-5);align-items:center;padding:var(--space-5) var(--space-6);border-bottom:1px solid var(--line)}
.gift-recipient:last-child{border-bottom:0}.gift-recipient p{margin:5px 0 0;overflow-wrap:anywhere}
/* Opening rules: a centered reading panel, with steady header and footer. */
.group-rules{width:min(700px,calc(100vw - 48px));max-width:none;height:min(800px,calc(100dvh - 48px));max-height:none;inset:0;margin:auto;padding:0;overflow:hidden;border:1px solid var(--line);border-radius:16px;background:var(--surface);color:var(--ink);box-shadow:0 20px 80px #10182824}
.group-rules[open]{animation:rules-center-in 280ms cubic-bezier(.22,1,.36,1) both}
.group-rules::backdrop{background:#1824344d;backdrop-filter:blur(2px);animation:rules-screen-in 240ms ease-out both}
.group-rules.rules-closing{animation:rules-center-out 220ms cubic-bezier(.4,0,1,1) both;pointer-events:none}
.group-rules.rules-closing::backdrop{animation:rules-screen-out 220ms ease-in both}
.group-rules-sheet{display:flex;flex-direction:column;height:100%;max-height:none;min-height:0}
.group-rules-header{display:flex;align-items:center;justify-content:space-between;gap:20px;flex:none;padding:24px 32px 18px;text-align:left;background:var(--surface);border:0}
.group-rules-header span{font-size:12px;color:var(--muted)}
.group-rules-header h2{font-family:var(--sans);font-size:28px;letter-spacing:-.03em;font-weight:650;line-height:1.25;margin:7px 0 0;outline:none}
.rules-close{align-self:flex-start;border:1px solid var(--line);border-radius:50%;width:34px;height:34px;padding:8px}
.rules-sections{display:flex;gap:4px;padding:0 28px 14px;flex:none}
.rules-sections button{padding:8px 10px;min-height:36px;border-radius:6px;font-size:12px;color:var(--muted);white-space:nowrap}
.rules-sections button:hover{background:var(--surface-alt)}.rules-sections button[aria-current]{background:var(--blue-soft);color:var(--blue);font-weight:600}
.rules-progress{display:block;flex:none;height:2px;width:100%;border:0;background:var(--line);color:var(--blue)}
.rules-progress::-webkit-progress-bar{background:var(--line)}.rules-progress::-webkit-progress-value{background:var(--blue)}.rules-progress::-moz-progress-bar{background:var(--blue)}
.group-rules-body{padding:28px 32px 32px;min-height:0;flex:1;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;text-align:left;font-size:15px;line-height:1.85}
.rules-section{outline:none;padding:0 0 24px;margin:0 0 28px;border-bottom:1px solid var(--line)}.rules-section:last-child{border:0;padding-bottom:0;margin-bottom:0}
.rules-section h3{font-size:18px;font-weight:650;margin:0 0 18px;color:var(--ink)}
.group-rules-body p{line-height:1.85;margin:0 0 18px}.group-rules-body p:last-child{margin:0}
.rules-raise-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid var(--line);border-radius:10px;overflow:hidden;margin:22px 0;background:var(--surface-alt)}
.rules-raise-grid>div{padding:12px 16px;font-size:14px;border-bottom:1px solid var(--line)}.rules-raise-grid>div:nth-child(odd){border-right:1px solid var(--line)}.rules-raise-grid>div:nth-last-child(-n+2){border-bottom:0}
.rules-formula-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0}.rules-formula-grid p{margin:0;border-left:2px solid var(--border-strong);padding:4px 0 4px 14px;color:var(--muted);font-size:14px}
.group-rules-body .group-rules-verse{font-family:var(--sans);font-weight:600;font-size:20px;line-height:1.8;letter-spacing:0;color:var(--blue);padding:16px 20px;background:var(--blue-soft);border-radius:8px}
.group-rules-body .group-rules-ending{font-weight:600;color:var(--ink);border-top:1px solid var(--line);padding:24px 0 0;margin-top:24px}
.group-rules-footer{flex:none;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 24px;background:var(--surface);border-top:1px solid var(--line);text-align:left;box-shadow:0 -8px 20px #17223604}
.group-rules-footer>span{font-size:12px;color:var(--muted)}.group-rules-footer .btn{min-height:42px;padding:10px 18px;font-size:14px}
@keyframes rules-center-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes rules-center-out{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(4px)}}
@keyframes rules-screen-in{from{opacity:0}to{opacity:1}}
@keyframes rules-screen-out{from{opacity:1}to{opacity:0}}
@media(max-width:600px){
 .group-rules{width:100%;height:calc(100dvh - 20px);inset:auto 0 0;margin:0;border-radius:18px 18px 0 0;border-bottom:0}
 .group-rules[open]{animation-name:rules-sheet-in}.group-rules.rules-closing{animation-name:rules-sheet-out}
 .group-rules-header{padding:20px 20px 16px}.group-rules-header h2{font-size:24px}.group-rules-header span{font-size:11px}
 .rules-sections{padding:0 12px 12px;gap:0;justify-content:space-between}.rules-sections button{font-size:11px;padding:8px 7px;min-height:38px}
 .group-rules-body{padding:24px 20px;font-size:14px}.rules-section h3{font-size:17px}.rules-raise-grid>div{padding:10px;font-size:12px}.rules-formula-grid{grid-template-columns:1fr}
 .group-rules-body .group-rules-verse{font-size:18px;padding:14px 16px}.group-rules-footer{padding:12px 16px max(12px,env(safe-area-inset-bottom));gap:10px}.group-rules-footer>span{display:none}.group-rules-footer .btn{width:100%;min-height:44px}
}
@keyframes rules-sheet-in{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}
@keyframes rules-sheet-out{to{opacity:0;transform:translateY(24px)}}
/* The existing title easter egg follows both themes. */
.brand-easter{border-radius:var(--radius);border-color:var(--line);color:var(--ink);background:var(--surface);transition:none}
.easter-paper{background:var(--surface)}.easter-paper::after{border-color:var(--line);border-radius:var(--radius-input)}
.easter-title{color:var(--blue);text-shadow:none}.easter-kicker,.easter-caption,.easter-hint{color:var(--muted)}
.easter-close{border-color:var(--line);background:var(--surface-alt);color:var(--ink)}
.easter-orbit,.easter-orbit::before,.easter-orbit::after{border-color:var(--line)}
.easter-rule{background:var(--line)}.easter-rule i{background:var(--blue)}
/* The same hierarchy adapts to a narrow work area and to touch. */
@media(min-width:1700px){.workspace{margin-right:auto}}
@media(max-width:1180px){
 :root{--sidebar-width:196px}
 .sidebar{padding-inline:10px}.brand-title strong{font-size:14px}.brandmark{width:27px;height:29px}
 .workspace{padding-inline:24px}.workspace-topline{margin-inline:-24px;padding-inline:24px}
 .self-editor-layout,.self-reader-layout{grid-template-columns:minmax(0,1fr) 148px;gap:20px}
 .self-outline nav button{padding:8px 6px;gap:6px}.self-outline-head{padding-inline:6px}
 .self-paper-section{padding:20px}.self-card-intro{padding:20px}
 .self-writing-guide ul{columns:1}
}
@media(min-width:761px) and (max-width:1000px){
 :root{--sidebar-width:176px}
 .brand small{display:none}.brand{gap:6px;padding:0}.brand-title strong{font-size:13px}.nav button{font-size:13px;padding-inline:8px;gap:8px}
 .workspace{padding-inline:20px}.workspace-topline{margin-inline:-20px;padding-inline:20px}
 .self-editor-layout,.self-reader-layout{display:block}.self-outline{position:static;padding:0;margin-bottom:20px}
 .self-outline-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:0 0 12px}.self-outline-head p{margin:0;margin-left:auto}.self-outline progress{width:100%;margin:0}
 .self-outline nav{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}.self-outline nav button{font-size:11px;gap:4px;padding:6px 4px}.self-outline nav button[aria-current]{box-shadow:none;background:var(--blue-soft);border-radius:5px}
 .self-outline-foot{display:none}.self-reader-layout .self-history{position:static;max-height:none;margin-top:24px}
}
@media(max-width:1050px){
 .people-table .table-wrap,.events-table .table-wrap,.gift-table .table-wrap,.relationship-table .table-wrap,.self-comparison-table{overflow:visible}
 .people-table table,.events-table table,.gift-table table,.relationship-table table,.self-comparison-table table{display:block;min-width:0;width:100%;white-space:normal}
 .people-table thead,.events-table thead,.gift-table thead,.relationship-table thead,.self-comparison-table thead{display:none}
 .people-table tbody,.events-table tbody,.gift-table tbody,.relationship-table tbody,.self-comparison-table tbody{display:block}
 .people-table tr,.events-table tr,.gift-table tr,.relationship-table tr,.self-comparison-table tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3) var(--space-4);padding:var(--space-5);border-bottom:1px solid var(--line)}
 .people-table tr:last-child,.events-table tr:last-child,.gift-table tr:last-child,.relationship-table tr:last-child,.self-comparison-table tr:last-child{border-bottom:0}
 .people-table td,.events-table td,.gift-table td,.relationship-table td,.self-comparison-table td{display:block;min-width:0;max-width:none;border:0;padding:0;font-size:var(--text-base);line-height:1.7}
 td[data-label]::before{content:attr(data-label);display:block;font-size:var(--text-xs);color:var(--muted);line-height:1.5;margin-bottom:var(--space-1)}
 .people-table td:first-child::before,.people-table td:last-child::before,.events-table td:last-child::before,.relationship-table td:last-child::before{display:none}
 .people-table td:first-child,.people-table td:nth-child(3),.events-table td.wrap,.gift-table td.wrap,.gift-table td[data-label="人物"],.relationship-table td.wrap,.self-comparison-table td{grid-column:1/-1}
 .people-table td:last-child,.events-table td:last-child,.gift-table td:last-child,.relationship-table td:last-child{grid-column:1/-1;justify-self:end}
 .people-table td:nth-child(2){grid-column:1/-1}.people-table td:nth-child(3)::before{display:none}
 .gift-recipient{grid-template-columns:1fr auto;gap:var(--space-3)}.gift-recipient>div{grid-column:1/-1;grid-row:2}
}
@media(max-width:760px){
 :root{--header-offset:132px;--sidebar-width:0px;--text-title:1.5rem}
 .sidebar{position:sticky;inset:auto;top:0;width:100%;height:auto;display:grid;grid-template-columns:1fr auto;align-items:center;padding:12px 16px 0;gap:10px 12px;border-right:0;border-bottom:1px solid var(--line);background:var(--surface)}
 .brand{padding:0;gap:8px}.brand-title strong{font-size:15px}.brandmark{width:28px;height:30px}.brandmark svg{width:18px}.brand small{display:none}
 .utility-menu{grid-column:2;grid-row:1;padding:0;margin:0;border:0}.utility-menu>summary{min-height:36px;padding:6px;font-size:12px;gap:6px}.utility-menu>summary svg{width:16px}.utility-menu>summary::after{display:none}
 .side-bottom{left:auto;right:0;top:calc(100% + 8px);max-height:70dvh}
 .sidebar>.local-label{display:none}
 .nav{grid-row:2;grid-column:1/-1;flex-direction:row;justify-content:space-between;margin:0;gap:0;overflow:visible}
 .nav button{flex:1;justify-content:center;gap:5px;padding:12px 4px;border-radius:0;min-height:44px;font-size:12px;position:relative}
 .nav button svg{width:15px;height:15px}.nav button.active,.nav button.active:hover{background:transparent}
 .nav button.active::after{content:"";height:2px;background:var(--blue);position:absolute;left:12px;right:12px;bottom:-1px}.nav .count{display:none}
 .workspace{margin:0;padding:0 16px 28px}.workspace-topline{display:none}.topbar{padding:24px 0 20px;align-items:flex-start;gap:16px;flex-wrap:wrap}
 .topbar>.actions:empty{display:none}.topbar .actions{flex-direction:row;width:auto;justify-content:flex-start}.topbar .btn{min-height:40px;font-size:12px}
 .subtitle{font-size:12px;max-width:34em}.btn{min-height:42px}.btn.small{min-height:36px}.icon-button{width:42px;height:42px}
 .panel-head{padding:16px;gap:12px;flex-wrap:wrap}.panel-body{padding:16px}
 .toolbar{gap:12px;flex-wrap:wrap}.toolbar .search{min-width:100%;max-width:none}.filters{width:100%;gap:8px}.toolbar select{max-width:180px;flex:1}
 .self-editor-layout,.self-reader-layout{display:block}.self-outline{position:static;padding:0;margin-bottom:20px}
 .self-outline-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:0 0 12px}.self-outline-head h2{font-size:12px}.self-outline-head p{margin:0;margin-left:auto;font-size:11px}.self-outline-head strong{font-size:14px}.self-outline progress{width:100%;margin:0;height:3px}
 .self-outline nav{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}.self-outline nav button{min-height:40px;padding:6px 4px;font-size:11px;gap:4px;align-items:flex-start}.self-outline nav button>span{font-size:10px}.self-outline nav button[aria-current]{background:var(--blue-soft);box-shadow:none;border-radius:5px}.self-outline-foot{display:none}
 .self-card-intro{padding:18px 16px}.self-card-intro h2{font-size:18px;margin-bottom:14px}.self-card-intro .self-sincerity{font-size:12px;line-height:1.8}
 .self-paper-section,.self-reader .self-paper-section{padding:20px 16px;border-radius:0}.self-section-heading{margin-bottom:16px}.self-entry-grid{gap:16px 12px}
 .self-entry input,.self-entry textarea,.field input,.field textarea,.field select{font-size:16px}.self-entry .self-choice{min-height:42px;font-size:13px;padding:8px 6px;gap:6px}
 .self-entry .self-writing-guide p,.self-writing-guide li{font-size:12px}.self-writing-guide ul{columns:1}
 .self-save-bar{padding:12px;gap:8px;bottom:0}.self-save-bar>div:first-child{width:100%}.self-save-bar .actions{width:100%;justify-content:flex-end;gap:6px}.self-save-bar .btn{font-size:12px;padding:9px 10px;min-height:40px}
 .self-card-tabs{padding-inline:16px}.self-card-tabs button{font-size:13px}.self-readable-fields dd{font-size:14px}.self-reader-layout .self-history{position:static;max-height:none;margin-top:24px}
 .self-history .panel-body{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
 .people-table tr,.events-table tr,.gift-table tr,.relationship-table tr,.self-comparison-table tr{padding:16px}.people-summary p{-webkit-line-clamp:3}.table-footer{padding:12px 16px}
 .relation-summary{gap:12px;font-size:12px;flex-wrap:wrap}.relation-summary strong{font-size:18px}.relation-controls{padding:16px;gap:12px}.relation-controls label{min-width:0;flex:1}.relation-controls select{max-width:100%;font-size:13px}
 .relationship-graph{height:400px}.graph-tools{width:100%;justify-content:flex-end}.graph-legend{padding:12px 16px;font-size:11px}.relation-table-tools{padding:16px}.relation-table-tools input[type=search]{width:100%;font-size:14px}.relation-tabs{gap:16px}.relation-tabs button{font-size:13px}
 #dialog{max-width:calc(100vw - 16px);max-height:94dvh}.modal-shell{max-height:calc(94dvh - 2px)}.modal-head,.modal-body{padding:16px}.modal-head h2{font-size:18px}.modal-footer{padding:12px 16px}
 .form-grid,.subform,.gift-entry-grid{grid-template-columns:1fr;gap:16px}.detail-stats>div{padding:12px 8px}.detail-stats strong{font-size:16px}.detail-stats span{font-size:11px}.gift-entry{padding:12px}.gift-recipient{padding:16px}
}
@media(prefers-reduced-transparency:reduce){.workspace-topline,.self-save-bar{background:var(--surface);backdrop-filter:none}dialog::backdrop{backdrop-filter:none}}
@media(prefers-contrast:more){:root{--line:var(--border-strong)}.btn,.panel,.self-card-form{border-color:var(--border-strong)}}
/* Motion only responds to navigation and deliberate actions, never to typing. */
@media(prefers-reduced-motion:no-preference){
 button,.utility-menu>summary{transition:background-color var(--dur-fast),color var(--dur-fast),border-color var(--dur-fast)}
 .btn:active,.icon-button:active{transform:scale(.98);transition:transform var(--dur-press)}
 .view-enter{animation:view-enter var(--dur-base) var(--ease-out) both}
 #dialog[open]{animation:dialog-enter var(--dur-base) var(--ease-out) both}
 #dialog[open]::backdrop{animation:backdrop-enter var(--dur-fast) ease-out both}
 #dialog.is-closing{animation:dialog-exit var(--dur-fast) ease-in both;pointer-events:none}
 #toast{transition:opacity var(--dur-fast),transform var(--dur-base) var(--ease-out)}
 .graph-person,.graph-link,.graph-my-edge{transition:opacity var(--dur-fast)}
 .graph-enter .graph-person,.graph-enter .graph-me{animation:node-enter var(--dur-base) ease-out both}
 .graph-enter .graph-link,.graph-enter .graph-my-edge{animation:backdrop-enter var(--dur-graph) ease-out both}
 .brand-easter,.brand-easter::backdrop{transition:opacity var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out)}
}
@keyframes view-enter{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@keyframes dialog-enter{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes dialog-exit{to{opacity:0;transform:translateY(4px) scale(.99)}}
@keyframes backdrop-enter{from{opacity:0}to{opacity:1}}
@keyframes node-enter{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}

/* Compact native selectors retain keyboard and platform accessibility. */
.self-entry select{display:block;width:100%;min-height:38px;padding:7px 32px 7px 10px;border:1px solid var(--border-strong);border-radius:var(--radius-input);font:var(--text-base)/1.6 var(--sans);background-color:var(--surface);color:var(--ink)}
.self-entry select:required:invalid{color:var(--muted)}
/* Salary illustration: one common scale, a clear doubling mark, exact yearly values. */
.salary-figure{margin:24px 0 28px;padding:22px 0;border-block:1px solid var(--border-strong);font-family:var(--sans);font-size:13px;color:var(--ink)}
.salary-figure figcaption strong{display:block;font-size:17px;line-height:1.6;font-weight:600}
.salary-figure figcaption>span{display:block;margin-top:5px;font-size:12px;color:var(--muted)}
.salary-rate-picker{margin:18px 0;display:flex;align-items:center;gap:12px}
.salary-rate-picker>span{font-size:12px;color:var(--muted);flex:none}
.salary-rate-picker>div{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;flex:1}
.salary-rate-picker button{font:13px var(--sans);min-height:38px;border:1px solid var(--line);border-radius:4px;color:var(--muted);background:var(--paper)}
.salary-rate-picker button:hover{border-color:var(--ink)}
.salary-rate-picker button[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.group-rules-body .salary-result{font:13px/1.8 var(--sans);margin:0 0 18px}
.salary-result strong{font-weight:600;font-variant-numeric:tabular-nums}
.salary-scale,.salary-years li{display:grid;grid-template-columns:52px minmax(0,1fr) 67px;gap:10px;align-items:center}
.salary-scale{font-size:11px;color:var(--muted);margin-bottom:10px}
.salary-scale>div{position:relative;height:20px}.salary-scale>div span{position:absolute;left:0;transform:translateX(-50%)}.salary-scale>div span:first-child{transform:none}.salary-scale>div span:nth-child(2){left:33.333%}.salary-scale>div span:nth-child(3){left:66.667%}.salary-scale>div span:last-child{left:100%;transform:translateX(-100%)}
.salary-scale>span:last-child{text-align:right}.salary-target-label{color:var(--red);font-weight:600}
.salary-years{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.salary-years li{font:12px/1.7 var(--sans)}.salary-years strong{font-size:14px;text-align:right;font-weight:500;font-variant-numeric:tabular-nums}
.salary-years svg{display:block;width:100%;height:18px;overflow:visible}.salary-track{fill:var(--sunken)}.salary-bar{fill:var(--ink)}.salary-target-line{stroke:var(--red);stroke-width:1;stroke-dasharray:2 2}.salary-doubled .salary-bar{fill:var(--red)}.salary-doubled strong{color:var(--red);font-weight:600}
.group-rules-body .salary-comparison{font:12px/1.75 var(--sans);color:var(--ink);margin:18px 0 0}
.group-rules-body .salary-assumption{font:11px/1.75 var(--sans);color:var(--muted);margin:8px 0 0}
@media(max-width:600px){.salary-figure{padding:18px 0}.salary-rate-picker{display:block}.salary-rate-picker>span{display:block;margin-bottom:7px}.salary-rate-picker button{min-height:44px;font-size:12px}.salary-scale,.salary-years li{grid-template-columns:43px minmax(0,1fr) 57px;gap:8px}.salary-years strong{font-size:13px}.salary-figure figcaption strong{font-size:16px}}

/* Long gift feedback stays compact in both the ledger and a person's history. */
.gift-table td{vertical-align:top}
.gift-feedback-preview{white-space:normal;min-width:0}
.gift-feedback-preview p{margin:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;overflow-wrap:anywhere;line-height:1.7}
.gift-feedback-open{display:block;margin-top:5px;min-height:32px;padding:3px 0;color:var(--ink);font:12px/1.6 var(--sans);text-decoration:underline;text-underline-offset:3px}
.gift-feedback-open:hover{color:var(--muted)}
.gift-feedback-context{padding-bottom:18px;margin-bottom:20px;border-bottom:1px solid var(--line)}.gift-feedback-context>span{font-size:12px;color:var(--muted)}.gift-feedback-context p{font-size:14px;margin:6px 0 0;white-space:pre-wrap;overflow-wrap:anywhere}
.gift-feedback-full{white-space:pre-wrap;overflow-wrap:anywhere;font:16px/1.9 var(--sans);color:var(--ink);user-select:text}
@media(max-width:600px){.gift-feedback-open{min-height:44px}.gift-feedback-full{font-size:15px}}

.salary-years svg{stroke:none}.salary-years rect{stroke:none}.salary-scale>div span{white-space:nowrap}

/* Password visibility: a native button, independent from form submission. */
.pw-field{position:relative;min-width:0}
.field .pw-field>input{width:100%;min-height:48px;padding-right:56px}
.pw-toggle{position:absolute;right:2px;top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border:0;border-radius:3px;background:transparent;color:var(--muted);cursor:pointer}
.pw-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.pw-toggle svg[hidden]{display:none}
.pw-toggle[aria-pressed=true]{color:var(--ink)}
.pw-toggle:focus-visible{outline:2px solid var(--ink);outline-offset:-4px;color:var(--ink)}
.pw-toggle:active{transform:translateY(-50%) scale(.97)}
@media(hover:hover){.pw-toggle:hover{color:var(--ink);background:var(--sunken)}}
.people-toolbar{flex-wrap:wrap;align-items:center;row-gap:12px}
.people-toolbar .filters{display:flex;flex-wrap:wrap;gap:8px;min-width:0}
.people-toolbar .filters select{max-width:100%;min-width:112px}
.people-filter-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:-8px 0 20px;color:var(--muted);font-size:12px}
.people-filter-summary>span:last-child{display:flex;align-items:center;gap:16px}
.people-filter-summary small{font-size:11px}
.filter-reset{border:0;background:transparent;color:var(--ink);padding:7px 0;text-decoration:underline;text-underline-offset:4px;cursor:pointer;font:inherit}
.record-pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;border-top:1px solid var(--line);color:var(--muted);font-size:12px;background:var(--paper)}
.record-pagination>div{display:flex;align-items:center;gap:12px}.record-pagination .btn{min-height:40px}.record-pagination button:disabled{opacity:.4;cursor:default}
.preview-notice{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 16px;padding:12px 16px;margin-bottom:24px;border:1px dashed var(--border-strong);background:var(--paper);font:12px/1.8 var(--sans);color:var(--muted)}
.preview-notice strong{color:var(--ink);font-weight:600}
@media(max-width:760px){.people-toolbar .filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.people-toolbar .filters select{min-width:0;width:100%}.people-view-switch{display:flex}.people-view-switch button{flex:1}.record-pagination{padding:14px;flex-wrap:wrap;justify-content:center}.people-filter-summary{margin-top:0}.people-filter-summary small{display:none}}
#self-section-1 .self-entry-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:600px){#self-section-1 .self-entry-grid{grid-template-columns:repeat(2,minmax(0,1fr))}#self-section-1 .self-entry:has(#self-orient){grid-column:1/-1}}

/* Relationship structure: names on the canvas, detail on demand. */
.relationship-presets{display:flex;flex-wrap:wrap;gap:8px}.relationship-presets small{width:100%;color:var(--muted)}
/* All visible connections use the same thin stroke. */
.relationship-graph .graph-link,.relationship-graph .graph-my-edge{cursor:pointer;outline:none;opacity:.56}
.relationship-graph .graph-my-edge{opacity:.17}
.relationship-graph .graph-link .graph-connection,.relationship-graph .graph-my-edge .graph-connection{stroke:var(--ink);stroke-width:1;fill:none;vector-effect:non-scaling-stroke;stroke-linecap:round}
.relationship-graph .graph-link .graph-hit,.relationship-graph .graph-my-edge .graph-hit{stroke:transparent;stroke-width:14;fill:none;vector-effect:non-scaling-stroke;pointer-events:stroke}
.relationship-graph .graph-arrow{stroke:var(--ink);stroke-width:1.3;fill:none;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.relationship-graph .graph-link:hover,.relationship-graph .graph-link:focus-visible,.relationship-graph .graph-my-edge:hover,.relationship-graph .graph-my-edge:focus-visible,.relationship-graph .graph-related{opacity:1}
.relationship-graph .graph-link.graph-muted,.relationship-graph .graph-my-edge.graph-muted{opacity:.055}
.relationship-graph .graph-person.graph-muted{opacity:.3}
.relationship-graph .graph-person rect{stroke-width:1;fill:var(--surface);stroke:var(--border-strong)}
.relationship-graph .graph-person:hover rect,.relationship-graph .graph-person:focus-visible rect,.relationship-graph .graph-person.graph-related rect{stroke:var(--ink);stroke-width:1.5;fill:var(--surface)}
.relationship-graph .graph-name{font-size:14px;font-weight:500}
.relationship-graph .graph-me{cursor:pointer}.relationship-graph .graph-me rect{fill:var(--ink);stroke:var(--surface);stroke-width:2}.relationship-graph .graph-me text{fill:var(--surface);font-size:15px}
.relationship-graph.hide-self-links .graph-my-edge{display:none}
.graph-selection{min-height:68px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 22px;border-top:1px solid var(--line);color:var(--muted);font-size:13px}.graph-selection strong{color:var(--ink);margin-right:auto}
.relation-controls .graph-self-toggle{flex-direction:row;align-items:center;gap:8px;min-height:44px}
.graph-legend .legend-self{border-color:var(--muted)!important;opacity:.5}.graph-legend .legend-confirmed,.graph-legend .legend-uncertain{border-color:var(--ink)!important}


/* Company groups reuse original person records. */
.group-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,310px),1fr));gap:20px}.group-card{padding:24px;display:flex;flex-direction:column}.group-kicker{font-size:11px;color:var(--muted)}.group-card h2{margin:14px 0 10px;font-size:24px}.group-card h2 button{text-align:left;color:var(--ink);font:inherit}.group-card>p{color:var(--muted);font-size:14px;line-height:1.7;min-height:48px}.group-members-preview{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0 24px}.group-members-preview span{font-size:12px;border:1px solid var(--line);padding:4px 8px}.group-card footer{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:16px;border-top:1px solid var(--line);flex-wrap:wrap}.group-card footer>span{margin-right:auto;font-size:12px;color:var(--muted)}
.group-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.group-heading h2{margin:14px 0 8px}.group-heading p{color:var(--muted);font-size:14px}.group-picker{margin-top:24px}.group-picker>input{width:100%;margin:12px 0}.group-picker-tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px}.group-picker-tools span{font-size:12px;color:var(--muted);margin-left:auto}.group-picker-list{max-height:320px;overflow-y:auto;border:1px solid var(--line);border-radius:6px}.group-member-option{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line);cursor:pointer}.group-member-option[hidden]{display:none}.group-member-option:last-child{border-bottom:0}.group-member-option>span{min-width:0;display:grid;gap:4px}.group-member-option small{color:var(--muted);font-size:12px}.group-member-option input{width:18px;height:18px;flex-shrink:0}.person-group-picker{border:1px solid var(--line);padding:16px;border-radius:6px;display:flex;flex-wrap:wrap;gap:12px}.person-group-picker legend{padding:0 6px;font-weight:600}.person-group-picker small{width:100%;color:var(--muted)}
@media(max-width:760px){.group-heading{align-items:flex-start;flex-direction:column}.group-heading .actions{flex-wrap:wrap}.group-card{padding:20px}}

.group-add-panel{border:1px solid var(--line);background:var(--surface);padding:20px;margin:20px 0;display:grid;grid-template-columns:1fr minmax(230px,1fr);align-items:center;gap:12px 24px}.group-add-panel h3{font-size:16px;margin:0 0 6px}.group-add-panel p{font-size:12px;color:var(--muted);margin:0}.group-add-panel>input{width:100%;min-width:0}.group-add-panel #group-add-results{grid-column:1/-1}.group-add-results:empty{display:none}.group-add-result{display:flex;justify-content:space-between;align-items:center;padding:12px 0;gap:12px;border-top:1px solid var(--line)}.group-add-result>span{display:grid;gap:4px}.group-add-result small{font-size:12px;color:var(--muted)}.group-drop-rail{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:20px 0}.group-drop-rail>span{font-size:12px;color:var(--muted)}.group-drop-rail [data-group-drop]{border:1px dashed var(--line);padding:12px 20px;min-height:44px;display:flex;align-items:center;border-radius:6px;font-size:13px;background:var(--surface)}.group-drop-active{outline:2px solid var(--ink)!important;outline-offset:2px;background:var(--surface-sunken)!important}.group-drag-handle{cursor:grab}.group-drag-handle:active{cursor:grabbing}.group-members-preview button{min-height:44px;font-size:12px;border:1px solid var(--line);padding:4px 8px;color:var(--ink);cursor:grab;text-align:left}
@media(max-width:760px){.group-add-panel{grid-template-columns:1fr;padding:16px}.group-drop-rail>span{width:100%}}
