/* Same page flow; preserve existing colours, type and cards. */
html body.ui-2026:not(.public-shell):not(.admin-shell) .surface-modal-drawer[open] {
  position:static!important; inset:auto!important; transform:none!important;
  width:100%!important; max-width:100%!important; max-height:none!important;
  display:block!important; overflow:visible!important; margin:8px 0!important;
  z-index:auto!important; box-shadow:none!important; scroll-margin-top:84px;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) .surface-modal-drawer[open]::before {content:none!important}
html body.ui-2026:not(.public-shell):not(.admin-shell) .surface-modal-drawer[open]>.admin-drawer-body {
  max-height:none!important; height:auto!important; overflow:visible!important; padding:12px!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) .surface-modal-drawer[open]>summary {
  min-height:44px; padding:8px 12px!important; grid-template-columns:28px 1fr auto!important; gap:8px!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) .surface-modal-drawer[open]>summary>b {
  width:auto!important; min-width:44px; height:44px; font-size:.75rem!important; border-radius:10px!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) .surface-modal-drawer[open]>summary>b::after {content:none!important}
html body.ui-2026:not(.public-shell):not(.admin-shell) .family-settings-drawer:not([open]):not(#family-add-modal) {
  display:block!important; margin:6px 0!important; width:100%!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) .family-settings-drawer>summary {min-height:44px; cursor:pointer}
html body.ui-2026:not(.public-shell):not(.admin-shell) [data-inline-task] {
  position:static!important; inset:auto!important; transform:none!important; width:100%!important;
  max-width:100%!important; max-height:none!important; margin:8px 0!important; overflow:visible!important;
  box-shadow:none!important; scroll-margin-top:84px;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) [data-inline-task][hidden] {display:none!important}
html body.ui-2026:not(.public-shell):not(.admin-shell) [data-inline-task]>:first-child {
  height:auto!important; max-height:none!important; overflow:visible!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) :is(.core-page,.secondary-page) :is(.surface-actions,.tasks-toolbar-actions,.calendar-top-actions,.actions,.task-modal-actions,.task-edit-actions) {
  gap:6px!important; flex-wrap:wrap!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) :is(.core-page,.secondary-page) :is(.surface-actions,.tasks-toolbar-actions,.calendar-top-actions,.actions,.task-modal-actions,.task-edit-actions) :is(a,button) {
  width:auto!important; flex:0 0 auto!important; min-width:0!important; padding:7px 10px!important; white-space:normal;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) :is(.core-page,.secondary-page) :is(input,select,textarea) {min-width:0; max-width:100%; box-sizing:border-box}
html body.ui-2026:not(.public-shell):not(.admin-shell) :is(.core-page,.secondary-page) :is(h1,h2,h3,p) {overflow-wrap:break-word}
html body.ui-2026:not(.public-shell):not(.admin-shell) .calendar-page .more-items {display:inline-flex; align-items:center; min-height:32px}
html body.ui-2026:not(.public-shell):not(.admin-shell) .calendar-page .calendar-edit-modal {grid-column:1/-1}
@media(max-width:1024px) {
  html body.ui-2026:not(.public-shell):not(.admin-shell) :is(.core-page,.secondary-page) :is(button,.primary,.secondary,summary) {min-height:44px!important}
  html body.ui-2026:not(.public-shell):not(.admin-shell) :is(.core-page,.secondary-page) :is(input,select,textarea) {font-size:16px!important}
  html body.ui-2026:not(.public-shell):not(.admin-shell) :is(.core-page,.secondary-page) {padding-bottom:calc(70px + env(safe-area-inset-bottom))}
}

/* Compact existing form controls; large enough hit areas, no stretched buttons. */
html body.ui-2026:not(.public-shell):not(.admin-shell) .calendar-kind-switch {
  display:flex!important; flex-wrap:wrap!important; width:fit-content!important; max-width:100%!important; padding:3px!important; gap:5px!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) .calendar-kind-switch label {
  flex:0 0 auto!important; width:auto!important; min-height:44px!important; padding:7px 10px!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) .surface-modal-drawer[open] .card {
  margin:0!important; padding:12px!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) .calendar-unified-create form.stack {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) .calendar-unified-create :is(.calendar-kind-switch,[data-recurring-fields],.form-grid,.actions),
html body.ui-2026:not(.public-shell):not(.admin-shell) .calendar-unified-create label:has(textarea) {grid-column:1/-1}
html body.ui-2026:not(.public-shell):not(.admin-shell) .surface-modal-drawer[open]>summary>div small {font-size:.75rem}
html body.ui-2026:not(.public-shell):not(.admin-shell) :is(.core-page,.secondary-page) :is(.section-head,.page-head) {gap:8px}
@media(max-width:600px) {
  html body.ui-2026:not(.public-shell):not(.admin-shell) .calendar-unified-create form.stack {grid-template-columns:minmax(0,1fr)}
}

html body.ui-2026:not(.public-shell):not(.admin-shell) :is(.core-page,.secondary-page) [hidden] {display:none!important}
html body.ui-2026:not(.public-shell):not(.admin-shell) [data-inline-task] :is(.task-modal-actions,.task-edit-actions,.reward-modal-actions) {
  position:static!important; inset:auto!important; margin:10px 0 0!important; padding:8px 0!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) .task-kind-picker {
  display:flex!important; flex-wrap:wrap!important; width:fit-content!important; max-width:100%!important; gap:5px!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) .task-kind-picker label {
  flex:0 0 auto!important; width:auto!important; min-height:44px!important; padding:7px 12px!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) .weekday-picks {
  display:flex!important; flex-wrap:wrap!important; gap:5px!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) .weekday-picks label {
  width:auto!important; flex:0 0 auto!important; min-height:44px!important; padding:7px 9px!important;
}

html body.ui-2026:not(.public-shell):not(.admin-shell) :is(.core-page,.secondary-page) :is(.task-kind-picker,.calendar-kind-switch,.weekday-picks) label {
  display:inline-flex!important; align-items:center!important; gap:6px!important; position:relative;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) :is(.core-page,.secondary-page) :is(.task-kind-picker,.calendar-kind-switch,.weekday-picks) input {
  position:static!important; inset:auto!important; width:18px!important; height:18px!important;
  min-height:0!important; max-width:18px!important; flex:0 0 18px!important; margin:0!important; padding:0!important;
  opacity:1!important; pointer-events:auto!important;
}

