#seafix-demo #sf-smt-screen { width:100%; max-width:none!important; min-width:0; margin:0; padding:0; }
#seafix-demo #sf-smt-screen > .sf-screen-title { margin:0 0 24px; }
#seafix-demo .sf-smt-heading-actions { display:flex; gap:8px; align-items:center; }
#seafix-demo .sf-smt-layout { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:32px; align-items:start; }
#seafix-demo .sf-smt-board { min-width:0; }
#seafix-demo .sf-smt-toolbar { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-bottom:12px; }
#seafix-demo .sf-smt-search { position:relative; flex:1 1 180px; }
#seafix-demo .sf-smt-search > svg { position:absolute; top:13px; left:12px; width:16px!important; height:16px!important; color:var(--sf-muted); }
#seafix-demo #sf-smt-screen input, #seafix-demo #sf-smt-screen select,
#seafix-demo #sf-smt-dialog :is(input,select,textarea) {
  box-sizing:border-box; min-width:0; max-width:100%; min-height:42px; padding:10px 12px;
  border:1px solid var(--sf-line); border-radius:11px; background:var(--sf-entry-background); color:var(--sf-text); font:inherit; font-size:14px;
}
#seafix-demo #sf-smt-search { width:100%; padding-left:36px; }
#seafix-demo .sf-smt-count { color:var(--sf-muted); font-size:12px; white-space:nowrap; }
#seafix-demo .sf-smt-icon { display:inline-flex; align-items:center; justify-content:center; flex:none; width:36px; height:36px; padding:8px; border:0; border-radius:10px; color:var(--sf-muted); background:transparent; cursor:pointer; }
#seafix-demo .sf-smt-icon:hover { color:var(--sf-heading); background:var(--sf-surface-raised); }
#seafix-demo .sf-smt-people { border:1px solid var(--sf-line); border-radius:18px; padding:20px; background:var(--sf-surface); }
#seafix-demo .sf-smt-people h3 { margin:0; font-size:16px; }
#seafix-demo .sf-smt-people > p { color:var(--sf-muted); font-size:12px; line-height:1.6; margin:8px 0 18px; }
#seafix-demo #sf-smt-members { list-style:none; padding:0; margin:0; }
#seafix-demo #sf-smt-members li { display:flex; align-items:center; gap:9px; padding:10px 0; }
#seafix-demo #sf-smt-members li > span:nth-child(2) { flex:1; min-width:0; }
#seafix-demo #sf-smt-members strong, #seafix-demo #sf-smt-members small { display:block; overflow-wrap:anywhere; }
#seafix-demo #sf-smt-members strong { font-size:12px; font-weight:600; line-height:1.4; }
#seafix-demo #sf-smt-members small { margin-top:3px; color:var(--sf-muted); font-size:11px; }
#seafix-demo #sf-smt-members li > svg { color:var(--sf-muted); width:15px!important; height:15px!important; flex:none; }
#seafix-demo .sf-smt-avatar { display:grid; place-items:center; flex:none; width:34px; height:34px; border-radius:50%; background:var(--sf-surface-raised); font-size:11px; font-weight:600; }
#seafix-demo #sf-smt-member-fields { display:grid; gap:10px; margin:14px 0 0; padding:16px 0 0; border:0; border-top:1px solid var(--sf-line); min-width:0; }
#seafix-demo #sf-smt-member-fields label { font-size:12px; font-weight:600; }
#seafix-demo #sf-smt-member-fields button { justify-content:center; }
#seafix-demo .sf-smt-empty { text-align:center; padding:56px 20px; color:var(--sf-muted); }
#seafix-demo .sf-smt-empty > svg { width:32px!important; height:32px!important; margin:0 auto 12px; opacity:.7; }
#seafix-demo .sf-smt-empty h3 { margin:0 0 8px; font-size:17px; font-weight:600; color:var(--sf-heading); }
#seafix-demo .sf-smt-empty p { margin:0; font-size:13px; line-height:1.6; }
#seafix-demo #sf-smt-dialog { width:min(590px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); box-sizing:border-box; padding:26px; border:1px solid var(--sf-line); border-radius:20px; background:var(--sf-canvas); color:var(--sf-text); overflow:auto; }
#seafix-demo #sf-smt-dialog::backdrop { background:#1116; backdrop-filter:blur(3px); }
#seafix-demo #sf-smt-dialog h2 { margin:0 0 22px; font-size:22px; }
#seafix-demo #sf-smt-edit-fields { display:grid; gap:16px; min-width:0; margin:0; padding:0; border:0; }
#seafix-demo #sf-smt-edit-fields label { display:grid; gap:7px; font-size:13px; font-weight:550; }
#seafix-demo .sf-smt-form-row { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
#seafix-demo #sf-smt-notes { width:100%; resize:vertical; }
#seafix-demo #sf-smt-audit { color:var(--sf-muted); font-size:12px; line-height:1.5; margin:0; }
#seafix-demo .sf-smt-dialog-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:22px; }
#seafix-demo :is(#sf-smt-screen,#sf-smt-dialog) :is(button,input,select,textarea):focus-visible { outline:2px solid var(--sf-heading); outline-offset:3px; }
#seafix-demo :is(#sf-smt-screen,#sf-smt-dialog) button:disabled { cursor:default; opacity:.5; }
#seafix-demo :is(#sf-smt-screen,#sf-smt-dialog) [hidden] { display:none!important; }
@media(max-width:1100px) { #seafix-demo .sf-smt-layout { grid-template-columns:minmax(0,1fr); } #seafix-demo .sf-smt-people { max-width:520px; } }
@media(max-width:600px) {
  #seafix-demo #sf-smt-screen > .sf-screen-title { flex-wrap:wrap; gap:16px; }
  #seafix-demo .sf-smt-form-row { grid-template-columns:minmax(0,1fr); }
  #seafix-demo #sf-smt-dialog { padding:20px; }
}
/* Keep the editor inside the visible phone viewport, including the keyboard.
   16px fields prevent Safari's automatic input zoom without blocking pinch zoom. */
@media(max-width:759px) {
  #seafix-demo #sf-smt-dialog {
    --sf-smt-top-gap:max(12px,env(safe-area-inset-top,0px));
    --sf-smt-bottom-gap:max(12px,env(safe-area-inset-bottom,0px));
    position:fixed; top:calc(var(--sf-viewport-top,0px) + var(--sf-smt-top-gap)); bottom:auto;
    left:max(12px,env(safe-area-inset-left,0px)); right:max(12px,env(safe-area-inset-right,0px));
    width:auto; max-width:590px; min-width:0; margin:0 auto;
    max-height:calc(var(--sf-viewport-height,100dvh) - var(--sf-smt-top-gap) - var(--sf-smt-bottom-gap));
    padding:20px; overflow-y:auto; overscroll-behavior:contain;
    scroll-padding-block:20px; -webkit-overflow-scrolling:touch;
  }
  #seafix-demo #sf-smt-edit-form, #seafix-demo #sf-smt-edit-fields label { min-width:0; }
  #seafix-demo #sf-smt-dialog :is(input,select,textarea) { width:100%; min-width:0; max-width:100%; font-size:16px; }
  #seafix-demo #sf-smt-dialog h2 { overflow-wrap:anywhere; }
  #seafix-demo .sf-smt-dialog-actions { flex-wrap:wrap; }
}

