/* ============================================================
   NEMO Clay UI — port of the Clay soft-UI kit (e:\style.css)
   Active when html[data-theme="clay"]. No borders; depth from
   paired light/dark shadows (lamp top-left).
   ============================================================ */
html[data-theme="clay"]{
  --bg:#eef0f4;
  --surface:#f5f6f9;
  --surface-2:#e6e8ee;
  --surface-hi:#ffffff;
  --room-light:rgba(255,255,255,.85);
  --room-shade:rgba(120,126,140,.18);
  --text:#5c606a;
  --text-strong:#33373f;
  --muted:#8f939d;

  --accent:#bcb094;
  --accent-deep:#a2977f;
  --accent-soft:#e1dbcf;
  --accent-rgb:162,151,127;
  --accent-deep-rgb:113,106,89;
  --on-accent:#fff;

  --light:rgba(255,255,255,.95);
  --dark:rgba(154,160,172,.55);
  --dark-2:rgba(154,160,172,.35);

  --r-sm:12px;
  --r-md:18px;
  --r-lg:26px;
  --r-pill:999px;

  --raise:-6px -6px 14px var(--light),6px 6px 14px var(--dark);
  --raise-sm:-3px -3px 8px var(--light),3px 3px 8px var(--dark);
  --raise-lg:-10px -10px 24px var(--light),10px 10px 24px var(--dark);
  --inset:inset -4px -4px 10px var(--light),inset 4px 4px 10px var(--dark);
  --inset-sm:inset -2px -2px 6px var(--light),inset 2px 2px 6px var(--dark);
  --accent-shadow:rgba(var(--accent-rgb),.45);
  --accent-raise:-5px -5px 12px var(--light),5px 5px 14px var(--accent-shadow);
  --accent-inset:inset -3px -3px 8px rgba(255,255,255,.55),inset 3px 3px 8px rgba(var(--accent-deep-rgb),.45);

  --knob-a:#f8f8fa;
  --knob-b:var(--surface-2);
  --sb-hi:rgba(255,255,255,.95);
  --sb-lo:var(--dark);

  --ease:cubic-bezier(.2,.8,.2,1);
  --spring:cubic-bezier(.34,1.56,.64,1);
  --spring-soft:cubic-bezier(.3,1.3,.5,1);
  --pull:cubic-bezier(.2,.9,.3,1.08);

  --ok:#4fa36d;
  --warn:#e0a232;
  --err:#d9534f;

  /* Bridge to NEMO token names used elsewhere */
  --paper-a:var(--surface-hi);
  --paper-b:var(--bg);
  --bg2:var(--surface);
  --bg3:var(--surface-2);
  --control-bg:var(--surface);
  --btn-bg:transparent;
  --btn-hover:transparent;
  --ink:var(--text-strong);
  --line:transparent;
  --accent-hover:var(--accent-deep);
  --accent2:var(--accent-deep);
  --accent-glow:rgba(var(--accent-rgb),.35);
  --bad:var(--err);
  --danger-bg:transparent;
  --danger-border:transparent;
  --danger-text:var(--err);
  --msg-user:var(--muted);
  --msg-claude:var(--accent-deep);
  --msg-bot:var(--accent);
  --radius:var(--r-lg);
  --radius-sm:var(--r-md);
  --focus-ring:3px solid var(--accent-soft);
  --color-scheme:light;
  --select-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath fill='%238f939d' d='M1 1l4 4 4-4'/%3E%3C/svg%3E");
  --scrollbar-size:18px;
  --scrollbar-track:transparent;
  --scrollbar-thumb:transparent;
  --mono:Consolas,"Cascadia Mono","Cascadia Code","SF Mono",ui-monospace,Menlo,monospace;
  font-family:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  color-scheme:light;
}

/* Dark Clay colour set — charcoal soft UI + cream accent (kit dark mode) */
html[data-theme="clay"][data-clay-scheme="dark"]{
  --bg:#121212;
  --surface:#1e1e1e;
  --surface-2:#181818;
  --surface-hi:#252525;
  --room-light:rgba(255,255,255,.04);
  --room-shade:rgba(0,0,0,.6);
  --text:#b0b0b4;
  --text-strong:#f0f0f2;
  --muted:#74747a;

  --accent:#d8cfb4;
  --accent-deep:#c4ba9e;
  --accent-soft:#2a2720;
  --accent-rgb:216,207,180;
  --accent-deep-rgb:196,186,158;
  --on-accent:#1a1a1c;

  --light:rgba(255,255,255,.07);
  --dark:rgba(0,0,0,.55);
  --dark-2:rgba(0,0,0,.4);

  --raise:-6px -6px 14px var(--light),6px 6px 14px var(--dark);
  --raise-sm:-3px -3px 8px var(--light),3px 3px 8px var(--dark);
  --raise-lg:-10px -10px 24px var(--light),10px 10px 24px var(--dark);
  --inset:inset -4px -4px 10px var(--light),inset 4px 4px 10px var(--dark);
  --inset-sm:inset -2px -2px 6px var(--light),inset 2px 2px 6px var(--dark);
  --accent-shadow:rgba(var(--accent-rgb),.28);
  --accent-raise:-4px -4px 10px var(--light),5px 5px 16px var(--accent-shadow);
  --accent-inset:inset -2px -2px 6px rgba(255,255,255,.14),inset 3px 3px 8px rgba(0,0,0,.4);

  --knob-a:#2a2a2e;
  --knob-b:var(--surface-2);
  --sb-hi:rgba(255,255,255,.1);
  --sb-lo:var(--dark);

  --focus-ring:3px solid var(--accent-soft);
  --color-scheme:dark;
  --select-chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath fill='%237a7a80' d='M1 1l4 4 4-4'/%3E%3C/svg%3E");
  color-scheme:dark;
}

html[data-theme="clay"][data-clay-scheme="dark"] .brand-name{
  color:var(--text-strong);
  text-shadow:1px 1px 2px rgba(0,0,0,.6);
}
html[data-theme="clay"][data-clay-scheme="dark"] .brand-link:hover .brand-name{
  color:var(--text-strong);
}
html[data-theme="clay"][data-clay-scheme="dark"] .tm-title,
html[data-theme="clay"][data-clay-scheme="dark"] .drop-title{
  color:var(--text-strong);
  text-shadow:1px 1px 2px rgba(0,0,0,.55);
}
html[data-theme="clay"][data-clay-scheme="dark"] .chat-input{
  box-shadow:inset 0 2px 10px var(--dark),inset 0 -1px 4px var(--light) !important;
}
html[data-theme="clay"][data-clay-scheme="dark"] .btn.btn--accent,
html[data-theme="clay"][data-clay-scheme="dark"] .chat-input-actions > .chat-send-btn,
html[data-theme="clay"][data-clay-scheme="dark"] .login-card .btn{
  color:var(--on-accent);
}

/* ---- Shared login / unlock card ---- */
html[data-theme="clay"] .login-wrap{
  width:min(420px,calc(100vw - 40px));
  position:relative;
  z-index:3;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}
html[data-theme="clay"] .login-card{
  width:100%;
  padding:42px 34px 34px;
  border:none;
  border-radius:26px;
  background-color:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-lg);
}
html[data-theme="clay"] .login-brand{
  margin:0 0 12px;
  font-size:clamp(2.6rem,9vw,3.6rem);
  font-weight:600;
  letter-spacing:.14em;
  line-height:1;
  color:var(--text-strong);
  text-transform:uppercase;
  text-shadow:-1px -1px 0 var(--light),1px 1px 1px var(--dark-2);
}
html[data-theme="clay"] .login-acronym{
  margin:0 0 30px;
  font-size:12px;
  font-weight:500;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--muted);
  line-height:1.55;
}
html[data-theme="clay"] .login-acronym span{font:inherit;color:inherit}
html[data-theme="clay"] .login-acronym span::first-letter{
  color:var(--accent-deep);
  font-weight:600;
  text-shadow:-1px -1px 0 var(--light),1px 1px 1px rgba(var(--accent-deep-rgb),.35);
}
html[data-theme="clay"] .login-card input[type=password]{
  width:100%;
  box-sizing:border-box;
  min-height:56px;
  padding:0 22px;
  margin:0 0 18px;
  border:none;
  border-radius:18px;
  background:var(--surface);
  box-shadow:var(--inset);
  color:var(--text-strong);
  font:500 15px/1.4 "Inter",system-ui,sans-serif;
  text-align:left;
  transition:box-shadow .2s var(--ease);
}
html[data-theme="clay"] .login-card input[type=password]::placeholder{color:var(--muted)}
html[data-theme="clay"] .login-card input[type=password]:focus,
html[data-theme="clay"] .login-card input[type=password]:focus-visible{
  outline:none;
  box-shadow:var(--inset);
}
html[data-theme="clay"] .login-card .btn{
  width:100%;
  min-height:52px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 28px;
  border:none;
  border-radius:18px;
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  color:var(--on-accent);
  font:500 15px/1 "Inter",system-ui,sans-serif;
  box-shadow:var(--accent-raise);
  text-decoration:none;
  cursor:pointer;
  transition:transform .28s var(--spring),box-shadow .18s var(--ease);
}
html[data-theme="clay"] .login-card .btn:hover{
  transform:translateY(-1px);
  text-decoration:none;
  filter:none;
}
html[data-theme="clay"] .login-card .btn:active{
  transform:translateY(1px) scale(.98);
  box-shadow:var(--accent-inset);
}
html[data-theme="clay"] .login-card .btn:disabled{
  cursor:not-allowed;
  opacity:.7;
  transform:none;
  color:color-mix(in srgb, var(--on-accent) 85%, transparent);
  box-shadow:var(--raise-sm);
}
html[data-theme="clay"] .login-err{
  font-size:13px;
  font-weight:500;
  color:var(--err);
  margin-top:16px;
  display:none;
  text-shadow:-1px -1px 0 var(--light),1px 1px 1px var(--dark-2);
}
@media (max-width:480px){
  html[data-theme="clay"] .login-card{padding:34px 22px 26px}
}

html[data-theme="clay"] body{
  margin:0;
  color:var(--text);
  font:400 15px/1.55 "Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  background:
    radial-gradient(120% 90% at 0% 0%,var(--room-light),transparent 62%),
    radial-gradient(120% 90% at 100% 100%,var(--room-shade),transparent 62%),
    var(--bg);
  background-attachment:fixed;
  transition:background .35s var(--ease),color .35s var(--ease);
}
html[data-theme="clay"] body.bg-acrylic,
html[data-theme="clay"] body.bg-lightpillar,
html[data-theme="clay"] body.admin-layout{
  background:
    radial-gradient(120% 90% at 0% 0%,var(--room-light),transparent 62%),
    radial-gradient(120% 90% at 100% 100%,var(--room-shade),transparent 62%),
    var(--bg) !important;
}
html[data-theme="clay"] .paperBg,
html[data-theme="clay"] .grain,
html[data-theme="clay"] .vignette,
html[data-theme="clay"] .light-pillar-bg,
html[data-theme="clay"] .bg-blur-overlay,
html[data-theme="clay"] .windBtn{
  display:none !important;
}
html[data-theme="clay"] .app,
html[data-theme="clay"] .main,
html[data-theme="clay"] body.admin-layout .app,
html[data-theme="clay"] body.admin-layout .main{
  background:transparent !important;
}
html[data-theme="clay"] :focus-visible{
  outline:3px solid var(--accent-soft);
  outline-offset:3px;
}
html[data-theme="clay"] input:focus-visible,
html[data-theme="clay"] textarea:focus-visible,
html[data-theme="clay"] select:focus-visible{outline:none}

/* ---- chrome ---- */
html[data-theme="clay"] .sidebar,
html[data-theme="clay"] body.admin-layout .sidebar{
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  background-color:var(--surface);
  border:none !important;
  box-shadow:var(--raise-lg);
}
html[data-theme="clay"] .sidebar nav a,
html[data-theme="clay"] body.admin-layout .sidebar nav a{
  border:none !important;
  border-radius:var(--r-md);
  color:var(--text);
  background:transparent;
  transition:transform .28s var(--spring),box-shadow .18s var(--ease),color .18s,background .18s;
}
html[data-theme="clay"] .sidebar nav a:hover,
html[data-theme="clay"] body.admin-layout .sidebar nav a:hover{
  transform:translateY(-1px);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise);
  color:var(--text-strong);
}
html[data-theme="clay"] .sidebar nav a.active,
html[data-theme="clay"] body.admin-layout .sidebar nav a.active{
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  background-image:linear-gradient(145deg,var(--accent-soft),var(--accent));
  color:var(--on-accent);
  box-shadow:var(--accent-raise);
}

/* ---- panels / cards ---- */
html[data-theme="clay"] .card,
html[data-theme="clay"] .acrylic,
html[data-theme="clay"] .panel,
html[data-theme="clay"] .el-section,
html[data-theme="clay"] .voice-section.card,
html[data-theme="clay"] body.admin-layout .card,
html[data-theme="clay"] body.admin-layout .acrylic{
  padding:26px 26px 30px;
  border:none !important;
  border-radius:var(--r-lg);
  background-color:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-lg);
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
html[data-theme="clay"] h1{color:var(--text-strong);font-weight:600;letter-spacing:-.02em}
html[data-theme="clay"] h2,
html[data-theme="clay"] .el-section h2,
html[data-theme="clay"] .voice-section-toggle-text > h2,
html[data-theme="clay"] body.admin-layout h2,
html[data-theme="clay"] .el-legend,
html[data-theme="clay"] .el-field-label,
html[data-theme="clay"] .cz-field > span{
  margin:0;
  font-size:12px;
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--muted);
}
html[data-theme="clay"] .sub,
html[data-theme="clay"] .el-note,
html[data-theme="clay"] .cz-hint,
html[data-theme="clay"] .hint{color:var(--muted)}

/* ---- buttons ---- */
html[data-theme="clay"] .btn,
html[data-theme="clay"] body.admin-layout .btn,
html[data-theme="clay"] .el-btn-icon,
html[data-theme="clay"] .el-chip,
html[data-theme="clay"] .cz-link,
html[data-theme="clay"] .el-toc a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 28px;
  border:none !important;
  border-radius:var(--r-md);
  background-color:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise);
  font-weight:500;
  color:var(--text);
  text-decoration:none;
  transition:box-shadow .18s var(--ease),transform .28s var(--spring),color .18s;
}
html[data-theme="clay"] .btn:hover,
html[data-theme="clay"] body.admin-layout .btn:hover,
html[data-theme="clay"] .btn:focus-visible,
html[data-theme="clay"] .cz-link:hover,
html[data-theme="clay"] .el-toc a:hover,
html[data-theme="clay"] .el-chip:hover{
  transform:translateY(-1px);
  background-color:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise);
  color:var(--text-strong);
  filter:none;
}
html[data-theme="clay"] .btn:active,
html[data-theme="clay"] body.admin-layout .btn:active,
html[data-theme="clay"] .el-chip:active{
  transition-duration:.08s,.08s,.18s;
  transform:translateY(1px) scale(.98);
  box-shadow:var(--inset);
  background-image:none;
  color:var(--accent-deep);
}
html[data-theme="clay"] .btn.sm,
html[data-theme="clay"] body.admin-layout .btn,
html[data-theme="clay"] .btn--sm{
  min-height:40px;
  padding:0 16px;
  font-size:13px;
  border-radius:var(--r-sm);
}
html[data-theme="clay"] .btn.secondary,
html[data-theme="clay"] .btn.ghost,
html[data-theme="clay"] body.admin-layout .btn.secondary,
html[data-theme="clay"] body.admin-layout .btn.ghost{
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise);
  color:var(--text);
}
html[data-theme="clay"] .btn.danger,
html[data-theme="clay"] body.admin-layout .btn.danger,
html[data-theme="clay"] .btn--danger{
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  color:var(--err);
  box-shadow:var(--raise);
}
html[data-theme="clay"] .btn--accent,
html[data-theme="clay"] .cz-theme-card.on,
html[data-theme="clay"] .el-chip.on,
html[data-theme="clay"] .el-choice--card:has(input:checked){
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  background-image:linear-gradient(145deg,var(--accent-soft),var(--accent));
  color:var(--on-accent);
  box-shadow:var(--accent-raise);
}
html[data-theme="clay"] .btn:disabled{
  cursor:not-allowed;
  color:var(--muted);
  box-shadow:var(--raise-sm);
  opacity:.7;
  transform:none;
}
html[data-theme="clay"] .tile,
html[data-theme="clay"] .el-btn-icon{
  width:60px;height:60px;min-height:60px;padding:0;
  border-radius:var(--r-md);
}