/* Same compact controls for rewards and rules. */
html body.ui-2026:not(.public-shell):not(.admin-shell) :is(.core-page,.secondary-page) :is(.reward-share-choice,.check-row) input {
  position:static!important; width:18px!important; height:18px!important; min-height:0!important;
  flex:0 0 18px!important; margin:0!important; padding:0!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) :is(.rule-edit,.rule-penalty,.reward-edit) {scroll-margin-top:84px}
html body.ui-2026:not(.public-shell):not(.admin-shell) :is(.rule-edit,.rule-penalty,.reward-edit) summary {
  display:inline-flex; align-items:center; min-height:44px; cursor:pointer;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) :is(.rule-edit,.rule-penalty,.reward-edit) form>button {
  width:auto!important; justify-self:start; padding:7px 10px!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) :is(.core-page,.secondary-page) .actions button {max-width:100%}

/* Flokken: readable settings rows in the existing dark card palette. */
html body.ui-2026:not(.public-shell):not(.admin-shell) .family-page .family-settings-drawer {
  background:rgba(7,31,48,.92)!important; color:#f5fbff!important;
  border:1px solid rgba(255,255,255,.13)!important; border-radius:16px!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) .family-page .family-settings-drawer>summary {
  display:grid!important; grid-template-columns:32px minmax(0,1fr) auto!important;
  align-items:center; gap:8px!important; padding:8px 10px!important; min-height:60px!important;
  background:transparent!important; box-sizing:border-box;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) .family-page .family-settings-drawer>summary>div {min-width:0}
html body.ui-2026:not(.public-shell):not(.admin-shell) .family-page .family-settings-drawer>summary strong {
  display:block; color:#f5fbff!important; font-size:.88rem!important; line-height:1.3!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) .family-page .family-settings-drawer>summary small {
  display:block; color:#bfd0d9!important; font-size:.75rem!important; line-height:1.3!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) .family-page .family-settings-drawer>summary>span:first-child {
  width:32px!important; height:32px!important; border-radius:10px!important;
  background:rgba(99,230,173,.13)!important; color:#63e6ad!important; font-size:1.25rem!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) .family-page .family-settings-drawer>summary>b {
  color:#63e6ad!important; background:rgba(255,255,255,.07)!important;
  font-size:.75rem!important; min-width:44px; padding:7px!important; border-radius:10px!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) .family-page .member-profile .child-edit>summary,
html body.ui-2026:not(.public-shell):not(.admin-shell) .family-page .owner-self-password>a {
  display:inline-flex!important; align-items:center; min-height:44px!important;
  width:fit-content!important; max-width:100%!important; box-sizing:border-box;
  padding:7px 10px!important; border-radius:12px!important; font-size:.8rem!important; line-height:1.25!important;
}

/* Clear feedback in the existing chat panel; no automatic resubmission. */
html body.ui-2026 .support-widget [hidden] {display:none!important}
html body.ui-2026 .support-feedback {
  margin:6px 12px 10px; padding:8px 10px; border-radius:10px; flex:0 0 auto;
  color:#ffe3bc; background:#3b2b20; border:1px solid #846347; font-size:.85rem; line-height:1.4;
}
html body.ui-2026 #flokktavle :is(.tv-parent-actions,.tv-profile-buttons) {gap:6px;flex-wrap:wrap}
html body.ui-2026 #flokktavle :is(button,summary) {min-height:44px;box-sizing:border-box;max-width:100%}
html body.ui-2026 #flokktavle :is(.tv-pin-form,.tv-parent-actions) :is(button,input) {min-width:0;max-width:100%}
html body.ui-2026 #flokktavle :is(h1,h2,h3,p,strong,small) {overflow-wrap:break-word}

@media(max-width:600px) {
  html body.ui-2026 #flokktavle .tv-hero {padding:12px!important;gap:10px!important;min-height:0!important}
  html body.ui-2026 #flokktavle .tv-hero h1 {font-size:1.5rem!important;margin:3px 0!important}
  html body.ui-2026 #flokktavle .tv-hero p {margin:4px 0!important;font-size:.85rem!important;line-height:1.35!important}
  html body.ui-2026 #flokktavle .tv-summary>div {padding:8px!important;min-height:0!important}
  html body.ui-2026 #flokktavle .tv-summary strong {font-size:1.5rem!important}
  html body.ui-2026 #flokktavle .tv-summary span {font-size:.75rem!important}
  html body.ui-2026 #flokktavle .tv-child-column {padding:12px!important}
  html body.ui-2026 #flokktavle .tv-child-column-head {
    display:grid!important;grid-template-columns:40px minmax(0,1fr) auto!important;gap:8px!important;
    align-items:center!important;margin-bottom:8px!important;padding-bottom:8px!important;
  }
  html body.ui-2026 #flokktavle .tv-avatar {width:40px!important;height:40px!important;font-size:1.2rem!important}
  html body.ui-2026 #flokktavle .tv-child-info h2 {font-size:.9rem!important;margin:0!important}
  html body.ui-2026 #flokktavle .tv-score {grid-column:auto!important;grid-row:1!important;justify-self:end!important;width:auto!important;padding:0!important}
  html body.ui-2026 #flokktavle .tv-score strong {font-size:1.1rem!important}
  html body.ui-2026 #flokktavle .tv-score span {font-size:.7rem!important}
}

