/* Paniym City night edition. Brand yellow stays #eab203. */
:root {
  color-scheme: dark;
  --yellow: #eab203;
  --ink: #f7f7f7;
  --muted: #c2c2c2;
  --line: #303030;
  --paper: #0b0b0b;
  --surface: #151515;
  --surface-raised: #1c1c1c;
  --surface-hover: #242424;
  --green: #81d5a1;
  --amber: #f4ce6b;
  --red: #ffaaa4;
  --blue: #a4c6ff;
  background: var(--paper);
  color: var(--ink);
}
html, body, .app-shell, .workspace { background: var(--paper); color: var(--ink); }
body { accent-color: var(--yellow); }
::selection { background: #eab203; color: #0b0b0b; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, [tabindex]:focus-visible { outline-color: var(--yellow); }
.sidebar { background: #080808; color: var(--ink); border-right: 1px solid #242424; }
.brand-type small, .workspace-label, .family-switch label, .vision-note small,
.workspace-owner small, .loading-title span, .loading-brand p { color: var(--muted); }
.nav-button { color: #eeeeee; }
.nav-button:hover, .workspace-owner:hover { background: var(--surface-hover); color: white; }
.nav-button .count { background: #303030; color: white; }
.nav-button.active { background: var(--yellow); color: #0b0b0b; }
.nav-button.active .count { background: #c99a03; color: #0b0b0b; }
.vision-note, .workspace-owner { border-color: var(--line); }
.family-switch select { background: var(--surface); border-color: #414141; color: white; }
.owner-avatar, .pc-avatar { background: #303030; color: white; border-color: #494949; }
.topbar, .roadmap-controls, .roadmap-footer { background: #111111; border-color: var(--line); }
.breadcrumbs, .breadcrumbs strong, .save-state, .eyebrow, .intro,
.summary-left, .summary-count, .summary-count strong, .summary-count .icon,
.status-summary, .page-footer, .page-footer strong, .page-footer .footer-brand,
.drag-hint, .family-title { color: var(--ink); }
.intro, .breadcrumbs, .eyebrow, .summary-left, .summary-count,
.save-state, .page-footer, .page-footer .footer-brand, .drag-hint { color: var(--muted); }
.button { background: var(--surface-raised); color: white; border-color: #414141; }
.button:hover, .icon-button:hover { background: #2a2a2a; color: white; }
.button.primary { background: var(--yellow); border-color: var(--yellow); color: #0b0b0b; }
.button.primary:hover { background: #f6c21b; border-color: #f6c21b; color: #0b0b0b; }
.button.dark { background: #303030; color: white; border-color: #4a4a4a; }
.button.danger { color: #ffc5c0; border-color: #75453f; background: #271816; }
.button.danger:hover { background: #3b211e; }
.icon-button, .today-button { color: white; border-color: #414141; }
.year-control select, .key-toggle { color: white; }
.segmented { background: #090909; border-color: #363636; }
.view-button { color: #e0e0e0; }
.view-button:hover { background: #242424; color: white; }
.view-button.active { background: var(--yellow); color: #0b0b0b; box-shadow: none; }
.roadmap-card { background: var(--surface); border-color: #353535; box-shadow: 0 10px 28px #00000020; }
.timeline-scroll { scrollbar-color: #494949 #111111; }
.timeline-header, .project-column-head, .milestone-head, .milestone-label {
  background: var(--surface); border-color: var(--line); color: white;
}
.project-column-head span:last-child, .quarter-label, .quarter-label small, .month,
.project-subline, .task-label-button, .offscreen-note, .range-note { color: var(--muted); }
.quarters, .quarter-label, .month, .project-label, .timeline-cell,
.task-row .project-label, .task-row .timeline-cell { border-color: #292929; }
.month-line { border-left-color: #242424; }
.month-line.quarter-line { border-left-color: #424242; }
.key-line { border-left-color: #eab203; opacity: .6; }
.milestone-label:hover { background: #332b12; color: white; }
.milestone-label .diamond { background: var(--yellow); }
.project-label { background: var(--surface); color: white; }
.project-label:hover { background: #202020; }
.project-group.is-expanded > .project-row > .project-label { background: #1c1c1c; }
.project-group.is-expanded > .project-row > .timeline-cell { background: #ffffff03; }
.task-row .project-label { background: #181818; }
.task-row .timeline-cell { background: #ffffff02; }
.grip, .chevron { color: #c2c2c2; }
.task-row .project-label .task-branch { border-color: #656565; }
.ontrack { --status: #81d5a1; --tint: #193026; --bar: #203b2d; --dark: #ffffff; }
.atrisk { --status: #f4ce6b; --tint: #332b17; --bar: #42351a; --dark: #ffffff; }
.blocked { --status: #ffaaa4; --tint: #382221; --bar: #462927; --dark: #ffffff; }
.ahead { --status: #a4c6ff; --tint: #202c40; --bar: #283952; --dark: #ffffff; }
.todo { --status: #cccccc; --tint: #303030; }
.doing { --status: #a4c6ff; --tint: #202c40; }
.done { --status: #81d5a1; --tint: #193026; }
.status-label, .status-pill, .task-status-select, .task-marker { color: white; }
.status-label .dot, .status-pill .dot { background: var(--status); }
.timeline-bar { color: white; border-color: color-mix(in srgb, var(--status) 35%, transparent); }
.timeline-bar:hover { box-shadow: 0 4px 16px #00000060; }
.bar-avatar { background: #ffffff16; color: white; }
.drag-date-label { background: #080808; color: white; border: 1px solid #5a5a5a; }
.add-project-row, .no-projects { background: var(--surface); color: var(--ink); border-color: var(--line); }
.add-project-row:hover { background: var(--surface-hover); color: var(--yellow); }
.no-projects h3 { color: white; }
.loading-screen { background: #080808; }
.loading-progress { background: #333333; }
.overlay, .modal-overlay { background: #000000b3; }
.drawer, .modal, .hover-card { background: var(--surface); color: white; border-color: #414141; box-shadow: 0 15px 60px #00000070; }
.drawer-foot, .modal-footer { background: #111111; border-color: var(--line); }
.drawer-kicker, .drawer-foot .saved-note, .form-label, .section-title small,
.section-title h3 .icon, .modal-head p, .task-dates .form-label { color: var(--muted); }
.input { background: #101010; color: white; border-color: #414141; }
.input:focus { border-color: var(--yellow); outline-color: #eab20340; }
.input::placeholder { color: #b0b0b0; }
.input:disabled { color: #dedede; -webkit-text-fill-color: #dedede; opacity: .7; }
.input.large-name { color: white; background: transparent; }
.input.large-name:hover, .input.large-name:focus { border-color: #505050; }
select option { background: #151515; color: white; }
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
  -webkit-text-fill-color: white; -webkit-box-shadow: 0 0 0 1000px #101010 inset; caret-color: white;
}
.contact-chip { background: #292929; color: white; }
.contact-chip .mini-avatar { background: #414141; color: white; }
.remove-chip, .deliverable-row .icon { color: #dedede; }
.deliverable-input, .task-card-name { color: white; }
.deliverable-input:hover, .deliverable-input:focus { border-color: #505050; }
.small-text-button, .switch-label, .task-description-toggle { color: white; }
.small-text-button:hover, .task-description-toggle:hover { color: var(--yellow); }
.switch-label input { background: #4b4b4b; }
.progress-track { background: #303030; }
.progress-track span { background: var(--yellow); }
.task-card { background: #1b1b1b; border-color: #393939; }
.form-error, .sync-error { background: #351e1c; color: #ffffff; border-color: #87534d; }
.save-state[data-status=error] { color: #ffc5c0; }
.milestone-calendar { background: #332b17; border-color: #65511b; color: white; }
.milestone-info p, .milestone-info small, .directory-card p, .directory-card-bottom,
.guide-item p, .empty-mini, .hover-card p, .hover-card .hover-dates { color: var(--muted); }
.directory-card { background: var(--surface-raised); border-color: #393939; color: white; }
.directory-card:hover { background: #262626; border-color: #675620; }
.guide-number { background: #3b3014; color: white; }
.storage-note, .read-only-note { background: #242424; color: white; border-color: #414141; }
.toast { background: #222222; border-color: #5b5130; color: white; box-shadow: 0 10px 30px #00000070; }
.toast button { color: var(--yellow); }
.auth-page { background: radial-gradient(ellipse at 50% 0%, #eab2030c, transparent 65%), #080808; }
.auth-panel { background: #141414; border-color: #333333; box-shadow: 0 25px 80px #00000050; }
.auth-footnote, .form-hint, .family-option small, .profile-card p { color: var(--muted); }
.family-option { background: #191919; border-color: #393939; color: white; }
.family-option:has(input:checked) { background: #302813; border-color: var(--yellow); }
.pending-list strong { color: white; }
.account-banner { background: #2d2614; border-color: #6d5720; color: white; }
.account-banner.view-only { background: #242424; border-color: #484848; color: white; }
.profile-card .owner-avatar { background: #332b17; color: white; border: 1px solid #806716; }
.person-card { background: #1c1c1c; color: white; border-color: #414141; }
.person-card .owner-avatar { background: #343434; color: white; }
.person-card small { color: var(--muted); }
.person-card.head { background: #302813; border-color: var(--yellow); }
.tree-trunk, .tree-members .person-card:before { background: #8b7129; }
.tree-members { border-top-color: #8b7129; }
.person-result { background: #1c1c1c; color: white; border-color: #414141; }
.person-result:hover { background: #302813; border-color: var(--yellow); }
.person-result small, .audit-row p, .audit-row small { color: var(--muted); }
.access-editor { background: #211e14; border-color: #6d5720; color: white; }
.audit-detail { background: #0b0b0b; color: white; border: 1px solid #393939; }
/* Existing inline helper text follows the night palette, including confirmation dialogs. */
[style*="color:#7d8a70"], [style*="color:#38482c"], [style*="color:#acb5a1"] { color: var(--ink) !important; }
[style*="color:#b47765"] { color: #ffc5c0 !important; }
/* Shared projects: multi-family selection lives in a compact dropdown. */
.collaboration-block{margin:0 0 20px}.collaboration-picker{position:relative;border:1px solid #414141;border-radius:6px;background:#101010;color:white}.collaboration-picker summary{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:11px;cursor:pointer;list-style:none;min-height:40px;font-size:12px}.collaboration-picker summary::-webkit-details-marker{display:none}.collaboration-picker summary .icon{width:14px;flex-shrink:0}.collaboration-picker[open]{border-color:var(--yellow)}.collaboration-picker[open] summary .icon{transform:rotate(180deg)}.collaboration-options{border-top:1px solid #333;max-height:240px;overflow:auto;padding:6px;display:grid;grid-template-columns:1fr 1fr;gap:3px}.collaboration-options label{display:flex;align-items:center;gap:9px;font-size:11px;padding:9px;border-radius:4px;cursor:pointer}.collaboration-options label:hover{background:#262626}.collaboration-options label:has(input:checked){background:#302813}.collaboration-options input{accent-color:var(--yellow);margin:0;width:14px;height:14px}.collaboration-options label:has(input:disabled){cursor:default}.collaboration-tag{display:inline-flex;align-items:center;gap:3px;font-size:8px;color:white;background:#302813;border:1px solid #65511c;border-radius:3px;padding:2px 4px}.collaboration-tag .icon{width:10px;height:10px}.project-subline{flex-wrap:wrap;gap:5px}
@media(max-width:420px){.collaboration-options{grid-template-columns:1fr}}