/* ---- fields ---- */
html[data-theme="clay"] input[type=text],
html[data-theme="clay"] input[type=password],
html[data-theme="clay"] input[type=email],
html[data-theme="clay"] input[type=number],
html[data-theme="clay"] input[type=url],
html[data-theme="clay"] input[type=search],
html[data-theme="clay"] input[type=date],
html[data-theme="clay"] input[type=time],
html[data-theme="clay"] input[type=datetime-local],
html[data-theme="clay"] input.field,
html[data-theme="clay"] textarea.field,
html[data-theme="clay"] textarea,
html[data-theme="clay"] select,
html[data-theme="clay"] select.field,
html[data-theme="clay"] body.admin-layout input[type=text],
html[data-theme="clay"] body.admin-layout input[type=password],
html[data-theme="clay"] body.admin-layout input[type=email],
html[data-theme="clay"] body.admin-layout input[type=number],
html[data-theme="clay"] body.admin-layout input[type=url],
html[data-theme="clay"] body.admin-layout input[type=search],
html[data-theme="clay"] body.admin-layout input[type=date],
html[data-theme="clay"] body.admin-layout input[type=time],
html[data-theme="clay"] body.admin-layout input[type=datetime-local],
html[data-theme="clay"] body.admin-layout input.field,
html[data-theme="clay"] body.admin-layout textarea,
html[data-theme="clay"] body.admin-layout select,
html[data-theme="clay"] body.admin-layout .db-select,
html[data-theme="clay"] .cz-field input[type=text],
html[data-theme="clay"] .cz-field select,
html[data-theme="clay"] .cz-modal-body select,
html[data-theme="clay"] .el-select,
html[data-theme="clay"] .el-section .field,
html[data-theme="clay"] .el-section input.field,
html[data-theme="clay"] .el-section textarea.field,
html[data-theme="clay"] .el-dd-trigger,
html[data-theme="clay"] .search{
  min-height:56px;
  height:auto;
  padding:0 22px;
  border:none !important;
  border-radius:var(--r-md);
  background:var(--surface) !important;
  background-color:var(--surface) !important;
  background-image:none !important;
  box-shadow:var(--inset) !important;
  color:var(--text-strong);
  transition:box-shadow .2s var(--ease);
}
html[data-theme="clay"] textarea,
html[data-theme="clay"] textarea.field{min-height:120px;padding:16px 22px}
html[data-theme="clay"] input:focus,
html[data-theme="clay"] input.field:focus,
html[data-theme="clay"] textarea:focus,
html[data-theme="clay"] textarea.field:focus,
html[data-theme="clay"] select:focus,
html[data-theme="clay"] body.admin-layout input:focus,
html[data-theme="clay"] body.admin-layout select:focus,
html[data-theme="clay"] .el-select:focus,
html[data-theme="clay"] .el-section .field:focus,
html[data-theme="clay"] .search:focus-within{
  box-shadow:inset -5px -5px 12px var(--light),inset 5px 5px 12px var(--dark) !important;
  border:none !important;
}
html[data-theme="clay"] ::placeholder{color:var(--muted)}
html[data-theme="clay"] select,
html[data-theme="clay"] body.admin-layout select{
  color-scheme:light;
  background-image:var(--select-chevron) !important;
  background-repeat:no-repeat !important;
  background-position:right 18px center !important;
  background-size:10px 6px !important;
  padding-right:40px !important;
}

/* ---- segmented ---- */
html[data-theme="clay"] .seg,
html[data-theme="clay"] body.admin-layout .seg,
html[data-theme="clay"] .el-seg,
html[data-theme="clay"] .segmented{
  display:flex;
  padding:6px;
  gap:4px;
  border:none !important;
  border-radius:var(--r-md);
  background:var(--surface);
  box-shadow:var(--inset);
}
html[data-theme="clay"] .seg button,
html[data-theme="clay"] .el-seg button,
html[data-theme="clay"] .segmented button{
  flex:1;
  min-height:40px;
  height:40px;
  border:none !important;
  border-radius:12px;
  background:transparent;
  box-shadow:none;
  color:var(--muted);
  font-weight:500;
  transition:box-shadow .2s var(--ease),color .2s,background .2s,transform .32s var(--spring);
}
html[data-theme="clay"] .seg button.on,
html[data-theme="clay"] body.admin-layout .seg button.on,
html[data-theme="clay"] .el-seg button.on,
html[data-theme="clay"] .segmented button[aria-checked="true"],
html[data-theme="clay"] .segmented button.on{
  background-color:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  color:var(--text-strong);
}

/* ---- toggles ---- */
html[data-theme="clay"] .el-toggle-ui,
html[data-theme="clay"] .toggle,
html[data-theme="clay"] .switch__track{
  width:84px;height:44px;
  border:none !important;
  border-radius:var(--r-pill);
  background:var(--surface);
  box-shadow:var(--inset);
  transition:background .5s var(--ease),box-shadow .5s var(--ease);
}
html[data-theme="clay"] .el-toggle-ui::before,
html[data-theme="clay"] .toggle::before,
html[data-theme="clay"] .switch__knob{
  width:34px;height:34px;top:5px;left:5px;
  border-radius:50%;
  background:linear-gradient(145deg,var(--knob-a),var(--knob-b));
  box-shadow:var(--raise-sm);
  transition:transform .38s var(--spring),background .5s var(--ease);
}
html[data-theme="clay"] .el-toggle input:checked + .el-toggle-ui,
html[data-theme="clay"] .toggle.on,
html[data-theme="clay"] .switch input:checked + .switch__track{
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  box-shadow:var(--accent-inset);
}
html[data-theme="clay"] .el-toggle input:checked + .el-toggle-ui::before{
  transform:translateX(40px);
  background:linear-gradient(145deg,var(--knob-a),var(--knob-b));
}

/* ---- radios / checks ---- */
html[data-theme="clay"] .el-choice input[type=radio],
html[data-theme="clay"] .el-choice input[type=checkbox],
html[data-theme="clay"] .radio span,
html[data-theme="clay"] .check span{
  border:none !important;
  background:var(--surface);
  box-shadow:var(--inset-sm);
}
html[data-theme="clay"] .el-choice input[type=radio]{border-radius:50%}
html[data-theme="clay"] .el-choice input[type=radio]:checked{
  background:var(--surface);
  box-shadow:var(--inset-sm),inset 0 0 0 6px transparent;
  background-image:radial-gradient(circle at center,var(--accent) 0 45%,transparent 46%);
}
html[data-theme="clay"] .el-choice--card,
html[data-theme="clay"] .el-toggle-row,
html[data-theme="clay"] .el-scrollbox,
html[data-theme="clay"] .cz-theme-card{
  border:none !important;
  background-color:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise);
  border-radius:var(--r-md);
  color:var(--text);
  transition:transform .28s var(--spring),box-shadow .18s var(--ease);
}
html[data-theme="clay"] .cz-theme-card:hover{
  transform:translateY(-1px);
  box-shadow:var(--raise);
  color:var(--text-strong);
}
html[data-theme="clay"] .cz-theme-card.on .cz-theme-meta span{color:rgba(255,255,255,.8)}
html[data-theme="clay"] .cz-theme-swatch{
  border:none;
  box-shadow:var(--inset-sm);
}

/* ---- menus / popovers ---- */
html[data-theme="clay"] .el-dd-menu,
html[data-theme="clay"] .el-menu,
html[data-theme="clay"] .settings-crumb-menu-panel,
html[data-theme="clay"] .cz-modal-panel,
html[data-theme="clay"] .dd__menu,
html[data-theme="clay"] .popover{
  background-color:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  border:none !important;
  border-radius:var(--r-md);
  box-shadow:var(--raise-lg);
  padding:10px;
}
html[data-theme="clay"] .el-dd-menu li:hover,
html[data-theme="clay"] .el-dd-menu li[aria-selected="true"],
html[data-theme="clay"] .el-menu button:hover,
html[data-theme="clay"] .settings-crumb-menu-panel a:hover,
html[data-theme="clay"] .settings-crumb-menu-panel a[aria-current="page"],
html[data-theme="clay"] .dd__option:hover{
  background:var(--surface-2);
  box-shadow:var(--inset-sm);
  color:var(--text-strong);
  border-radius:var(--r-sm);
}
html[data-theme="clay"] .cz-modal-backdrop,
html[data-theme="clay"] .modal::backdrop{
  background:color-mix(in srgb,var(--bg) 72%,rgba(20,22,28,.28));
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

html[data-theme="clay"] .topbar{
  background:transparent;
  border:none;
  box-shadow:none;
}
html[data-theme="clay"] .brand-name{
  font-family:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-size:clamp(1.35rem,2.6vw,1.75rem);
  font-weight:600;
  letter-spacing:.14em;
  line-height:1;
  color:#33373f;
  text-transform:uppercase;
  text-shadow:1px 1px 1px rgba(154,160,172,.35);
}
html[data-theme="clay"] .brand-link:hover .brand-name{
  color:#33373f;
  opacity:.88;
}
html[data-theme="clay"] .topbar-status{
  font-family:Consolas,"Cascadia Mono",ui-monospace,monospace;
  font-weight:600;
  letter-spacing:.1em;
  text-shadow:none;
}
html[data-theme="clay"] .topbar-status .dot{
  box-shadow:none;
}
html[data-theme="clay"] .topbar-status-label{
  text-shadow:none;
}

html[data-theme="clay"] body.chat-speak-mode,
html[data-theme="clay"] body.chat-speak-mode.bg-acrylic,
html[data-theme="clay"] body.chat-speak-mode.bg-lightpillar{
  background:var(--bg) !important;
  background-image:none !important;
}
html[data-theme="clay"] body.chat-speak-mode .chat-shell--speak .chat-input,
html[data-theme="clay"] body.chat-speak-mode .chat-shell--speak .chat-mic-btn{
  margin:0 !important;
  width:100% !important;
}
html[data-theme="clay"] body.chat-speak-mode .chat-shell--speak .chat-input-actions{
  margin-left:0 !important;
}

/* ---- chat: clay terminal screen ---- */
html[data-theme="clay"] .chat-shell--message,
html[data-theme="clay"] .chat-wrap:not(.chat-wrap--talk),
html[data-theme="clay"] .chat-compose,
html[data-theme="clay"] .chat-input,
html[data-theme="clay"] .chat-input textarea,
html[data-theme="clay"] .chat-slash-menu,
html[data-theme="clay"] .msg,
html[data-theme="clay"] .msg-name,
html[data-theme="clay"] .msg-body,
html[data-theme="clay"] .msg-loading-bar{
  font-family:Consolas,"Cascadia Mono","Cascadia Code","SF Mono",ui-monospace,monospace;
}
html[data-theme="clay"] .chat-wrap:not(.chat-wrap--talk){
  --chat-font-size:13.5px;
  --chat-term-indent:1.65em;
  --chat-term-shadow:-1px -1px 0 var(--light),1px 1px 1px var(--dark);
  --chat-term-prompt-shadow:-1px -1px 0 rgba(255,255,255,.75),1px 1px 1px rgba(var(--accent-deep-rgb),.45);
}
/* chat-log stays unthemed — no clay panel/well */
html[data-theme="clay"] .chat-log,
html[data-theme="clay"] .chat-wrap:not(.chat-wrap--empty):not(.chat-wrap--talk) .chat-log{
  margin:0;
  padding-block:16px;
  width:100%;
  max-width:var(--chat-max-width);
  margin-inline:auto;
  padding-inline:var(--chat-gutter);
  border-radius:0;
  background:transparent;
  background-image:none;
  box-shadow:none;
  text-shadow:none;
  color:inherit;
  font-size:var(--chat-font-size);
  font-weight:inherit;
  letter-spacing:inherit;
  line-height:1.55;
}
html[data-theme="clay"] .chat-wrap:not(.chat-wrap--empty):not(.chat-wrap--talk) .chat-compose{
  padding-inline:var(--chat-gutter);
  padding-bottom:22px;
  overflow:visible;
}
html[data-theme="clay"] .msg{
  border-left:none !important;
  padding:0 0 12px !important;
  margin:0;
  border-radius:0 !important;
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  color:inherit;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:2px;
  font-weight:600;
  text-shadow:var(--chat-term-shadow);
}
html[data-theme="clay"] .msg.user,
html[data-theme="clay"] .msg.bot,
html[data-theme="clay"] .msg.bot[data-agent="claude"],
html[data-theme="clay"] .msg.bot[data-agent="chatgpt"],
html[data-theme="clay"] .msg.bot[data-agent="deepseek"],
html[data-theme="clay"] .msg.bot[data-agent="gemini"]{
  padding:0 0 12px !important;
  border-radius:0 !important;
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  color:inherit;
}
html[data-theme="clay"] .msg-head{
  display:flex;
  align-items:baseline;
  gap:.55em;
  margin:0;
  line-height:1.75;
}
html[data-theme="clay"] .msg-name{
  display:inline;
  margin:0;
  font-size:var(--chat-font-size);
  font-weight:600;
  letter-spacing:.01em;
  line-height:1.75;
  color:var(--accent-deep);
  text-shadow:var(--chat-term-prompt-shadow);
}
html[data-theme="clay"] .msg-name::before{
  content:"> ";
  color:var(--accent-deep);
}
html[data-theme="clay"] .msg.user .msg-name{
  color:var(--text-strong);
  text-shadow:var(--chat-term-shadow);
}
html[data-theme="clay"] .msg.user .msg-name::before{
  content:"$ ";
  color:var(--accent-deep);
  text-shadow:var(--chat-term-prompt-shadow);
}
html[data-theme="clay"] .msg-body{
  display:block;
  padding-left:var(--chat-term-indent);
  margin:0;
  white-space:pre-wrap;
  word-break:break-word;
  color:var(--text-strong);
  font-weight:600;
  text-shadow:var(--chat-term-shadow);
}
html[data-theme="clay"] .msg.system{
  padding-left:var(--chat-term-indent) !important;
  color:var(--muted);
  font-weight:500;
  text-shadow:var(--chat-term-shadow);
}
html[data-theme="clay"] .msg.system .msg-name{display:none}
html[data-theme="clay"] .msg-loading-bar{
  padding-left:var(--chat-term-indent);
  font-family:inherit;
  font-weight:600;
  letter-spacing:.08em;
  color:var(--muted);
  text-shadow:var(--chat-term-shadow);
}
html[data-theme="clay"] .msg-actions{
  display:inline-flex;
  align-items:baseline;
  gap:.28em;
  padding:0;
  margin:0;
}
html[data-theme="clay"] .msg-action-char{
  appearance:none;
  -webkit-appearance:none;
  display:inline;
  border:none !important;
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  padding:0;
  margin:0;
  min-width:0;
  min-height:0;
  width:auto;
  height:auto;
  font:inherit;
  font-size:.92em;
  font-weight:500;
  line-height:1;
  letter-spacing:0;
  color:var(--muted);
  cursor:pointer;
  text-shadow:var(--chat-term-shadow);
  transform:none !important;
}
html[data-theme="clay"] .msg-action-char:hover{
  color:var(--accent-deep);
  text-shadow:var(--chat-term-prompt-shadow);
}
html[data-theme="clay"] .msg-action-char:focus-visible{
  outline:1px dotted var(--accent-deep);
  outline-offset:2px;
}
html[data-theme="clay"] .msg-speak-btn.speaking{
  color:var(--accent-deep);
  text-shadow:var(--chat-term-prompt-shadow);
}
html[data-theme="clay"] .msg-save-doc-btn.saved{
  color:var(--ok);
}
html[data-theme="clay"] .msg-action-char.loading,
html[data-theme="clay"] .msg-speak-btn.loading{
  opacity:.4;
  animation:msg-char-pulse .9s ease-in-out infinite;
}
@keyframes msg-char-pulse{
  50%{opacity:.15}
}
html[data-theme="clay"] .chat-wrap--empty:not(.chat-wrap--talk) .chat-compose{
  padding:0 var(--chat-gutter);
  border-radius:0;
  background:transparent;
  box-shadow:none;
  text-shadow:none;
}
html[data-theme="clay"] .chat-wrap--empty:not(.chat-wrap--talk) .chat-input{
  padding:14px 16px 12px;
}
html[data-theme="clay"] .chat-wrap--empty:not(.chat-wrap--talk) .chat-input-bar{
  margin-top:0;
}
html[data-theme="clay"] .info-icon-btn{
  border:none !important;
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  color:var(--muted);
}
html[data-theme="clay"] .info-icon-btn:hover{
  transform:translateY(-1px);
  color:var(--accent-deep);
  box-shadow:var(--raise-sm);
}
html[data-theme="clay"] .chat-input{
  border:none !important;
  border-radius:var(--r-md);
  background:var(--surface) !important;
  background-image:none !important;
  /* Soft well — no hard left/top bevel that clips glyphs */
  box-shadow:inset 0 2px 8px var(--dark-2),inset 0 -1px 4px var(--light) !important;
  padding:14px 16px 12px;
  gap:10px;
  overflow:visible;
  margin:2px 4px;
}
html[data-theme="clay"] .chat-input::before{display:none}
html[data-theme="clay"] .chat-input textarea,
html[data-theme="clay"] .chat-input input,
html[data-theme="clay"] .chat-wrap--empty .chat-input textarea,
html[data-theme="clay"] .chat-wrap:not(.chat-wrap--empty) .chat-input textarea{
  background:transparent !important;
  box-shadow:none !important;
  height:auto;
  min-height:48px;
  max-height:160px;
  padding:8px 2px 6px;
  overflow:auto;
  font-family:Consolas,"Cascadia Mono","Cascadia Code","SF Mono",ui-monospace,monospace !important;
  font-size:var(--chat-font-size);
  font-weight:600;
  letter-spacing:.01em;
  line-height:1.55;
  color:var(--text-strong);
  text-shadow:none;
  caret-color:var(--accent);
}
html[data-theme="clay"] .chat-slash-field{
  min-height:48px;
}
html[data-theme="clay"] .chat-slash-ghost{
  padding:8px 2px 6px;
  font-family:Consolas,"Cascadia Mono","Cascadia Code","SF Mono",ui-monospace,monospace !important;
  font-size:var(--chat-font-size);
  font-weight:600;
  letter-spacing:.01em;
  line-height:1.55;
}
html[data-theme="clay"] .chat-slash-ghost-rest{color:var(--muted);opacity:.6}
html[data-theme="clay"] .chat-input textarea::placeholder{
  color:var(--muted);
  text-shadow:none;
  font-weight:500;
  opacity:.85;
  line-height:1.55;
}
html[data-theme="clay"] .chat-slash-menu{
  border:none !important;
  background:var(--surface) !important;
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%) !important;
  box-shadow:var(--raise-lg) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  font-family:Consolas,"Cascadia Mono",ui-monospace,monospace;
}
html[data-theme="clay"] .chat-slash-item{
  font-weight:600;
  text-shadow:var(--chat-term-shadow);
  color:var(--text);
}
html[data-theme="clay"] .chat-slash-item:hover,
html[data-theme="clay"] .chat-slash-item.active{
  background:var(--surface-2);
  box-shadow:var(--inset-sm);
  border-radius:var(--r-sm);
  color:var(--text-strong);
}

