/* ==========================================================================
   SEHL MAIL — APP UX MASTER V1.2
   FULL LIGHT means FULL LIGHT.
   Dark remains untouched unless a rule is explicitly theme-neutral.
   ========================================================================== */

:root{
  --sehl-app-sheet-radius:24px;
  --sehl-app-control-radius:12px;

  --sehl-app-canvas:var(--bg);
  --sehl-app-surface:var(--surface);
  --sehl-app-surface-soft:var(--surface-2);
  --sehl-app-surface-strong:var(--surface-3);
  --sehl-app-text:var(--ink);
  --sehl-app-text-2:var(--ink-soft);
  --sehl-app-text-3:var(--ink-faint);
  --sehl-app-line:var(--line);
  --sehl-app-line-soft:var(--line-soft);
  --sehl-app-accent:var(--gold);
  --sehl-app-accent-deep:var(--gold-deep);
  --sehl-app-accent-soft:color-mix(in srgb,var(--gold) 11%,transparent);
  --sehl-app-selected:color-mix(in srgb,var(--gold) 7%,var(--surface));
  --sehl-app-unread:color-mix(in srgb,var(--gold) 3.5%,var(--surface));
  --sehl-app-overlay:rgba(18,22,30,.42);
}

[data-theme="light"]{
  --sehl-light-canvas:#f7f4ef;
  --sehl-light-canvas-2:#f3efe8;
  --sehl-light-surface:#fffefd;
  --sehl-light-surface-2:#f2eee7;
  --sehl-light-surface-3:#ebe5dc;
  --sehl-light-text:#20242d;
  --sehl-light-text-2:#596171;
  --sehl-light-text-3:#9099a9;
  --sehl-light-line:#e6dfd5;
  --sehl-light-line-soft:#eee8df;
  --sehl-light-accent:#ad7f36;
  --sehl-light-accent-deep:#8f6427;
  --sehl-light-accent-soft:#f4ead9;

  --sehl-app-canvas:var(--sehl-light-canvas);
  --sehl-app-surface:var(--sehl-light-surface);
  --sehl-app-surface-soft:var(--sehl-light-surface-2);
  --sehl-app-surface-strong:var(--sehl-light-surface-3);
  --sehl-app-text:var(--sehl-light-text);
  --sehl-app-text-2:var(--sehl-light-text-2);
  --sehl-app-text-3:var(--sehl-light-text-3);
  --sehl-app-line:var(--sehl-light-line);
  --sehl-app-line-soft:var(--sehl-light-line-soft);
  --sehl-app-accent:var(--sehl-light-accent);
  --sehl-app-accent-deep:var(--sehl-light-accent-deep);
  --sehl-app-accent-soft:var(--sehl-light-accent-soft);
  --sehl-app-selected:#f6eddd;
  --sehl-app-unread:#fbf7f0;
  --sehl-app-overlay:rgba(40,42,47,.36);
}

[data-theme="dark"]{
  --sehl-app-accent-soft:color-mix(in srgb,var(--gold) 12%,transparent);
  --sehl-app-selected:color-mix(in srgb,var(--gold) 8%,var(--surface));
  --sehl-app-unread:color-mix(in srgb,var(--gold) 3%,var(--surface));
  --sehl-app-overlay:rgba(0,0,0,.56);
}

/* --------------------------------------------------------------------------
   GLOBAL APP PAINT
   -------------------------------------------------------------------------- */

html,
body{
  background:var(--sehl-app-canvas)!important;
  color:var(--sehl-app-text)!important;
}

[data-theme="light"] body,
[data-theme="light"] .app,
[data-theme="light"] .main,
[data-theme="light"] .content,
[data-theme="light"] .page,
[data-theme="light"] .view,
[data-theme="light"] .workspace,
[data-theme="light"] .center,
[data-theme="light"] .center-pane,
[data-theme="light"] .mail,
[data-theme="light"] .mailbox,
[data-theme="light"] .inbox,
[data-theme="light"] .mail-pane,
[data-theme="light"] .mailpane,
[data-theme="light"] .list-pane,
[data-theme="light"] .list-wrap,
[data-theme="light"] .messages,
[data-theme="light"] .rows,
[data-theme="light"] #rows,
[data-theme="light"] #mailList,
[data-theme="light"] .mail-list,
[data-theme="light"] .list{
  background:var(--sehl-light-canvas)!important;
  color:var(--sehl-light-text)!important;
}