#seafix-demo .sf-smt-count { display:inline-flex; gap:5px; }

/* Update 40: the member directory opens in place of the agenda. */
#seafix-demo .sf-smt-board>.sf-screen-title { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin:0 0 24px; }
#seafix-demo .sf-smt-board>.sf-screen-title>div { min-width:0; }
#seafix-demo #sf-smt-navigation .sf-sidebar-heading { margin:0; }
#seafix-demo #sf-smt-navigation .sf-sidebar-heading h2 { margin:0; font-size:23px; line-height:1.25; font-weight:650; letter-spacing:-.5px; }
#seafix-demo #sf-smt-navigation .sf-sidebar-heading p { margin:7px 0 0; color:var(--sf-muted); font-size:13px; line-height:1.5; }
#seafix-demo #sf-smt-members-panel { padding:0; border:0; border-radius:0; background:transparent; max-width:none; }
#seafix-demo #sf-smt-members li { padding:15px 0; border-bottom:1px solid var(--sf-line); gap:12px; }
#seafix-demo #sf-smt-members strong { font-size:14px; }
#seafix-demo #sf-smt-members small { font-size:12px; }
#seafix-demo #sf-smt-members .sf-smt-avatar { width:40px; height:40px; font-size:12px; }
#seafix-demo #sf-smt-member-fields { max-width:540px; }
@media(min-width:760px) { #seafix-demo .sf-smt-layout { grid-template-columns:minmax(0,3fr) minmax(180px,1fr); gap:clamp(24px,3vw,48px); } }
@media(max-width:759px) { #seafix-demo #sf-smt-navigation { grid-row:1; } }

/* Update 43: agenda filters and the same empty state as work orders. */
#seafix-demo .sf-smt-board > .sf-screen-title { margin-bottom:14px; }
#seafix-demo .sf-smt-toolbar { display:grid; grid-template-columns:minmax(0,3fr) minmax(0,1fr); gap:8px 12px; }
#seafix-demo .sf-smt-search { min-width:0; margin:0; }
#seafix-demo #sf-smt-screen #sf-smt-search { padding-left:40px; }
#seafix-demo .sf-smt-search > :is(svg,i) { position:absolute; left:13px; top:50%; transform:translateY(-50%); width:16px; height:16px; pointer-events:none; }
#seafix-demo #sf-smt-filter { width:100%; }
#seafix-demo #sf-smt-screen :is(#sf-smt-search,#sf-smt-filter) { height:44px; }
#seafix-demo .sf-smt-count { grid-column:1/-1; margin:0; }
#seafix-demo :is(#sf-smt-empty,.fv-smt-empty) { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:24px; }
#seafix-demo :is(#sf-smt-empty,.fv-smt-empty) .sf-empty-work-copy h3 { margin:0; }
#seafix-demo :is(#sf-smt-empty,.fv-smt-empty) .sf-empty-work-copy p { margin-top:10px; }
@media(max-width:480px) {
  #seafix-demo .sf-smt-toolbar { grid-template-columns:minmax(0,3fr) minmax(134px,1fr); gap:8px; }
  #seafix-demo #sf-smt-screen #sf-smt-filter { padding:10px 6px; font-size:12px; }
}

/* Update 48: notes stay with the subject; ownership sits below priority. */
#seafix-demo .sf-smt-board { container: smt-board / inline-size; }
#seafix-demo #sf-smt-list:not(:empty) { border-block:1px solid var(--sf-line); }
#seafix-demo .sf-smt-topic {
  --sf-smt-highlight:transparent;
  position:relative; isolation:isolate; display:grid;
  grid-template-columns:38px 70px minmax(0,1fr) 155px 24px;
  gap:14px; align-items:start; min-width:0; padding:20px 10px; border:0;
}
#seafix-demo .sf-smt-topic::before {
  content:""; position:absolute; inset:5px 0; z-index:-1; border-radius:12px;
  background:var(--sf-smt-highlight); pointer-events:none; transition:background-color .14s ease;
}
#seafix-demo .sf-smt-topic + .sf-smt-topic::after {
  content:""; position:absolute; top:0; left:10px; right:10px; height:1px; background:var(--sf-line); pointer-events:none;
}
#seafix-demo .sf-smt-topic .sf-smt-number {
  padding:0; min-height:28px; border:0; background:transparent; color:var(--sf-muted);
  font:inherit; font-size:12px; font-weight:500; font-variant-numeric:tabular-nums;
  letter-spacing:-.4px; cursor:pointer; white-space:nowrap;
}
#seafix-demo .sf-smt-number > span { margin-right:1px; opacity:.55; font-size:10px; }
#seafix-demo .sf-smt-date {
  display:flex; flex-direction:column; gap:4px; padding-top:5px;
  color:var(--sf-heading); font-size:12px; font-weight:550; line-height:1.3; font-variant-numeric:tabular-nums;
}
#seafix-demo .sf-smt-date-year { color:var(--sf-muted); font-size:11px; font-weight:400; }
#seafix-demo .sf-smt-date-compact { display:none; }
#seafix-demo .sf-smt-copy { min-width:0; padding-top:2px; }
#seafix-demo .sf-smt-topic h3 { margin:0; font-size:14px; line-height:1.5; font-weight:600; }
#seafix-demo .sf-smt-topic-heading button {
  display:block; width:100%; min-height:24px; padding:0; border:0; background:transparent;
  color:var(--sf-heading); font:inherit; text-align:left; overflow-wrap:anywhere; cursor:pointer;
}
#seafix-demo .sf-smt-notes { margin:7px 0 0; color:var(--sf-muted); font-size:12px; line-height:1.65; white-space:pre-wrap; overflow-wrap:anywhere; }
#seafix-demo .sf-smt-meta { display:flex; flex-direction:column; align-items:flex-end; gap:6px; min-width:0; }
#seafix-demo .sf-smt-presenter { display:block; max-width:100%; padding-top:3px; text-align:right; font-size:11px; line-height:1.5; overflow-wrap:anywhere; }
#seafix-demo .sf-smt-lead-label { display:block; color:var(--sf-muted); font-size:10px; }
#seafix-demo .sf-smt-lead-name { display:block; color:var(--sf-text); font-weight:500; }
#seafix-demo .sf-smt-presenter.is-unassigned .sf-smt-lead-name { color:var(--sf-muted); font-weight:400; }
#seafix-demo :is(#sf-smt-screen,.fv-smt-board) .sf-smt-topic .sf-smt-status {
  width:110px; min-height:28px; height:28px; box-sizing:border-box; margin:0; padding:3px 8px; border:0; border-radius:7px;
  background:light-dark(#e9eaee,#2e3036); color:var(--sf-heading); font:inherit; font-size:11px; font-weight:550; line-height:22px;
}
#seafix-demo :is(#sf-smt-screen,.fv-smt-board) .sf-smt-status[data-status="in_progress"] { background:light-dark(#f7f0d9,#3c3522); color:light-dark(#826614,#e4c564); }
#seafix-demo :is(#sf-smt-screen,.fv-smt-board) .sf-smt-status[data-status="closed"] { background:light-dark(#e3efe8,#20372c); color:light-dark(#2f7250,#90caaa); }
#seafix-demo .sf-smt-urgency { display:flex; align-items:center; gap:6px; padding:0 5px; color:var(--sf-muted); font-size:10px; line-height:18px; white-space:nowrap; }
#seafix-demo .sf-smt-urgency-dots { display:flex; align-items:center; gap:3px; }
#seafix-demo .sf-smt-urgency-dots b { width:4px; height:4px; border-radius:50%; background:color-mix(in srgb,currentColor 20%,transparent); }
#seafix-demo .sf-smt-urgency-dots .is-filled { background:currentColor; }
#seafix-demo .sf-smt-urgency[data-level="2"] { color:light-dark(#8a7135,#ccae71); }
#seafix-demo .sf-smt-urgency[data-level="3"] { color:light-dark(#a5535c,#de939d); }
#seafix-demo .sf-smt-topic .sf-smt-open { width:24px; height:28px; padding:4px; }
#seafix-demo .sf-smt-topic .sf-smt-open svg { width:16px!important; height:16px!important; stroke-width:1.5; }
#seafix-demo .sf-smt-topic:focus-within { --sf-smt-highlight:light-dark(#edeef2,#1c1e23); }
#seafix-demo #sf-smt-read-detail h3 { margin:0 0 12px; overflow-wrap:anywhere; }
#seafix-demo #sf-smt-read-detail p { font-size:13px; line-height:1.6; overflow-wrap:anywhere; }
#seafix-demo .sf-smt-read-meta { color:var(--sf-muted); }
#seafix-demo .sf-smt-read-notes { margin-top:20px; padding-top:16px; border-top:1px solid var(--sf-line); white-space:pre-wrap; }
@media(hover:hover) and (pointer:fine) {
  #seafix-demo .sf-smt-topic:hover { --sf-smt-highlight:light-dark(#edeef2,#1c1e23); }
}
@container smt-board (max-width:600px) {
  #seafix-demo .sf-smt-topic { grid-template-columns:30px minmax(0,1fr) 110px; gap:8px 12px; padding:16px 5px; }
  #seafix-demo .sf-smt-topic .sf-smt-number { grid-column:1; grid-row:1; min-height:22px; font-size:11px; }
  #seafix-demo .sf-smt-date { grid-column:2; grid-row:1; padding-top:3px; font-size:11px; font-weight:400; color:var(--sf-muted); }
  #seafix-demo .sf-smt-date-day, #seafix-demo .sf-smt-date-year { display:none; }
  #seafix-demo .sf-smt-date-compact { display:inline; }
  #seafix-demo .sf-smt-copy { grid-column:1/3; grid-row:2; padding:0; }
  #seafix-demo .sf-smt-meta { grid-column:3; grid-row:1/3; }
  #seafix-demo .sf-smt-topic h3 { font-size:13px; }
  #seafix-demo .sf-smt-notes { font-size:11px; line-height:1.6; }
  #seafix-demo :is(#sf-smt-screen,.fv-smt-board) .sf-smt-topic .sf-smt-status { width:110px; }
  #seafix-demo .sf-smt-topic .sf-smt-open { display:none; }
}
/* Department sections share the crew's own icons and restrained surfaces. */
#seafix-demo #sf-smt-members { display:grid; gap:16px; }
#seafix-demo .sf-smt-member-group { padding:16px 18px 4px; border:1px solid var(--sf-line); border-radius:16px; background:var(--sf-surface); }
#seafix-demo .sf-smt-member-group header { display:flex; align-items:center; gap:10px; padding:0 0 12px; border-bottom:1px solid var(--sf-line); }
#seafix-demo .sf-smt-member-group h4 { margin:0; flex:1; min-width:0; font-size:13px; font-weight:600; color:var(--sf-heading); }
#seafix-demo .sf-smt-group-icon { display:grid; place-items:center; width:30px; height:30px; border-radius:10px; background:var(--sf-surface-raised); color:var(--sf-muted); }
#seafix-demo .sf-smt-group-icon svg { width:19px!important; height:19px!important; }
#seafix-demo .sf-smt-group-count { min-width:24px; padding:3px 6px; border:1px solid var(--sf-line); border-radius:7px; text-align:center; font-size:11px; color:var(--sf-muted); font-variant-numeric:tabular-nums; }
#seafix-demo .sf-smt-member-group ul { list-style:none; margin:0; padding:0; }
#seafix-demo #sf-smt-members li { padding:13px 0; }
#seafix-demo #sf-smt-members li:last-child { border:0; }
#seafix-demo #sf-smt-members .sf-smt-avatar { width:36px; height:36px; border-radius:12px; border:1px solid var(--sf-line); background:var(--sf-canvas); color:var(--sf-muted); font-size:11px; }
#seafix-demo #sf-smt-members strong { font-size:13px; }
#seafix-demo #sf-smt-members small { font-size:11px; }
#seafix-demo .sf-smt-permanent { display:grid; place-items:center; width:36px; color:var(--sf-muted); }
#seafix-demo .sf-smt-permanent svg { width:15px!important; height:15px!important; }
#seafix-demo .sf-smt-group-empty { margin:14px 0; font-size:12px; color:var(--sf-muted); line-height:1.5; }
#seafix-demo #sf-smt-member-fields { max-width:none; grid-template-columns:minmax(0,1fr) auto; gap:10px; margin-top:24px; padding-top:20px; }
#seafix-demo #sf-smt-member-fields label { grid-column:1/-1; }
#seafix-demo #sf-smt-member-fields select { width:100%; }
#seafix-demo .sf-smt-report { width:100%; min-width:0; }
#seafix-demo #sf-smt-report-form { display:grid; gap:14px; width:100%; min-width:0; margin:0; padding:0; border:0; background:transparent; }
#seafix-demo #sf-smt-report-fields { display:grid; gap:10px; width:100%; min-width:0; padding:0; margin:0; border:0; }
#seafix-demo #sf-smt-report-fields label { margin:0; color:var(--sf-text); font-size:12px; font-weight:600; }
#seafix-demo #sf-smt-report-fields select { width:100%; min-width:0; }
#seafix-demo #sf-smt-report-form .sf-report-guide { margin:2px 0 0; color:var(--sf-muted); font-size:13px; line-height:1.65; overflow-wrap:anywhere; }
#seafix-demo #sf-smt-report-form .sf-export-hint { margin:0!important; font-size:11px; line-height:1.6; }
#seafix-demo #sf-smt-report-form .sf-primary-action { width:100%; min-width:0; justify-content:center; margin-top:10px; padding:13px 18px; line-height:1.4; }
#seafix-demo #sf-smt-report-message { margin:0; overflow-wrap:anywhere; }
@container smt-board (max-width:420px) {
  #seafix-demo #sf-smt-member-fields { grid-template-columns:minmax(0,1fr); }
  #seafix-demo .sf-smt-member-group { padding:14px 12px 2px; }
}
@media(max-width:759px) {
  #seafix-demo #sf-smt-navigation .sf-layovers-tile {
    grid-column:auto; grid-template-columns:18px minmax(0,1fr); align-items:center;
    min-height:64px; padding:12px; gap:8px;
  }
  #seafix-demo #sf-smt-navigation .sf-layovers-tile > svg:first-child { width:18px!important; height:18px!important; }
  #seafix-demo #sf-smt-navigation .sf-layovers-tile strong { font-size:13px; overflow-wrap:normal; }
  #seafix-demo #sf-smt-navigation .sf-layovers-tile small { display:none; }
}
@media(prefers-reduced-motion:reduce) { #seafix-demo .sf-smt-topic::before { transition:none; } }

/* Center the icon and title in each compact navigation tile. */
@media(max-width:999px){
  #seafix-demo #sf-smt-navigation .sf-layovers-tile{
    grid-template-columns:20px minmax(0,1fr);align-content:center;align-items:center;min-height:76px;
  }
  #seafix-demo #sf-smt-view-report small{display:none;}
  #seafix-demo #sf-smt-navigation .sf-layovers-tile>span{align-self:center;}
}