/* Status chips — same embossed type as clay terminal, never frosted */
html[data-theme="clay"] .chat-status-labels{
  position:relative;
  z-index:3;
  isolation:isolate;
  margin:0 6px 10px;
  pointer-events:none;
}
html[data-theme="clay"] .chat-status-label{
  font-family:Consolas,"Cascadia Mono","SF Mono",ui-monospace,monospace;
  font-size:12px;
  font-weight:600;
  letter-spacing:.04em;
  line-height:1.2;
  color:var(--text-strong);
  opacity:1;
  filter:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  text-shadow:-1px -1px 0 var(--light),1px 1px 1px var(--dark);
}
html[data-theme="clay"] #chat-api-only-label,
html[data-theme="clay"] #chat-local-only-label,
html[data-theme="clay"] #chat-auto-speak-label{
  color:var(--accent-deep);
  text-shadow:-1px -1px 0 rgba(255,255,255,.75),1px 1px 1px rgba(var(--accent-deep-rgb),.45);
}

/* ---- sliders ---- */
html[data-theme="clay"] input[type=range]{
  height:18px;
  border-radius:var(--r-pill);
  background:var(--surface);
  box-shadow:var(--inset-sm);
  accent-color:var(--accent);
}
html[data-theme="clay"] input[type=range]::-webkit-slider-thumb{
  width:32px;height:32px;
  border-radius:50%;
  border:none;
  background:linear-gradient(145deg,var(--knob-a),var(--knob-b));
  box-shadow:var(--raise-sm);
}

/* ---- misc admin ---- */
html[data-theme="clay"] .note,
html[data-theme="clay"] body.admin-layout .note,
html[data-theme="clay"] .filter-btn,
html[data-theme="clay"] body.admin-layout .filter-btn,
html[data-theme="clay"] .badge,
html[data-theme="clay"] .admin-dash-table,
html[data-theme="clay"] body.admin-layout table,
html[data-theme="clay"] .pill{
  border:none !important;
  background-color:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  border-radius:var(--r-md);
}
html[data-theme="clay"] .filter-btn.active,
html[data-theme="clay"] body.admin-layout .filter-btn.active{
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  background-image:linear-gradient(145deg,var(--accent-soft),var(--accent));
  color:var(--on-accent);
  box-shadow:var(--accent-raise);
}
html[data-theme="clay"] .settings-crumbs,
html[data-theme="clay"] .settings-crumb-link,
html[data-theme="clay"] .settings-crumb-summary{color:var(--muted)}
html[data-theme="clay"] .settings-crumb-current{color:var(--text-strong)}
html[data-theme="clay"] .el-progress{
  background:var(--surface);
  box-shadow:var(--inset-sm);
  border:none;
}
html[data-theme="clay"] .el-progress-bar{
  background:linear-gradient(90deg,var(--accent-soft),var(--accent));
}
html[data-theme="clay"] .el-dial-face{
  background:radial-gradient(circle at 35% 30%,var(--surface-hi),var(--surface));
  border:none;
  box-shadow:var(--inset);
}
html[data-theme="clay"] .el-dial-knob{
  background:var(--accent);
  box-shadow:var(--accent-raise);
}

/* ---- clay kit helper classes (Elements / future) ---- */
html[data-theme="clay"] .search{
  display:flex;align-items:center;gap:12px;
  height:56px;padding:0 20px;color:var(--muted);
}
html[data-theme="clay"] .search input{
  flex:1;border:0;background:transparent !important;box-shadow:none !important;
  outline:none;color:var(--text-strong);min-height:auto;padding:0;
}
html[data-theme="clay"] .chip{
  display:inline-flex;align-items:center;gap:10px;
  height:48px;padding:0 22px;border-radius:var(--r-sm);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise);font-weight:500;color:var(--text);border:none;
}
html[data-theme="clay"] .chip:hover{transform:translateY(-1px)}
html[data-theme="clay"] .chip:active{box-shadow:var(--inset);transform:none;background-image:none}

/* kit body/board must not constrain NEMO chrome */
html[data-theme="clay"] body{
  max-width:none !important;
  padding:0 !important;
  min-height:100vh;
}
html[data-theme="clay"] .hero,
html[data-theme="clay"] .board{
  display:contents;
}
html[data-theme="clay"] .panel h2{
  margin:0 0 18px;
}
html[data-theme="clay"] .main > h1 + .sub{
  margin-bottom:18px;
}
html[data-theme="clay"] kbd{
  border:none !important;
  background:var(--surface) !important;
  box-shadow:var(--raise-sm);
  color:var(--muted);
  border-radius:8px;
}
html[data-theme="clay"] .el-toc a{
  border:none !important;
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  border-radius:var(--r-sm);
  padding:8px 14px;
}
html[data-theme="clay"] .el-choice input[type=radio],
html[data-theme="clay"] .el-choice input[type=checkbox]{
  width:22px;height:22px;
  border:none !important;
  background:var(--surface);
  box-shadow:var(--inset-sm);
}
html[data-theme="clay"] .el-choice input[type=checkbox]:checked{
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  box-shadow:var(--accent-inset);
}
html[data-theme="clay"] .el-btn-icon{
  width:60px;height:60px;min-height:60px;
}
html[data-theme="clay"] .slider{width:100%;max-width:420px}

/* NEMO status toasts (#chat-toast, settings pages) — not kit .toasts stack */
html[data-theme="clay"] .toast,
html[data-theme="clay"] #chat-toast,
html[data-theme="clay"] #toast,
html[data-theme="clay"] #fn-toast,
html[data-theme="clay"] #cs-toast{
  position:fixed !important;
  right:24px;bottom:24px;left:auto;top:auto;
  width:auto;max-width:min(360px,calc(100vw - 48px));
  height:auto !important;
  margin:0;padding:14px 20px;padding-bottom:14px !important;
  display:none;
  align-items:center;
  gap:0;
  border:none !important;
  border-radius:var(--r-md);
  background-color:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-lg);
  color:var(--text-strong);
  font-size:13px;font-weight:500;line-height:1.4;
  overflow:visible;
  pointer-events:none;
  z-index:200;
  animation:none !important;
  transform:none !important;
  transition:opacity .18s var(--ease),transform .28s var(--spring);
}
html[data-theme="clay"] .toast.show,
html[data-theme="clay"] #chat-toast.show,
html[data-theme="clay"] #toast.show,
html[data-theme="clay"] #fn-toast.show,
html[data-theme="clay"] #cs-toast.show{
  display:block;
  pointer-events:auto;
}
html[data-theme="clay"] .toast.ok{color:var(--ok);box-shadow:var(--raise-lg),inset 0 0 0 2px color-mix(in srgb,var(--ok) 35%,transparent)}
html[data-theme="clay"] .toast.err{color:var(--err);box-shadow:var(--raise-lg),inset 0 0 0 2px color-mix(in srgb,var(--err) 35%,transparent)}

html[data-theme="clay"] .app-drawer-panel{
  border:none !important;
  background-color:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:none !important;
  border-radius:var(--r-lg) var(--r-lg) 0 0;
}
@media (min-width:641px){
  html[data-theme="clay"] .app-drawer-panel{
    border-radius:var(--r-lg);
    box-shadow:none !important;
  }
}
html[data-theme="clay"] .app-drawer-title{color:var(--text-strong)}
html[data-theme="clay"] .app-drawer-close{
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  border-radius:var(--r-sm);
  color:var(--muted);
}
html[data-theme="clay"] .app-drawer-close:hover{
  color:var(--text-strong);
  box-shadow:var(--raise-sm);
  background:var(--surface);
}
html[data-theme="clay"] .app-drawer-heading{color:var(--muted)}
html[data-theme="clay"] .app-drawer .create-tile-icon{
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise);
  border-radius:var(--r-md);
  color:var(--text);
  width:48px;height:48px;
}
html[data-theme="clay"] .app-drawer .create-tile:hover .create-tile-icon,
html[data-theme="clay"] .app-drawer .create-tile--live .create-tile-icon{
  color:var(--text-strong);
}
html[data-theme="clay"] .app-drawer .create-tile-label{color:var(--text)}
html[data-theme="clay"] .app-drawer-backdrop{
  background:color-mix(in srgb,var(--bg) 48%,rgba(20,22,28,.22));
  backdrop-filter:blur(16px) saturate(1.15) !important;
  -webkit-backdrop-filter:blur(16px) saturate(1.15) !important;
}

/* ---- clay icon system: filled glyphs on soft raised tiles ---- */
html[data-theme="clay"] .create-tile-icon,
html[data-theme="clay"] .home-page .create-tile-icon,
html[data-theme="clay"] .app-drawer .create-tile-icon{
  width:52px;height:52px;
  border-radius:var(--r-md);
  background-color:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise);
  color:var(--text);
}
html[data-theme="clay"] .create-tile-icon svg,
html[data-theme="clay"] .appnav-icon svg,
html[data-theme="clay"] .chat-icon svg,
html[data-theme="clay"] .talk-vision-toggle-icon svg,
html[data-theme="clay"] .chat-preview-fab-btn svg,
html[data-theme="clay"] .chat-preview-fab-btn .chat-icon svg{
  width:22px;height:22px;display:block;
}
html[data-theme="clay"] .create-tile:hover .create-tile-icon,
html[data-theme="clay"] .create-tile--live .create-tile-icon,
html[data-theme="clay"] .app-drawer .create-tile:hover .create-tile-icon{
  color:var(--text-strong);
  transform:translateY(-1px);
}
html[data-theme="clay"] .create-tile--add .create-tile-icon{
  color:var(--accent-deep);
}
html[data-theme="clay"] .home-page .create-tile-label,
html[data-theme="clay"] .app-drawer .create-tile-label{
  color:var(--text);
}
html[data-theme="clay"] .home-hero{
  padding:28px 8px 8px;
}
html[data-theme="clay"] .home-clock{
  color:var(--text-strong);
  font-weight:300;
  text-shadow:1px 1px 2px color-mix(in srgb,var(--dark) 40%,transparent);
}
html[data-theme="clay"] .home-date{
  color:var(--muted);
}
html[data-theme="clay"] .home-glance{
  gap:10px;
  padding:14px 0 10px;
}
html[data-theme="clay"] .home-glance-chip{
  border:none !important;
  border-radius:var(--r-md);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  color:var(--text);
  transition:box-shadow .18s var(--ease),transform .28s var(--spring);
}
html[data-theme="clay"] .home-glance-chip:hover{
  transform:translateY(-1px);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  border:none !important;
}
html[data-theme="clay"] .home-glance-chip:active{
  transform:translateY(1px);
  box-shadow:var(--inset-sm);
}
html[data-theme="clay"] .home-glance-kicker{
  color:var(--muted);
  letter-spacing:.08em;
}
html[data-theme="clay"] .home-glance-value{
  color:var(--text-strong);
}
html[data-theme="clay"] .home-glance-chip.is-muted .home-glance-value{
  color:var(--muted);
  font-weight:500;
}
html[data-theme="clay"] .chat-input-actions{
  gap:8px;
}
html[data-theme="clay"] .chat-input-actions > .chat-icon-btn,
html[data-theme="clay"] .chat-input-actions > .btn.chat-icon-btn{
  width:34px;height:34px;min-height:34px;min-width:34px;
  padding:0;
  border-radius:var(--r-sm);
  background-color:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  color:var(--text);
}
html[data-theme="clay"] .chat-input-actions > .chat-icon-btn:hover{
  transform:translateY(-1px);
  color:var(--text-strong);
  box-shadow:var(--raise-sm);
}
html[data-theme="clay"] .chat-input-actions > .chat-icon-btn:active{
  transform:translateY(1px) scale(.98);
  box-shadow:var(--inset-sm);
  background-image:none;
}
html[data-theme="clay"] .chat-input-actions > .chat-send-btn{
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  background-image:linear-gradient(145deg,var(--accent-soft),var(--accent));
  color:var(--on-accent);
  box-shadow:var(--accent-raise);
}
html[data-theme="clay"] .chat-input-actions > .chat-send-btn:hover{
  color:var(--on-accent);
  box-shadow:var(--accent-raise);
}
html[data-theme="clay"] .chat-input-actions > .chat-send-btn:active{
  box-shadow:var(--accent-inset);
  color:var(--on-accent);
}
html[data-theme="clay"] .chat-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:18px;height:18px;
}
html[data-theme="clay"] .chat-icon svg{
  width:18px;height:18px;display:block;
}
html[data-theme="clay"] .appnav-icon{
  width:34px;height:34px;
  border-radius:12px;
  display:inline-flex;align-items:center;justify-content:center;
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  color:var(--text);
}
html[data-theme="clay"] .appnav a.active .appnav-icon{
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  background-image:linear-gradient(145deg,var(--accent-soft),var(--accent));
  color:var(--on-accent);
  box-shadow:var(--accent-raise);
}
html[data-theme="clay"] .appnav-icon svg{width:18px;height:18px}
html[data-theme="clay"] .talk-vision-toggle{
  border:none !important;
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise);
  border-radius:var(--r-md);
  color:var(--text);
}
html[data-theme="clay"] .talk-vision-toggle--on{
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  background-image:linear-gradient(145deg,var(--accent-soft),var(--accent));
  color:var(--on-accent);
  box-shadow:var(--accent-raise);
}
html[data-theme="clay"] .talk-vision-toggle-icon,
html[data-theme="clay"] .talk-vision-toggle-icon svg{
  width:22px;height:22px;display:block;
}
html[data-theme="clay"] .chat-preview-fab-btn{
  border:none !important;
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  color:var(--text);
}
html[data-theme="clay"] .msg-actions .btn{
  min-height:34px;
  padding:0 10px;
  border-radius:var(--r-sm);
}

