/* © 2026 Wannlabs. wl-app-theme.css: the signed-in apps (/app dashboard, /chat, /meet, /calendar, /calendar/book)
   on the home-page look, using the shared tokens in /assets/wl-theme.css (load that first).
   Hand-written part: dark nav + footer chrome, no ambient video. Generated part (below): colour-only overrides of
   site/dash/dash-nav/app-mobile/drive/admin/chat/meet/calendar/book.css, made by sites/wannlabs/theme/gen.py.
   Not styled here on purpose: sign-in and loading screens (SSO job), Ask Emma (themes itself from html[data-theme]). */
html{background:var(--wl-bg)!important;color-scheme:light}
body{background:var(--wl-bg)!important;color:var(--wl-ink);text-shadow:none!important}
.scene,.mood{display:none!important}
body>nav{background:var(--wl-chrome)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border-bottom:1px solid var(--wl-chrome-line)!important;color:var(--wl-chrome-ink)}
body>nav,.sn-drawer,.sn-layer,.sn-mega,wl-apps,.wlu-m{--ink:var(--wl-chrome-ink);--mut:#d6cdc4;--dim:#d0c6bc;--e1:#ffb36b;--line:rgba(255,240,225,.09);--glass:rgba(255,245,235,.045)}
body>nav a,body>nav .brand{color:var(--wl-chrome-ink)}
body>nav .links,body>nav .links a{color:#efe4d9}
body>nav .links a:hover,body>nav .links a[aria-current]{color:#fff}
:root body>nav .btn.pri{background:var(--wl-chrome-acc)!important;color:var(--wl-chrome-on-acc)!important;box-shadow:none!important}
:root body>nav .btn.gho{background:transparent!important;border:1px solid rgba(255,255,255,.22)!important;color:var(--wl-chrome-ink)!important}
body>nav wl-auth-cta .wlg-pri{color:var(--wl-chrome-on-acc)}
body>nav a:focus-visible,body>nav button:focus-visible{outline:2px solid var(--wl-chrome-focus);outline-offset:2px}
@media (max-width:480px){body>nav wl-auth-cta [data-wlg=login],body>nav .navsignin{display:none!important}body>nav .navr{gap:6px!important}}
body>footer{background:var(--wl-chrome);color:var(--wl-chrome-mut);border-top:0!important}
body>footer a,body>footer .brand{color:var(--wl-chrome-ink)}
body>footer .fg h5,body>footer .fg .fh{color:var(--wl-chrome-head)}
body>footer .fg a{color:#e9ded3}
body>footer p,body>footer .fb{color:var(--wl-chrome-mut)!important;border-color:var(--wl-chrome-line-2)!important}
:root button, :root .btn {
  font-family: inherit;
  -webkit-appearance: none;
  appearance: none;
}
:root .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 999px;
  font-weight: 600;
  border: 1px solid transparent;
  cursor: pointer;
  text-decoration: none;
  transition: transform .15s ease, background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
:root .btn-sm {
  padding: 8px 16px;
  font-size: 13.5px;
}
:root:not([data-theme="dark"]):not([data-mood="porch"]):not([data-wl-mood="porch"]):not(.dark) .btn:not(.pri):not(.gho):not(.mintbtn) {
  background: #ffffff;
  border: 1.5px solid var(--wl-line-2);
  color: var(--wl-ink);
  box-shadow: 0 1px 2px rgba(28,19,13,.04);
}
:root:not([data-theme="dark"]):not([data-mood="porch"]):not([data-wl-mood="porch"]):not(.dark) .btn:not(.pri):not(.gho):not(.mintbtn):hover {
  background: var(--wl-soft-2);
  border-color: var(--wl-acc);
  color: var(--wl-acc-2);
}
:root .btn.pri, :root .pri {
  background: linear-gradient(135deg, #ff8c42, #e84c2a) !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 4px 14px rgba(232,76,42,.28) !important;
}
:root .btn.pri:hover, :root .pri:hover {
  background: linear-gradient(135deg, #ff9b58, #ec5736) !important;
  box-shadow: 0 6px 18px rgba(232,76,42,.38) !important;
  transform: translateY(-1px);
}
:root:not([data-theme="dark"]):not([data-mood="porch"]):not([data-wl-mood="porch"]):not(.dark) .btn.gho,
:root:not([data-theme="dark"]):not([data-mood="porch"]):not([data-wl-mood="porch"]):not(.dark) .gho {
  background: #ffffff !important;
  border: 1.5px solid var(--wl-line-2) !important;
  color: var(--wl-ink) !important;
  box-shadow: 0 1px 2px rgba(28,19,13,.04);
}
:root:not([data-theme="dark"]):not([data-mood="porch"]):not([data-wl-mood="porch"]):not(.dark) .btn.gho:hover,
:root:not([data-theme="dark"]):not([data-mood="porch"]):not([data-wl-mood="porch"]):not(.dark) .gho:hover {
  background: var(--wl-soft-2) !important;
  border-color: var(--wl-acc-2) !important;
  color: var(--wl-acc-2) !important;
}
:root .btn:disabled {
  opacity: .6;
  cursor: default;
  transform: none !important;
  box-shadow: none !important;
}
:focus-visible{outline-color:var(--wl-focus)}
/* dashboard sidebar: active item in the Ember accent */
:root .dside{border:1px solid var(--wl-line);box-shadow:var(--wl-shadow)}
:root .dside a[aria-current=page],:root .dside a[aria-selected=true]{background:var(--wl-soft)!important;color:var(--wl-acc-2)!important}
:root .dside a[aria-current=page]::before{background:var(--wl-acc)}
/* chat text the multi-AI job styles for a dark page: keep it readable on light (links, inline code) */
:root .wc-msg a{color:var(--wl-acc-2)}
:root .wc-msg code{background:var(--wl-soft)}
/* links inside sentences are underlined, not colour-only */
:root main p a:not(.btn),:root #dmain p a:not(.btn),:root .hint a,:root .wl-meetpage main li>a{text-decoration:underline;text-underline-offset:2px}
:root .empty a{text-decoration:underline;text-underline-offset:2px}
/* from site.css */
:root:root{--bg:var(--wl-bg);--ink:var(--wl-ink);--mut:var(--wl-mut);--dim:var(--wl-mut);--line:var(--wl-line);--glass:var(--wl-card)}
:root body{background:var(--wl-bg)}
:root body.prime-page{background:var(--wl-bg)}
:root .eyebrow{color:var(--wl-acc-2)}
:root .pri{box-shadow:inset 0 0 0 1px rgba(194,65,12,.28),0 10px 30px -8px rgba(194,65,12,.28)}
:root .gho{background:var(--wl-card);backdrop-filter:none}
:root .gho:hover{background:var(--wl-soft-2)}
:root .mintbtn{box-shadow:var(--wl-shadow)}
:root .lead{color:var(--wl-mut)}
:root .shot{border:1px solid var(--wl-line);box-shadow:var(--wl-shadow);background:var(--wl-card)}
:root .card{background:var(--wl-soft-2);box-shadow:var(--wl-shadow)}
:root a.card:hover{border-color:var(--wl-line-2)}
:root .ic{background:var(--wl-soft);border:1px solid var(--wl-line-2);color:var(--wl-acc-2)}
:root .prime-page .ic{background:var(--wl-soft-2);border-color:var(--wl-line-2)}
:root summary:after{color:var(--wl-acc-2)}
:root .final:before{background:var(--wl-soft)}
:root .prime-page .final:before{background:var(--wl-soft)}
:root .search{background:var(--wl-soft-2);border:1px solid var(--wl-line-2)}
:root .lesson:hover{border-color:var(--wl-line-2);background:var(--wl-soft-2)}
:root .num{background:var(--wl-soft-2)}
:root .bar{background:var(--wl-soft-2)}
:root .prose p,:root .prose li{color:var(--wl-mut)}
:root .prose img{box-shadow:var(--wl-shadow)}
:root .prose blockquote{background:var(--wl-soft-2);border:1px solid var(--wl-line-2);color:var(--wl-mut)}
:root .next a:hover{border-color:var(--wl-line-2)}
:root .next .n{background:var(--wl-soft);border-color:var(--wl-line-2)}
:root .draftnote{color:var(--wl-acc-2);background:var(--wl-soft-2);border:1px solid var(--wl-line-2)}
:root .plan{background:var(--wl-soft-2)}
:root .plan.best{background:var(--wl-soft);border-color:var(--wl-line-2);box-shadow:var(--wl-shadow)}
:root .draft{color:var(--wl-acc-2);border:1px solid var(--wl-line-2)}
:root .plan li{color:var(--wl-mut)}
:root .cmp thead th{background:var(--wl-card)}
:root .cmp td.us{background:var(--wl-soft-2)}
:root .calc{background:var(--wl-soft-2);border:1px solid var(--wl-line-2)}
:root .fields input,:root .fields select{background:var(--wl-card);border:1px solid var(--wl-line)}
:root .fields input:focus,:root .fields select:focus{box-shadow:0 0 0 4px rgba(194,65,12,.28)}
:root .fields select option{background:var(--wl-card)}
:root .out div{background:var(--wl-card)}
:root .out .tot{background:var(--wl-soft);border-color:var(--wl-line-2)}
:root .pill2{color:var(--wl-acc-2);border:1px solid var(--wl-line-2);background:var(--wl-soft-2)}
:root .primeprice{background:var(--wl-soft);border:1px solid var(--wl-line-2)}
:root .pbadge2{color:var(--wl-ink);background:var(--wl-soft-2);border:1px solid var(--wl-line-2)}
:root .pp{background:var(--wl-card);border:1px solid var(--wl-line-2)}
:root .pp li{color:var(--wl-mut)}
:root .legal h2{color:var(--wl-ink)}
:root .legal p,:root .legal li{color:var(--wl-mut)}
:root .legal a{color:var(--wl-acc-2)}
:root .sd{background:var(--wl-soft);backdrop-filter:none;-webkit-backdrop-filter:none;border:1px solid var(--wl-line-2);box-shadow:var(--wl-shadow)}
:root .sdn{color:var(--wl-ink)}
:root .sdl{color:var(--wl-ink)}
:root .sdq{background:var(--wl-card);border:1px solid var(--wl-line);color:var(--wl-ink)}
:root .sdq:hover{border-color:var(--wl-line-2)}
:root .sdq svg{color:var(--wl-acc-2)}
:root body{text-shadow:none}
:root .card,:root details,:root .lesson{background-color:var(--wl-card)!important;-webkit-backdrop-filter:none;backdrop-filter:none}
:root .price+.yr{color:var(--wl-ink)}
:root:root,:root [data-wl-mood=off]{--wl-mood-tint:var(--wl-card);--wl-mood-edge:var(--wl-line)}
:root [data-wl-mood=beach]{--wl-mood-tint:var(--wl-soft-2);--wl-mood-edge:var(--wl-line-2)}
:root [data-wl-mood=porch]{--wl-mood-tint:var(--wl-soft-2);--wl-mood-edge:var(--wl-line)}
html:root{background:var(--wl-bg)}
:root .legal{background:var(--wl-card);border:1px solid var(--wl-line);backdrop-filter:none;-webkit-backdrop-filter:none}
/* from dash.css */
:root .dside{background:var(--wl-card);backdrop-filter:none;-webkit-backdrop-filter:none;border:1px solid var(--wl-line)}
:root .dside a{color:var(--wl-ink)}
:root .dside a:hover{background:var(--wl-soft-2)}
:root .dside a[aria-current=page]{background:var(--wl-soft);color:var(--wl-ink)}
:root .dme{border-bottom:1px solid var(--wl-line)}
:root #dwho{color:var(--wl-ink)}
:root #dout{color:var(--wl-ink)}
:root #dout:hover{background:var(--wl-soft-2);color:var(--wl-ink)}
:root .dh{text-shadow:none}
:root .dsub{color:var(--wl-ink);text-shadow:none}
:root .dsub2{color:var(--wl-ink)}
:root .tile{color:var(--wl-ink);background:var(--wl-card);backdrop-filter:none;-webkit-backdrop-filter:none;border:1px solid var(--wl-line);box-shadow:var(--wl-shadow)}
:root .tile:hover{border-color:var(--wl-line-2)}
:root .tile span{color:var(--wl-ink)}
:root .tile em{color:var(--wl-acc-2)}
:root .ti{color:var(--wl-ink)}
:root .dsech a{color:var(--wl-acc-2)}
:root .proj{color:var(--wl-ink);background:var(--wl-card);backdrop-filter:none;-webkit-backdrop-filter:none;border:1px solid var(--wl-line)}
:root .proj:hover{border-color:var(--wl-line-2)}
:root .proj span:last-child{color:var(--wl-ink)}
:root .pdot{box-shadow:var(--wl-shadow)}
:root .card{background:var(--wl-card);backdrop-filter:none;-webkit-backdrop-filter:none;border:1px solid var(--wl-line)}
:root .drow{border-bottom:1px solid var(--wl-line)}
:root .drow>div:first-child span{color:var(--wl-ink)}
:root .inl input{border:1px solid var(--wl-line);background:var(--wl-card);color:var(--wl-ink)}
:root .inl input:focus{outline:2px solid var(--wl-focus)}
:root .seg{background:var(--wl-card);border:1px solid var(--wl-line)}
:root .seg button{color:var(--wl-ink)}
:root .seg button[aria-pressed=true]{background:var(--wl-soft);color:var(--wl-ink)}
:root .pill{background:var(--wl-soft-2);color:var(--wl-ink)}
:root .pill.ok{background:var(--wl-soft);color:#1d7256}
:root .btn.danger{background:var(--wl-soft);color:var(--wl-acc-2);border:1px solid var(--wl-line-2)}
:root .lbl{color:var(--wl-ink)}
:root .bar{background:var(--wl-soft-2)}
:root .bnote{color:var(--wl-ink)}
:root .grant{border-top:1px solid var(--wl-line)}
:root .grant span{color:var(--wl-ink)}
:root .empty{color:var(--wl-ink)}
:root .empty a{color:var(--wl-acc-2)}
:root .dtoast{background:var(--wl-card);backdrop-filter:none;-webkit-backdrop-filter:none;border:1px solid var(--wl-line);color:var(--wl-ink)}
:root .dtoast.bad{border-color:var(--wl-line-2)}
:root .tlinks a{color:var(--wl-acc-2)}
:root .tlinks a+a{color:var(--wl-acc-2)}
:root .welcome{background:var(--wl-soft);border:1px solid var(--wl-line-2)}
:root .welcome p{color:var(--wl-ink)}
:root .plansel a,:root .plansel div{background:var(--wl-soft-2);border:1px solid var(--wl-line);color:var(--wl-ink)}
:root .plansel span{color:var(--wl-ink)}
/* from dash-nav.css */
:root .dside{background:var(--wl-card)}
:root .dside a{color:var(--wl-ink)}
:root .dside a[aria-current=page],:root .dside a[aria-selected=true]{background:var(--wl-soft);color:var(--wl-ink)}
@media (hover:hover){:root .dside a:hover{background:var(--wl-soft-2)}:root .dside a[aria-current=page]:hover{background:var(--wl-soft)}}
:root .dside a:focus-visible,:root .adm-dd:focus-visible,:root .wls-b:focus-visible{outline:2px solid var(--wl-focus)}
:root .adm-nav{border-top:1px solid var(--wl-line)}
:root .adm-nav .adm-h{color:var(--wl-mut)}
@media (max-width:767px){:root .dside{box-shadow:var(--wl-shadow);background:var(--wl-card)}:root .adm-nav{border-left:1px solid var(--wl-line)!important}:root .adm-dd{color:var(--wl-ink)}:root .adm-nav.open .adm-dd,:root .adm-nav.cur .adm-dd{background:var(--wl-soft);color:var(--wl-ink)}:root .adm-menu{background:var(--wl-card);border:1px solid var(--wl-line);box-shadow:var(--wl-shadow)}:root .adm-menu a{color:var(--wl-ink)}:root .adm-menu a:hover,:root .adm-menu a:focus-visible{background:var(--wl-soft-2)}:root .adm-menu a[aria-current=page]{background:var(--wl-soft)}}
:root .wls-b{border:1px solid var(--wl-line);background:var(--wl-card);color:var(--wl-ink)}
:root .wls-m{background:var(--wl-card);border:1px solid var(--wl-line);box-shadow:var(--wl-shadow);color:var(--wl-ink)}
:root .wls-m h2{color:var(--wl-mut)}
/* from app-mobile.css */
@media (max-width:900px){:root .adm-dd{color:var(--wl-ink)}:root .adm-nav.open .adm-dd,:root .adm-dd:hover{background:var(--wl-soft-2)}:root .adm-menu{background:var(--wl-card);border:1px solid var(--wl-line);box-shadow:var(--wl-shadow)}:root .adm-menu a{color:var(--wl-ink)}:root .adm-menu a:hover{background:var(--wl-soft-2)}}
/* from drive.css */
:root .dv-q input{border:1px solid var(--wl-line);background:var(--wl-soft-2)}
:root .dv-drop.dv-over{outline:2px dashed var(--wl-focus)}
:root .dv-meter{background:var(--wl-soft-2)}
:root .dv-prog{background:var(--wl-card);border:1px solid var(--wl-line)}
:root .dv-views [aria-pressed=true]{background:var(--wl-soft);border-color:var(--wl-line-2)}
:root .dv-th{background:var(--wl-soft-2);color:var(--wl-acc-2)}
:root .dv-grid .dv-row{border:1px solid var(--wl-line)}
:root .dv-pv{background:var(--wl-card)}
:root .dv-pv-bar{background:var(--wl-card)}
:root .dv-pv-body pre{background:var(--wl-card);color:var(--wl-ink)}
:root .dv-newbtn{border:1px solid var(--wl-line);background:var(--wl-soft-2)}
:root .dv-newbtn span{color:var(--wl-acc-2)}
:root .dv-newbtn:hover{background:var(--wl-soft)}
:root .dv-newmenu{background:var(--wl-card);border:1px solid var(--wl-line);box-shadow:var(--wl-shadow)}
:root .dv-newmenu button:hover,:root .dv-newmenu button:focus-visible,:root .dv-ctx button:hover,:root .dv-ctx button:focus-visible{background:var(--wl-soft)}
:root .dv-newmenu button:nth-child(2){border-bottom:1px solid var(--wl-line)}
:root .dv-nav-i:hover{background:var(--wl-soft-2)}
:root .dv-nav-i.on{background:var(--wl-soft);color:var(--wl-acc-2)}
:root .dv-ctx{background:var(--wl-card);border:1px solid var(--wl-line);box-shadow:var(--wl-shadow)}
:root .dv-share{border:1px solid var(--wl-line);background:var(--wl-card);color:var(--wl-ink)}
:root .dv-sh-n{color:var(--wl-mut)}
:root .dv-share select,:root .dv-share input[type=password]{border:1px solid var(--wl-line);background:var(--wl-card);color:var(--wl-ink)}
:root .dv-sh-h{color:var(--wl-mut)}
/* from admin.css */
:root .adm-nav{border-top:1px solid var(--wl-line)}
:root .adm-h{color:var(--wl-mut)}
:root .adm-tbl th{color:var(--wl-mut)}
:root .adm-tbl td{border-top:1px solid var(--wl-line)}
:root .adm-tbl td span:not(.pill){color:var(--wl-mut)}
:root .adm-tbl tr[data-uid]:hover td,:root .adm-tbl tr[data-uid]:focus td{background:var(--wl-card)}
:root .adm-lock{background:var(--wl-soft);color:var(--wl-acc-2)}
:root .adm-sum{color:var(--wl-mut)}
@media (max-width:760px){:root .adm-nav{border-left:1px solid var(--wl-line)}}
:root .adm-bar input,:root .adm-pts input{border:1px solid var(--wl-line);background:var(--wl-soft-2);color:var(--wl-ink)}
:root .adm-bar input::placeholder,:root .adm-pts input::placeholder{color:var(--wl-mut)}
/* from chat.css */
:root .wc-side{background:var(--wl-card);border:1px solid var(--wl-line)}
:root .wc-conv:hover,:root .wc-conv[aria-current=true]{background:var(--wl-soft)}
:root .wc-main{background:var(--wl-card);border:1px solid var(--wl-line)}
:root .wc-top{border-bottom:1px solid var(--wl-line);color:var(--mut,var(--wl-mut))}
:root .wc-msg.u{background:var(--wl-soft)}
:root .wc-msg code{background:var(--wl-soft-2)}
:root .wc-code{border:1px solid var(--wl-line);background:var(--wl-card)}
:root .wc-codeh button{border:1px solid var(--wl-line)}
:root .wc-confirm{border:1px solid var(--wl-line-2);background:var(--wl-soft-2)}
:root .wc-thumb{background:var(--wl-soft-2)}
:root .wc-thumb button{background:var(--wl-card);color:var(--wl-ink)}
:root .wc-box{border-top:1px solid var(--wl-line)}
:root .wc-row textarea{border:1px solid var(--wl-line);background:var(--wl-soft-2)}
:root .wc-ib{border:1px solid var(--wl-line);background:var(--wl-card)}
:root .wc-ib.wc-talk{border-radius:50%;background:#1d4ed8!important;color:#fff!important;border-color:transparent!important}
:root .wc-ib.wc-talk:hover{background:#1e40af!important}
:root .wc-ib#wc-send{border-radius:50%;background:#1d4ed8!important;color:#fff!important;border-color:transparent!important;font-size:17px;font-weight:700}
:root .wc-ib#wc-send:hover{background:#1e40af!important}
:root .t-chat .ti{color:#3c008f}
:root #wc-pick{background:var(--wl-soft-2);border:1px solid var(--wl-line)}
:root #wc-pick option,:root #wc-pick optgroup{background:var(--wl-card);color:var(--wl-ink)}
:root #wc-addkey{color:var(--wl-acc-2)}
:root .wc-qi{background:var(--wl-soft-2);border:1px dashed var(--wl-line-2)}
:root .wc-qi input:focus-visible{outline:1px solid var(--wl-focus)}
:root .wc-qi button{border:1px solid var(--wl-line)}
:root .wc-more{color:var(--wl-acc-2)}
:root .wc-meta button[aria-pressed=true]{color:var(--wl-acc-2)}
:root .wlt{background:var(--wl-card);color:var(--wl-ink)}
:root .wlt-top{color:var(--wl-mut)}
:root .wlt-x{background:var(--wl-soft-2);color:var(--wl-ink)}
:root .wlt-x:hover{background:var(--wl-soft)}
:root .wlt-st{color:var(--wl-mut)}
:root .wlt-you{color:#057c8a}
:root .wlt-you span{color:var(--wl-mut)}
:root .wc-shot img{background:var(--wl-card)}
:root .wc-thumb .wc-shotsave{background:var(--wl-card);color:var(--wl-ink)}
:root .wc-md-img img{border-color:var(--wl-line);background:var(--wl-soft-2);box-shadow:var(--wl-shadow)}
:root .wd{background:var(--wl-card);border:1px solid var(--wl-line)}
:root .wd-top{border-bottom:1px solid var(--wl-line)}
:root .wd-b{background:var(--wl-soft-2);border:1px solid var(--wl-line)}
:root .wd-menu{background:var(--wl-card);border:1px solid var(--wl-line);box-shadow:var(--wl-shadow)}
:root .wd-mi:hover,:root .wd-mi:focus-visible{background:var(--wl-soft)}
:root .wd-rbar{background:var(--wl-card)}
:root .wd-h del{background:var(--wl-soft);color:var(--wl-mut)}
:root .wd-h ins{background:var(--wl-soft);color:var(--wl-mut)}
:root .wd-hb button{border:1px solid var(--wl-line);background:var(--wl-soft-2)}
:root .wd-ai{border-top:1px solid var(--wl-line)}
:root .wd-ai input{background:var(--wl-soft-2);border:1px solid var(--wl-line)}
@media (max-width:1000px){:root .wc.wc-hasdoc .wd{background:var(--wl-card)}}
:root .wc-log:focus-visible{outline:2px solid var(--wl-focus)}
:root .wc-chip,:root #wc-pick,:root #wc-addkey,:root .wc-as,:root .wc-top .wc-def{border:1px solid var(--wl-line);background:var(--wl-soft-2);color:var(--wl-ink)}
:root #wc-addkey{color:var(--wl-acc-2)}
:root .wc-chip:hover,:root #wc-addkey:hover,:root .wc-as:hover,:root .wc-top .wc-def:hover{background:var(--wl-soft-2)}
:root .wc-chip:focus-visible,:root #wc-pick:focus-visible,:root #wc-addkey:focus-visible,:root .wc-top .wc-def:focus-visible,:root .wc-as:focus-within,:root .wc-ib:focus-visible,:root .wc-conv:focus-visible,:root .wc-jump:focus-visible,:root .wc-burger:focus-visible,:root .wc-link:focus-visible{outline:2px solid var(--wl-focus)}
:root #wc-model,:root #wc-tools{color:var(--wl-mut)}
:root .wc-msg a{color:var(--wl-acc-2)}
:root .wc-link{background:var(--wl-soft-2);border:1px solid var(--wl-line-2);color:var(--wl-acc-2)!important}
:root .wc-link:hover{background:var(--wl-soft)}
:root .wc-jump{border:1px solid var(--wl-line);background:var(--wl-card);color:var(--wl-ink);box-shadow:var(--wl-shadow)}
:root .wc-box{background:var(--wl-card);-webkit-backdrop-filter:none;backdrop-filter:none}
:root .wc-burger{border:1px solid var(--wl-line);background:var(--wl-card);color:var(--wl-ink)}
@media (max-width:760px){:root .wc-side{background:var(--wl-card);box-shadow:var(--wl-shadow)}}
/* from meet.css */
:root .meet{--fg:var(--wl-ink);--mut:var(--wl-mut);--bg2:var(--wl-bg);--bg3:var(--wl-card);--line:var(--wl-line)}
:root .meet :focus-visible{outline:3px solid var(--wl-focus)}
:root .meet .btn.gho{color:var(--wl-acc-2)}
:root .err{color:var(--wl-acc-2)}
:root .err a,:root .mnote a,:root .hint a,:root .upc a{color:var(--wl-acc-2)}
:root .warn{color:var(--wl-acc-2)}
:root .mok{color:#1d7232}
:root .menu{background:var(--wl-card);box-shadow:var(--wl-shadow)}
:root .joinf input{color:var(--wl-ink);border:1px solid var(--wl-line)}
:root .joinf input::placeholder{color:var(--wl-mut)}
:root .upc li{border-top:1px solid var(--wl-line)}
:root dialog{background:var(--wl-card)}
:root .prev{background:var(--wl-card)}
:root .pvoff{color:var(--wl-ink)}
:root .lvl{background:var(--wl-card)}
:root .lobby #name{color:var(--wl-ink);border:1px solid var(--wl-line)}
:root .spin{border:4px solid var(--wl-line)}
:root body.in-call{background:var(--wl-bg)}
:root body.in-call .meet{background:var(--wl-card);color:var(--wl-ink)}
:root .rec{background:#fbe6e4}
:root .room.sharing .stage{background:var(--wl-card)}
:root .mtile{background:var(--wl-card)}
:root .mtile.speaking{box-shadow:inset 0 0 0 3px rgba(194,65,12,.28)}
:root .mlbl{background:var(--wl-card);color:var(--wl-ink)}
:root .mo svg{fill:var(--wl-acc-2)}
:root .cc{background:var(--wl-card);color:var(--wl-ink)}
:root .pnote{color:var(--wl-mut)}
:root #msgs time{color:var(--wl-mut)}
:root #say{border-top:1px solid var(--wl-line)}
:root #say input{border:1px solid var(--wl-line)}
:root .hostbox{border-top:1px solid var(--wl-line)}
:root .panel .btn.sec{border-color:var(--wl-line)}
:root .panel .ib.mdanger{color:var(--wl-acc-2)}
:root .sep{color:var(--wl-mut)}
:root .tag{background:var(--wl-card);color:var(--wl-acc-2)}
:root .cb{background:var(--wl-card);color:var(--wl-ink)}
:root .cb.leave{color:var(--wl-ink)}
:root .pbtns .cb{background:var(--wl-card)}
:root .ib{color:var(--wl-ink)}
:root .ib:hover{background:var(--wl-card)}
:root .ib[aria-pressed=true]{color:#083887}
:root .reactmenu{background:var(--wl-card)}
:root .mtoast{background:var(--wl-card);color:var(--wl-ink)}
/* from calendar.css */
:root .wl-calpage{--bg:var(--wl-bg);--panel:var(--wl-card);--line:var(--wl-line);--tx:var(--wl-ink);--mu:var(--wl-mut);--focus:var(--wl-focus)}
:root .gc .cmsg{background:var(--wl-card);box-shadow:var(--wl-shadow)}
:root .gc .cmsg.bad{background:#fbe6e4;color:var(--wl-ink)}
:root .gc-signin a{color:var(--wl-acc-2)}
:root .gc-ib:hover{background:var(--wl-soft-2)}
:root .gc-btn{border:1px solid var(--wl-line)}
:root .gc-btn:hover{background:var(--wl-soft-2)}
:root .gc-btn.danger{color:var(--wl-acc-2)}
:root .gc-view{border:1px solid var(--wl-line)}
:root .gc-seg{border:1px solid var(--wl-line)}
:root .gc-seg button[aria-pressed=true]{background:var(--wl-soft);color:var(--wl-acc-2)}
:root .gc-create{background:var(--wl-card);box-shadow:var(--wl-shadow)}
:root .gc-create:hover{background:var(--wl-card)}
:root .gc-mini .mh button:hover{background:var(--wl-soft-2)}
:root .gc-mini td button.o{color:var(--wl-mut)}
:root .gc-mini td button.inr{background:var(--wl-soft-2)}
:root .gc-cals label:hover{background:var(--wl-soft-2)}
:root .gc-cals input:checked::after{border:2px solid var(--wl-line)}
:root .gc-link:hover{background:var(--wl-soft-2)}
:root .gc-fab{box-shadow:var(--wl-shadow)}
:root .gc-fc{--fc-border-color:var(--wl-line);--fc-neutral-bg-color:var(--wl-card);--fc-list-event-hover-bg-color:var(--wl-card);--fc-today-bg-color:var(--wl-soft-2);--fc-highlight-color:var(--wl-soft)}
:root .gc-fc .fc-day-today .gc-dow{color:var(--wl-acc-2)}
:root .gc-fc .fc-daygrid-dot-event:hover{background:var(--wl-soft-2)}
:root .gc-fc .fc-popover{box-shadow:var(--wl-shadow)}
:root .gc-ev .vd{background:var(--wl-soft-2)}
:root .gc-pop{box-shadow:var(--wl-shadow)}
:root .gc-x:hover{background:var(--wl-soft-2)}
:root .gc-qt{border-bottom:2px solid var(--wl-line)}
:root .gc-det .tools button:hover{background:var(--wl-soft-2)}
:root .gc-det a{color:var(--wl-acc-2)}
:root .gc-ed{box-shadow:var(--wl-shadow)}
:root .gc-ed input,:root .gc-ed select,:root .gc-ed textarea,:root .gc-dlg input,:root .gc-dlg select,:root .gc-dlg textarea{border:1px solid var(--wl-line);background:var(--wl-card);color-scheme:light}
:root #ecolors input:checked+span{border-color:var(--wl-line)}
:root .gc-dlg{box-shadow:var(--wl-shadow)}
:root .gc-list a{color:var(--wl-acc-2)}
:root .gc-keys dt{background:var(--wl-card)}
@media (max-width:899px){:root .gc-side{box-shadow:var(--wl-shadow)}}
/* from book.css */
:root .wl-bookpage{--bg:var(--wl-bg);--panel:var(--wl-card);--panel2:var(--wl-card);--line:var(--wl-line);--tx:var(--wl-ink);--mu:var(--wl-mut);--focus:var(--wl-focus);--soft:var(--wl-soft)}
:root .bk-back{color:var(--wl-acc-2)}
:root #berr{color:var(--wl-acc-2)}
:root .bk-dl a,:root .bk a:not(.btn){color:var(--wl-acc-2)}

/* Returning User Dashboard Components: Billing bar, Used apps, Popular templates */
.wl-dash-billing-bar {
  background: var(--wl-card, #ffffff);
  border: 1.5px solid var(--wl-line, #ead9c8);
  border-radius: 18px;
  padding: 16px 20px;
  margin-bottom: 24px;
  box-shadow: 0 2px 8px rgba(28,19,13,.04);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.wl-templates-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 16px;
  margin-top: 12px;
}
.wl-template-card {
  background: var(--wl-card, #ffffff);
  border: 1.5px solid var(--wl-line, #ead9c8);
  border-radius: 16px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
  box-shadow: 0 1px 3px rgba(28,19,13,.04);
}
.wl-template-card:hover {
  transform: translateY(-2px);
  border-color: var(--wl-acc, #c2410c);
  box-shadow: 0 6px 20px rgba(194,65,12,.12);
}
.wl-template-shot {
  position: relative;
  aspect-ratio: 16/9;
  background: #0f172a;
  overflow: hidden;
}
.wl-template-shot img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
  transition: transform .3s ease;
}
.wl-template-card:hover .wl-template-shot img {
  transform: scale(1.04);
}
.wl-template-body {
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  flex: 1;
  justify-content: space-between;
  gap: 8px;
}

/* Emma hardware requirements card (Ember palette; !important so dark-glass dash.css can't wash it out) */
#wl-emma-specs-card .wl-spec-title{font-size:16px!important;font-weight:700!important;margin-bottom:4px!important;color:var(--wl-ink,#1c130d)!important;text-shadow:none!important}
#wl-emma-specs-card .wl-spec-sub{margin:0!important;font-size:13px!important;line-height:1.5!important;color:var(--wl-mut,#5a4a3f)!important;text-shadow:none!important}
#wl-emma-specs-card .wl-spec-dev{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:999px;font-size:12px;font-weight:700;background:var(--wl-soft-2,#fff4ea)!important;color:var(--wl-mut,#5a4a3f)!important;border:1px solid var(--wl-line,#ead9c8)!important}
#wl-emma-specs-card .wl-spec-dev[data-state=ok]{background:#eaf6ee!important;color:var(--wl-ok,#166534)!important;border-color:#b7dcc3!important}
#wl-emma-specs-card .wl-spec-dev[data-state=warn]{background:#fdf3dc!important;color:var(--wl-gold,#7a5c12)!important;border-color:#ecd59a!important}
#wl-emma-specs-card .wl-spec-dev[data-state=bad]{background:var(--wl-soft,#fdeee0)!important;color:var(--wl-acc-2,#9a3412)!important;border-color:#f1b48f!important}
#wl-emma-specs-card .wl-spec-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin-top:16px}
#wl-emma-specs-card .wl-spec-box{background:var(--wl-soft-2,#fff4ea)!important;border:1.5px solid var(--wl-line,#ead9c8)!important;border-radius:16px;padding:18px;box-shadow:0 1px 3px rgba(28,19,13,.04)}
#wl-emma-specs-card .wl-spec-box--best{background:linear-gradient(180deg,#fdeee0 0%,#fffaf5 100%)!important;border-color:#f0a77a!important;box-shadow:0 6px 20px -8px rgba(194,65,12,.25)}
#wl-emma-specs-card .wl-spec-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}
#wl-emma-specs-card .wl-spec-name{font-weight:700;font-size:14.5px;color:var(--wl-ink,#1c130d)!important}
#wl-emma-specs-card .wl-spec-box--best .wl-spec-name{color:var(--wl-acc-2,#9a3412)!important}
#wl-emma-specs-card .wl-spec-tag{font-size:11px;font-weight:700;padding:3px 10px;border-radius:999px;background:var(--wl-card,#fff)!important;color:var(--wl-mut,#5a4a3f)!important;border:1px solid var(--wl-line-2,#cdb7a2)!important;white-space:nowrap}
#wl-emma-specs-card .wl-spec-box--best .wl-spec-tag{background:linear-gradient(135deg,#ff8c42,#e84c2a)!important;color:#fff!important;border-color:transparent!important}
#wl-emma-specs-card .wl-spec-list{display:flex;flex-direction:column;gap:10px;margin:0;font-size:13px}
#wl-emma-specs-card .wl-spec-list>div{display:flex;justify-content:space-between;gap:12px;padding-bottom:8px;border-bottom:1px solid var(--wl-line,#ead9c8)}
#wl-emma-specs-card .wl-spec-list>div:last-child{border-bottom:0;padding-bottom:0}
#wl-emma-specs-card .wl-spec-list dt{margin:0;font-weight:500;color:var(--wl-mut,#5a4a3f)!important}
#wl-emma-specs-card .wl-spec-list dd{margin:0;text-align:right;font-weight:700;color:var(--wl-ink,#1c130d)!important}
#wl-emma-specs-card .wl-spec-list dd.hi{color:var(--wl-acc-2,#9a3412)!important}
#wl-emma-specs-card .wl-spec-detail{margin-top:14px;font-size:12.5px;line-height:1.5;font-weight:500;color:var(--wl-mut,#5a4a3f)!important}

/* ===== Dark & Porch Mode Luxury Copper Metallic Theme ===== */
html[data-theme="dark"], html[data-mood="porch"], html[data-wl-mood="porch"], html.dark,
body.dark, body[data-mood="porch"], body[data-wl-mood="porch"],
[data-theme="dark"], [data-mood="porch"], [data-wl-mood="porch"],
:root[data-theme="dark"], :root[data-mood="porch"], :root[data-wl-mood="porch"] {
  --wl-bg: #121316 !important;
  --wl-card: #18191f !important;
  --wl-chrome: #141519 !important;
  --wl-chrome-ink: #f8fafc !important;
  --wl-chrome-head: #ffffff !important;
  --wl-chrome-mut: #94a3b8 !important;
  --wl-chrome-line: rgba(255, 255, 255, 0.08) !important;
  --wl-chrome-line-2: rgba(255, 255, 255, 0.12) !important;
  --wl-chrome-acc: #d98e68 !important;
  --wl-chrome-on-acc: #ffffff !important;
  --wl-chrome-focus: #d98e68 !important;
  --wl-ink: #f8fafc !important;
  --wl-mut: #94a3b8 !important;
  --wl-line: rgba(255, 255, 255, 0.08) !important;
  --wl-line-2: rgba(255, 255, 255, 0.14) !important;
  --wl-soft: rgba(217, 142, 104, 0.12) !important;
  --wl-soft-2: rgba(217, 142, 104, 0.20) !important;
  --wl-acc: #d98e68 !important;
  --wl-acc-2: #f0b594 !important;
  --wl-acc-dark: #b8653e !important;
  --wl-focus: #d98e68 !important;
  --wl-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
  color-scheme: dark !important;
}

html[data-theme="dark"], html[data-mood="porch"], html[data-wl-mood="porch"], html.dark {
  background: #121316 !important;
  color-scheme: dark !important;
}
html[data-theme="dark"] body, html[data-mood="porch"] body, html[data-wl-mood="porch"] body, html.dark body {
  background: #121316 !important;
  color: #f8fafc !important;
}

/* Cards & Surfaces */
html[data-theme="dark"] .card, html[data-mood="porch"] .card, html[data-wl-mood="porch"] .card, html.dark .card,
html[data-theme="dark"] .dwrap .card, html[data-mood="porch"] .dwrap .card, html[data-wl-mood="porch"] .dwrap .card, html.dark .dwrap .card,
[data-theme="dark"] .card, [data-mood="porch"] .card, [data-wl-mood="porch"] .card {
  background: #18191f !important;
  background-color: #18191f !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.45) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  color: #f8fafc !important;
}
html[data-theme="dark"] .card b, html[data-mood="porch"] .card b, html[data-wl-mood="porch"] .card b, html.dark .card b,
html[data-theme="dark"] .dh, html[data-mood="porch"] .dh, html[data-wl-mood="porch"] .dh, html.dark .dh,
[data-theme="dark"] .card b, [data-mood="porch"] .card b, [data-wl-mood="porch"] .card b {
  color: #f8fafc !important;
}
html[data-theme="dark"] .dsub, html[data-mood="porch"] .dsub, html[data-wl-mood="porch"] .dsub, html.dark .dsub,
html[data-theme="dark"] .dsub2, html[data-mood="porch"] .dsub2, html[data-wl-mood="porch"] .dsub2, html.dark .dsub2,
html[data-theme="dark"] .card .dsub2, html[data-mood="porch"] .card .dsub2 {
  color: #94a3b8 !important;
}
html[data-theme="dark"] .drow, html[data-mood="porch"] .drow, html[data-wl-mood="porch"] .drow, html.dark .drow {
  border-bottom: 1px solid rgba(255, 255, 255, 0.07) !important;
}
html[data-theme="dark"] .drow>div:first-child span, html[data-mood="porch"] .drow>div:first-child span, html[data-wl-mood="porch"] .drow>div:first-child span {
  color: #94a3b8 !important;
}
html[data-theme="dark"] .drow>div:first-child strong, html[data-mood="porch"] .drow>div:first-child strong, html[data-wl-mood="porch"] .drow>div:first-child strong,
html[data-theme="dark"] .drow>div:first-child b, html[data-mood="porch"] .drow>div:first-child b, html[data-wl-mood="porch"] .drow>div:first-child b {
  color: #f8fafc !important;
}

/* Sidebar & Navigation */
html[data-theme="dark"] .dside, html[data-mood="porch"] .dside, html[data-wl-mood="porch"] .dside, html.dark .dside,
[data-theme="dark"] .dside, [data-mood="porch"] .dside, [data-wl-mood="porch"] .dside {
  background: #18191f !important;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
}
html[data-theme="dark"] .dside a, html[data-mood="porch"] .dside a, html[data-wl-mood="porch"] .dside a, html.dark .dside a,
[data-theme="dark"] .dside a, [data-mood="porch"] .dside a, [data-wl-mood="porch"] .dside a {
  color: #cbd5e1 !important;
}
html[data-theme="dark"] .dside a:hover, html[data-mood="porch"] .dside a:hover, html[data-wl-mood="porch"] .dside a:hover, html.dark .dside a:hover,
[data-theme="dark"] .dside a:hover, [data-mood="porch"] .dside a:hover, [data-wl-mood="porch"] .dside a:hover {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .dside a[aria-current=page], html[data-mood="porch"] .dside a[aria-current=page], html[data-wl-mood="porch"] .dside a[aria-current=page],
html.dark .dside a[aria-current=page],
html[data-theme="dark"] .dside a[aria-selected=true], html[data-mood="porch"] .dside a[aria-selected=true], html[data-wl-mood="porch"] .dside a[aria-selected=true],
[data-theme="dark"] .dside a[aria-current=page], [data-mood="porch"] .dside a[aria-current=page], [data-wl-mood="porch"] .dside a[aria-current=page] {
  color: #f0b594 !important;
  background: rgba(217, 142, 104, 0.18) !important;
  font-weight: 600 !important;
}
html[data-theme="dark"] .dside a[aria-current=page]::before, html[data-mood="porch"] .dside a[aria-current=page]::before, html[data-wl-mood="porch"] .dside a[aria-current=page]::before,
[data-theme="dark"] .dside a[aria-current=page]::before, [data-mood="porch"] .dside a[aria-current=page]::before, [data-wl-mood="porch"] .dside a[aria-current=page]::before {
  background: #d98e68 !important;
}
html[data-theme="dark"] .dside a svg, html[data-mood="porch"] .dside a svg, html[data-wl-mood="porch"] .dside a svg, html.dark .dside a svg,
[data-theme="dark"] .dside a svg, [data-mood="porch"] .dside a svg, [data-wl-mood="porch"] .dside a svg {
  color: inherit !important;
  stroke: currentColor !important;
}
html[data-theme="dark"] #dout, html[data-mood="porch"] #dout, html[data-wl-mood="porch"] #dout, html.dark #dout,
[data-theme="dark"] #dout, [data-mood="porch"] #dout, [data-wl-mood="porch"] #dout {
  color: #94a3b8 !important;
  background: transparent !important;
}
html[data-theme="dark"] #dout:hover, html[data-mood="porch"] #dout:hover, html[data-wl-mood="porch"] #dout:hover, html.dark #dout:hover,
[data-theme="dark"] #dout:hover, [data-mood="porch"] #dout:hover, [data-wl-mood="porch"] #dout:hover {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.08) !important;
}

/* Primary Buttons */
html[data-theme="dark"] .btn.pri, html[data-theme="dark"] .pri,
html[data-mood="porch"] .btn.pri, html[data-mood="porch"] .pri,
html[data-wl-mood="porch"] .btn.pri, html[data-wl-mood="porch"] .pri,
html.dark .btn.pri, html.dark .pri,
[data-theme="dark"] .btn.pri, [data-theme="dark"] .pri,
[data-mood="porch"] .btn.pri, [data-mood="porch"] .pri,
[data-wl-mood="porch"] .btn.pri, [data-wl-mood="porch"] .pri {
  background: linear-gradient(135deg, #d98e68 0%, #b8653e 100%) !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 4px 16px rgba(184, 101, 62, 0.38) !important;
}
html[data-theme="dark"] .btn.pri:hover, html[data-theme="dark"] .pri:hover,
html[data-mood="porch"] .btn.pri:hover, html[data-mood="porch"] .pri:hover,
html[data-wl-mood="porch"] .btn.pri:hover, html[data-wl-mood="porch"] .pri:hover,
html.dark .btn.pri:hover, html.dark .pri:hover,
[data-theme="dark"] .btn.pri:hover, [data-theme="dark"] .pri:hover,
[data-mood="porch"] .btn.pri:hover, [data-mood="porch"] .pri:hover,
[data-wl-mood="porch"] .btn.pri:hover, [data-wl-mood="porch"] .pri:hover {
  background: linear-gradient(135deg, #ea9f7a 0%, #c8754b 100%) !important;
  box-shadow: 0 6px 20px rgba(184, 101, 62, 0.48) !important;
  transform: translateY(-1px);
}

/* Standard & Secondary Buttons */
html[data-theme="dark"] .btn:not(.pri):not(.mintbtn):not(.danger),
html[data-mood="porch"] .btn:not(.pri):not(.mintbtn):not(.danger),
html[data-wl-mood="porch"] .btn:not(.pri):not(.mintbtn):not(.danger),
html.dark .btn:not(.pri):not(.mintbtn):not(.danger),
[data-theme="dark"] .btn:not(.pri):not(.mintbtn):not(.danger),
[data-mood="porch"] .btn:not(.pri):not(.mintbtn):not(.danger),
[data-wl-mood="porch"] .btn:not(.pri):not(.mintbtn):not(.danger),
html[data-theme="dark"] .btn-sm:not(.pri):not(.mintbtn):not(.danger),
html[data-mood="porch"] .btn-sm:not(.pri):not(.mintbtn):not(.danger),
html[data-wl-mood="porch"] .btn-sm:not(.pri):not(.mintbtn):not(.danger),
html.dark .btn-sm:not(.pri):not(.mintbtn):not(.danger) {
  background: #1e2026 !important;
  border: 1.5px solid rgba(255, 255, 255, 0.18) !important;
  color: #f8fafc !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.45) !important;
}
html[data-theme="dark"] .btn:not(.pri):not(.mintbtn):not(.danger):hover,
html[data-mood="porch"] .btn:not(.pri):not(.mintbtn):not(.danger):hover,
html[data-wl-mood="porch"] .btn:not(.pri):not(.mintbtn):not(.danger):hover,
html.dark .btn:not(.pri):not(.mintbtn):not(.danger):hover,
[data-theme="dark"] .btn:not(.pri):not(.mintbtn):not(.danger):hover,
[data-mood="porch"] .btn:not(.pri):not(.mintbtn):not(.danger):hover,
[data-wl-mood="porch"] .btn:not(.pri):not(.mintbtn):not(.danger):hover,
html[data-theme="dark"] .btn-sm:not(.pri):not(.mintbtn):not(.danger):hover,
html[data-mood="porch"] .btn-sm:not(.pri):not(.mintbtn):not(.danger):hover,
html[data-wl-mood="porch"] .btn-sm:not(.pri):not(.mintbtn):not(.danger):hover,
html.dark .btn-sm:not(.pri):not(.mintbtn):not(.danger):hover {
  background: rgba(217, 142, 104, 0.22) !important;
  border-color: #d98e68 !important;
  color: #ffffff !important;
}

/* Ghost Buttons */
html[data-theme="dark"] .btn.gho, html[data-theme="dark"] .gho,
html[data-mood="porch"] .btn.gho, html[data-mood="porch"] .gho,
html[data-wl-mood="porch"] .btn.gho, html[data-wl-mood="porch"] .gho,
html.dark .btn.gho, html.dark .gho,
[data-theme="dark"] .btn.gho, [data-theme="dark"] .gho,
[data-mood="porch"] .btn.gho, [data-mood="porch"] .gho,
[data-wl-mood="porch"] .btn.gho, [data-wl-mood="porch"] .gho {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1.5px solid rgba(255, 255, 255, 0.16) !important;
  color: #f1f5f9 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35) !important;
}
html[data-theme="dark"] .btn.gho:hover, html[data-theme="dark"] .gho:hover,
html[data-mood="porch"] .btn.gho:hover, html[data-mood="porch"] .gho:hover,
html[data-wl-mood="porch"] .btn.gho:hover, html[data-wl-mood="porch"] .gho:hover,
html.dark .btn.gho:hover, html.dark .gho:hover,
[data-theme="dark"] .btn.gho:hover, [data-theme="dark"] .gho:hover,
[data-mood="porch"] .btn.gho:hover, [data-mood="porch"] .gho:hover,
[data-wl-mood="porch"] .btn.gho:hover, [data-wl-mood="porch"] .gho:hover {
  background: rgba(217, 142, 104, 0.22) !important;
  border-color: #d98e68 !important;
  color: #ffffff !important;
}

/* Disabled & Danger Buttons */
html[data-theme="dark"] .btn:disabled, html[data-mood="porch"] .btn:disabled, html[data-wl-mood="porch"] .btn:disabled, html.dark .btn:disabled,
[data-theme="dark"] .btn:disabled, [data-mood="porch"] .btn:disabled {
  background: rgba(255, 255, 255, 0.05) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: rgba(255, 255, 255, 0.4) !important;
  cursor: not-allowed !important;
}
html[data-theme="dark"] .btn.danger, html[data-mood="porch"] .btn.danger, html[data-wl-mood="porch"] .btn.danger, html.dark .btn.danger {
  background: rgba(239, 68, 68, 0.16) !important;
  border: 1.5px solid rgba(239, 68, 68, 0.35) !important;
  color: #fca5a5 !important;
}
html[data-theme="dark"] .btn.danger:hover, html[data-mood="porch"] .btn.danger:hover, html[data-wl-mood="porch"] .btn.danger:hover, html.dark .btn.danger:hover {
  background: rgba(239, 68, 68, 0.26) !important;
  border-color: #ef4444 !important;
  color: #ffffff !important;
}

/* Icons inside Buttons */
html[data-theme="dark"] .btn svg, html[data-mood="porch"] .btn svg, html[data-wl-mood="porch"] .btn svg, html.dark .btn svg {
  color: inherit !important;
  stroke: currentColor !important;
}

/* Form Inputs */
html[data-theme="dark"] .inl input, html[data-mood="porch"] .inl input, html[data-wl-mood="porch"] .inl input, html.dark .inl input,
html[data-theme="dark"] .card input:not([type="checkbox"]):not([type="radio"]),
html[data-mood="porch"] .card input:not([type="checkbox"]):not([type="radio"]),
html[data-wl-mood="porch"] .card input:not([type="checkbox"]):not([type="radio"]),
html.dark .card input:not([type="checkbox"]):not([type="radio"]),
html[data-theme="dark"] .lcard input, html[data-mood="porch"] .lcard input, html[data-wl-mood="porch"] .lcard input, html.dark .lcard input {
  background: #121316 !important;
  border: 1.5px solid rgba(255, 255, 255, 0.16) !important;
  color: #f8fafc !important;
}
html[data-theme="dark"] .inl input:focus, html[data-mood="porch"] .inl input:focus, html[data-wl-mood="porch"] .inl input:focus, html.dark .inl input:focus,
html[data-theme="dark"] .card input:focus, html[data-mood="porch"] .card input:focus, html[data-wl-mood="porch"] .card input:focus, html.dark .card input:focus,
html[data-theme="dark"] .lcard input:focus, html[data-mood="porch"] .lcard input:focus, html[data-wl-mood="porch"] .lcard input:focus, html.dark .lcard input:focus {
  outline: 2px solid #d98e68 !important;
  border-color: #d98e68 !important;
}

/* Segmented Buttons */
html[data-theme="dark"] .seg, html[data-mood="porch"] .seg, html[data-wl-mood="porch"] .seg, html.dark .seg,
[data-theme="dark"] .seg, [data-mood="porch"] .seg, [data-wl-mood="porch"] .seg {
  background: #121316 !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
}
html[data-theme="dark"] .seg button, html[data-mood="porch"] .seg button, html[data-wl-mood="porch"] .seg button, html.dark .seg button,
[data-theme="dark"] .seg button, [data-mood="porch"] .seg button, [data-wl-mood="porch"] .seg button {
  color: #94a3b8 !important;
}
html[data-theme="dark"] .seg button[aria-pressed=true], html[data-mood="porch"] .seg button[aria-pressed=true], html[data-wl-mood="porch"] .seg button[aria-pressed=true], html.dark .seg button[aria-pressed=true],
[data-theme="dark"] .seg button[aria-pressed=true], [data-mood="porch"] .seg button[aria-pressed=true], [data-wl-mood="porch"] .seg button[aria-pressed=true] {
  background: rgba(217, 142, 104, 0.22) !important;
  color: #f0b594 !important;
  font-weight: 600 !important;
}

/* Pills & Badges */
html[data-theme="dark"] .pill, html[data-mood="porch"] .pill, html[data-wl-mood="porch"] .pill, html.dark .pill,
[data-theme="dark"] .pill, [data-mood="porch"] .pill, [data-wl-mood="porch"] .pill {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #f8fafc !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
}
html[data-theme="dark"] .pill.ok, html[data-mood="porch"] .pill.ok, html[data-wl-mood="porch"] .pill.ok, html.dark .pill.ok,
[data-theme="dark"] .pill.ok, [data-mood="porch"] .pill.ok, [data-wl-mood="porch"] .pill.ok {
  background: rgba(34, 197, 94, 0.18) !important;
  color: #4ade80 !important;
  border: 1px solid rgba(34, 197, 94, 0.35) !important;
}
html[data-theme="dark"] .pill.bad, html[data-mood="porch"] .pill.bad, html[data-wl-mood="porch"] .pill.bad, html.dark .pill.bad,
[data-theme="dark"] .pill.bad, [data-mood="porch"] .pill.bad, [data-wl-mood="porch"] .pill.bad {
  background: rgba(239, 68, 68, 0.18) !important;
  color: #f87171 !important;
  border: 1px solid rgba(239, 68, 68, 0.35) !important;
}

/* App Tiles & Badges */
html[data-theme="dark"] .tile, html[data-mood="porch"] .tile, html[data-wl-mood="porch"] .tile, html.dark .tile,
[data-theme="dark"] .tile, [data-mood="porch"] .tile, [data-wl-mood="porch"] .tile {
  background: #18191f !important;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  color: #f8fafc !important;
}
html[data-theme="dark"] .tile:hover, html[data-mood="porch"] .tile:hover, html[data-wl-mood="porch"] .tile:hover, html.dark .tile:hover,
[data-theme="dark"] .tile:hover, [data-mood="porch"] .tile:hover, [data-wl-mood="porch"] .tile:hover {
  border-color: rgba(217, 142, 104, 0.45) !important;
  transform: translateY(-3px);
}
html[data-theme="dark"] .tile b, html[data-mood="porch"] .tile b, html[data-wl-mood="porch"] .tile b, html.dark .tile b,
[data-theme="dark"] .tile b, [data-mood="porch"] .tile b, [data-wl-mood="porch"] .tile b {
  color: #ffffff !important;
}
html[data-theme="dark"] .tile span, html[data-mood="porch"] .tile span, html[data-wl-mood="porch"] .tile span, html.dark .tile span,
[data-theme="dark"] .tile span, [data-mood="porch"] .tile span, [data-wl-mood="porch"] .tile span {
  color: #94a3b8 !important;
}
html[data-theme="dark"] .tile em, html[data-mood="porch"] .tile em, html[data-wl-mood="porch"] .tile em, html.dark .tile em,
[data-theme="dark"] .tile em, [data-mood="porch"] .tile em, [data-wl-mood="porch"] .tile em {
  color: #d98e68 !important;
}
html[data-theme="dark"] .tlinks a, html[data-mood="porch"] .tlinks a, html[data-wl-mood="porch"] .tlinks a {
  color: #d98e68 !important;
}
html[data-theme="dark"] .tlinks a:hover, html[data-mood="porch"] .tlinks a:hover {
  color: #f0b594 !important;
}

/* Individual tile icon containers */
html[data-theme="dark"] .ti, html[data-mood="porch"] .ti, html[data-wl-mood="porch"] .ti, html.dark .ti,
[data-theme="dark"] .ti, [data-mood="porch"] .ti, [data-wl-mood="porch"] .ti {
  color: #ffffff !important;
  border-radius: 14px;
}
html[data-theme="dark"] .ti svg, html[data-mood="porch"] .ti svg, html[data-wl-mood="porch"] .ti svg, html.dark .ti svg,
[data-theme="dark"] .ti svg, [data-mood="porch"] .ti svg, [data-wl-mood="porch"] .ti svg {
  stroke: currentColor !important;
  color: #ffffff !important;
}
html[data-theme="dark"] .t-ember .ti, html[data-mood="porch"] .t-ember .ti, html[data-wl-mood="porch"] .t-ember .ti {
  background: linear-gradient(135deg, #d98e68, #b8653e) !important;
}
html[data-theme="dark"] .t-store .ti, html[data-mood="porch"] .t-store .ti, html[data-wl-mood="porch"] .t-store .ti {
  background: linear-gradient(135deg, #10b981, #047857) !important;
}
html[data-theme="dark"] .t-prime .ti, html[data-mood="porch"] .t-prime .ti, html[data-wl-mood="porch"] .t-prime .ti {
  background: linear-gradient(135deg, #d97706, #92400e) !important;
}
html[data-theme="dark"] .t-chat .ti, html[data-mood="porch"] .t-chat .ti, html[data-wl-mood="porch"] .t-chat .ti {
  background: linear-gradient(135deg, #8b5cf6, #6d28d9) !important;
}
html[data-theme="dark"] .t-drive .ti, html[data-mood="porch"] .t-drive .ti, html[data-wl-mood="porch"] .t-drive .ti {
  background: linear-gradient(135deg, #3b82f6, #1d4ed8) !important;
}
html[data-theme="dark"] .t-desktop .ti, html[data-mood="porch"] .t-desktop .ti, html[data-wl-mood="porch"] .t-desktop .ti {
  background: linear-gradient(135deg, #ec4899, #be185d) !important;
}
html[data-theme="dark"] .t-passwords .ti, html[data-mood="porch"] .t-passwords .ti, html[data-wl-mood="porch"] .t-passwords .ti {
  background: linear-gradient(135deg, #06b6d4, #0e7490) !important;
}
html[data-theme="dark"] .t-domains .ti, html[data-mood="porch"] .t-domains .ti, html[data-wl-mood="porch"] .t-domains .ti {
  background: linear-gradient(135deg, #6366f1, #4338ca) !important;
}
html[data-theme="dark"] .t-forms .ti, html[data-mood="porch"] .t-forms .ti, html[data-wl-mood="porch"] .t-forms .ti {
  background: linear-gradient(135deg, #14b8a6, #0f766e) !important;
}
html[data-theme="dark"] .t-git .ti, html[data-mood="porch"] .t-git .ti, html[data-wl-mood="porch"] .t-git .ti {
  background: linear-gradient(135deg, #f97316, #c2410c) !important;
}
html[data-theme="dark"] .t-stats .ti, html[data-mood="porch"] .t-stats .ti, html[data-wl-mood="porch"] .t-stats .ti {
  background: linear-gradient(135deg, #a855f7, #7e22ce) !important;
}

/* Billing Grid & Plan Cards */
html[data-theme="dark"] #wlplansgrid>div,
html[data-mood="porch"] #wlplansgrid>div,
html[data-wl-mood="porch"] #wlplansgrid>div {
  background: #18191f !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}
html[data-theme="dark"] #wlplansgrid>div b,
html[data-mood="porch"] #wlplansgrid>div b,
html[data-wl-mood="porch"] #wlplansgrid>div b {
  color: #ffffff !important;
}
html[data-theme="dark"] #wlplansgrid>div ul,
html[data-mood="porch"] #wlplansgrid>div ul,
html[data-wl-mood="porch"] #wlplansgrid>div ul {
  color: #f1f5f9 !important;
}
html[data-theme="dark"] #wlplansgrid>div svg,
html[data-mood="porch"] #wlplansgrid>div svg,
html[data-wl-mood="porch"] #wlplansgrid>div svg {
  stroke: #d98e68 !important;
}
html[data-theme="dark"] .wl-plan-crypto,
html[data-mood="porch"] .wl-plan-crypto,
html[data-wl-mood="porch"] .wl-plan-crypto {
  background: rgba(30, 64, 175, 0.22) !important;
  border: 1.5px solid rgba(59, 130, 246, 0.45) !important;
  color: #93c5fd !important;
}
html[data-theme="dark"] .wl-plan-crypto:hover,
html[data-mood="porch"] .wl-plan-crypto:hover,
html[data-wl-mood="porch"] .wl-plan-crypto:hover {
  background: rgba(30, 64, 175, 0.38) !important;
  border-color: #60a5fa !important;
  color: #ffffff !important;
}
html[data-theme="dark"] .wl-app-crypto,
html[data-mood="porch"] .wl-app-crypto,
html[data-wl-mood="porch"] .wl-app-crypto {
  background: rgba(217, 119, 6, 0.22) !important;
  border: 1.5px solid rgba(217, 119, 6, 0.5) !important;
  color: #fcd34d !important;
}
html[data-theme="dark"] .wl-app-crypto:hover,
html[data-mood="porch"] .wl-app-crypto:hover,
html[data-wl-mood="porch"] .wl-app-crypto:hover {
  background: rgba(217, 119, 6, 0.38) !important;
  border-color: #fbbf24 !important;
  color: #ffffff !important;
}
html[data-theme="dark"] #wlinttoggle,
html[data-mood="porch"] #wlinttoggle,
html[data-wl-mood="porch"] #wlinttoggle {
  background: #121316 !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}
html[data-theme="dark"] .wl-ind-grid>div,
html[data-mood="porch"] .wl-ind-grid>div,
html[data-wl-mood="porch"] .wl-ind-grid>div {
  background: #18191f !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

/* Recent Apps Grid */
html[data-theme="dark"] #wl-recent-apps a,
html[data-mood="porch"] #wl-recent-apps a,
html[data-wl-mood="porch"] #wl-recent-apps a {
  background: #18191f !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}
html[data-theme="dark"] #wl-recent-apps a:hover,
html[data-mood="porch"] #wl-recent-apps a:hover,
html[data-wl-mood="porch"] #wl-recent-apps a:hover {
  border-color: rgba(217, 142, 104, 0.5) !important;
  transform: translateY(-2px);
}
html[data-theme="dark"] #wl-recent-apps a span:first-child,
html[data-mood="porch"] #wl-recent-apps a span:first-child,
html[data-wl-mood="porch"] #wl-recent-apps a span:first-child {
  background: rgba(217, 142, 104, 0.18) !important;
  color: #f0b594 !important;
}

/* Admin Sidebar Quick AI */
html[data-theme="dark"] .adm-quick-ai button,
html[data-mood="porch"] .adm-quick-ai button,
html[data-wl-mood="porch"] .adm-quick-ai button {
  background: #121316 !important;
  color: #cbd5e1 !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
}
html[data-theme="dark"] .adm-quick-ai button:hover,
html[data-mood="porch"] .adm-quick-ai button:hover,
html[data-wl-mood="porch"] .adm-quick-ai button:hover {
  background: rgba(217, 142, 104, 0.2) !important;
  color: #f0b594 !important;
  border-color: #d98e68 !important;
}
html[data-theme="dark"] .adm-quick-ai button:not(.gho),
html[data-mood="porch"] .adm-quick-ai button:not(.gho),
html[data-wl-mood="porch"] .adm-quick-ai button:not(.gho) {
  background: linear-gradient(135deg, #d98e68, #b8653e) !important;
  color: #ffffff !important;
  border: none !important;
}

/* Passkeys & Modals */
html[data-theme="dark"] .pklist li,
html[data-mood="porch"] .pklist li,
html[data-wl-mood="porch"] .pklist li {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}
html[data-theme="dark"] .pklist li b,
html[data-mood="porch"] .pklist li b,
html[data-wl-mood="porch"] .pklist li b {
  color: #f8fafc !important;
}
html[data-theme="dark"] .pklist li .pkm,
html[data-mood="porch"] .pklist li .pkm,
html[data-wl-mood="porch"] .pklist li .pkm {
  color: #94a3b8 !important;
}
html[data-theme="dark"] .mfa-modal .card,
html[data-mood="porch"] .mfa-modal .card,
html[data-wl-mood="porch"] .mfa-modal .card {
  background: #18191f !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.7) !important;
  color: #f8fafc !important;
}

/* Worker Online Badge & Active Tab indicator */
.wl-worker-online-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(18, 38, 26, 0.75);
  border: 1px solid rgba(34, 197, 94, 0.35);
  border-radius: 999px;
  padding: 4px 14px;
  font: 700 12px/1.2 system-ui, -apple-system, sans-serif;
  letter-spacing: 0.05em;
  color: #4ade80;
  box-shadow: 0 0 16px rgba(34, 197, 94, 0.25), inset 0 0 8px rgba(34, 197, 94, 0.15);
  text-shadow: 0 0 10px rgba(34, 197, 94, 0.6);
}

.wl-tab-item.active::after, html[data-theme="dark"] .wl-tab-item.active::after, html[data-mood="porch"] .wl-tab-item.active::after, html[data-wl-mood="porch"] .wl-tab-item.active::after {
  content: "";
  position: absolute;
  bottom: -4px;
  left: 0;
  right: 0;
  height: 2.5px;
  background: #d98e68;
  border-radius: 2px;
  box-shadow: 0 0 8px rgba(217, 142, 104, 0.7);
}