/*
 * Runtime marks the real list ancestors after mail.js renders them.
 * This is deliberate: it prevents unknown legacy class names from escaping
 * Light Mode without globally repainting arbitrary email HTML.
 */
[data-theme="light"] .sehl-light-runtime-surface{
  background:var(--sehl-light-canvas)!important;
  color:var(--sehl-light-text)!important;
  border-color:var(--sehl-light-line-soft)!important;
}

[data-theme="light"] .sehl-light-runtime-toolbar{
  background:var(--sehl-light-surface)!important;
  color:var(--sehl-light-text-2)!important;
  border-color:var(--sehl-light-line)!important;
  box-shadow:none!important;
}

/* ---------- Header / search ---------- */

.top{
  background:var(--sehl-app-canvas)!important;
  color:var(--sehl-app-text)!important;
  border-bottom-color:var(--sehl-app-line-soft)!important;
}

[data-theme="light"] .top{
  background:var(--sehl-light-canvas)!important;
}

[data-theme="light"] .top input,
[data-theme="light"] .top .search,
[data-theme="light"] .top .searchbox,
[data-theme="light"] .top [class*="search" i] input{
  background:var(--sehl-light-surface)!important;
  color:var(--sehl-light-text)!important;
  border-color:var(--sehl-light-line)!important;
  box-shadow:none!important;
}

[data-theme="light"] .top input::placeholder{
  color:var(--sehl-light-text-3)!important;
}

[data-theme="light"] .top .ico,
[data-theme="light"] .top button{
  color:var(--sehl-light-text-2)!important;
}

[data-theme="light"] .top .ico:hover,
[data-theme="light"] .top button:hover{
  background:var(--sehl-light-surface-2)!important;
  color:var(--sehl-light-text)!important;
}

/* ---------- Tabs ---------- */

.tabs{
  background:var(--sehl-app-canvas)!important;
  border-bottom-color:var(--sehl-app-line-soft)!important;
}

[data-theme="light"] .tabs{
  background:var(--sehl-light-canvas)!important;
}

.tab{color:var(--sehl-app-text-3)!important}
.tab.on{color:var(--sehl-app-text)!important}
[data-theme="dark"] .tab.on{color:var(--sehl-app-accent)!important}
[data-theme="light"] .tab.on{color:var(--sehl-light-accent-deep)!important}

/* ---------- Sidebar ---------- */

[data-theme="light"] .rail,
[data-theme="light"] .side,
[data-theme="light"] .sidebar{
  background:var(--sehl-light-surface)!important;
  color:var(--sehl-light-text)!important;
  border-color:var(--sehl-light-line-soft)!important;
}

[data-theme="light"] .brand,
[data-theme="light"] .fold,
[data-theme="light"] .people-row,
[data-theme="light"] .prow,
[data-theme="light"] .menu{
  color:var(--sehl-light-text)!important;
}

[data-theme="light"] .fold:hover,
[data-theme="light"] .people-row:hover,
[data-theme="light"] .prow:hover,
[data-theme="light"] .menu button:hover{
  background:var(--sehl-light-surface-2)!important;
}

[data-theme="light"] .fold.on,
[data-theme="light"] .prow.on{
  background:var(--sehl-light-accent-soft)!important;
  color:var(--sehl-light-accent-deep)!important;
}

/* --------------------------------------------------------------------------
   INBOX TOOLBAR — no dark island in Light
   -------------------------------------------------------------------------- */

.tb,
.selbar{
  color:var(--sehl-app-text-2)!important;
  background:var(--sehl-app-canvas)!important;
  border-color:var(--sehl-app-line-soft)!important;
}

[data-theme="light"] .tb,
[data-theme="light"] .selbar,
[data-theme="light"] .toolbar,
[data-theme="light"] .tools,
[data-theme="light"] .listbar,
[data-theme="light"] .list-bar,
[data-theme="light"] .list-tools,
[data-theme="light"] .bulkbar,
[data-theme="light"] .bulk-bar,
[data-theme="light"] .controls,
[data-theme="light"] .selection-bar{
  background:var(--sehl-light-surface)!important;
  color:var(--sehl-light-text-2)!important;
  border-color:var(--sehl-light-line)!important;
}