/* ---- Task Manager ---- */
html[data-theme="clay"] .main:has(.tm-page){
  background:transparent;
}
html[data-theme="clay"] .tm-title{
  font-family:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-weight:600;
  letter-spacing:.04em;
  color:var(--text-strong);
  text-shadow:1px 1px 1px rgba(154,160,172,.3);
}
html[data-theme="clay"] .tm-sub,
html[data-theme="clay"] .tm-updated,
html[data-theme="clay"] .tm-card-label,
html[data-theme="clay"] .tm-card-hint,
html[data-theme="clay"] .tm-group,
html[data-theme="clay"] .tm-detail{
  color:var(--muted);
}
html[data-theme="clay"] .tm-card{
  border:none !important;
  border-radius:var(--r-md);
  background-color:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise);
  padding:16px 15px 14px;
}
html[data-theme="clay"] .tm-card-value{
  color:var(--text-strong);
  font-weight:600;
}
html[data-theme="clay"] .tm-card.warn .tm-card-value{color:var(--warn)}
html[data-theme="clay"] .tm-card.bad .tm-card-value{color:var(--err, var(--bad))}
html[data-theme="clay"] .tm-card.ok .tm-card-value{color:var(--ok)}
html[data-theme="clay"] .tm-alert{
  border:none !important;
  border-radius:var(--r-md);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm), inset 0 0 0 2px color-mix(in srgb,var(--warn) 35%,transparent);
  color:var(--text-strong);
}
html[data-theme="clay"] .tm-table-wrap{
  border:none !important;
  border-radius:var(--r-lg);
  background-color:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-lg);
  overflow:hidden;
}
html[data-theme="clay"] .tm-table th{
  color:var(--muted);
  border-bottom:none;
  background:color-mix(in srgb,var(--surface-2) 55%,transparent);
  padding:14px 16px;
}
html[data-theme="clay"] .tm-table td{
  border-top:1px solid color-mix(in srgb,var(--dark) 28%,transparent);
  padding:13px 16px;
  color:var(--text);
}
html[data-theme="clay"] .tm-table tbody tr:first-child td{border-top:none}
html[data-theme="clay"] .tm-table tbody tr:hover{
  background:color-mix(in srgb,var(--accent-soft) 45%,transparent);
}
html[data-theme="clay"] .tm-name{color:var(--text-strong);font-weight:600}
html[data-theme="clay"] .tm-state{
  border:none !important;
  border-radius:var(--r-sm);
  background:var(--surface-2);
  box-shadow:var(--inset-sm);
  color:var(--muted);
  padding:4px 10px;
}
html[data-theme="clay"] .tm-state.busy,
html[data-theme="clay"] .tm-state.loaded{
  color:var(--ok);
  background:color-mix(in srgb,var(--ok) 14%,var(--surface));
  box-shadow:var(--inset-sm);
}
html[data-theme="clay"] .tm-state.starved{
  color:var(--warn);
  background:color-mix(in srgb,var(--warn) 16%,var(--surface));
  box-shadow:var(--inset-sm);
}
html[data-theme="clay"] .tm-bar{
  height:8px;
  background:var(--surface-2);
  box-shadow:var(--inset-sm);
  border-radius:var(--r-pill);
}
html[data-theme="clay"] .tm-bar > i{
  background:linear-gradient(90deg,var(--accent-soft),var(--accent));
  box-shadow:none;
}
html[data-theme="clay"] .tm-bar.hot > i{
  background:linear-gradient(90deg,#f0c98a,var(--warn));
}
html[data-theme="clay"] .tm-bar.max > i{
  background:linear-gradient(90deg,#f0a0a0,var(--err, var(--bad)));
}
html[data-theme="clay"] .tm-starve{color:var(--warn)}
html[data-theme="clay"] .tm-filter.seg{
  box-shadow:var(--inset);
}

/* ---- Drop ---- */
html[data-theme="clay"] .main:has(.drop-page),
html[data-theme="clay"] .drop-page{
  background:
    radial-gradient(120% 70% at 0% 0%,color-mix(in srgb,var(--accent-soft) 55%,transparent),transparent 55%),
    var(--bg);
  color:var(--text);
}
html[data-theme="clay"] .drop-page{
  gap:14px;
}
html[data-theme="clay"] .drop-bar{
  padding:4px 2px 12px;
  box-shadow:inset 0 -3px 0 color-mix(in srgb,var(--accent) 62%,transparent);
}
html[data-theme="clay"] .drop-title{
  font-family:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-weight:650;
  letter-spacing:.06em;
  color:var(--accent-deep);
  text-shadow:-1px -1px 0 var(--light),1px 1px 1px var(--dark-2);
}
html[data-theme="clay"] .drop-sub,
html[data-theme="clay"] .drop-muted,
html[data-theme="clay"] .drop-row-meta,
html[data-theme="clay"] .drop-status{
  color:var(--muted);
}
html[data-theme="clay"] .drop-status.ok{color:var(--ok)}
html[data-theme="clay"] .drop-status.err{color:var(--err, var(--bad))}
html[data-theme="clay"] .drop-status.busy{color:var(--accent-deep)}
html[data-theme="clay"] .drop-zone{
  border:none;
  border-radius:var(--r-lg);
  background:
    linear-gradient(145deg,color-mix(in srgb,var(--accent-soft) 55%,var(--surface-hi)),color-mix(in srgb,var(--accent) 18%,var(--surface)));
  box-shadow:var(--inset), inset 0 0 0 2px color-mix(in srgb,var(--accent) 55%,transparent);
}
html[data-theme="clay"] .drop-page.is-dragover .drop-zone{
  background:linear-gradient(145deg,var(--accent-soft),color-mix(in srgb,var(--accent) 35%,var(--surface)));
  box-shadow:var(--accent-inset), inset 0 0 0 2px var(--accent);
}
html[data-theme="clay"] .drop-zone-label{
  color:var(--on-accent);
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  font-size:12px;
  text-shadow:0 1px 0 color-mix(in srgb,var(--accent-deep) 35%,transparent);
}
html[data-theme="clay"] .drop-empty{
  border:none;
  border-radius:var(--r-lg);
  background-color:var(--surface);
  background-image:
    radial-gradient(90% 80% at 50% 0%,color-mix(in srgb,var(--accent-soft) 50%,transparent),transparent 70%),
    linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--inset), inset 0 0 0 2px color-mix(in srgb,var(--accent) 35%,transparent);
  padding:56px 20px;
  gap:10px;
}
html[data-theme="clay"] .drop-empty-icon{
  border:none;
  width:56px;height:56px;
  border-radius:var(--r-md);
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  box-shadow:var(--accent-raise);
  color:var(--on-accent);
}
html[data-theme="clay"] .drop-list{gap:10px}
html[data-theme="clay"] .drop-row{
  border:none !important;
  border-radius:var(--r-md);
  background-color:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise), inset 3px 0 0 color-mix(in srgb,var(--accent) 70%,transparent);
  padding:14px 16px;
  transition:transform .28s var(--spring),box-shadow .18s var(--ease);
}
html[data-theme="clay"] .drop-row:hover{
  transform:translateY(-1px);
  box-shadow:var(--raise), inset 3px 0 0 var(--accent);
}
html[data-theme="clay"] .drop-row-icon{
  border:none;
  width:44px;height:44px;
  border-radius:var(--r-sm);
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  box-shadow:var(--accent-raise);
  color:var(--on-accent);
}
html[data-theme="clay"] .drop-row-name{color:var(--text-strong);font-weight:600}
html[data-theme="clay"] .drop-bar-actions .btn.btn--accent,
html[data-theme="clay"] #drop-upload-btn{
  border:none;
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  color:var(--on-accent);
  box-shadow:var(--accent-raise);
}
html[data-theme="clay"] .drop-row-actions .btn.sm,
html[data-theme="clay"] .drop-bar-actions .btn{
  min-height:40px;
  padding:0 18px;
  border-radius:var(--r-sm);
}
html[data-theme="clay"] .drop-row-actions .btn.ghost.sm{
  background:transparent;
  background-image:none;
  box-shadow:none;
  color:var(--muted);
  min-height:36px;
}
html[data-theme="clay"] .drop-row-actions .btn.ghost.sm:hover{
  color:var(--err, var(--bad));
  transform:none;
  box-shadow:none;
}
html.nemo-embed .drop-title{display:none}
html.nemo-embed .main:has(.drop-page){
  padding:0 !important;
  height:100%;max-height:100%;
  overflow:hidden;
}
html.nemo-embed .drop-page{
  max-width:none;height:100%;min-height:0;
  padding:10px 12px 12px;
  box-sizing:border-box;
  gap:10px;
  background:var(--bg);
  background-image:none;
}
html.nemo-embed .drop-bar{
  padding:0 0 8px;
  box-shadow:inset 0 -2px 0 color-mix(in srgb,var(--accent) 50%,transparent);
}
html.nemo-embed .drop-empty{
  padding:20px 10px;
  border-radius:var(--r-md);
}
html.nemo-embed .drop-empty-icon{
  width:40px;height:40px;border-radius:12px;
  box-shadow:var(--raise-sm);
}
html.nemo-embed .drop-list{gap:6px}
html.nemo-embed .drop-row{
  padding:8px 10px;
  border-radius:var(--r-sm);
}
html.nemo-embed .drop-row-icon{
  width:32px;height:32px;border-radius:9px;
}
html[data-theme="clay"] .app-modal-panel--compact{
  width:min(440px, 100%);
  height:min(460px, calc(100vh - 48px));
  max-height:calc(100dvh - 48px);
  box-shadow:
    var(--raise-lg),
    0 0 0 2px color-mix(in srgb,var(--accent) 48%,transparent),
    0 14px 36px color-mix(in srgb,var(--accent-deep) 18%,transparent) !important;
}
html[data-theme="clay"] .app-modal-panel--compact .app-modal-head{
  padding:12px 14px;
}

/* ---- Browser ---- */
html[data-theme="clay"] body:has(.browser-page){
  background:var(--bg);
}
html[data-theme="clay"] body:has(.browser-page) .app,
html[data-theme="clay"] body:has(.browser-page) .app-body,
html[data-theme="clay"] body:has(.browser-page) .main{
  background:var(--bg);
}
html[data-theme="clay"] .browser-page{
  background:var(--bg);
}
html[data-theme="clay"] .br-tabs{
  gap:6px;
  min-height:44px;
  padding:10px 12px 8px;
  padding-top:calc(10px + env(safe-area-inset-top, 0px));
  background:var(--bg);
  border-bottom:none;
}
html[data-theme="clay"] .br-tabs-scroll{
  gap:8px;
  align-items:center;
  padding-bottom:2px;
}
html[data-theme="clay"] .br-tab{
  height:34px;
  max-width:200px;
  min-width:88px;
  padding:0 10px 0 14px;
  border-radius:var(--r-md);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  color:var(--muted);
  font-size:12px;
  font-weight:500;
  transition:box-shadow .18s var(--ease),transform .28s var(--spring),color .18s;
}
html[data-theme="clay"] .br-tab:hover{
  transform:translateY(-1px);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  color:var(--text-strong);
}
html[data-theme="clay"] .br-tab.is-active{
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  background-image:linear-gradient(145deg,var(--accent-soft),var(--accent));
  box-shadow:var(--accent-raise);
  color:var(--on-accent);
}
html[data-theme="clay"] .br-tab-close{
  width:18px;height:18px;
  border-radius:8px;
  opacity:.7;
}
html[data-theme="clay"] .br-tab-close:hover{
  opacity:1;
  background:color-mix(in srgb,var(--text-strong) 12%,transparent);
}
html[data-theme="clay"] .br-tab.is-active .br-tab-close:hover{
  background:color-mix(in srgb,var(--on-accent) 18%,transparent);
}
html[data-theme="clay"] .br-tab-new{
  width:34px;height:34px;
  margin-left:2px;
  border-radius:var(--r-md);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  color:var(--text);
  font-size:20px;
  transition:box-shadow .18s var(--ease),transform .28s var(--spring),color .18s;
}
html[data-theme="clay"] .br-tab-new:hover{
  transform:translateY(-1px);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  color:var(--text-strong);
}
html[data-theme="clay"] .br-tab-new:active{
  transform:translateY(1px);
  box-shadow:var(--inset-sm);
}
html[data-theme="clay"] .br-bar{
  gap:10px;
  min-height:56px;
  padding:10px 14px 14px;
  background:var(--bg);
  border-bottom:none;
}
html[data-theme="clay"] .br-nav-btn{
  width:40px;height:40px;
  border:none !important;
  border-radius:var(--r-md);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  color:var(--text);
  font-size:16px;
  transition:box-shadow .18s var(--ease),transform .28s var(--spring),color .18s,opacity .18s;
}
html[data-theme="clay"] .br-nav-btn:not(:disabled):hover{
  transform:translateY(-1px);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  color:var(--text-strong);
}
html[data-theme="clay"] .br-nav-btn:not(:disabled):active{
  transform:translateY(1px);
  box-shadow:var(--inset-sm);
}
html[data-theme="clay"] .br-nav-btn:disabled{
  opacity:.38;
  box-shadow:none;
  background:var(--surface-2);
  background-image:none;
  color:var(--muted);
}
html[data-theme="clay"] .br-input{
  padding:12px 18px;
  border:none !important;
  border-radius:var(--r-pill);
  background:var(--surface-2);
  box-shadow:var(--inset);
  color:var(--text-strong);
  font-size:14px;
  transition:box-shadow .18s var(--ease),background .18s var(--ease);
}
html[data-theme="clay"] .br-input::placeholder{color:var(--muted)}
html[data-theme="clay"] .br-input:focus{
  outline:none;
  background:var(--surface);
  box-shadow:var(--inset),0 0 0 3px var(--accent-soft);
}
html[data-theme="clay"] .br-content{
  margin:0 10px 10px;
  border-radius:var(--r-lg) var(--r-lg) 0 0;
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 72%);
  box-shadow:var(--raise-lg);
  color:var(--text);
  overflow:hidden;
}
html[data-theme="clay"] .br-content:not(.br-content--empty){
  background:#fff;
  background-image:none;
  color:#111;
  box-shadow:var(--raise);
}
html[data-theme="clay"] .br-replica-host{
  background:#fff;
  color:#111;
}
html[data-theme="clay"] .br-status{
  color:var(--muted);
  font-size:14px;
  padding:56px 20px 110px;
}
html[data-theme="clay"] .br-status.err{color:var(--err, var(--bad))}
html[data-theme="clay"] .br-text{
  color:var(--text);
  padding:18px 20px 96px;
}
html[data-theme="clay"] .br-links{
  border-top:none;
  box-shadow:inset 0 1px 0 color-mix(in srgb,var(--dark) 35%,transparent);
  padding:12px 18px 96px;
}
html[data-theme="clay"] .br-links h3{color:var(--muted);opacity:1}
html[data-theme="clay"] .br-links a{color:var(--accent-deep)}
html[data-theme="clay"] .br-links a .href{color:var(--muted)}
html[data-theme="clay"] .br-title{color:var(--text-strong)}