/* Modals are positioned inside the visible viewport on iPhone and iPad. */
@media(max-width:999px){
  #seafix-demo #sf-smt-dialog{
    position:fixed;top:calc(var(--sf-viewport-top,0px) + max(12px,env(safe-area-inset-top,0px)));
    bottom:auto;left:max(12px,env(safe-area-inset-left,0px));right:max(12px,env(safe-area-inset-right,0px));
    width:auto;max-width:590px;margin:0 auto;
    max-height:calc(var(--sf-viewport-height,100dvh) - max(12px,env(safe-area-inset-top,0px)) - max(12px,env(safe-area-inset-bottom,0px)));
    overflow-y:auto;overscroll-behavior:contain;
  }
  #seafix-demo #sf-smt-screen :is(input,select,textarea),
  #seafix-demo #sf-smt-dialog :is(input,select,textarea){font-size:16px;}
}

/* Update 53: heading, navigation and content keep the same mobile reading order. */
#seafix-demo .sf-smt-layout { row-gap:18px; }
#seafix-demo .sf-smt-heading { grid-column:1; grid-row:1; display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin:0; }
#seafix-demo .sf-smt-heading > div { min-width:0; }
#seafix-demo .sf-smt-board { grid-column:1; grid-row:2; min-width:0; }
/* Update 55: align the tiles with the filters; spanning both rows made short search results stretch the heading row. */
#seafix-demo #sf-smt-navigation { grid-column:2; grid-row:2; }
#seafix-demo #sf-smt-add { background:var(--sf-primary-soft); }
#seafix-demo #sf-smt-members { grid-template-columns:repeat(3,minmax(210px,1fr)); gap:12px; overflow-x:auto; padding-bottom:8px; scroll-snap-type:x proximity; overscroll-behavior-x:contain; }
#seafix-demo .sf-smt-member-group { padding:14px 12px 4px; scroll-snap-align:start; }
#seafix-demo .sf-smt-member-group[data-department="unknown"] { grid-column:1 / -1; }
#seafix-demo #sf-smt-members li { gap:8px; }
#seafix-demo #sf-smt-members .sf-smt-avatar { flex:none; width:30px; height:30px; }
#seafix-demo #sf-smt-members .sf-smt-permanent { flex:none; width:24px; }
@media(max-width:759px) {
  #seafix-demo .sf-smt-layout { grid-template-columns:minmax(0,1fr); row-gap:18px; }
  #seafix-demo #sf-smt-navigation { grid-column:1; grid-row:2; }
  #seafix-demo .sf-smt-board { grid-row:3; }
}

