/* Shared visual system. Loaded after legacy styles to allow incremental rollout. */
html { --primary:#2459c4; --deep:#19449b; --bg:#f5f6f8; --card:#fff; --solid:#fff; --text:#202936; --muted:#616d7d; --border:#dce1e8; --shadow:0 2px 8px #17253b08; --success:#16805a; --danger:#b82c44; --text-main:var(--text); --text-muted:var(--muted); --page-bg:var(--solid); --line:var(--border); }
html[data-theme="dark"] { --primary:#94b6ff; --deep:#b7ceff; --bg:#15191f; --card:#1d232c; --solid:#1d232c; --text:#e7ecf3; --muted:#acb7c7; --border:#384353; --shadow:none; --success:#6ed3a5; --danger:#ff9bad; --text-main:var(--text); --text-muted:var(--muted); --page-bg:var(--solid); --line:var(--border); --section-treasures:#9ac8d1; --section-treasures-text:#9ac8d1; --section-ministry:#e6bd76; --section-living:#f19ca9; --section-neutral:#c2baa9; }
body,html[data-theme="dark"] body { background:var(--bg); line-height:1.55; }
[hidden] { display:none!important; }
.main,.content,.field,.topbar-left { min-width:0; }
.app { grid-template-columns:246px minmax(0,1fr); }
.sidebar,html[data-theme="dark"] .sidebar { background:var(--solid); padding:18px 12px; overflow-y:auto; backdrop-filter:none; }
.topbar,html[data-theme="dark"] .topbar { background:var(--solid); min-height:72px; height:auto; padding:12px 24px; backdrop-filter:none; gap:12px; }
.content { width:100%; max-width:1500px; margin-inline:auto; padding:28px; }
.content>section,.content>details { margin-bottom:20px; }
h1,.page-title h1 { font-size:clamp(26px,3vw,36px); letter-spacing:-.025em; font-weight:650; line-height:1.2; }
h2,h3,.clm-title-line h2 { font-weight:650; }
.clm-title-line h2 { font-size:clamp(21px,2vw,28px); }
.clm-date-line strong { font-size:clamp(18px,1.8vw,23px); font-weight:600; }
.card,.program,.group-view-card,.admin-entry-card,.modal-card { border:1px solid var(--border); border-radius:12px; background:var(--card); box-shadow:var(--shadow); padding:24px; }
.card .card { box-shadow:none; }
.program,.clm-program,.clm-planning-program { color:var(--text); background:var(--card); }
button,.primary,.secondary,.ghost,.danger,.tabs button,.subtabs button,.nav button { font-weight:600; border-radius:8px; box-shadow:none; min-height:44px; }
.primary,.tabs button.active,.subtabs button.active,.user-tabs button.active { background:var(--primary); color:#fff; border-color:var(--primary); box-shadow:none; }
html[data-theme="dark"] .primary,html[data-theme="dark"] .tabs button.active,html[data-theme="dark"] .subtabs button.active { background:#315fb2; border-color:#648bd6; color:#fff; }
.secondary { background:var(--solid); color:var(--primary); border:1px solid var(--border); }
.danger { background:transparent; color:var(--danger); border:1px solid var(--danger); }
.ghost { color:var(--primary); }
button:hover { filter:brightness(.96); }
.nav button { margin-bottom:4px; padding:10px 12px; min-height:48px; color:var(--muted); }
.nav button.active { color:var(--primary); background:color-mix(in srgb,var(--primary) 10%,transparent); }
.nav-icon { width:32px; height:32px; border-radius:7px; background:transparent; }
.field>span,.field label,.muted,.section-detail .line span,.servant-display-value { font-weight:400; }
.field>span { color:var(--muted); font-size:calc(13px * var(--font-scale)); }
.field input,.field select,.field textarea,.clm-planning-program .field input,.clm-planning-program .field select,.clm-planning-program .field textarea { background:var(--solid); color:var(--text); border:1px solid var(--border); border-radius:8px; padding:10px 12px; min-height:44px; font-size:calc(15px * var(--font-scale)); font-weight:400; width:100%; }
input::placeholder,textarea::placeholder { color:var(--muted); opacity:1; }
input:read-only { background:var(--bg); }
:is(button,a,input,select,textarea,summary):focus-visible { outline:3px solid var(--primary); outline-offset:3px; }
.formgrid,.grid2 { gap:20px; }
.field { gap:6px; }
.tabs,.subtabs { gap:8px; margin-block:16px; }
.tabs button { padding:10px 14px; min-height:46px; }
.week { box-shadow:none; border-radius:10px; padding:8px; margin:0 auto 20px; max-width:100%; }
.week button { width:44px; height:44px; }
.pill,.status,.visibility-toggle { border-radius:6px; font-weight:500; width:auto; min-width:0; }
.visibility-toggle { padding:6px 10px; }
.profile { box-shadow:none; border-radius:8px; }
#userRole { display:none; }
.login-card { border-radius:16px; max-width:460px; padding:32px; box-shadow:var(--shadow); }
.login-logo { max-width:280px; }
.row,.report-row,.admin-user-row,.help-row { gap:12px; padding:14px; overflow-wrap:anywhere; }
.row strong,.admin-user-row strong { font-weight:600; }
.assignment-row { grid-template-columns:minmax(0,2fr) minmax(160px,1fr); gap:16px; padding-block:20px; }
.assignment-row .row-actions { grid-column:1/-1; justify-content:flex-end; }
.partner-field { grid-column:1/-1; }
summary { cursor:pointer; min-height:44px; padding-block:10px; }
.assignment-detail { border-bottom:1px solid var(--border); padding:8px 0; }
.assignment-detail:last-child { border-bottom:0; }
.assignment-detail summary { overflow-wrap:anywhere; }
.assignment-detail summary .muted { display:block; margin-left:20px; }
.security-panel>summary { font-weight:600; }
.security-panel .card { padding:16px 0 0; border:0; margin:0; }
.toolbar-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.toolbar-grid .actions { grid-column:1/-1; flex-wrap:wrap; }
.territory-data-row { grid-template-columns:repeat(3,minmax(0,1fr)); border-radius:10px; gap:16px; }
.calendar-grid,.calendar-weekdays { grid-template-columns:repeat(7,minmax(0,1fr)); gap:5px; }
.calendar-day { min-width:0; min-height:64px; padding:8px; border-radius:8px; }
.calendar-day small { overflow:hidden; text-overflow:ellipsis; }
.calendar-day.active { outline:2px solid var(--primary); box-shadow:none; }
.modal-backdrop { padding:16px; align-items:center; }
.modal-card,.modal-card.wide { width:min(900px,100%); max-height:calc(100dvh - 32px); overflow-y:auto; text-align:left; }
.modal-card p { font-weight:400; }
.groups-view-grid { grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr)); }
.admin-entry-card { min-height:110px; }
.actions { flex-wrap:wrap; gap:10px; }
.line { grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:20px; }
@media (min-width:761px) and (max-width:1100px) {
 .app { grid-template-columns:210px minmax(0,1fr); }
 .content { padding:20px; }
 .topbar { padding:12px 16px; }
 .brand small,.profile-text,#installBtn span { display:none; }
 .layout2,.talks-layout { grid-template-columns:1fr; }
 .territory-data-row { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .row,.report-row { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .assignment-row { grid-template-columns:1fr; }
}
@media (max-width:760px) {
 .content { padding:18px 12px 32px; }
 .topbar,html[data-theme="dark"] .topbar { padding:8px 12px; gap:8px; }
 .top-actions { gap:6px; }
 .brand { max-width:40vw; }
 .brand strong { font-size:13px; overflow-wrap:anywhere; }
 #installBtn { display:none!important; }
 .card,.program,.group-view-card,.modal-card { padding:16px; border-radius:10px; }
 .tabs { display:flex; overflow-x:auto; padding-bottom:4px; }
 .tabs button { flex:1 0 auto; white-space:nowrap; }
 .formgrid,.grid2,.territory-data-row,.toolbar-grid,.assignment-row,.admin-entry-grid,.admin-user-row,.report-row,.row,.line { grid-template-columns:minmax(0,1fr); }
 .calendar-grid,.calendar-weekdays { grid-template-columns:repeat(7,minmax(0,1fr)); }
 .calendar-day { min-height:48px; padding:4px; }
 .calendar-day small { font-size:10px; }
 .plan-header-actions { flex-wrap:wrap; }
 .clm-date-line strong { font-size:18px; }
 .profile-hero { flex-wrap:wrap; }
 .week strong { font-size:13px; min-width:0; }
 .modal-backdrop { padding:8px; }
 .modal-card,.modal-card.wide { max-height:calc(100dvh - 16px); }
 .actions>* { max-width:100%; }
 .section-head { flex-wrap:wrap; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; animation:none!important; } }

.my-assignment { border-left:3px solid var(--primary); padding-left:12px; background:color-mix(in srgb,var(--primary) 7%,transparent); }