/* ---- App modal (home popups) ---- */
html[data-theme="clay"] .app-modal-backdrop,
html[data-theme="clay"] .create-add-dialog,
html[data-theme="clay"] .load-chat-dialog,
html[data-theme="clay"] .cal-modal-backdrop,
html[data-theme="clay"] .contacts-modal-backdrop{
  background:
    radial-gradient(120% 80% at 50% 0%,color-mix(in srgb,var(--accent) 28%,transparent),transparent 58%),
    color-mix(in srgb,var(--bg) 62%,rgba(20,22,28,.38)) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
html[data-theme="clay"] body.app-modal-open .app,
html[data-theme="clay"] body.app-modal-open .paperBg,
html[data-theme="clay"] body.app-modal-open .light-pillar-bg,
html[data-theme="clay"] body.app-modal-open .grain,
html[data-theme="clay"] body.app-modal-open .vignette,
html[data-theme="clay"] body.app-modal-open .bg-blur-overlay,
html[data-theme="clay"] body.app-modal-open .windBtn,
html[data-theme="clay"] body.app-modal-open .talk-bottom-nav{
  filter:none !important;
}
html[data-theme="clay"] body.app-drawer-open .app,
html[data-theme="clay"] body.app-drawer-open .paperBg,
html[data-theme="clay"] body.app-drawer-open .light-pillar-bg,
html[data-theme="clay"] body.app-drawer-open .grain,
html[data-theme="clay"] body.app-drawer-open .vignette,
html[data-theme="clay"] body.app-drawer-open .bg-blur-overlay,
html[data-theme="clay"] body.app-drawer-open .windBtn,
html[data-theme="clay"] body.app-drawer-open .talk-bottom-nav{
  filter:blur(12px) saturate(1.05) !important;
  pointer-events:none;
  user-select:none;
}
html[data-theme="clay"] .app-modal-panel,
html[data-theme="clay"] .create-add-dialog-panel,
html[data-theme="clay"] .load-chat-panel,
html[data-theme="clay"] .cal-modal,
html[data-theme="clay"] .cal-popover,
html[data-theme="clay"] .contacts-detail,
html[data-theme="clay"] .cz-modal-panel{
  border:none !important;
  background-color:var(--surface) !important;
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 72%) !important;
  box-shadow:var(--raise-lg) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
html[data-theme="clay"] .app-drawer-panel{
  border:none !important;
  background-color:var(--surface) !important;
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 72%) !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
html[data-theme="clay"] .app-modal-panel{
  border-radius:var(--r-lg);
  overflow:hidden;
  background-image:
    linear-gradient(180deg,color-mix(in srgb,var(--accent-soft) 70%,var(--surface-hi)) 0,var(--surface) 88px),
    linear-gradient(145deg,var(--surface-hi),var(--surface) 72%) !important;
  box-shadow:
    var(--raise-lg),
    0 0 0 3px color-mix(in srgb,var(--accent) 58%,transparent),
    0 18px 48px color-mix(in srgb,var(--accent-deep) 22%,transparent) !important;
}
html[data-theme="clay"] .app-modal-head{
  border-bottom:none;
  padding:16px 16px 14px;
  background:linear-gradient(145deg,var(--accent-soft),var(--accent)) !important;
  box-shadow:
    var(--accent-raise),
    inset 0 -2px 0 color-mix(in srgb,var(--accent-deep) 40%,transparent);
}
html[data-theme="clay"] .app-modal-title{
  color:var(--on-accent) !important;
  font-weight:650;
  letter-spacing:.02em;
  text-shadow:0 1px 0 color-mix(in srgb,var(--accent-deep) 35%,transparent);
}
html[data-theme="clay"] .app-modal-close{
  width:38px;height:38px;
  border-radius:var(--r-sm);
  border:none;
  background:color-mix(in srgb,var(--on-accent) 18%,transparent) !important;
  background-image:none !important;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--on-accent) 28%,transparent);
  color:var(--on-accent) !important;
  font-weight:600;
}
html[data-theme="clay"] .app-modal-close:hover{
  color:var(--on-accent) !important;
  background:color-mix(in srgb,var(--on-accent) 28%,transparent) !important;
  background-image:none !important;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--on-accent) 40%,transparent);
}
html[data-theme="clay"] .app-modal-close:active{
  box-shadow:var(--accent-inset);
}
html[data-theme="clay"] .app-modal-frame{
  background:var(--bg);
}

/* ---- Notepad (modal embed) ---- */
html[data-theme="clay"] .main:has(.notepad-page),
html[data-theme="clay"] .notepad-page{
  background:var(--bg);
  color:var(--text);
}
html[data-theme="clay"] .notepad-page{
  border:none;
  box-shadow:none;
  background-image:none;
  gap:12px;
}
html[data-theme="clay"] .notepad-bar{
  padding:2px 2px 10px;
  box-shadow:inset 0 -2px 0 color-mix(in srgb,var(--accent) 55%,transparent);
}
html[data-theme="clay"] .notepad-title{
  color:var(--text-strong);
  font-weight:600;
}
html[data-theme="clay"] .notepad-status{
  color:var(--muted);
  font-weight:500;
}
html[data-theme="clay"] .notepad-status.ok{color:var(--ok)}
html[data-theme="clay"] .notepad-status.err{color:var(--err)}
html[data-theme="clay"] .notepad-status.busy{color:var(--accent-deep)}
html[data-theme="clay"] .notepad-tool-btn,
html[data-theme="clay"] .notepad-rewrite{
  border:none !important;
  border-radius:var(--r-sm);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  color:var(--text);
}
html[data-theme="clay"] .notepad-rewrite{
  background-color:var(--surface);
  background-image:
    linear-gradient(45deg,transparent 50%,var(--muted) 50%),
    linear-gradient(135deg,var(--muted) 50%,transparent 50%),
    linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  background-position:calc(100% - 14px) calc(50% - 2px),calc(100% - 9px) calc(50% - 2px),0 0;
  background-size:5px 5px,5px 5px,auto;
  background-repeat:no-repeat;
  color:var(--text-strong);
}
html[data-theme="clay"] .notepad-tool-btn:hover:not(:disabled),
html[data-theme="clay"] .notepad-rewrite:hover:not(:disabled){
  color:var(--on-accent);
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  background-image:linear-gradient(145deg,var(--accent-soft),var(--accent));
  box-shadow:var(--accent-raise);
}
html[data-theme="clay"] .notepad-rewrite:hover:not(:disabled){
  background-image:
    linear-gradient(45deg,transparent 50%,var(--on-accent) 50%),
    linear-gradient(135deg,var(--on-accent) 50%,transparent 50%),
    linear-gradient(145deg,var(--accent-soft),var(--accent));
}
html[data-theme="clay"] .notepad-speak-btn{
  color:var(--on-accent);
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  background-image:linear-gradient(145deg,var(--accent-soft),var(--accent));
  box-shadow:var(--accent-raise);
}
html[data-theme="clay"] .notepad-speak-btn:hover:not(:disabled){
  transform:translateY(-1px);
}
html[data-theme="clay"] .notepad-speak-btn.is-recording{
  color:var(--on-accent);
  background:linear-gradient(145deg,var(--accent),var(--accent-deep));
  background-image:linear-gradient(145deg,var(--accent),var(--accent-deep));
  box-shadow:var(--accent-inset);
  animation:notepad-speak-pulse 1.2s ease-in-out infinite;
}
html[data-theme="clay"] .notepad-tool-btn:active:not(:disabled){
  box-shadow:var(--inset-sm);
  transform:translateY(1px);
}
html[data-theme="clay"] .notepad-text{
  border:none !important;
  border-radius:var(--r-md);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 78%);
  box-shadow:var(--inset);
  color:var(--text-strong);
  color-scheme:inherit;
  padding:16px 18px;
}
html[data-theme="clay"] .notepad-text:focus,
html[data-theme="clay"] .notepad-text:focus-visible{
  outline:none;
  box-shadow:var(--inset),0 0 0 3px var(--accent-soft);
}
html[data-theme="clay"] .notepad-text::placeholder{color:var(--muted)}
@keyframes notepad-speak-pulse{
  0%,100%{filter:brightness(1)}
  50%{filter:brightness(1.08)}
}
html[data-theme="clay"].nemo-embed,
html[data-theme="clay"].nemo-embed body,
html[data-theme="clay"].nemo-embed .app,
html[data-theme="clay"].nemo-embed .app-body,
html[data-theme="clay"].nemo-embed .main{
  background:var(--bg) !important;
  background-image:none !important;
}

/* ---- Contacts ---- */
html[data-theme="clay"] body:has(.contacts-page),
html[data-theme="clay"] .main:has(.contacts-page),
html[data-theme="clay"] .contacts-page{
  background:var(--bg);
  color:var(--text);
}
html[data-theme="clay"] .contacts-page{
  padding:8px 16px 0;
}
html[data-theme="clay"] .contacts-title{
  color:var(--text-strong);
  font-weight:600;
  letter-spacing:-.03em;
  text-shadow:1px 1px 2px color-mix(in srgb,var(--dark) 55%,transparent);
}
html[data-theme="clay"] .contacts-icon-btn{
  width:40px;height:40px;
  border-radius:var(--r-md);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  color:var(--text);
  transition:box-shadow .18s var(--ease),transform .28s var(--spring),color .18s;
}
html[data-theme="clay"] .contacts-icon-btn svg{width:20px;height:20px}
html[data-theme="clay"] .contacts-icon-btn:hover{
  transform:translateY(-1px);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  color:var(--text-strong);
}
html[data-theme="clay"] .contacts-icon-btn:active{
  transform:translateY(1px);
  box-shadow:var(--inset-sm);
}
html[data-theme="clay"] .contacts-icon-btn.is-on,
html[data-theme="clay"] #contacts-menu-btn{
  color:var(--accent-deep);
}
html[data-theme="clay"] .contacts-icon-btn.is-on{
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  background-image:linear-gradient(145deg,var(--accent-soft),var(--accent));
  box-shadow:var(--accent-raise);
  color:var(--on-accent);
}
html[data-theme="clay"] .contacts-icon-btn.is-fav{
  color:var(--warn);
}
html[data-theme="clay"] .contacts-icon-btn:focus-visible{
  outline:none;
  box-shadow:var(--raise-sm),0 0 0 3px var(--accent-soft);
}
html[data-theme="clay"] .contacts-search{
  border:none !important;
  border-radius:var(--r-pill);
  background:var(--surface-2);
  box-shadow:var(--inset);
  color:var(--text-strong);
  font-size:15px;
}
html[data-theme="clay"] .contacts-search::placeholder{color:var(--muted)}
html[data-theme="clay"] .contacts-search:focus{
  outline:none;
  background:var(--surface);
  box-shadow:var(--inset),0 0 0 3px var(--accent-soft);
}
html[data-theme="clay"] .contacts-export-menu{
  border:none !important;
  border-radius:var(--r-md);
  background-color:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-lg);
  padding:8px;
}
html[data-theme="clay"] .contacts-export-item{
  border-radius:var(--r-sm);
  color:var(--text);
  font-size:14px;
  font-weight:500;
}
html[data-theme="clay"] .contacts-export-item:hover{
  background:var(--surface-2);
  box-shadow:var(--inset-sm);
  color:var(--text-strong);
}
html[data-theme="clay"] .contacts-status{color:var(--muted)}
html[data-theme="clay"] .contacts-status.ok{color:var(--ok)}
html[data-theme="clay"] .contacts-status.err{color:var(--err, var(--bad))}
html[data-theme="clay"] .contacts-status.busy{color:var(--accent-deep)}
html[data-theme="clay"] .contacts-group-label{
  color:var(--muted);
  font-size:12px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
}
html[data-theme="clay"] .contacts-pod{
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 72%);
  box-shadow:var(--raise-sm);
  border-radius:var(--r-md);
  padding:2px 0;
}
html[data-theme="clay"] .contacts-row{
  min-height:40px;
  border-radius:var(--r-sm);
  margin:0 4px;
  width:calc(100% - 8px);
  gap:10px;
}
html[data-theme="clay"] .contacts-row:hover,
html[data-theme="clay"] .contacts-row.is-active{
  background:var(--surface-2);
  box-shadow:var(--inset-sm);
}
html[data-theme="clay"] .contacts-avatar{
  width:28px;height:28px;font-size:12px;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--light) 35%,transparent);
}
html[data-theme="clay"] .contacts-row-text{
  border-bottom-color:color-mix(in srgb,var(--dark) 18%,transparent);
  padding:6px 0 5px;
}
html[data-theme="clay"] .contacts-row-name{
  color:var(--text-strong);
  font-size:14px;
  font-weight:500;
}
html[data-theme="clay"] .contacts-row-sub{color:var(--muted);font-size:11px}
html[data-theme="clay"] .contacts-pod li:last-child .contacts-row-text{border-bottom:none}
html[data-theme="clay"] .contacts-muted{color:var(--muted)}
html[data-theme="clay"] .contacts-avatar--people{
  background:var(--surface-2);
  color:var(--text);
  box-shadow:var(--inset-sm);
}
html[data-theme="clay"] .contacts-avatar--star{
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  color:var(--on-accent);
  box-shadow:var(--accent-raise);
}
html[data-theme="clay"] .contacts-az-letter{color:color-mix(in srgb,var(--muted) 55%,transparent)}
html[data-theme="clay"] .contacts-az-letter.has-people{color:var(--muted)}
html[data-theme="clay"] .contacts-az-letter.is-dot{color:color-mix(in srgb,var(--muted) 45%,transparent)}
html[data-theme="clay"] .contacts-az-letter:hover,
html[data-theme="clay"] .contacts-az-letter:focus-visible,
html[data-theme="clay"] .contacts-az-letter.is-active{
  color:var(--accent-deep);
}

/* Contacts profile popup */
html[data-theme="clay"] .contacts-modal-backdrop{
  padding:24px;
}
html[data-theme="clay"] .contacts-detail{
  border:none !important;
  border-radius:var(--r-lg);
  padding:0 0 18px;
  color:var(--text);
  background-image:
    linear-gradient(180deg,color-mix(in srgb,var(--accent-soft) 72%,var(--surface-hi)) 0,var(--surface) 160px),
    linear-gradient(145deg,var(--surface-hi),var(--surface) 72%) !important;
  box-shadow:
    var(--raise-lg),
    0 0 0 3px color-mix(in srgb,var(--accent) 55%,transparent) !important;
  max-width:min(440px,calc(100vw - 32px));
}
html[data-theme="clay"] .contacts-detail-top{
  padding:14px 14px 6px;
}
html[data-theme="clay"] .contacts-detail-close{
  width:36px;height:36px;
  border-radius:var(--r-sm);
  background:color-mix(in srgb,var(--on-accent) 16%,transparent);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--on-accent) 26%,transparent);
  color:var(--on-accent);
}
html[data-theme="clay"] .contacts-detail-close svg{width:16px;height:16px}
html[data-theme="clay"] .contacts-detail-close:hover{
  color:var(--on-accent);
  background:color-mix(in srgb,var(--on-accent) 26%,transparent);
}
html[data-theme="clay"] .contacts-detail-delete{
  color:color-mix(in srgb,var(--err, var(--bad)) 85%,var(--text));
  border-radius:var(--r-sm);
}
html[data-theme="clay"] .contacts-detail-delete:hover{
  color:var(--err, var(--bad));
  background:color-mix(in srgb,var(--err, var(--bad)) 12%,transparent);
}
html[data-theme="clay"] .contacts-detail-actions .contacts-icon-btn{
  background:color-mix(in srgb,var(--on-accent) 16%,transparent);
  background-image:none;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--on-accent) 26%,transparent);
  color:var(--on-accent);
}
html[data-theme="clay"] .contacts-detail-actions .contacts-icon-btn.is-fav{
  color:var(--warn);
  background:color-mix(in srgb,var(--on-accent) 22%,transparent);
}
html[data-theme="clay"] .contacts-profile-hero{
  padding:4px 20px 18px;
}
html[data-theme="clay"] .contacts-profile-avatar{
  width:88px;height:88px;font-size:36px;
  box-shadow:var(--accent-raise),0 0 0 4px color-mix(in srgb,var(--on-accent) 28%,transparent);
}
html[data-theme="clay"] .contacts-profile-name{
  color:var(--text-strong);
  font-weight:650;
}
html[data-theme="clay"] .contacts-profile-name::placeholder{color:var(--muted)}
html[data-theme="clay"] .contacts-profile-name:focus{
  background:color-mix(in srgb,var(--surface) 55%,transparent);
  box-shadow:var(--inset-sm);
}
html[data-theme="clay"] .contacts-profile-sub{color:var(--muted)}
html[data-theme="clay"] .contacts-section-label{
  color:var(--accent-deep);
  font-weight:700;
}
html[data-theme="clay"] .contacts-section-icon{
  color:var(--accent-deep);
  opacity:1;
}
html[data-theme="clay"] .contacts-section-card{
  border:none;
  border-radius:var(--r-md);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 78%);
  box-shadow:var(--raise-sm);
  padding:2px 0;
}
html[data-theme="clay"] .contacts-field{
  color:var(--muted);
  font-size:11px;
  font-weight:650;
  letter-spacing:.06em;
  text-transform:uppercase;
  border-bottom-color:color-mix(in srgb,var(--dark) 16%,transparent);
  padding:8px 14px;
}
html[data-theme="clay"] .contacts-field input,
html[data-theme="clay"] .contacts-field textarea{
  border:none !important;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  color:var(--text-strong);
  font-size:15px;
  font-weight:500;
  letter-spacing:0;
  text-transform:none;
  padding:0;
}
html[data-theme="clay"] .contacts-field input:focus,
html[data-theme="clay"] .contacts-field textarea:focus{
  outline:none;
  background:transparent;
  box-shadow:none;
}
html[data-theme="clay"] .contacts-field input::placeholder,
html[data-theme="clay"] .contacts-field textarea::placeholder{color:var(--muted)}
html[data-theme="clay"] .contacts-detail-foot{padding:12px 16px 2px}
html[data-theme="clay"] .contacts-save-btn{
  border:none;
  border-radius:var(--r-md);
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  color:var(--on-accent);
  box-shadow:var(--accent-raise);
  font-weight:600;
}
html[data-theme="clay"] .contacts-save-btn:hover{
  transform:translateY(-1px);
}
html.nemo-embed .contacts-title{display:none}
html.nemo-embed .main:has(.contacts-page){
  padding:0 !important;
}
html.nemo-embed .contacts-page{
  padding:10px 12px 0;
}