[data-theme="light"] .tb button,
[data-theme="light"] .selbar button,
[data-theme="light"] .toolbar button,
[data-theme="light"] .tools button,
[data-theme="light"] .listbar button,
[data-theme="light"] .list-tools button,
[data-theme="light"] .controls button,
[data-theme="light"] .sehl-light-runtime-toolbar button{
  color:var(--sehl-light-text-2)!important;
  background:transparent!important;
}

[data-theme="light"] .tb button:hover,
[data-theme="light"] .selbar button:hover,
[data-theme="light"] .toolbar button:hover,
[data-theme="light"] .tools button:hover,
[data-theme="light"] .sehl-light-runtime-toolbar button:hover{
  background:var(--sehl-light-surface-2)!important;
  color:var(--sehl-light-text)!important;
}

[data-theme="light"] .tb .on,
[data-theme="light"] .selbar .on,
[data-theme="light"] .sehl-light-runtime-toolbar .on{
  background:var(--sehl-light-surface-2)!important;
  color:var(--sehl-light-accent-deep)!important;
}

.tb button,
.selbar button,
.tb .ico,
.selbar .ico{
  border-radius:10px!important;
}

/* --------------------------------------------------------------------------
   INBOX ROWS — Light rows are actually light, not transparent over dark parent
   -------------------------------------------------------------------------- */

.row{
  margin:0!important;
  border-left:0!important;
  border-right:0!important;
  border-top:0!important;
  border-bottom:1px solid var(--sehl-app-line-soft)!important;
  border-radius:0!important;
  outline:0!important;
  box-shadow:none!important;
  background:var(--sehl-app-surface)!important;
  color:var(--sehl-app-text)!important;
}

.row:hover{background:var(--sehl-app-surface-soft)!important}
.row.unread{background:var(--sehl-app-unread)!important}

.row.on,
[data-theme="dark"] .row.on{
  background:var(--sehl-app-selected)!important;
  border-color:var(--sehl-app-line-soft)!important;
  outline:0!important;
  box-shadow:none!important;
}

[data-theme="light"] .row{
  background:var(--sehl-light-surface)!important;
  color:var(--sehl-light-text)!important;
  border-color:var(--sehl-light-line-soft)!important;
}

[data-theme="light"] .row:hover{
  background:var(--sehl-light-surface-2)!important;
}