@media(max-width:700px) {
  html body.ui-2026 .support-widget.is-open,
  html body.ui-2026.support-keyboard-open .support-widget.is-open {width:auto!important}
  html body.ui-2026:is(.role-owner,.role-parent) .support-widget.is-open .support-panel:not([hidden]) {
    grid-template-rows:auto minmax(0,1fr) auto auto auto!important;
  }
  html body.ui-2026:is(.role-owner,.role-parent) .support-widget.is-open .support-feedback {grid-row:5!important}
  html body.ui-2026.role-child .support-widget.is-open .support-panel:not([hidden]) {
    grid-template-rows:auto minmax(0,1fr) auto auto!important;
  }
  html body.ui-2026.role-child .support-widget.is-open .support-feedback {grid-row:4!important}
  html body.ui-2026 .support-panel>header button {min-width:44px!important;min-height:44px!important;height:44px!important}
  html body.ui-2026 .support-channel-tabs button,html body.ui-2026 .support-compose button {min-height:44px!important;height:auto!important}
}

/* Privacy actions use the same compact controls as the other pages. */
html body.ui-2026:not(.public-shell):not(.admin-shell) .privacy-center-page form>button {
  width:auto!important; justify-self:start!important; align-self:flex-start!important;
  max-width:100%!important; padding:7px 10px!important; min-height:44px!important;
}

html body.ui-2026:not(.public-shell):not(.admin-shell) .family-page .child-device-approve>button {
  width:auto!important;justify-self:start!important;max-width:100%!important;min-height:44px!important;
}