@media (max-width:820px){
  html[data-theme="clay"] .contacts-modal-backdrop{
    padding:0;
    background:var(--bg);
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
  }
  html[data-theme="clay"] .contacts-detail{
    border-radius:0;
    box-shadow:none !important;
    background:var(--bg);
    background-image:
      linear-gradient(180deg,color-mix(in srgb,var(--accent-soft) 65%,var(--bg)) 0,var(--bg) 180px) !important;
    padding:0 0 calc(16px + env(safe-area-inset-bottom, 0px));
    max-width:none;
    width:100%;
    height:100%;
  }
  html[data-theme="clay"] .app-modal{
    padding:0;
    align-items:stretch;
    justify-content:stretch;
  }
  html[data-theme="clay"] .app-modal-panel{
    width:100%;
    height:100%;
    height:100dvh;
    max-height:none;
    border-radius:0;
    box-shadow:none !important;
  }
  html[data-theme="clay"] .app-modal-head{
    border-radius:0;
    padding-top:max(14px, env(safe-area-inset-top, 0px));
  }
}

/* ---- Music ---- */
html[data-theme="clay"] body:has(.music-app),
html[data-theme="clay"] .main:has(.music-app),
html[data-theme="clay"] .music-app{
  background:var(--bg);
  color:var(--text);
}
html[data-theme="clay"] .music-app{
  background:
    radial-gradient(120% 80% at 0% 0%,color-mix(in srgb,var(--accent-soft) 45%,transparent),transparent 55%),
    var(--bg);
}
html[data-theme="clay"] .music-side{
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 78%);
  border-right:none;
  box-shadow:var(--raise-sm);
  border-radius:0 var(--r-lg) var(--r-lg) 0;
  margin:10px 0 10px 10px;
  padding:16px 12px;
  gap:8px;
}
html[data-theme="clay"] .music-brand{
  color:var(--accent-deep);
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-shadow:-1px -1px 0 var(--light),1px 1px 1px var(--dark-2);
  padding:4px 12px 14px;
}
html[data-theme="clay"] .music-side-btn,
html[data-theme="clay"] .music-side a{
  color:var(--muted);
  border-radius:var(--r-sm);
  font-weight:600;
}
html[data-theme="clay"] .music-side-btn:hover,
html[data-theme="clay"] .music-side a:hover{
  color:var(--text-strong);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
}
html[data-theme="clay"] .music-side-btn.is-on{
  color:var(--on-accent);
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  background-image:linear-gradient(145deg,var(--accent-soft),var(--accent));
  box-shadow:var(--accent-raise);
}
html[data-theme="clay"] .music-main{color:var(--text)}
html[data-theme="clay"] .music-hero h1,
html[data-theme="clay"] .music-lib-head h1,
html[data-theme="clay"] .music-search-head h1,
html[data-theme="clay"] .music-mobile-head h1,
html[data-theme="clay"] .music-section-title,
html[data-theme="clay"] .music-artist-head h1{
  color:var(--text-strong);
  font-weight:650;
  letter-spacing:-.03em;
  text-shadow:1px 1px 2px color-mix(in srgb,var(--dark) 45%,transparent);
}
html[data-theme="clay"] .music-muted,
html[data-theme="clay"] .music-card-sub,
html[data-theme="clay"] .music-track-num,
html[data-theme="clay"] .music-track-sub,
html[data-theme="clay"] .music-now-sub,
html[data-theme="clay"] .music-bio,
html[data-theme="clay"] .music-fs-artist,
html[data-theme="clay"] .music-fs-times,
html[data-theme="clay"] .music-fs-qrow small{
  color:var(--muted);
}
html[data-theme="clay"] .music-search,
html[data-theme="clay"] .music-search--light{
  border:none !important;
  border-radius:var(--r-pill);
  background:var(--surface-2) !important;
  box-shadow:var(--inset);
  color:var(--text-strong) !important;
}
html[data-theme="clay"] .music-search::placeholder,
html[data-theme="clay"] .music-search--light::placeholder{color:var(--muted)}
html[data-theme="clay"] .music-search:focus,
html[data-theme="clay"] .music-search--light:focus{
  outline:none;
  background:var(--surface) !important;
  box-shadow:var(--inset),0 0 0 3px var(--accent-soft);
}
html[data-theme="clay"] .music-card{
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 72%);
  box-shadow:var(--raise);
  border-radius:var(--r-md);
  color:var(--text);
}
html[data-theme="clay"] .music-card:hover{
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 72%);
  box-shadow:var(--raise-lg);
  transform:translateY(-1px);
}
html[data-theme="clay"] .music-card--rail,
html[data-theme="clay"] .music-card--hero{
  background:transparent;
  background-image:none;
  box-shadow:none;
}
html[data-theme="clay"] .music-card--rail:hover,
html[data-theme="clay"] .music-card--hero:hover{
  transform:none;
  box-shadow:none;
}
html[data-theme="clay"] .music-card-title,
html[data-theme="clay"] .music-track-title,
html[data-theme="clay"] .music-now-title,
html[data-theme="clay"] .music-fs-title,
html[data-theme="clay"] .music-fs-qrow b{
  color:var(--text-strong);
}
html[data-theme="clay"] .music-cover{
  background:var(--surface-2);
  box-shadow:var(--raise-sm);
}
html[data-theme="clay"] .music-card--hero .music-cover,
html[data-theme="clay"] .music-card--rail .music-cover{
  box-shadow:var(--raise);
  border-radius:var(--r-md);
}
html[data-theme="clay"] .music-track{
  border-radius:var(--r-sm);
  color:var(--text);
}
html[data-theme="clay"] .music-track:hover,
html[data-theme="clay"] .music-track.is-on{
  background:var(--surface-2);
  box-shadow:var(--inset-sm);
}
html[data-theme="clay"] .music-track.is-on .music-track-title{color:var(--accent-deep)}
html[data-theme="clay"] .music-pill{
  color:var(--muted);
  border-bottom-color:transparent;
}
html[data-theme="clay"] .music-pill.is-on{
  color:var(--accent-deep);
  border-bottom-color:var(--accent);
}
html[data-theme="clay"] .music-lib-add{
  color:var(--on-accent);
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  box-shadow:var(--accent-raise);
  border-radius:var(--r-sm);
  width:40px;height:40px;
  font-size:24px;
  display:inline-flex;align-items:center;justify-content:center;
}
html[data-theme="clay"] .music-artist-chip{color:var(--text-strong)}
html[data-theme="clay"] .music-artist-photo{
  box-shadow:var(--raise-lg);
  background:var(--surface-2);
}
html[data-theme="clay"] .music-edit-btn{
  border:none;
  border-radius:var(--r-sm);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  color:var(--muted);
}
html[data-theme="clay"] .music-edit-btn:hover{
  color:var(--text-strong);
  box-shadow:var(--raise);
}
html[data-theme="clay"] .music-edit-btn--del:hover{
  color:var(--err, var(--bad));
}
html[data-theme="clay"] .music-edit-panel input,
html[data-theme="clay"] .music-edit-panel textarea{
  border:none !important;
  border-radius:var(--r-md);
  background:var(--surface-2);
  box-shadow:var(--inset);
  color:var(--text-strong);
}
html[data-theme="clay"] .music-dock,
html[data-theme="clay"] .music-player{
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 78%);
  border-top:none;
  box-shadow:var(--raise-lg);
}
html[data-theme="clay"] .music-dock{
  box-shadow:0 -8px 28px color-mix(in srgb,var(--dark) 35%,transparent);
}
html[data-theme="clay"] .music-now img{
  border-radius:var(--r-sm);
  box-shadow:var(--raise-sm);
  background:var(--surface-2);
}
html[data-theme="clay"] .music-ctrl{
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  color:var(--on-accent);
  box-shadow:var(--accent-raise);
  width:38px;height:38px;
}
html[data-theme="clay"] .music-ctrl.ghost{
  background:transparent;
  background-image:none;
  box-shadow:none;
  color:var(--text);
}
html[data-theme="clay"] .music-ctrl.ghost:hover{color:var(--accent-deep)}
html[data-theme="clay"] .music-seek,
html[data-theme="clay"] .music-fs-seek{
  accent-color:var(--accent);
}
html[data-theme="clay"] .music-screensaver-btn{
  border:none;
  border-radius:var(--r-sm);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  color:var(--text);
}
html[data-theme="clay"] .music-screensaver-btn:hover{
  color:var(--text-strong);
  box-shadow:var(--raise);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
}
html[data-theme="clay"] .music-cast-btn.is-on,
html[data-theme="clay"] .music-like-btn.is-on,
html[data-theme="clay"] .music-fs-ctrl.is-on{
  color:var(--accent-deep) !important;
  border-color:color-mix(in srgb,var(--accent) 55%,transparent);
}
html[data-theme="clay"] .music-like-btn,
html[data-theme="clay"] .music-add-btn{
  color:var(--muted);
  border-radius:var(--r-sm);
}
html[data-theme="clay"] .music-like-btn:hover,
html[data-theme="clay"] .music-add-btn:hover{
  color:var(--accent-deep);
  background:var(--surface-2);
  box-shadow:var(--inset-sm);
}
html[data-theme="clay"] .music-playlist-card{
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 72%);
  box-shadow:var(--raise-sm);
  border-radius:var(--r-md);
  color:var(--text-strong);
}
html[data-theme="clay"] .music-playlist-card:hover{
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 72%);
  box-shadow:var(--raise);
}
html[data-theme="clay"] .music-playlist-ph{
  background:var(--surface-2);
  box-shadow:var(--inset-sm);
}
html[data-theme="clay"] .music-playlist-heart{
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  color:var(--on-accent);
  box-shadow:var(--accent-raise);
}
html[data-theme="clay"] .music-now-screen{
  background:var(--bg);
  color:var(--text);
}
html[data-theme="clay"] .music-fs-bg{
  filter:blur(36px) saturate(120%);
  opacity:.35;
}
html[data-theme="clay"] .music-fs-inner{
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--accent-soft) 40%,transparent) 0,var(--bg) 42%);
}
html[data-theme="clay"] .music-fs-icon,
html[data-theme="clay"] .music-fs-ctrl,
html[data-theme="clay"] .music-fs-head-title{
  color:var(--text-strong);
}
html[data-theme="clay"] .music-fs-art{
  border-radius:var(--r-md);
  box-shadow:var(--raise-lg);
  background:var(--surface-2);
}
html[data-theme="clay"] .music-fs-play{
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  color:var(--on-accent);
  box-shadow:var(--accent-raise);
}
html[data-theme="clay"] .music-fs-queue-wrap{
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 78%);
  box-shadow:var(--raise-lg);
  border-radius:var(--r-lg) var(--r-lg) 0 0;
}
html[data-theme="clay"] .music-fs-queue-label{color:var(--accent-deep)}
html[data-theme="clay"] .music-fs-qrow{color:var(--text)}
html[data-theme="clay"] .music-fs-qrow:hover{
  background:var(--surface-2);
  box-shadow:var(--inset-sm);
  border-radius:var(--r-sm);
}
html[data-theme="clay"] .music-import-overlay,
html[data-theme="clay"] .music-cast-overlay{
  background:
    radial-gradient(120% 80% at 50% 0%,color-mix(in srgb,var(--accent) 28%,transparent),transparent 58%),
    color-mix(in srgb,var(--bg) 62%,rgba(20,22,28,.38)) !important;
  backdrop-filter:none !important;
}
html[data-theme="clay"] .music-import-panel,
html[data-theme="clay"] .music-cast-panel{
  border:none !important;
  border-radius:var(--r-lg);
  background:var(--surface) !important;
  background-image:
    linear-gradient(180deg,color-mix(in srgb,var(--accent-soft) 70%,var(--surface-hi)) 0,var(--surface) 88px),
    linear-gradient(145deg,var(--surface-hi),var(--surface) 72%) !important;
  box-shadow:
    var(--raise-lg),
    0 0 0 3px color-mix(in srgb,var(--accent) 55%,transparent) !important;
  color:var(--text);
}
html[data-theme="clay"] .music-import-head,
html[data-theme="clay"] .music-cast-head{
  border-bottom:none;
  box-shadow:inset 0 -2px 0 color-mix(in srgb,var(--accent) 55%,transparent);
}
html[data-theme="clay"] .music-import-head h2,
html[data-theme="clay"] .music-cast-head h2,
html[data-theme="clay"] .music-import-dest-name{
  color:var(--accent-deep);
  font-weight:650;
}
html[data-theme="clay"] .music-import-form input[type=text],
html[data-theme="clay"] .music-cast-panel input[type=text]{
  border:none !important;
  border-radius:var(--r-md);
  background:var(--surface-2) !important;
  box-shadow:var(--inset);
  color:var(--text-strong) !important;
}
html[data-theme="clay"] .music-import-status{color:var(--accent-deep)}
html[data-theme="clay"] .music-import-path-line,
html[data-theme="clay"] .music-cast-hint,
html[data-theme="clay"] .music-cast-status,
html[data-theme="clay"] .music-import-dest-kicker,
html[data-theme="clay"] .music-output-section{color:var(--muted)}
html[data-theme="clay"] .music-import-path-line code,
html[data-theme="clay"] .music-import-dest-path,
html[data-theme="clay"] .music-import-log{
  background:var(--surface-2);
  border:none;
  border-radius:var(--r-sm);
  box-shadow:var(--inset-sm);
  color:var(--text-strong);
}
html[data-theme="clay"] .music-import-log.is-err{color:var(--err, var(--bad))}
html[data-theme="clay"] .music-import-log.is-ok{color:var(--ok)}
html[data-theme="clay"] .music-import-dest{
  background:transparent;
  color:var(--text);
  border-left:none;
  box-shadow:inset 1px 0 0 color-mix(in srgb,var(--dark) 28%,transparent);
}
html[data-theme="clay"] .music-import-files li{color:var(--muted);border-bottom-color:color-mix(in srgb,var(--dark) 18%,transparent)}
html[data-theme="clay"] .music-import-files li.is-current{color:var(--accent-deep)}
html[data-theme="clay"] .music-cast-device{
  border:none;
  border-radius:var(--r-md);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  color:var(--text-strong);
}
html[data-theme="clay"] .music-cast-device:hover{
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise);
}
html[data-theme="clay"] .music-cast-device.is-on{
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  background-image:linear-gradient(145deg,var(--accent-soft),var(--accent));
  box-shadow:var(--accent-raise);
  color:var(--on-accent);
  border:none;
}
html[data-theme="clay"] .music-cast-device.is-on .music-cast-device-sub{color:color-mix(in srgb,var(--on-accent) 75%,transparent)}
html[data-theme="clay"] .music-cast-device-sub{color:var(--muted)}
html[data-theme="clay"] .music-now-banner-copy{color:var(--text)}
html[data-theme="clay"] .music-now-banner:hover .music-now-banner-copy{color:var(--accent-deep)}
html[data-theme="clay"] .music-tab-pips i{background:var(--accent)}