[data-theme="light"] .row.unread{
  background:var(--sehl-light-unread,#fbf7f0)!important;
}

[data-theme="light"] .row.on{
  background:var(--sehl-light-accent-soft)!important;
}

/* Known historical row information classes plus safe generic metadata. */
.row b,
.row strong,
.row .from,
.row .who,
.row .who1,
.row .who2,
.row .sender,
.row .sender-name,
.row .name{
  color:var(--sehl-app-text)!important;
}

[data-theme="light"] .row b,
[data-theme="light"] .row strong,
[data-theme="light"] .row .from,
[data-theme="light"] .row .who,
[data-theme="light"] .row .who1,
[data-theme="light"] .row .who2,
[data-theme="light"] .row .sender,
[data-theme="light"] .row .sender-name,
[data-theme="light"] .row .name{
  color:var(--sehl-light-text)!important;
}

.row .subj,
.row .subject{
  color:var(--sehl-app-text-2)!important;
}

.row.unread .subj,
.row.unread .subject{
  color:var(--sehl-app-text)!important;
  font-weight:650;
}

[data-theme="light"] .row .subj,
[data-theme="light"] .row .subject{
  color:var(--sehl-light-text-2)!important;
}

[data-theme="light"] .row.unread .subj,
[data-theme="light"] .row.unread .subject{
  color:var(--sehl-light-text)!important;
}

.row .prev,
.row .preview,
.row .snippet,
.row .when{
  color:var(--sehl-app-text-3)!important;
}

[data-theme="light"] .row .prev,
[data-theme="light"] .row .preview,
[data-theme="light"] .row .snippet,
[data-theme="light"] .row .when,
[data-theme="light"] .row.unread .when{
  color:var(--sehl-light-text-3)!important;
}

/* Attachments */
.chip.att,
[data-theme="dark"] .chip.att{
  display:inline-flex!important;
  align-items:center!important;
  width:auto!important;
  min-height:24px!important;
  padding:3px 8px!important;
  margin-top:4px!important;
  border:1px solid color-mix(in srgb,var(--sehl-app-accent) 28%,var(--sehl-app-line))!important;
  border-radius:999px!important;
  background:var(--sehl-app-accent-soft)!important;
  color:var(--sehl-app-accent-deep)!important;
  font-size:10.5px!important;
  font-weight:700!important;
  line-height:1.2!important;
  letter-spacing:.01em!important;
  text-transform:none!important;
  box-shadow:none!important;
}

[data-theme="dark"] .chip.att{color:var(--sehl-app-accent)!important}

[data-theme="light"] .chip.att{
  background:var(--sehl-light-accent-soft)!important;
  color:var(--sehl-light-accent-deep)!important;
  border-color:#ddc9a9!important;
}

/* Date separators */
.sehl-app-date-header{
  display:block!important;
  margin:0!important;
  padding:14px 18px 7px!important;
  border:0!important;
  border-bottom:1px solid var(--sehl-app-line-soft)!important;
  background:var(--sehl-app-canvas)!important;
  color:var(--sehl-app-text-3)!important;
  box-shadow:none!important;
  font-size:10.5px!important;
  font-weight:800!important;
  line-height:1.2!important;
  letter-spacing:.15em!important;
  text-transform:uppercase!important;
}

[data-theme="light"] .sehl-app-date-header{
  background:var(--sehl-light-canvas)!important;
  color:var(--sehl-light-text-3)!important;
  border-color:var(--sehl-light-line-soft)!important;
}

/* Empty space below rows belongs to Light too. */
[data-theme="light"] .sehl-light-list-root{
  min-height:100%!important;
  background:var(--sehl-light-canvas)!important;
}

/* --------------------------------------------------------------------------
   READING VIEW
   -------------------------------------------------------------------------- */

[data-theme="light"] .read,
[data-theme="light"] .reader,
[data-theme="light"] .read-pane,
[data-theme="light"] .read-main,
[data-theme="light"] .read-head,
[data-theme="light"] .message,
[data-theme="light"] .msg{
  background:var(--sehl-light-canvas)!important;
  color:var(--sehl-light-text)!important;
  border-color:var(--sehl-light-line-soft)!important;
}

[data-theme="light"] .msg-body{color:var(--sehl-light-text)!important}
[data-theme="light"] .msg-body:not(.htmlmail.canvas){background:var(--sehl-light-surface)!important}

[data-theme="light"] .att,
[data-theme="light"] .cwatt{
  background:var(--sehl-light-surface)!important;
  color:var(--sehl-light-text)!important;
  border-color:var(--sehl-light-line)!important;
}

[data-theme="light"] .att:hover,
[data-theme="light"] .cwatt:hover{
  background:var(--sehl-light-surface-2)!important;
}

/* --------------------------------------------------------------------------
   PEOPLE / SETTINGS / FORMS
   -------------------------------------------------------------------------- */

[data-theme="light"] .people-row,
[data-theme="light"] .prow,
[data-theme="light"] .card-person,
[data-theme="light"] .stats,
[data-theme="light"] .stat,
[data-theme="light"] .menu,
[data-theme="light"] .pal-item{
  color:var(--sehl-light-text)!important;
  border-color:var(--sehl-light-line-soft)!important;
}

[data-theme="light"] .people-row small,
[data-theme="light"] .prow small,
[data-theme="light"] .stat small{
  color:var(--sehl-light-text-3)!important;
}

[data-theme="light"] .setgrid,
[data-theme="light"] .setrow{
  color:var(--sehl-light-text)!important;
  border-color:var(--sehl-light-line)!important;
}

[data-theme="light"] .setrow{background:var(--sehl-light-surface)!important}

[data-theme="light"] .field span,
[data-theme="light"] .sub{color:var(--sehl-light-text-3)!important}

[data-theme="light"] .field input,
[data-theme="light"] .field select,
[data-theme="light"] .sehl-editor-field input,
[data-theme="light"] .sehl-v13-dialog-body input,
[data-theme="light"] .sehl-v13-dialog-body select{
  background:var(--sehl-light-surface)!important;
  color:var(--sehl-light-text)!important;
  border-color:var(--sehl-light-line)!important;
}

[data-theme="light"] .seg{
  background:var(--sehl-light-surface-2)!important;
  border-color:var(--sehl-light-line-soft)!important;
}

[data-theme="light"] .seg button{color:var(--sehl-light-text-3)!important}

[data-theme="light"] .seg button.on{
  background:var(--sehl-light-surface)!important;
  color:var(--sehl-light-accent-deep)!important;
  box-shadow:0 2px 8px rgba(39,35,27,.07)!important;
}

/* --------------------------------------------------------------------------
   FAB
   -------------------------------------------------------------------------- */

#fab{
  width:52px!important;
  height:52px!important;
  right:calc(18px + env(safe-area-inset-right))!important;
  bottom:calc(18px + env(safe-area-inset-bottom))!important;
  border:1px solid color-mix(in srgb,var(--gold) 58%,var(--line))!important;
  box-shadow:0 10px 28px color-mix(in srgb,var(--gold) 22%,transparent)!important;
}