/* Approved SMT composition: two main actions above one shared utility panel. */
#seafix-demo #sf-smt-screen #sf-smt-navigation {
  display:grid; gap:14px; min-width:0; padding:0; margin:0; position:static; inset:auto;
  align-self:start; height:auto; max-height:none; overflow:visible;
}
#seafix-demo .sf-smt-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
#seafix-demo #sf-smt-navigation .sf-layovers-tile {
  position:relative; min-width:0; width:100%; margin:0; box-sizing:border-box;
  border:0; color:var(--sf-heading); font:inherit; text-align:left; cursor:pointer;
  grid-column:auto; transform:none; transition:box-shadow .16s ease; background:transparent;
}
#seafix-demo #sf-smt-navigation .sf-smt-nav-card {
  display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:34px minmax(0,1fr) 28px; align-items:start;
  min-height:186px; padding:18px; gap:12px; border:1px solid light-dark(#d1dcd5,#4a5e50);
  border-radius:20px; background:linear-gradient(135deg,light-dark(#e5ebe7,#303b34),light-dark(#f0f3f0,#39473e));
  color:light-dark(#2d4637,#dfede3); box-shadow:0 4px 12px light-dark(#2630440d,#00000020);
}
#seafix-demo #sf-smt-navigation #sf-smt-add {
  background:linear-gradient(135deg,#22262b,#3c4249); color:#fff; border-color:#343a42;
}
#seafix-demo #sf-smt-navigation .sf-smt-nav-card > :is(i,svg) { width:30px!important; height:30px!important; stroke-width:1.5; }
#seafix-demo #sf-smt-navigation .sf-smt-nav-copy { display:grid; gap:5px; min-width:0; }
#seafix-demo #sf-smt-navigation .sf-smt-nav-copy strong { font-size:19px; font-weight:550; line-height:1.3; letter-spacing:-.35px; }
#seafix-demo #sf-smt-navigation .sf-smt-nav-copy small { display:block; margin:0; font-size:12px; line-height:1.5; color:light-dark(#56695d,#bacbc1); }
#seafix-demo #sf-smt-add .sf-smt-nav-copy small { color:#d1d7df; }
#seafix-demo #sf-smt-navigation .sf-smt-nav-arrow {
  display:grid; place-items:center; flex:none; width:28px; height:28px; align-self:flex-end;
  border-radius:50%; color:inherit; background:light-dark(#22262b08,#ffffff0e);
}
#seafix-demo #sf-smt-navigation .sf-smt-nav-card > .sf-smt-nav-arrow { grid-row:3; justify-self:end; }
#seafix-demo #sf-smt-add .sf-smt-nav-arrow { background:#ffffff15; }
#seafix-demo #sf-smt-navigation .sf-smt-nav-arrow :is(i,svg) { width:16px!important; height:16px!important; stroke-width:1.6; }
#seafix-demo #sf-smt-navigation .sf-smt-active-total {
  position:absolute; top:15px; right:15px; display:grid; place-items:center; min-width:42px; height:36px;
  padding:0 9px; border:1px solid light-dark(#2d463715,#dfede326); border-radius:13px;
  background:light-dark(#ffffff40,#dfede308); color:inherit;
}
#seafix-demo #sf-smt-navigation .sf-smt-active-total > strong { font-size:25px; line-height:1; font-weight:550; font-variant-numeric:tabular-nums; }
#seafix-demo .sf-smt-actions:has(#sf-smt-add[hidden]) #sf-smt-view-topics { grid-column:1/-1; }
#seafix-demo .sf-smt-utilities {
  padding:0 20px; border:1px solid var(--sf-line); border-radius:20px; background:var(--sf-surface);
  box-shadow:0 4px 12px light-dark(#26304408,#00000018); min-width:0;
}
#seafix-demo #sf-smt-navigation .sf-smt-nav-utility { display:flex; align-items:center; gap:12px; padding:24px 0; min-height:100px; border-radius:0; }
#seafix-demo #sf-smt-navigation .sf-smt-nav-utility > :is(i,svg) { flex:none; width:29px!important; height:29px!important; stroke-width:1.5; }
#seafix-demo #sf-smt-navigation .sf-smt-nav-utility .sf-smt-nav-copy { flex:1; }
#seafix-demo #sf-smt-navigation .sf-smt-nav-utility .sf-smt-nav-copy strong { font-size:16px; letter-spacing:-.2px; }
#seafix-demo #sf-smt-navigation .sf-smt-nav-utility .sf-smt-nav-copy small { color:var(--sf-muted); font-size:11px; }
#seafix-demo #sf-smt-navigation .sf-smt-nav-utility .sf-smt-nav-arrow { align-self:center; width:27px; height:27px; }
#seafix-demo .sf-smt-utility-footer { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
#seafix-demo .sf-smt-utilities:has(#sf-smt-invite:not([hidden])) .sf-smt-utility-footer { border-top:1px solid var(--sf-line); }
#seafix-demo #sf-smt-navigation .sf-smt-utility-footer .sf-smt-nav-utility { min-height:96px; gap:10px; padding:20px 0; }
#seafix-demo #sf-smt-navigation .sf-smt-utility-footer .sf-smt-nav-copy strong { font-size:14px; }
#seafix-demo #sf-smt-navigation .sf-smt-utility-footer .sf-smt-nav-utility > :is(i,svg) { width:24px!important; height:24px!important; }
#seafix-demo #sf-smt-view-members { padding-right:12px!important; }
#seafix-demo #sf-smt-view-report { padding-left:12px!important; }
#seafix-demo #sf-smt-view-report::before { content:""; position:absolute; left:0; top:22px; bottom:22px; width:1px; background:var(--sf-line); }
#seafix-demo #sf-smt-navigation [aria-pressed="true"] .sf-smt-nav-arrow { background:light-dark(#2d463712,#dfede31a); }
#seafix-demo #sf-smt-navigation button:focus-visible { outline:2px solid var(--sf-heading); outline-offset:3px; }
#seafix-demo :is(#sf-smt-heading-copy,.fv-smt-heading p) { margin-top:4px; }
@media(min-width:1000px) {
  #seafix-demo .sf-smt-layout { grid-template-columns:minmax(0,1.7fr) minmax(380px,1fr); column-gap:24px; row-gap:18px; }
  /* Share the search row with the right panel, even when the heading wraps. */
  #seafix-demo .sf-smt-left { display:contents; }
  #seafix-demo .sf-smt-left > .sf-smt-heading { grid-column:1; grid-row:1; }
  #seafix-demo .sf-smt-left > .sf-smt-board { grid-column:1; grid-row:2; }
  #seafix-demo #sf-smt-navigation { grid-column:2; grid-row:2; }
  #seafix-demo #sf-smt-navigation .sf-smt-nav-card { grid-template-rows:30px minmax(0,1fr) 24px; min-height:168px; padding:16px; gap:8px; }
  #seafix-demo #sf-smt-navigation .sf-smt-nav-card > :is(i,svg) { width:28px!important; height:28px!important; }
  #seafix-demo #sf-smt-navigation .sf-smt-nav-card > .sf-smt-nav-arrow { width:24px; height:24px; }
}
@media(max-width:999px) {
  #seafix-demo .sf-smt-left { display:contents; }
  #seafix-demo .sf-smt-layout { grid-template-columns:minmax(0,1fr); }
  #seafix-demo #sf-smt-navigation { grid-column:1; grid-row:2; }
  #seafix-demo .sf-smt-board { grid-row:3; }
  #seafix-demo #sf-smt-navigation .sf-smt-nav-card { grid-template-rows:34px minmax(0,1fr); min-height:136px; gap:14px; padding:18px; }
  #seafix-demo #sf-smt-navigation .sf-smt-nav-card .sf-smt-nav-copy strong { font-size:16px; }
  #seafix-demo #sf-smt-navigation .sf-smt-nav-card .sf-smt-nav-copy small { display:none; }
  #seafix-demo #sf-smt-navigation .sf-smt-nav-arrow { display:none; }
  #seafix-demo #sf-smt-navigation .sf-smt-active-total { top:13px; right:13px; min-width:36px; height:34px; }
  #seafix-demo #sf-smt-navigation .sf-smt-active-total > strong { font-size:20px; }
  #seafix-demo .sf-smt-utilities { padding-inline:14px; }
  #seafix-demo #sf-smt-navigation .sf-smt-nav-utility { min-height:80px; padding-block:18px; }
}
@media(hover:hover) and (pointer:fine) {
  #seafix-demo #sf-smt-navigation .sf-smt-nav-card:hover { box-shadow:0 5px 16px light-dark(#26304420,#00000040); }
  #seafix-demo #sf-smt-navigation .sf-smt-nav-utility:hover .sf-smt-nav-copy strong { text-decoration:underline; text-underline-offset:4px; }
}
/* Print choices are a dialog on the current agenda or member view. */
#seafix-demo #sf-smt-report-panel {
  width:min(440px,calc(100vw - 32px)); min-width:0; max-height:calc(var(--sf-viewport-height,100dvh) - 32px);
  box-sizing:border-box; padding:24px; border:1px solid var(--sf-line); border-radius:20px;
  color:var(--sf-text); background:var(--sf-surface); overflow:auto;
}
#seafix-demo #sf-smt-report-panel[hidden] { display:none!important; }
#seafix-demo #sf-smt-report-panel::backdrop { background:#1117; backdrop-filter:blur(3px); }
#seafix-demo .sf-smt-report-heading { display:flex; align-items:center; gap:10px; margin-bottom:22px; }
#seafix-demo .sf-smt-report-heading > :is(i,svg) { flex:none; width:24px!important; height:24px!important; }
#seafix-demo .sf-smt-report-heading h2 { flex:1; margin:0; min-width:0; font-size:17px; font-weight:600; line-height:1.4; }
#seafix-demo #sf-smt-report-close { width:28px; height:28px; padding:4px; }
#seafix-demo #sf-smt-report-fields select { box-sizing:border-box; min-height:44px; padding:10px; border:1px solid var(--sf-line); border-radius:10px; background:var(--sf-entry-background); color:var(--sf-text); font:inherit; }
#seafix-demo #sf-smt-report-form .sf-report-guide { font-size:12px; line-height:1.6; }
#seafix-demo #sf-smt-report-form .sf-smt-paper-format { margin:10px 0 0; padding-top:16px; border-top:1px solid var(--sf-line); color:var(--sf-muted); font-size:12px; }
#seafix-demo .sf-smt-report-buttons { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
#seafix-demo .sf-smt-report-buttons button { justify-content:center; min-height:40px; font-size:12px; }
#seafix-demo #sf-smt-report-panel :is(button,select):focus-visible { outline:2px solid var(--sf-heading); outline-offset:3px; }
#seafix-demo #sf-smt-report-panel .sf-smt-icon:focus:not(:focus-visible) { outline:none; }
@media(max-width:999px) {
  #seafix-demo #sf-smt-report-panel { max-width:calc(100vw - 24px); padding:20px; }
  #seafix-demo #sf-smt-report-fields select { font-size:16px; }
}
@media(prefers-reduced-motion:reduce) { #seafix-demo #sf-smt-navigation button { transition:none; } }

/* Topic responsibility and files use the same compact controls as the agenda. */
#seafix-demo .sf-smt-lead-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
#seafix-demo .sf-smt-lead-chip{display:inline-flex;align-items:center;gap:8px;padding:5px 9px;border:1px solid var(--sf-line);border-radius:9px;font-size:12px;max-width:100%;overflow-wrap:anywhere}
#seafix-demo .sf-smt-lead-chip button,#seafix-demo .sf-smt-file>button{border:0;background:none;color:var(--sf-muted);font:inherit;font-size:20px;min-width:28px;min-height:28px;padding:0;cursor:pointer}
#seafix-demo .sf-smt-topic-extras{display:grid;gap:16px;min-width:0;margin-top:14px}
#seafix-demo .sf-smt-topic-extras small{display:block;color:var(--sf-muted);font-size:12px;font-weight:400;margin-top:5px}
#seafix-demo .sf-smt-attachments{border-top:1px solid var(--sf-line);padding-top:12px;min-width:0}
#seafix-demo .sf-smt-attachments summary{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:14px;font-weight:500;list-style:none;min-height:36px}
#seafix-demo .sf-smt-attachments summary::-webkit-details-marker{display:none}
#seafix-demo .sf-smt-attachments summary svg,#seafix-demo .sf-smt-attachment-entry svg{width:18px;height:18px}
#seafix-demo .sf-smt-attachments p{font-size:12px;color:var(--sf-muted);line-height:1.5}
#seafix-demo .sf-smt-attach-actions{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
#seafix-demo .sf-smt-attach-actions button{border:1px solid var(--sf-line);border-radius:9px;background:var(--sf-surface);padding:8px 12px;font:inherit;font-size:13px;color:var(--sf-text);cursor:pointer}
#seafix-demo .sf-smt-file{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--sf-line);padding:10px 0;min-width:0;font-size:13px}
#seafix-demo .sf-smt-file>span:first-child{width:44px;flex:none}
#seafix-demo .sf-smt-file>span:nth-child(2){flex:1;min-width:0;overflow-wrap:anywhere}
#seafix-demo .sf-smt-file img{width:44px;height:44px;object-fit:cover;border-radius:8px}
#seafix-demo .sf-smt-file a{color:inherit;text-decoration:underline;text-underline-offset:3px}
#seafix-demo .sf-smt-attachment-entry{display:inline-flex;align-items:center;gap:5px;border:0;background:transparent;color:var(--sf-muted);padding:4px 0;font:inherit;cursor:pointer}
#seafix-demo .sf-smt-meeting-date{font-size:12px;color:var(--sf-muted)}

#seafix-demo .sf-smt-overdue{display:inline-block;white-space:nowrap;margin-left:4px;font-size:11px;font-weight:500;color:var(--sf-text);border-bottom:1px dotted currentColor}

#seafix-demo .sf-smt-meeting-date{overflow-wrap:anywhere;max-width:100%}
#seafix-demo .sf-smt-topic-extras [hidden]{display:none!important}

/* Keep desktop SMT actions in place while the topic/member column scrolls. */
@media(min-width:1000px){
  #seafix-demo .sf-main:has(>#sf-smt-screen:not([hidden])){overflow-y:hidden;padding-bottom:0;}
  #seafix-demo #sf-smt-screen:not([hidden]){height:100%;min-height:0;}
  #seafix-demo #sf-smt-screen .sf-smt-layout{height:100%;min-height:0;grid-template-rows:auto minmax(0,1fr);}
  #seafix-demo #sf-smt-screen .sf-smt-board{align-self:stretch;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;scrollbar-width:thin;padding-bottom:20px;box-sizing:border-box;}
  #seafix-demo #sf-smt-screen #sf-smt-navigation{max-height:100%;overflow-y:auto;overscroll-behavior-y:contain;scrollbar-width:thin;box-sizing:border-box;padding-bottom:20px;}
}

/* Compact topic metadata: status, responsibility, then target and files. */
#seafix-demo .sf-smt-topic{grid-template-columns:38px 70px minmax(0,1fr) 148px 24px;padding-block:16px;}
#seafix-demo .sf-smt-meta{gap:5px;}
#seafix-demo .sf-smt-status-row{display:flex;align-items:center;justify-content:flex-end;gap:7px;max-width:100%;}
#seafix-demo .sf-smt-status-row .sf-smt-urgency{padding:0;flex:none;}
#seafix-demo .sf-smt-status-row .sf-smt-urgency-label{display:none;}
#seafix-demo .sf-smt-meta .sf-smt-presenter{display:flex;align-items:flex-start;justify-content:flex-end;gap:5px;padding-top:0;line-height:1.4;}
#seafix-demo .sf-smt-presenter>svg{width:13px!important;height:13px!important;flex:none;margin-top:1px;color:var(--sf-muted);}
#seafix-demo .sf-smt-target-row{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:3px 7px;max-width:100%;}
#seafix-demo .sf-smt-target-row:empty{display:none;}
#seafix-demo .sf-smt-target-row .sf-smt-meeting-date{font-size:11px;line-height:1.4;text-align:right;min-width:0;flex:1 1 94px;}
#seafix-demo .sf-smt-target-row .sf-smt-attachment-entry{flex:none;}
#seafix-demo .sf-smt-overdue{color:light-dark(#b42332,#ff9aa5);border-bottom:0;white-space:nowrap;}
#seafix-demo :is(#sf-smt-screen,.fv-smt-board) .sf-smt-topic .sf-smt-status[data-status="open"]{background:light-dark(#e3efe8,#20372c);color:light-dark(#2f7250,#90caaa);}
#seafix-demo :is(#sf-smt-screen,.fv-smt-board) .sf-smt-topic .sf-smt-status[data-status="closed"]{background:light-dark(#e9eaee,#2e3036);color:var(--sf-heading);}
@container smt-board (max-width:600px){
 #seafix-demo .sf-smt-topic{grid-template-columns:30px minmax(0,1fr) 124px;}
 #seafix-demo :is(#sf-smt-screen,.fv-smt-board) .sf-smt-topic .sf-smt-status{width:97px;padding-inline:5px;}
}