@media (max-width:820px){
  html[data-theme="clay"] body:has(.music-app){
    background:var(--bg);
  }
  html[data-theme="clay"] .music-app{
    background:
      radial-gradient(120% 70% at 50% 0%,color-mix(in srgb,var(--accent-soft) 50%,transparent),transparent 55%),
      var(--bg);
  }
  html[data-theme="clay"] .music-player{
    background:var(--surface);
    background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 78%);
    border-radius:var(--r-md) var(--r-md) 0 0;
    box-shadow:var(--raise);
  }
  html[data-theme="clay"] .music-tabbar{
    background:var(--surface);
    background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 78%);
    border-top:none;
    box-shadow:inset 0 2px 0 color-mix(in srgb,var(--accent) 45%,transparent);
  }
  html[data-theme="clay"] .music-tab{color:var(--muted)}
  html[data-theme="clay"] .music-tab.is-on{color:var(--accent-deep)}
  html[data-theme="clay"] .music-import-dest{
    box-shadow:inset 0 1px 0 color-mix(in srgb,var(--dark) 28%,transparent);
  }
}

/* ---- Calendar (simple flat grid) ---- */
html[data-theme="clay"] .main:has(.cal){
  background:transparent;
}
html[data-theme="clay"] .cal-range-label{
  color:var(--text-strong);
  font-weight:600;
  letter-spacing:-.02em;
}
html[data-theme="clay"] .cal-today-btn{
  background:var(--surface-2);
  color:var(--text);
  box-shadow:var(--inset-sm);
}
html[data-theme="clay"] .cal-today-btn:hover{color:var(--text-strong)}
html[data-theme="clay"] .cal-chevron{
  border-radius:var(--r-sm);
  color:var(--text);
}
html[data-theme="clay"] .cal-chevron:hover{
  background:var(--surface-2);
  color:var(--text-strong);
}
html[data-theme="clay"] .cal-sync-pill{
  background:var(--surface-2);
  color:var(--muted);
}
html[data-theme="clay"] .cal-sync-pill.ok{color:var(--ok)}
html[data-theme="clay"] .cal-sync-pill.err{color:var(--err, var(--bad))}
html[data-theme="clay"] .cal-fab{
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  color:var(--on-accent);
  box-shadow:var(--accent-raise);
  border:none;
}
html[data-theme="clay"] .cal-mini-label{color:var(--text-strong)}
html[data-theme="clay"] .cal-mini-day.today{
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  color:var(--on-accent);
}
html[data-theme="clay"] .cal-mini-day.focus:not(.today){
  background:var(--surface-2);
}
html[data-theme="clay"] .cal-legend-toggle{
  background:var(--surface-2);
  color:var(--text-strong);
  box-shadow:var(--inset-sm);
}
html[data-theme="clay"] .cal-legend-menu{
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 80%);
  box-shadow:var(--raise-lg);
  border:none;
  padding:3px;
  border-radius:10px;
}
html[data-theme="clay"] .cal-legend-row{
  padding:5px 7px;
  border-radius:7px;
}
html[data-theme="clay"] .cal-legend-row:hover{
  background:var(--surface-2);
  box-shadow:none;
}
html[data-theme="clay"] .cal-legend-name{color:var(--text-strong);font-size:12.5px}
html[data-theme="clay"] .cal-legend-hint{color:var(--muted)}
html[data-theme="clay"] .cal-legend-manage{
  padding:5px 7px;
  font-size:11px;
  color:var(--muted);
}
html[data-theme="clay"] .cal-legend-manage:hover{
  background:var(--surface-2);
  color:var(--text-strong);
  box-shadow:none;
}
html[data-theme="clay"] .cal-main{
  border:none;
  background:var(--surface);
  box-shadow:var(--raise);
}
html[data-theme="clay"] .cal-month-dows{
  border-bottom:1px solid color-mix(in srgb,var(--dark) 28%,transparent);
}
html[data-theme="clay"] .cal-month-dow{color:var(--muted);font-weight:600}
html[data-theme="clay"] .cal-month-grid{
  gap:0;
  padding:0;
  background:transparent;
}
html[data-theme="clay"] .cal-month-cell{
  border-right:1px solid color-mix(in srgb,var(--dark) 22%,transparent) !important;
  border-bottom:1px solid color-mix(in srgb,var(--dark) 22%,transparent) !important;
  border-radius:0;
  min-height:0;
  background:transparent;
  box-shadow:none;
  transform:none;
}
html[data-theme="clay"] .cal-month-cell:hover{
  transform:none;
  box-shadow:none;
  background:color-mix(in srgb,var(--surface-2) 70%,transparent);
}
html[data-theme="clay"] .cal-month-cell.other{
  background:color-mix(in srgb,var(--surface-2) 55%,transparent);
  box-shadow:none;
}
html[data-theme="clay"] .cal-month-cell.other:hover{
  transform:none;
  box-shadow:none;
}
html[data-theme="clay"] .cal-month-cell.is-selecting{
  background:color-mix(in srgb,var(--accent) 22%,var(--surface));
  box-shadow:none;
}
html[data-theme="clay"] .cal-month-num{
  color:var(--text-strong);
  border-radius:999px;
}
html[data-theme="clay"] .cal-month-cell.today .cal-month-num{
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  color:var(--on-accent);
  box-shadow:none;
}
html[data-theme="clay"] .cal-chip{
  border-radius:6px;
  box-shadow:none;
}
html[data-theme="clay"] .cal-time-head-num{color:var(--text-strong)}
html[data-theme="clay"] .cal-time-head-day.today .cal-time-head-num{
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  color:var(--on-accent);
}
html[data-theme="clay"] .cal-time-head,
html[data-theme="clay"] .cal-allday-row{
  border-bottom:1px solid color-mix(in srgb,var(--dark) 28%,transparent);
  box-shadow:none;
}
html[data-theme="clay"] .cal-allday-cell,
html[data-theme="clay"] .cal-time-col{
  border-left:1px solid color-mix(in srgb,var(--dark) 22%,transparent) !important;
  box-shadow:none;
}
html[data-theme="clay"] .cal-time-event{
  border:none;
  border-radius:8px;
  box-shadow:0 1px 3px rgba(0,0,0,.18);
}
html[data-theme="clay"] .cal-popover,
html[data-theme="clay"] .cal-modal{
  border:none;
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 78%);
  box-shadow:var(--raise-lg);
  color:var(--text);
}
html[data-theme="clay"] .cal-popover-title{color:var(--text-strong)}
html[data-theme="clay"] .cal-pop-icon{
  background:transparent;
  box-shadow:none;
}
html[data-theme="clay"] .cal-pop-icon:hover{background:var(--surface-2)}
html[data-theme="clay"] .cal-f-input,
html[data-theme="clay"] select.cal-f-input,
html[data-theme="clay"] .cal-modal textarea.cal-f-input{
  border:none !important;
  background:var(--surface-2) !important;
  box-shadow:var(--inset-sm) !important;
  color:var(--text-strong) !important;
  border-radius:12px !important;
}
html[data-theme="clay"] .cal-f-check{
  background:var(--surface-2);
  box-shadow:var(--inset-sm);
}
html[data-theme="clay"] .cal-modal-foot #cal-f-save.btn{
  background:linear-gradient(145deg,var(--accent-soft),var(--accent)) !important;
  color:var(--on-accent) !important;
  box-shadow:var(--accent-raise) !important;
}
html[data-theme="clay"] .cal-pop-duplicate{
  background:linear-gradient(145deg,var(--accent-soft),var(--accent)) !important;
  color:var(--on-accent) !important;
}

@media (max-width:900px){
  html[data-theme="clay"] .cal-main{
    border-radius:0;
    background:transparent;
    box-shadow:none;
  }
  html[data-theme="clay"] .cal-month-cell{
    min-height:0;
    padding:3px 1px 1px;
  }
  html[data-theme="clay"] .cal-modal{
    border-radius:0;
    background:var(--bg);
    background-image:none;
    box-shadow:none;
  }
}

/* ---- /load past chats picker ---- */
html[data-theme="clay"] .load-chat-panel{
  border-radius:var(--r-lg);
}
html[data-theme="clay"] .load-chat-title{
  color:var(--text-strong);
  font-weight:600;
  letter-spacing:-.01em;
}
html[data-theme="clay"] .load-chat-close{
  width:36px;height:36px;
  border-radius:var(--r-sm);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  color:var(--muted);
}
html[data-theme="clay"] .load-chat-close:hover{
  color:var(--text-strong);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
}
html[data-theme="clay"] .load-chat-sub,
html[data-theme="clay"] .load-chat-status,
html[data-theme="clay"] .load-chat-item-meta{
  color:var(--muted);
}
html[data-theme="clay"] .load-chat-status.err{color:var(--err, var(--bad))}
html[data-theme="clay"] .load-chat-list{gap:10px;padding:4px 14px 18px}
html[data-theme="clay"] .load-chat-item{
  border-radius:var(--r-md);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  transition:box-shadow .18s var(--ease),transform .28s var(--spring);
}
html[data-theme="clay"] .load-chat-item:hover{
  transform:translateY(-1px);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
}
html[data-theme="clay"] .load-chat-item:active{
  transform:translateY(1px);
  box-shadow:var(--inset-sm);
}
html[data-theme="clay"] .load-chat-item.is-current{
  box-shadow:var(--accent-raise);
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  background-image:linear-gradient(145deg,var(--accent-soft),var(--accent));
}
html[data-theme="clay"] .load-chat-item.is-current .load-chat-item-preview{
  color:var(--on-accent);
}
html[data-theme="clay"] .load-chat-item.is-current .load-chat-item-meta{
  color:color-mix(in srgb,var(--on-accent) 72%,transparent);
}
html[data-theme="clay"] .load-chat-item-preview{color:var(--text-strong);font-weight:600}

/* ---- /context viewer ---- */
html[data-theme="clay"] .context-view-dialog{
  background:
    radial-gradient(120% 80% at 50% 0%,color-mix(in srgb,var(--accent) 28%,transparent),transparent 58%),
    color-mix(in srgb,var(--bg) 62%,rgba(20,22,28,.38)) !important;
}
html[data-theme="clay"] .context-view-panel{
  border:none !important;
  border-radius:var(--r-lg);
  background-image:
    linear-gradient(180deg,color-mix(in srgb,var(--accent-soft) 70%,var(--surface-hi)) 0,var(--surface) 88px),
    linear-gradient(145deg,var(--surface-hi),var(--surface) 72%) !important;
  box-shadow:
    var(--raise-lg),
    0 0 0 3px color-mix(in srgb,var(--accent) 55%,transparent) !important;
}
html[data-theme="clay"] .context-view-title{
  color:var(--accent-deep);
  font-weight:650;
}
html[data-theme="clay"] .context-view-close{
  background:color-mix(in srgb,var(--on-accent) 16%,transparent);
  background-image:none;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--on-accent) 26%,transparent);
  color:var(--on-accent);
}
html[data-theme="clay"] .context-view-close:hover{
  color:var(--on-accent);
  background:color-mix(in srgb,var(--on-accent) 26%,transparent);
}
html[data-theme="clay"] .context-view-sub,
html[data-theme="clay"] .context-view-status,
html[data-theme="clay"] .context-view-section h3,
html[data-theme="clay"] .context-view-empty,
html[data-theme="clay"] .context-view-more,
html[data-theme="clay"] .context-view-index,
html[data-theme="clay"] .context-view-media-meta,
html[data-theme="clay"] .context-view-injected-meta{color:var(--muted)}
html[data-theme="clay"] .context-view-status.err{color:var(--err, var(--bad))}
html[data-theme="clay"] .context-view-stats li{
  background:var(--surface-2);
  box-shadow:var(--inset-sm);
}
html[data-theme="clay"] .context-view-stats strong{color:var(--text-strong)}
html[data-theme="clay"] .context-view-pre{
  background:var(--surface-2);
  box-shadow:var(--inset);
  color:var(--text-strong);
  border-radius:var(--r-md);
}
html[data-theme="clay"] .context-view-list li{
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  border-radius:var(--r-sm);
}
html[data-theme="clay"] .context-view-badge{color:var(--accent-deep)}
html[data-theme="clay"] .context-view-foot{
  box-shadow:inset 0 2px 0 color-mix(in srgb,var(--accent) 55%,transparent);
}
html[data-theme="clay"] .context-view-settings{
  border:none;
  border-radius:var(--r-md);
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  color:var(--on-accent);
  box-shadow:var(--accent-raise);
  font-weight:600;
}
@media (max-width:640px){
  html[data-theme="clay"] .context-view-dialog{padding:0}
  html[data-theme="clay"] .context-view-panel{
    border-radius:0;
    box-shadow:none !important;
    height:100%;
    height:100dvh;
    max-height:none;
  }
}

@media (max-width:640px){
  html[data-theme="clay"] .br-bar{
    gap:8px;
    padding:8px 10px 12px;
    min-height:52px;
  }
  html[data-theme="clay"] .br-nav-btn{
    width:36px;height:36px;
    border-radius:12px;
  }
  html[data-theme="clay"] .br-input{
    padding:10px 14px;
    font-size:13px;
  }
  html[data-theme="clay"] .br-tab{
    height:32px;
    min-width:72px;
    max-width:140px;
  }
  html[data-theme="clay"] .br-content{
    margin:0 8px 8px;
  }
}

@media (max-width:640px){
  html[data-theme="clay"] .chat-input,
  html[data-theme="clay"] .chat-wrap--empty:not(.chat-wrap--talk) .chat-input{
    padding:10px 12px 8px;
    gap:6px;
  }
  html[data-theme="clay"] .chat-input textarea,
  html[data-theme="clay"] .chat-input input,
  html[data-theme="clay"] .chat-wrap--empty .chat-input textarea,
  html[data-theme="clay"] .chat-wrap:not(.chat-wrap--empty) .chat-input textarea{
    min-height:36px;
    max-height:120px;
    padding:4px 2px 2px;
  }
  html[data-theme="clay"] .chat-input-actions{
    gap:5px;
  }
  html[data-theme="clay"] .chat-input-actions > .chat-icon-btn,
  html[data-theme="clay"] .chat-input-actions > .btn.chat-icon-btn{
    width:28px;height:28px;min-width:28px;min-height:28px;
    border-radius:10px;
  }
  html[data-theme="clay"] .chat-icon{
    width:15px;height:15px;
  }
  html[data-theme="clay"] .chat-icon svg{
    width:15px;height:15px;
  }
}