[data-theme="light"] #fab{
  background:var(--sehl-light-accent)!important;
  color:#fff!important;
  border-color:var(--sehl-light-accent)!important;
  box-shadow:0 12px 28px rgba(130,88,28,.20)!important;
}

/* --------------------------------------------------------------------------
   COMPOSER
   -------------------------------------------------------------------------- */

#cwClose{display:none!important}
#sehlComposerCloseBottom{order:30}

.cw,
.cw-body,
.cw-foot{
  background:var(--sehl-app-surface)!important;
  color:var(--sehl-app-text)!important;
}

.cw-foot{border-top:1px solid var(--sehl-app-line)!important}
.cw-row input{color:var(--sehl-app-text)!important}

#cBody .sehl-prosemirror{
  color:var(--sehl-app-text)!important;
  caret-color:var(--sehl-app-text)!important;
}

[data-theme="light"] .cw,
[data-theme="light"] .cw-body,
[data-theme="light"] .cw-foot{
  background:var(--sehl-light-surface)!important;
  color:var(--sehl-light-text)!important;
}

[data-theme="light"] .cw-head{
  background:var(--sehl-light-surface)!important;
  color:var(--sehl-light-text)!important;
  border-bottom:1px solid var(--sehl-light-line)!important;
}

[data-theme="light"] .cw-head .ico{color:var(--sehl-light-text-2)!important}
[data-theme="light"] .cw-row{border-color:var(--sehl-light-line-soft)!important}

[data-theme="light"] .cw-row label,
[data-theme="light"] .cw-row .tog{color:var(--sehl-light-text-3)!important}

[data-theme="light"] #cBody .sehl-prosemirror{
  background:var(--sehl-light-surface)!important;
  color:var(--sehl-light-text)!important;
  border-color:var(--sehl-light-line)!important;
}

/* --------------------------------------------------------------------------
   DIALOGS — content scrolls; footer never overlays it
   -------------------------------------------------------------------------- */

dialog{color:var(--sehl-app-text)!important}

dialog::backdrop{
  background:var(--sehl-app-overlay)!important;
  backdrop-filter:blur(8px)!important;
  -webkit-backdrop-filter:blur(8px)!important;
}

.sehl-editor-dialog-head > button,
.sehl-v13-dialog-head > button,
dialog [class*="dialog-head"] > button[title*="Close" i],
dialog [class*="sheet-head"] > button[title*="Close" i]{
  display:none!important;
}

dialog.sheet.sehl-app-structured{
  padding:0!important;
  overflow:hidden!important;
  background:var(--sehl-app-surface)!important;
  color:var(--sehl-app-text)!important;
  border-color:var(--sehl-app-line)!important;
}

dialog.sheet.sehl-app-structured[open]{
  display:flex!important;
  flex-direction:column!important;
}

.sehl-app-dialog-scroll{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  padding:24px 28px 20px!important;
  background:var(--sehl-app-surface)!important;
}

.sheet-foot{
  position:static!important;
  inset:auto!important;
  flex:0 0 auto!important;
  margin:0!important;
  padding:12px 16px!important;
  border-top:1px solid var(--sehl-app-line-soft)!important;
  background:var(--sehl-app-surface)!important;
  z-index:auto!important;
}

.sehl-app-dialog-footer,
.sehl-editor-dialog-actions,
.sehl-v13-dialog-actions{
  border-top:1px solid var(--sehl-app-line-soft);
  background:var(--sehl-app-surface)!important;
}

.sehl-app-dialog-footer{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  padding:12px 14px calc(12px + env(safe-area-inset-bottom));
}