/* Inline saving feedback retains the existing colours and form flow. */
html body.ui-2026 .form-save-feedback {grid-column:1/-1;margin:8px 0 0;padding:8px 10px;border-radius:10px;color:#d9fff0;background:#0d3d32;font-size:.85rem;line-height:1.4}
html body.ui-2026 .form-save-feedback.is-error {color:#ffe3bc;background:#3b2b20;border:1px solid #846347}
html body.ui-2026 form[data-flow-save] [aria-invalid="true"] {outline:2px solid #edb66c;outline-offset:2px}

/* Cover the layout viewport, including the iOS keyboard accessory gap. */
@media(max-width:700px) {
  html:has(body.ui-2026 .support-widget.is-open) {overflow:hidden!important}
  html body.ui-2026 .support-widget.is-open,
  html body.ui-2026.support-keyboard-open .support-widget.is-open {
    inset:0!important;top:0!important;bottom:auto!important;
    height:100vh!important;height:100lvh!important;min-height:100lvh!important;
    background:#07141d!important;isolation:isolate!important;
  }
  html body.ui-2026 .support-widget.is-open::before {
    top:0!important;bottom:auto!important;height:100vh!important;height:100lvh!important;
    background:#07141d!important;
  }
}
@media(max-width:1180px) {
  html body.ui-2026:is(.role-owner,.role-parent,.role-child)>.topbar {
    position:relative!important;z-index:1000!important;isolation:isolate!important;
  }
}
html body.ui-2026 form[data-flow-save]>button {
  width:auto!important;justify-self:start!important;align-self:flex-start!important;
  max-width:100%!important;min-height:44px!important;padding:7px 12px!important;
}

@media(max-width:1180px) {
 html body.ui-2026:is(.role-owner,.role-parent,.role-child) .mobile-menu-panel {
   align-content:start!important;gap:4px!important;
 }
 html body.ui-2026:is(.role-owner,.role-parent,.role-child) .mobile-menu-panel>a,
 html body.ui-2026:is(.role-owner,.role-parent,.role-child) .mobile-menu-panel .mobile-logout {
   min-height:44px!important;padding:8px 12px!important;box-sizing:border-box!important;
 }
}

/* Calendar cards: controls are whole buttons, with short consistent labels. */
html body.ui-2026 .calendar-page .calendar-item-actions {
  display:flex!important;flex-wrap:wrap!important;align-items:center!important;
  justify-content:flex-start!important;gap:6px!important;margin:6px 0 0!important;
}
html body.ui-2026 .calendar-page .calendar-item-actions>form {
  display:contents!important;margin:0!important;padding:0!important;
}
html body.ui-2026 .calendar-page .calendar-item-actions :is(a,button) {
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  flex:0 0 auto!important;width:auto!important;max-width:100%!important;min-width:0!important;
  min-height:36px!important;height:auto!important;padding:6px 9px!important;
  box-sizing:border-box!important;border-radius:10px!important;
  font-size:.78rem!important;line-height:1.2!important;
  white-space:nowrap!important;word-break:normal!important;overflow-wrap:normal!important;
  margin:0!important;text-decoration:none!important;
}
html body.ui-2026 .calendar-page .calendar-item-status {
  display:block!important;margin:4px 0!important;font-size:.75rem!important;
  line-height:1.3!important;color:#bfd0d9!important;background:none!important;border:0!important;
}
@media(max-width:900px),(pointer:coarse) {
 html body.ui-2026 .calendar-page .calendar-item-actions :is(a,button) {min-height:44px!important}
}

/* Shared-screen overview: existing cards and profile controls. */
html body.ui-2026 #flokktavle #board-sync-status {display:block;font-size:.8rem;line-height:1.4;color:var(--muted);margin:3px 0}
html body.ui-2026 #flokktavle #board-sync-status.is-stale {color:#f3c589!important}
html body.ui-2026 #flokktavle .tv-profile-picker {gap:10px!important;padding:12px!important;grid-template-columns:minmax(0,1fr)!important;margin-bottom:14px!important}
html body.ui-2026 #flokktavle .tv-profile-picker :is(h2,p) {margin:3px 0!important}
html body.ui-2026 #flokktavle .tv-profile-picker .eyebrow {margin:0!important}
html body.ui-2026 #flokktavle .tv-profile-buttons {display:flex!important;gap:8px!important}
html body.ui-2026 #flokktavle .tv-profile-buttons form {min-width:0;max-width:100%}
html body.ui-2026 #flokktavle .tv-profile-button {width:auto!important;min-width:0!important;max-width:100%;padding:8px 12px!important;min-height:48px!important;border-radius:12px!important}
html body.ui-2026 #flokktavle .tv-profile-button>span:nth-child(2) {overflow-wrap:anywhere;min-width:0}
html body.ui-2026 #flokktavle .tv-parent-unlock {width:fit-content;max-width:100%}
html body.ui-2026 #flokktavle .tv-parent-unlock[open] {width:100%}
html body.ui-2026 #flokktavle .tv-kiosk-controls {margin-bottom:12px;gap:8px}
html body.ui-2026 #flokktavle .tv-child-columns {grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr))!important;gap:14px!important}
html body.ui-2026 #flokktavle[data-child-active="1"] .tv-child-columns {grid-template-columns:minmax(0,1fr)!important;max-width:850px;margin-inline:auto}
html body.ui-2026 #flokktavle[data-child-active="1"] .is-inactive-child {display:none!important}
html body.ui-2026 #flokktavle[data-child-active="1"] [data-board-region="adults"] {display:none!important}
html body.ui-2026 #flokktavle .tv-child-task {min-height:0!important;display:flex!important;flex-wrap:wrap!important;gap:6px!important;padding:10px!important}
html body.ui-2026 #flokktavle .tv-child-task>div {flex:1 1 160px;min-width:0}
html body.ui-2026 #flokktavle .tv-child-task .pill {width:fit-content;max-width:100%;white-space:normal;font-size:.75rem;align-self:flex-start}
html body.ui-2026 #flokktavle .tv-child-task p {margin:3px 0 0!important}
html body.ui-2026 #flokktavle .status-approved .pill {color:#63e6ad!important;border-color:rgba(81,230,160,.4)!important}
html body.ui-2026 #flokktavle .tv-today-event {display:grid!important;grid-template-columns:minmax(0,auto) minmax(0,1fr)!important;gap:10px!important;align-items:start!important;padding:8px 0!important}
html body.ui-2026 #flokktavle .tv-today-event strong {display:block}
html body.ui-2026 #flokktavle .tv-today-event small {display:block;margin-top:2px}
html body.ui-2026 #flokktavle .tv-today-time {font-variant-numeric:tabular-nums;max-width:110px;white-space:normal!important}
html body.ui-2026 #flokktavle .tv-today-event.is-complete small {color:#63e6ad!important}
html body.ui-2026 #flokktavle .tv-adult-task-grid {grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr))!important}
html body.ui-2026 #flokktavle .tv-adult-task-list>div {display:flex;flex-wrap:wrap;gap:6px;min-width:0}
html body.ui-2026 #flokktavle .tv-adult-task-list>div strong {flex:1 1 160px;min-width:0}
html body.ui-2026 #flokktavle .tv-adult-task-list>div small {flex:1 1 100%;margin-left:16px}
html body.ui-2026 #flokktavle .tv-common-rules-grid {grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))!important}
html body.ui-2026 #flokktavle :is(.tv-footnote,.tv-parent-note) {line-height:1.5}
html body.ui-2026 #flokktavle :is(button,summary):focus-visible {outline:3px solid #63e6ad;outline-offset:3px}
@media(min-width:1600px) {
  html body.ui-2026.role-dashboard>.container {width:min(calc(100% - 48px),1680px)!important;max-width:1680px!important}
  html body.ui-2026.role-dashboard #flokktavle {max-width:1680px!important;font-size:1.1rem}
  html body.ui-2026.role-dashboard #flokktavle .tv-child-info h2 {font-size:1.3rem!important}
  html body.ui-2026.role-dashboard #flokktavle .tv-child-columns {grid-template-columns:repeat(auto-fit,minmax(350px,1fr))!important}
  html body.ui-2026.role-dashboard #flokktavle[data-child-active="1"] .tv-child-columns {grid-template-columns:minmax(0,1fr)!important}
}


/* 2026-09-30 Flokken: remove remaining light surfaces and keep one dark visual flow. */
html body.ui-2026:is(.role-owner,.role-parent) .family-page .mac-settings-members,
html body.ui-2026:is(.role-owner,.role-parent) .family-page .member-profile,
html body.ui-2026:is(.role-owner,.role-parent) .family-page .compact-info-drawer,
html body.ui-2026:is(.role-owner,.role-parent) .family-page .child-edit[open],
html body.ui-2026:is(.role-owner,.role-parent) .family-page .owner-account-control[open] {
  color:#f5fbff!important;
  background:rgba(7,31,48,.94)!important;
  border-color:rgba(255,255,255,.13)!important;
  box-shadow:none!important;
}
html body.ui-2026:is(.role-owner,.role-parent) .family-page .member-profile {
  border-radius:16px!important;
}
html body.ui-2026:is(.role-owner,.role-parent) .family-page :is(
  .member-profile,.compact-info-drawer,.child-edit,.owner-account-control
) :is(strong,h2,h3,label,summary) {
  color:#f5fbff!important;
}
html body.ui-2026:is(.role-owner,.role-parent) .family-page :is(
  .member-profile,.compact-info-drawer,.child-edit,.owner-account-control
) :is(p,small,.muted,.role-change-note) {
  color:#bdd0da!important;
}
html body.ui-2026:is(.role-owner,.role-parent) .family-page .child-meta span {
  color:#d9e8ee!important;
  background:rgba(255,255,255,.07)!important;
  border-color:rgba(255,255,255,.11)!important;
}
html body.ui-2026:is(.role-owner,.role-parent) .family-page :is(
  .member-profile,.compact-info-drawer,.child-edit,.owner-account-control,
  .family-settings-drawer[open]
) :is(input,select,textarea) {
  color:#f5fbff!important;
  background:#12364b!important;
  border-color:rgba(255,255,255,.15)!important;
  color-scheme:dark!important;
}
html body.ui-2026:is(.role-owner,.role-parent) .family-page :is(input,textarea)::placeholder {
  color:#91aab7!important;
}
html body.ui-2026:is(.role-owner,.role-parent) .family-page select option {
  color:#f5fbff!important;
  background:#12364b!important;
}
html body.ui-2026:is(.role-owner,.role-parent) .family-page .child-edit>summary {
  color:#dcebf1!important;
  background:rgba(255,255,255,.06)!important;
  border:1px solid rgba(255,255,255,.10)!important;
}
html body.ui-2026:is(.role-owner,.role-parent) .family-page .child-edit[open]>summary {
  color:#63e6ad!important;
  background:rgba(99,230,173,.10)!important;
}

/* Hjelp ekstra til — frivillige plukkoppgaver. */
html body.ui-2026 .help-extra-section{
  margin:12px 0 16px!important;
  padding:16px!important;
  border:1px solid rgba(255,255,255,.13)!important;
  border-radius:18px!important;
  background:rgba(7,31,48,.94)!important;
  color:#f5fbff!important;
}
html body.ui-2026 .help-extra-head{
  display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:12px
}
html body.ui-2026 .help-extra-head h2{margin:2px 0 4px;color:#fff!important}
html body.ui-2026 .help-extra-head p{margin:0;color:#bdd0da!important}
html body.ui-2026 .help-extra-limit{
  flex:0 0 auto;min-width:110px;padding:9px 11px;border-radius:14px;text-align:center;
  background:rgba(99,230,173,.10);border:1px solid rgba(99,230,173,.18)
}
html body.ui-2026 .help-extra-limit strong{display:block;color:#63e6ad!important;font-size:1.15rem}
html body.ui-2026 .help-extra-limit span{display:block;color:#bdd0da;font-size:.74rem}
html body.ui-2026 .help-extra-pool{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px
}
html body.ui-2026 .help-extra-card{
  display:flex;flex-direction:column;gap:10px;min-width:0;padding:13px;border-radius:15px;
  background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.11)
}
html body.ui-2026 .help-extra-card.state-mine{
  border-color:rgba(99,230,173,.30);background:rgba(99,230,173,.08)
}
html body.ui-2026 .help-extra-card.state-claimed{opacity:.76}
html body.ui-2026 .help-extra-card.state-approved{opacity:.72}
html body.ui-2026 .help-extra-card-top{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:10px}
html body.ui-2026 .help-extra-card-top>div{min-width:0}
html body.ui-2026 .help-extra-card :is(h3,p){overflow-wrap:anywhere}
html body.ui-2026 .help-extra-card h3{margin:0;color:#fff!important;font-size:.98rem}
html body.ui-2026 .help-extra-card p{margin:4px 0 0;color:#bdd0da!important;font-size:.82rem}
html body.ui-2026 .help-extra-points{
  white-space:nowrap;color:#ffe08a!important;background:rgba(255,224,138,.08);
  border:1px solid rgba(255,224,138,.16);padding:5px 7px;border-radius:10px;font-size:.82rem
}
html body.ui-2026 .help-extra-card form{margin-top:auto}
html body.ui-2026 .help-extra-card form button{width:100%}
html body.ui-2026 .help-extra-state{
  margin-top:auto;padding:8px 9px;border-radius:11px;background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08)
}
html body.ui-2026 .help-extra-state strong{display:block;color:#eef8fb!important}
html body.ui-2026 .help-extra-state small{display:block;margin-top:2px;color:#afc5d0!important}
html body.ui-2026 .help-extra-state.mine{background:rgba(99,230,173,.09)}
html body.ui-2026 .help-extra-state.approved{background:rgba(99,230,173,.07)}
html body.ui-2026 .help-extra-my-claim{
  display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:10px;
  margin:0 0 12px;padding:11px 12px;border-radius:14px;
  background:rgba(99,230,173,.10);border:1px solid rgba(99,230,173,.20)
}
html body.ui-2026 .help-extra-my-claim .help-extra-icon{
  width:42px;height:42px;display:grid;place-items:center;border-radius:12px;
  background:rgba(255,255,255,.07);font-size:1.2rem
}
html body.ui-2026 .help-extra-my-claim strong{display:block;color:#fff!important}
html body.ui-2026 .help-extra-my-claim small,
html body.ui-2026 .help-extra-my-claim span{display:block;color:#bdd0da!important;font-size:.78rem}
html body.ui-2026 .help-extra-adult-summary{
  display:flex;flex-wrap:wrap;gap:7px;margin-bottom:10px
}
html body.ui-2026 .help-extra-adult-summary span{
  padding:6px 8px;border-radius:10px;background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);color:#bdd0da;font-size:.78rem
}
html body.ui-2026 .help-extra-adult-summary strong{color:#fff!important}
html body.ui-2026 .help-extra-review{
  margin:10px 0;padding:11px;border-radius:14px;background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.09)
}
html body.ui-2026 .help-extra-review-list{display:grid;gap:7px}
html body.ui-2026 .help-extra-review-list>article,
html body.ui-2026 .help-extra-admin-list>article{
  display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 10px;
  border-radius:12px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08)
}
html body.ui-2026 .help-extra-review-list strong,
html body.ui-2026 .help-extra-admin-list strong{color:#fff!important}
html body.ui-2026 .help-extra-review-list small,
html body.ui-2026 .help-extra-admin-list small{display:block;color:#bdd0da!important;margin-top:2px}
html body.ui-2026 .help-extra-drawer{
  margin-top:8px;border-radius:14px;background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.09);overflow:hidden
}
html body.ui-2026 .help-extra-drawer>summary{
  display:flex;justify-content:space-between;align-items:center;gap:10px;cursor:pointer;
  min-height:46px;padding:9px 11px;color:#f5fbff!important;background:rgba(255,255,255,.035)
}
html body.ui-2026 .help-extra-drawer>summary span{color:#9eb6c2;font-size:.75rem}
html body.ui-2026 .help-extra-drawer>form,
html body.ui-2026 .help-extra-drawer>.help-extra-review-list,
html body.ui-2026 .help-extra-drawer>.help-extra-admin-list{padding:11px}
html body.ui-2026 .help-extra-section :is(input,select,textarea){
  color:#f5fbff!important;background:#12364b!important;border-color:rgba(255,255,255,.14)!important;color-scheme:dark
}
html body.ui-2026 .help-extra-section :is(input,textarea)::placeholder{color:#8fa8b5!important}
html body.ui-2026 .help-extra-section label,
html body.ui-2026 .help-extra-section legend{color:#f5fbff!important}
html body.ui-2026 .help-extra-admin-main{min-width:0}
html body.ui-2026 .help-extra-admin-list .child-edit{margin-left:auto;min-width:min(100%,390px)}
html body.ui-2026 .help-extra-empty{grid-column:1/-1}

@media(max-width:700px){
  html body.ui-2026 .help-extra-section{padding:12px!important}
  html body.ui-2026 .help-extra-head{display:grid;grid-template-columns:1fr}
  html body.ui-2026 .help-extra-limit{min-width:0;width:auto;justify-self:start;text-align:left}
  html body.ui-2026 .help-extra-pool{grid-template-columns:1fr}
  html body.ui-2026 .help-extra-my-claim{grid-template-columns:38px minmax(0,1fr)}
  html body.ui-2026 .help-extra-my-claim form{grid-column:1/-1}
  html body.ui-2026 .help-extra-my-claim form button{width:100%}
  html body.ui-2026 .help-extra-review-list>article,
  html body.ui-2026 .help-extra-admin-list>article{align-items:stretch;flex-direction:column}
  html body.ui-2026 .help-extra-review-list .actions{width:100%;display:grid;grid-template-columns:1fr 1fr}
  html body.ui-2026 .help-extra-review-list .actions form button{width:100%}
  html body.ui-2026 .help-extra-admin-list .child-edit{width:100%;margin-left:0}
}


/* Hjelp ekstra til: dark, compact controls inside the task page. */
html body.ui-2026 .help-extra-section .task-kind-picker{
  padding:4px!important;
  background:rgba(255,255,255,.045)!important;
  border:1px solid rgba(255,255,255,.10)!important;
  border-radius:13px!important;
}
html body.ui-2026 .help-extra-section .task-kind-picker label{
  min-height:0!important;
  padding:0!important;
  background:transparent!important;
  color:#dcebf1!important;
  box-shadow:none!important;
}
html body.ui-2026 .help-extra-section .task-kind-picker input{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  max-width:1px!important;
  opacity:0!important;
  pointer-events:none!important;
}
html body.ui-2026 .help-extra-section .task-kind-picker label>span{
  display:block!important;
  padding:10px 13px!important;
  color:#dcebf1!important;
  background:#12364b!important;
  border:1px solid rgba(255,255,255,.11)!important;
  border-radius:10px!important;
  box-shadow:none!important;
}
html body.ui-2026 .help-extra-section .task-kind-picker input:checked+span{
  color:#052b21!important;
  background:#63e6ad!important;
  border-color:#63e6ad!important;
  box-shadow:0 0 0 2px rgba(99,230,173,.16)!important;
}
html body.ui-2026 .help-extra-section .weekday-picks label{
  min-height:38px!important;
  padding:7px 9px!important;
  color:#dcebf1!important;
  background:#12364b!important;
  border:1px solid rgba(255,255,255,.11)!important;
  border-radius:10px!important;
  box-shadow:none!important;
}
html body.ui-2026 .help-extra-section .weekday-picks label:has(input:checked){
  color:#e9fff5!important;
  background:rgba(99,230,173,.12)!important;
  border-color:rgba(99,230,173,.28)!important;
}
html body.ui-2026 .help-extra-section .weekday-picks input{
  accent-color:#63e6ad!important;
}


/* Child home: always show goal, required tasks and today's calendar. */
html body.ui-2026.role-child .child-home-intro{
  margin:0 0 10px;padding:2px 2px 0
}
html body.ui-2026.role-child .child-home-intro h1{
  margin:2px 0 3px;color:#f5fbff!important;font-size:clamp(1.5rem,4vw,2rem)
}
html body.ui-2026.role-child .child-home-intro p{margin:0;color:#bdd0da!important}
html body.ui-2026.role-child .child-home-empty-row{
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;
  padding:12px;border-radius:14px;background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.09)
}
html body.ui-2026.role-child .child-home-empty-row>span{font-size:1.35rem}
html body.ui-2026.role-child .child-home-empty-row strong{display:block;color:#fff!important}
html body.ui-2026.role-child .child-home-empty-row small{display:block;margin-top:2px;color:#bdd0da!important}
html body.ui-2026.role-child .child-home-extra-hint{
  margin:10px 0 0;padding:9px 10px;border-radius:11px;color:#bdd0da!important;
  background:rgba(99,230,173,.07);border:1px solid rgba(99,230,173,.12)
}
html body.ui-2026.role-child .child-home-extra-hint a{color:#63e6ad!important;font-weight:800}
@media(max-width:600px){
  html body.ui-2026.role-child .child-home-empty-row{grid-template-columns:auto minmax(0,1fr)}
  html body.ui-2026.role-child .child-home-empty-row>a{grid-column:1/-1;width:100%;text-align:center}
}

/* 2026-10-01 mobile Flokktavle header: keep avatar/name/points inside card */
@media(max-width:600px){
  html body.ui-2026 #flokktavle .tv-child-columns{
    width:100%!important;min-width:0!important;max-width:100%!important;overflow-x:clip!important
  }
  html body.ui-2026 #flokktavle .tv-child-column{
    width:100%!important;min-width:0!important;max-width:100%!important;box-sizing:border-box!important;overflow:hidden!important
  }
  html body.ui-2026 #flokktavle .tv-child-column-head{
    width:100%!important;min-width:0!important;max-width:100%!important;box-sizing:border-box!important;
    display:grid!important;grid-template-columns:44px minmax(0,1fr)!important;
    grid-template-areas:"avatar info" "avatar score"!important;column-gap:10px!important;row-gap:2px!important;
    align-items:center!important
  }
  html body.ui-2026 #flokktavle .tv-child-column-head>.tv-avatar{
    grid-area:avatar!important;width:44px!important;height:44px!important;margin:0!important;justify-self:start!important
  }
  html body.ui-2026 #flokktavle .tv-child-column-head>.tv-child-info{
    grid-area:info!important;min-width:0!important;max-width:100%!important;overflow:hidden!important
  }
  html body.ui-2026 #flokktavle .tv-child-column-head>.tv-child-info :is(h2,p){
    max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important
  }
  html body.ui-2026 #flokktavle .tv-child-column-head>.tv-score{
    grid-area:score!important;display:flex!important;align-items:baseline!important;gap:5px!important;
    justify-self:start!important;min-width:0!important;max-width:100%!important;margin:0!important;padding:0!important;text-align:left!important
  }
  html body.ui-2026 #flokktavle .tv-child-column-head>.tv-score :is(strong,span){display:inline!important;white-space:nowrap!important}
}

/* 2026-10-02 responsive invariant layer: every signed-in surface must fit its viewport. */
html body.ui-2026:not(.public-shell):not(.admin-shell){
  max-width:100%;
  overflow-x:clip;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) :where(
  .container,.adult-main-content,.core-page,.secondary-page,.card,.page-head,.section-head,
  .grid,.adult-child-task-groups,.adult-child-task-group,.adult-task-lines,.adult-task-line,
  .calendar-mac-layout,.calendar-mac-main,.calendar-controls,.calendar-settings-grid,
  .week-card,.month-card,.week-grid,.month-grid,.week-day,.month-day,
  .reward-grid,.reward-card,.rule-list,.rule-card,.family-hierarchy,.family-member-picker,
  .family-member-card,.family-member-action-panel,.family-member-toolbar,.family-action-grid,
  .settings-page,.settings-layout,.settings-content,.settings-section,.settings-row,
  .help-extra-section,.help-extra-pool,.help-extra-card,.help-extra-review-list,
  .task-modal-shell,.task-edit-shell,.reward-modal-shell,.support-panel
){min-width:0;max-width:100%;}
html body.ui-2026:not(.public-shell):not(.admin-shell) :where(img,video,canvas,svg){max-width:100%;}
html body.ui-2026:not(.public-shell):not(.admin-shell) :where(input:not([type="checkbox"]):not([type="radio"]),select,textarea){
  min-width:0;
  max-width:100%;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) :where(
  .actions,.surface-actions,.tasks-toolbar-actions,.calendar-controls,.week-nav,
  .rewards-toolbar,.family-toolbar,.rules-toolbar,.task-modal-actions,.task-edit-actions
){flex-wrap:wrap;max-width:100%;}
html body.ui-2026:not(.public-shell):not(.admin-shell) :where(
  h1,h2,h3,p,small,strong,a,button,label,.member-body,.collab-child-copy
){overflow-wrap:break-word;}

/* Wide tablet / small laptop: avoid a dead zone between phone and desktop layouts. */
@media (max-width:1100px){
  html body.ui-2026:not(.public-shell):not(.admin-shell) .adult-main-content{
    width:min(calc(100% - 20px),1180px)!important;
    margin-inline:auto!important;
  }
  html body.ui-2026:not(.public-shell):not(.admin-shell) .page-head,
  html body.ui-2026:not(.public-shell):not(.admin-shell) .tasks-toolbar,
  html body.ui-2026:not(.public-shell):not(.admin-shell) .rewards-toolbar,
  html body.ui-2026:not(.public-shell):not(.admin-shell) .family-toolbar,
  html body.ui-2026:not(.public-shell):not(.admin-shell) .rules-toolbar{
    max-width:100%;
  }
  html body.ui-2026:not(.public-shell):not(.admin-shell) :where(.week-card,.month-card,.table-wrap){
    max-width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }
}

/* Phones of any width: content becomes one readable column and controls wrap locally. */
@media (max-width:700px){
  html body.ui-2026:not(.public-shell):not(.admin-shell) .adult-main-content,
  html body.ui-2026:not(.public-shell):not(.admin-shell)>.container{
    width:calc(100% - 14px)!important;
    max-width:100%!important;
    margin-inline:auto!important;
  }
  html body.ui-2026:not(.public-shell):not(.admin-shell) :where(.page-head,.card,.hero){
    max-width:100%;
  }
  html body.ui-2026:not(.public-shell):not(.admin-shell) :where(.form-grid,.task-modal-grid,.calendar-settings-grid){
    grid-template-columns:minmax(0,1fr)!important;
  }
  html body.ui-2026:not(.public-shell):not(.admin-shell) :where(
    .tasks-toolbar-actions,.calendar-controls,.rewards-toolbar,.family-toolbar,.rules-toolbar
  ){
    width:100%;
  }
  html body.ui-2026:not(.public-shell):not(.admin-shell) :where(
    .tasks-toolbar-actions>button,.tasks-toolbar-actions>a,
    .calendar-controls>button,.calendar-controls>a
  ){
    flex:1 1 140px;
  }
  html body.ui-2026:not(.public-shell):not(.admin-shell) .family-member-toolbar{
    width:100%!important;
  }
}

/* Very narrow phones: preserve tappable controls without forcing horizontal scroll. */
@media (max-width:390px){
  html body.ui-2026:not(.public-shell):not(.admin-shell) .adult-main-content,
  html body.ui-2026:not(.public-shell):not(.admin-shell)>.container{
    width:calc(100% - 10px)!important;
  }
  html body.ui-2026:not(.public-shell):not(.admin-shell) :where(.card,.page-head,.hero){
    border-radius:14px!important;
  }
  html body.ui-2026:not(.public-shell):not(.admin-shell) .adult-mobile-menu .mobile-menu-panel{
    left:6px!important;
    right:6px!important;
    width:auto!important;
    max-width:none!important;
  }
}

/* 2026-10-02 iPhone Safari chat viewport: never let the page beneath peek through. */
@media(max-width:700px){
  html body.ui-2026:has(.support-widget.is-open){overflow:hidden!important;overscroll-behavior:none!important}
  html body.ui-2026 .support-widget.is-open{
    position:fixed!important;
    z-index:10000!important;
    inset:auto!important;
    top:var(--support-vv-top,0px)!important;
    left:var(--support-vv-left,0px)!important;
    right:auto!important;
    bottom:auto!important;
    width:var(--support-vv-width,100vw)!important;
    height:var(--support-vv-height,100dvh)!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    background:#061f30!important;
    overflow:hidden!important;
    transform:none!important;
  }
  html body.ui-2026 .support-widget.is-open .support-panel:not([hidden]){
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    max-height:none!important;
    border:0!important;
    border-radius:0!important;
    background:#071f30!important;
    overflow:hidden!important;
  }
  html body.ui-2026 .support-widget.is-open .support-head{
    min-height:0!important;
    padding:max(10px,env(safe-area-inset-top,0px)) 14px 10px!important;
    flex:0 0 auto!important;
  }
  html body.ui-2026 .support-widget.is-open .support-message-list{
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
  }
  html body.ui-2026 .support-widget.is-open .support-compose{
    position:relative!important;
    inset:auto!important;
    margin:0!important;
    padding:8px 10px max(10px,env(safe-area-inset-bottom,0px))!important;
    background:#0b2635!important;
    flex:0 0 auto!important;
  }
  html body.ui-2026.support-keyboard-open .support-widget.is-open{
    top:var(--support-vv-top,var(--support-kb-vv-top,0px))!important;
    left:var(--support-vv-left,0px)!important;
    width:var(--support-vv-width,100vw)!important;
    height:var(--support-vv-height,var(--support-kb-vv-height,100dvh))!important;
  }
}

/* 2026-10-02 iOS Safari chat v2: full-screen cover + visual-viewport panel. */
@media(max-width:700px){
  html:has(body.ui-2026 .support-widget.is-open),
  html body.ui-2026:has(.support-widget.is-open){
    overflow:hidden!important;
    overscroll-behavior:none!important;
    background:#061f30!important;
  }
  /* Nothing from the page beneath may paint through the chat surface. */
  html body.ui-2026:has(.support-widget.is-open) > :is(
    .topbar,.mobile-quick-nav,.adult-sidebar,.container,.site-footer,.public-shell-background
  ){
    visibility:hidden!important;
  }
  html body.ui-2026 .support-widget.is-open{
    position:fixed!important;
    z-index:2147483600!important;
    inset:0!important;
    top:0!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    width:100vw!important;
    height:100vh!important;
    height:100lvh!important;
    min-height:100lvh!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    background:#061f30!important;
    overflow:hidden!important;
    isolation:isolate!important;
    transform:none!important;
  }
  html body.ui-2026 .support-widget.is-open::before{
    content:""!important;
    position:absolute!important;
    z-index:0!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    background:#061f30!important;
    pointer-events:none!important;
  }
  html body.ui-2026 .support-widget.is-open .support-panel:not([hidden]){
    position:fixed!important;
    z-index:2!important;
    inset:auto!important;
    top:var(--support-vv-top,0px)!important;
    left:var(--support-vv-left,0px)!important;
    right:auto!important;
    bottom:auto!important;
    width:var(--support-vv-width,100vw)!important;
    height:var(--support-vv-height,100dvh)!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:#071f30!important;
    overflow:hidden!important;
    isolation:isolate!important;
  }
  html body.ui-2026 .support-widget.is-open .support-panel:not([hidden])::after{
    content:"";
    position:absolute;
    z-index:-1;
    inset:0;
    background:#071f30;
    pointer-events:none;
  }
}

/* Keyboard-open variant must keep the full cover too; only the panel follows VisualViewport. */
@media(max-width:700px){
  html body.ui-2026.support-keyboard-open .support-widget.is-open{
    position:fixed!important;
    z-index:2147483600!important;
    inset:0!important;
    top:0!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    width:100vw!important;
    height:100vh!important;
    height:100lvh!important;
    min-height:100lvh!important;
    max-width:none!important;
    max-height:none!important;
    background:#061f30!important;
    overflow:hidden!important;
    isolation:isolate!important;
    transform:none!important;
  }
  html body.ui-2026.support-keyboard-open .support-widget.is-open .support-panel:not([hidden]){
    position:fixed!important;
    z-index:2!important;
    inset:auto!important;
    top:var(--support-vv-top,var(--support-kb-vv-top,0px))!important;
    left:var(--support-vv-left,0px)!important;
    right:auto!important;
    bottom:auto!important;
    width:var(--support-vv-width,100vw)!important;
    height:var(--support-vv-height,var(--support-kb-vv-height,100dvh))!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    border:0!important;
    border-radius:0!important;
    background:#071f30!important;
    overflow:hidden!important;
  }
}

/* 2026-10-02 Help ekstra: form controls must stay in the authenticated dark-glass theme. */
html body.ui-2026:not(.public-shell):not(.admin-shell) .tasks-page .help-extra-section :is(
  input:not([type="checkbox"]):not([type="radio"]),select,textarea
){
  background:#12364b!important;
  color:#f5fbff!important;
  border-color:rgba(116,220,181,.22)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
  color-scheme:dark!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) .tasks-page .help-extra-section :is(
  input:not([type="checkbox"]):not([type="radio"]),textarea
)::placeholder{
  color:#8fa8b5!important;
  opacity:1!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) .tasks-page .help-extra-section :is(
  input:not([type="checkbox"]):not([type="radio"]),select,textarea
):focus{
  border-color:#63e6ad!important;
  box-shadow:0 0 0 3px rgba(99,230,173,.14)!important;
  outline:none!important;
}
html body.ui-2026:not(.public-shell):not(.admin-shell) .tasks-page .help-extra-section input:-webkit-autofill,
html body.ui-2026:not(.public-shell):not(.admin-shell) .tasks-page .help-extra-section input:-webkit-autofill:focus{
  -webkit-text-fill-color:#f5fbff!important;
  -webkit-box-shadow:0 0 0 1000px #12364b inset!important;
  caret-color:#f5fbff!important;
}

/* A pending reward has three blocks. Stack them inside each responsive card
   so approval and individual rejection never overlap at tablet widths. */
html body#vf-app.ui-2026.vf-shell main .reward-approval-group {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 10px;
}
html body#vf-app.ui-2026.vf-shell main .reward-approval-group > div { min-width: 0; }
html body#vf-app.ui-2026.vf-shell main .reward-approval-group > .actions { justify-content: flex-start; align-items: start; }
html body#vf-app.ui-2026.vf-shell main .reward-approval-group > .actions > form { flex: 0 0 auto; max-width: 100%; }
html body#vf-app.ui-2026.vf-shell main .reward-approval-group > .reward-edit { margin-top: 0; }
html body#vf-app.ui-2026.vf-shell main .reward-approval-group .day-tag { white-space: normal; overflow-wrap: anywhere; }