/* ---- Mail ---- */
html[data-theme="clay"] .main:has(.mail-page){
  background:transparent;
}
html[data-theme="clay"] .mail-side{
  border-right:none;
  background:var(--surface);
  background-image:linear-gradient(180deg,var(--surface-hi),var(--surface) 40%);
  box-shadow:inset -1px 0 0 color-mix(in srgb,var(--dark) 28%,transparent);
}
html[data-theme="clay"] .mail-compose-btn{
  border:none !important;
  background:linear-gradient(145deg,var(--accent-soft),var(--accent)) !important;
  background-image:linear-gradient(145deg,var(--accent-soft),var(--accent)) !important;
  box-shadow:var(--accent-raise);
  color:var(--on-accent) !important;
  border-radius:var(--r-pill);
  transition:transform .28s var(--spring),box-shadow .18s var(--ease);
}
html[data-theme="clay"] .mail-compose-btn:hover{
  transform:translateY(-1px);
  filter:none;
}
html[data-theme="clay"] .mail-compose-btn:active{
  transform:translateY(1px);
  box-shadow:var(--accent-inset);
}
html[data-theme="clay"] .mail-account-pick{
  border:none !important;
  border-radius:var(--r-md);
  background:var(--surface-2) !important;
  box-shadow:var(--inset-sm);
  color:var(--text-strong);
}
html[data-theme="clay"] .mail-folder{
  border-radius:var(--r-md);
  transition:box-shadow .18s var(--ease),background .18s,transform .28s var(--spring);
}
html[data-theme="clay"] .mail-folder:hover{
  background:var(--surface-2);
  box-shadow:var(--inset-sm);
}
html[data-theme="clay"] .mail-folder.active{
  background:linear-gradient(145deg,var(--accent-soft),color-mix(in srgb,var(--accent) 55%,var(--surface)));
  background-image:linear-gradient(145deg,var(--accent-soft),color-mix(in srgb,var(--accent) 55%,var(--surface)));
  box-shadow:var(--accent-raise);
  color:var(--on-accent);
}
html[data-theme="clay"] .mail-folder.active .mail-folder-icon,
html[data-theme="clay"] .mail-folder.active .mail-folder-count{
  color:var(--on-accent);
}
html[data-theme="clay"] .mail-folder-name{color:inherit}
html[data-theme="clay"] .mail-folder:not(.active) .mail-folder-name{color:var(--text-strong)}
html[data-theme="clay"] .mail-home-link .mail-folder-name{color:var(--text-strong)}
html[data-theme="clay"] .mail-side-sep{
  background:color-mix(in srgb, var(--dark) 22%, transparent);
}
html[data-theme="clay"] .mail-side-group{color:var(--muted)}
html[data-theme="clay"] .mail-mini{
  border-radius:var(--r-sm);
  color:var(--muted);
}
html[data-theme="clay"] .mail-mini:hover{
  background:var(--surface-2);
  box-shadow:var(--inset-sm);
  color:var(--text-strong);
}
html[data-theme="clay"] .mail-toolbar{
  border-bottom:none;
  box-shadow:inset 0 -1px 0 color-mix(in srgb,var(--dark) 28%,transparent);
  background:transparent;
}
html[data-theme="clay"] .mail-search{
  border:none !important;
  background:var(--surface-2) !important;
  box-shadow:var(--inset);
  color:var(--text-strong);
}
html[data-theme="clay"] .mail-search:focus{
  background:var(--surface) !important;
  box-shadow:var(--inset),0 0 0 3px var(--accent-soft);
}
html[data-theme="clay"] .mail-icon-btn{
  border:none !important;
  border-radius:var(--r-sm);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  color:var(--text);
  transition:transform .28s var(--spring),box-shadow .18s var(--ease),color .18s;
}
html[data-theme="clay"] .mail-icon-btn:hover{
  transform:translateY(-1px);
  color:var(--text-strong);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
}
html[data-theme="clay"] .mail-icon-btn:active{
  transform:translateY(1px);
  box-shadow:var(--inset-sm);
}
html[data-theme="clay"] .mail-icon-btn:disabled{
  opacity:.4;
  transform:none;
  box-shadow:var(--raise-sm);
}
html[data-theme="clay"] .mail-icon-btn.danger:hover{color:var(--err, var(--bad))}
html[data-theme="clay"] .mail-tool{
  border:none !important;
  border-radius:var(--r-sm);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  color:var(--text);
}
html[data-theme="clay"] .mail-tool:hover{
  color:var(--text-strong);
  transform:translateY(-1px);
}
html[data-theme="clay"] .mail-tool.danger{color:var(--err, var(--bad))}
html[data-theme="clay"] .mail-count{color:var(--muted)}
html[data-theme="clay"] .mail-row{
  border-bottom:none;
  box-shadow:inset 0 -1px 0 color-mix(in srgb,var(--dark) 18%,transparent);
}
html[data-theme="clay"] .mail-row:hover{
  background:var(--surface-2);
}
html[data-theme="clay"] .mail-row.unread{
  background:color-mix(in srgb,var(--accent-soft) 55%,transparent);
}
html[data-theme="clay"] .mail-row.sel{
  background:color-mix(in srgb,var(--accent) 18%,var(--surface));
}
html[data-theme="clay"] .mail-from,
html[data-theme="clay"] .mail-subject{color:var(--text)}
html[data-theme="clay"] .mail-row.unread .mail-from,
html[data-theme="clay"] .mail-row.unread .mail-subject{color:var(--text-strong)}
html[data-theme="clay"] .mail-snippet,
html[data-theme="clay"] .mail-date{color:var(--muted)}
html[data-theme="clay"] .mail-star{color:var(--muted)}
html[data-theme="clay"] .mail-star.on{color:#c9a227}
html[data-theme="clay"] .mail-badge{
  border:none;
  background:var(--surface-2);
  box-shadow:var(--inset-sm);
  color:var(--muted);
}
html[data-theme="clay"] .mail-badge.ai{
  background:var(--accent-soft);
  color:var(--accent-deep);
}
html[data-theme="clay"] .mail-empty{color:var(--muted)}
html[data-theme="clay"] .mail-empty a{color:var(--accent-deep)}
html[data-theme="clay"] .mail-subject-line{color:var(--text-strong)}
html[data-theme="clay"] .mail-msg{
  border:none;
  border-radius:var(--r-lg);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 78%);
  box-shadow:var(--raise);
}
html[data-theme="clay"] .mail-msg-head{
  border-bottom:none;
  box-shadow:inset 0 -1px 0 color-mix(in srgb,var(--dark) 22%,transparent);
}
html[data-theme="clay"] .mail-msg-from{color:var(--text-strong)}
html[data-theme="clay"] .mail-attach{
  border-top:none;
  box-shadow:inset 0 1px 0 color-mix(in srgb,var(--dark) 22%,transparent);
}
html[data-theme="clay"] .mail-attach a{
  border:none;
  border-radius:var(--r-sm);
  background:var(--surface-2);
  box-shadow:var(--inset-sm);
  color:var(--text);
}
html[data-theme="clay"] .mail-attach a:hover{color:var(--accent-deep)}
html[data-theme="clay"] .mail-composer{
  border:none;
  border-radius:var(--r-lg);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 78%);
  box-shadow:var(--raise-lg);
}
html[data-theme="clay"] .mail-composer-head,
html[data-theme="clay"] .mail-composer-foot{
  border-color:transparent;
  box-shadow:inset 0 -1px 0 color-mix(in srgb,var(--dark) 22%,transparent);
}
html[data-theme="clay"] .mail-composer-foot{
  box-shadow:inset 0 1px 0 color-mix(in srgb,var(--dark) 22%,transparent);
}
html[data-theme="clay"] .mail-composer-head{color:var(--text-strong)}
html[data-theme="clay"] .mail-field{
  border-bottom-color:color-mix(in srgb,var(--dark) 22%,transparent);
}
html[data-theme="clay"] .mail-send{
  border:none !important;
  background:linear-gradient(145deg,var(--accent-soft),var(--accent)) !important;
  color:var(--on-accent) !important;
  box-shadow:var(--accent-raise);
}
html[data-theme="clay"] .mail-toast{
  background:var(--surface);
  color:var(--text-strong);
  box-shadow:var(--raise-lg);
  border-radius:var(--r-md);
}
html[data-theme="clay"] .mail-contact-dialog{
  background:color-mix(in srgb, var(--bg) 70%, rgba(20,22,28,.32));
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html[data-theme="clay"] .mail-contact-panel{
  border:none;
  border-radius:var(--r-lg);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 78%);
  box-shadow:var(--raise-lg);
}
html[data-theme="clay"] .mail-contact-panel h3{color:var(--text-strong)}
html[data-theme="clay"] .mail-contact-field input{
  border:none !important;
  border-radius:var(--r-md);
  background:var(--surface-2);
  box-shadow:var(--inset);
  color:var(--text-strong);
}
html[data-theme="clay"] .mail-contact-field input:focus{
  outline:none;
  background:var(--surface);
  box-shadow:var(--inset),0 0 0 3px var(--accent-soft);
}
html[data-theme="clay"] .mail-side-toggle-icon{color:var(--muted)}
html[data-theme="clay"] .mail-side-section--collapsible:not(.is-collapsed) .mail-side-toggle-icon{
  color:var(--accent-deep);
}

@media (max-width:820px){
  html[data-theme="clay"] .mail-side{
    background:var(--surface);
    background-image:none;
  }
  html[data-theme="clay"] .mail-composer{
    border-radius:0;
    box-shadow:none;
    background:var(--bg);
    background-image:none;
  }
}

/* ---- Screen saver dock ---- */
html[data-theme="clay"] .screensaver-dock-wrap{
  max-width:min(94vw,680px);
}
html[data-theme="clay"] .screensaver-dock-toggle{
  border:none !important;
  border-radius:14px 14px 0 0;
  background:rgba(8,10,14,.42);
  background-image:none;
  box-shadow:none;
  color:rgba(255,255,255,.55);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  width:56px;height:26px;
  transition:color .18s var(--ease),background .18s var(--ease),opacity .22s ease;
}
html[data-theme="clay"] .screensaver-dock-toggle:hover{
  color:rgba(255,255,255,.9);
  background:rgba(8,10,14,.58);
  background-image:none;
  box-shadow:none;
}
html[data-theme="clay"] .screensaver-dock-wrap.is-collapsed .screensaver-dock-toggle{
  opacity:.28;
  border-radius:14px;
}
html[data-theme="clay"] .screensaver-dock-wrap.is-collapsed .screensaver-dock-toggle:hover{
  opacity:1;
}
html[data-theme="clay"] .screensaver-dock{
  border:none !important;
  border-radius:var(--r-lg) var(--r-lg) 0 0;
  background:rgba(8,10,14,.48);
  background-image:none;
  box-shadow:none;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  padding:10px 12px 12px;
  gap:10px;
  max-height:140px;
}
html[data-theme="clay"] .screensaver-dock-modes{
  border:none;
  border-radius:var(--r-md);
  background:rgba(0,0,0,.28);
  box-shadow:none;
  padding:4px;
  gap:4px;
  flex-wrap:wrap;
  justify-content:center;
}
html[data-theme="clay"] .screensaver-dock-actions{
  gap:6px;
}
html[data-theme="clay"] .screensaver-dock-btn{
  border:none;
  border-radius:var(--r-sm);
  color:rgba(255,255,255,.62);
  font-weight:600;
  padding:8px 12px;
  background:transparent;
  box-shadow:none;
  transition:color .18s,background .18s;
}
html[data-theme="clay"] .screensaver-dock-btn.mode{padding:8px 11px}
html[data-theme="clay"] .screensaver-dock-btn:hover{
  color:rgba(255,255,255,.95);
  background:rgba(255,255,255,.1);
  background-image:none;
  box-shadow:none;
  transform:none;
}
html[data-theme="clay"] .screensaver-dock-btn.active{
  color:#fff;
  background:rgba(255,255,255,.16);
  background-image:none;
  box-shadow:none;
}
html[data-theme="clay"] .screensaver-dock-btn.active:hover{
  color:#fff;
  background:rgba(255,255,255,.2);
  background-image:none;
  box-shadow:none;
  transform:none;
}
html[data-theme="clay"] .screensaver-dock-btn.action{
  border:none;
  background:rgba(255,255,255,.06);
  background-image:none;
  box-shadow:none;
  color:rgba(255,255,255,.78);
}
html[data-theme="clay"] .screensaver-dock-btn.action:hover{
  color:#fff;
  box-shadow:none;
  background:rgba(255,255,255,.12);
  background-image:none;
}
html[data-theme="clay"] .screensaver-dock-btn.action.active{
  color:#fff;
  background:rgba(255,255,255,.18);
  background-image:none;
  box-shadow:none;
}
html[data-theme="clay"] .screensaver-dock-btn--exit:hover{
  color:#ff8e8e;
  background:rgba(255,80,80,.14);
  box-shadow:none;
  transform:none;
}
html[data-theme="clay"] .screensaver-dock-sep{
  width:1px;min-height:28px;border-radius:1px;
  background:rgba(255,255,255,.14);
  box-shadow:none;
}html[data-theme="clay"] .screensaver-unlock{
  background:
    radial-gradient(120% 90% at 0% 0%,var(--room-light),transparent 62%),
    radial-gradient(120% 90% at 100% 100%,var(--room-shade),transparent 62%),
    color-mix(in srgb, var(--bg) 88%, rgba(20,22,28,.45));
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html[data-theme="clay"] .screensaver-unlock-wrap{
  pointer-events:auto;
}
html[data-theme="clay"] .screensaver-settings{
  border:none !important;
  border-radius:var(--r-lg) var(--r-lg) 0 0;
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 78%);
  box-shadow:var(--raise-lg);
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
html[data-theme="clay"] .screensaver-settings-head{
  border-bottom:none;
  box-shadow:inset 0 -1px 0 color-mix(in srgb,var(--dark) 28%,transparent);
}
html[data-theme="clay"] .screensaver-settings-title{color:var(--text-strong)}
html[data-theme="clay"] .screensaver-settings-close{
  border:none;
  border-radius:var(--r-sm);
  color:var(--muted);
  background:transparent;
}
html[data-theme="clay"] .screensaver-settings-close:hover{
  color:var(--text-strong);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
}
html[data-theme="clay"] .screensaver-settings-label{color:var(--muted)}
html[data-theme="clay"] .screensaver-settings-label output{color:var(--text-strong)}
html[data-theme="clay"] .screensaver-segment{
  border:none;
  border-radius:var(--r-md);
  background:var(--surface-2);
  box-shadow:var(--inset-sm);
  padding:4px;
}
html[data-theme="clay"] .screensaver-segment-btn{
  border:none;
  border-radius:var(--r-sm);
  color:var(--muted);
  background:transparent;
}
html[data-theme="clay"] .screensaver-segment-btn:hover{color:var(--text-strong)}
html[data-theme="clay"] .screensaver-segment-btn.active{
  color:var(--on-accent);
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  box-shadow:var(--accent-raise);
}
html[data-theme="clay"] .screensaver-settings-row--action{
  border-top:none;
  box-shadow:inset 0 1px 0 color-mix(in srgb,var(--dark) 28%,transparent);
}
html[data-theme="clay"] .screensaver-settings-advanced{
  border:none !important;
  border-radius:var(--r-md);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
  box-shadow:var(--raise-sm);
  color:var(--text);
}
html[data-theme="clay"] .screensaver-settings-advanced:hover{
  color:var(--text-strong);
  box-shadow:var(--raise);
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface) 70%);
}
html[data-theme="clay"] .screensaver-settings-switch-ui{
  border:none;
  background:var(--surface-2);
  box-shadow:var(--inset-sm);
}
html[data-theme="clay"] .screensaver-settings-switch-ui::before{
  background:var(--surface);
  background-image:linear-gradient(145deg,var(--surface-hi),var(--surface));
  box-shadow:var(--raise-sm);
}
html[data-theme="clay"] .screensaver-settings-switch input:checked + .screensaver-settings-switch-ui{
  background:linear-gradient(145deg,var(--accent-soft),var(--accent));
  box-shadow:var(--accent-raise);
}
html[data-theme="clay"] .screensaver-settings-switch input:checked + .screensaver-settings-switch-ui::before{
  background:var(--on-accent);
  box-shadow:none;
}

@media (max-width:560px){
  html[data-theme="clay"] .screensaver-dock{
    border-radius:var(--r-lg) var(--r-lg) 0 0;
    max-height:220px;
  }
  html[data-theme="clay"] .screensaver-dock-sep{
    width:auto;height:2px;min-height:0;
  }
}

@media (prefers-reduced-motion:reduce){
  html[data-theme="clay"] .btn,
  html[data-theme="clay"] .seg button,
  html[data-theme="clay"] .el-toggle-ui::before,
  html[data-theme="clay"] .cz-theme-card,
  html[data-theme="clay"] .sidebar nav a,
  html[data-theme="clay"] .mail-compose-btn,
  html[data-theme="clay"] .mail-icon-btn,
  html[data-theme="clay"] .mail-folder,
  html[data-theme="clay"] .screensaver-dock-btn,
  html[data-theme="clay"] .screensaver-dock-toggle,
  html[data-theme="clay"] .login-card .btn{
    transition:none !important;
  }
}