.sehl-app-close-btn,
#sehlComposerCloseBottom{
  min-height:38px;
  padding:0 14px!important;
  border:1px solid var(--sehl-app-line)!important;
  border-radius:10px!important;
  background:var(--sehl-app-surface-soft)!important;
  color:var(--sehl-app-text)!important;
  font-weight:650!important;
}

.sheet-foot .btn,
.cw-foot .btn,
.sehl-editor-dialog-actions button,
.sehl-v13-dialog-actions button{
  border-radius:10px!important;
}

[data-theme="light"] dialog.sheet.sehl-app-structured,
[data-theme="light"] .sheet,
[data-theme="light"] .pal,
[data-theme="light"] .sehl-editor-dialog-card,
[data-theme="light"] .sehl-v13-dialog-card,
[data-theme="light"] .sehl-app-dialog-scroll,
[data-theme="light"] .sheet-foot,
[data-theme="light"] .sehl-app-dialog-footer{
  background:var(--sehl-light-surface)!important;
  color:var(--sehl-light-text)!important;
  border-color:var(--sehl-light-line)!important;
}

[data-theme="light"] dialog.sheet h2,
[data-theme="light"] .sehl-editor-dialog-head h3,
[data-theme="light"] .sehl-v13-dialog-head h3{
  color:var(--sehl-light-text)!important;
}

[data-theme="light"] .sehl-app-close-btn,
[data-theme="light"] #sehlComposerCloseBottom,
[data-theme="light"] .sheet-foot .btn.ghost{
  background:var(--sehl-light-surface)!important;
  color:var(--sehl-light-text-2)!important;
  border-color:var(--sehl-light-line)!important;
}

/* --------------------------------------------------------------------------
   MOBILE
   -------------------------------------------------------------------------- */

@media (max-width:760px), ((max-width:900px) and (pointer:coarse)){
  .top{
    min-height:64px!important;
    padding-inline:max(12px,env(safe-area-inset-left)) max(12px,env(safe-area-inset-right))!important;
  }

  .tabs{
    min-height:48px!important;
    padding-inline:12px!important;
  }

  .tab{
    min-height:46px!important;
    font-size:13px!important;
    font-weight:700!important;
  }

  .row{
    min-height:0!important;
    padding-top:11px!important;
    padding-bottom:11px!important;
  }

  .sehl-app-date-header{
    padding:13px max(16px,env(safe-area-inset-right)) 7px max(16px,env(safe-area-inset-left))!important;
  }

  .cw-foot{
    position:sticky!important;
    bottom:0!important;
    z-index:30!important;
    gap:8px!important;
    padding:9px max(12px,env(safe-area-inset-right)) calc(9px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))!important;
  }

  .cw-foot .right{display:none!important}
  #sehlComposerCloseBottom{margin-left:auto!important}

  dialog.sheet.sehl-app-structured{
    width:100%!important;
    max-width:none!important;
    height:auto!important;
    max-height:calc(100dvh - max(72px,env(safe-area-inset-top)))!important;
    margin:auto 0 0!important;
    border-radius:var(--sehl-app-sheet-radius) var(--sehl-app-sheet-radius) 0 0!important;
  }

  dialog.sheet.sehl-app-structured .sehl-app-dialog-scroll{
    padding:26px max(18px,env(safe-area-inset-right)) 20px max(18px,env(safe-area-inset-left))!important;
  }

  dialog.sheet.sehl-app-structured .sheet-foot{
    padding:10px max(14px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left))!important;
    box-shadow:0 -1px 0 var(--sehl-app-line-soft)!important;
  }

  dialog.pal{
    width:calc(100vw - 16px)!important;
    max-width:none!important;
    margin:auto 8px max(8px,env(safe-area-inset-bottom))!important;
    background:var(--sehl-app-surface)!important;
    color:var(--sehl-app-text)!important;
    border-radius:20px!important;
  }

  .pal-foot{
    border-top:1px solid var(--sehl-app-line-soft)!important;
    background:var(--sehl-app-surface)!important;
  }

  [data-theme="light"] dialog.pal,
  [data-theme="light"] .pal-foot{
    background:var(--sehl-light-surface)!important;
    color:var(--sehl-light-text)!important;
    border-color:var(--sehl-light-line)!important;
  }
}

@media (prefers-reduced-motion:reduce){
  .row,.chip.att,#fab,dialog{
    transition:none!important;
    animation:none!important;
  }
}