:root{
  --bg:#f4f1ea; --card:#fff; --border:rgba(36,29,18,0.08); --border2:rgba(36,29,18,0.14);
  --ink:#241d12; --ink2:#5b5345; --muted:#8b8576; --muted2:#a39c8c;
  --gold1:#e6c577; --gold2:#cfa44f; --gold3:#c79338;
  --warm:#faf8f2; --warm2:#f1ece0;
  --green:#3fae6a; --red:#d9534f; --blue:#3b82f6; --amber:#d99a2b;
  --shadow:0 24px 64px rgba(36,29,18,0.12);
  --shadow-sm:0 4px 18px rgba(36,29,18,0.06);
}
*{box-sizing:border-box;margin:0;padding:0}
.due-pill{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;padding:2px 8px;border-radius:999px;background:var(--warm2);color:var(--ink2);white-space:nowrap}
.due-pill svg{width:11px;height:11px}
.due-pill.overdue{background:rgba(217,83,79,0.13);color:var(--red)}
.due-pill.soon{background:rgba(217,154,43,0.15);color:var(--amber)}
.prio-dot{display:inline-block;width:9px;height:9px;border-radius:50%;flex:none}
.prio-low{background:#9aa0a6}.prio-normal{background:#3fae6a}.prio-high{background:var(--amber)}.prio-urgent{background:var(--red)}
.prio-tag{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;text-transform:capitalize;color:var(--ink2)}
body{
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  background:var(--bg); color:var(--ink); font-size:13.5px; height:100vh; height:100dvh; overflow:hidden;
  -webkit-font-smoothing:antialiased;
}
button,input,select,textarea{font-family:inherit}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-thumb{background:rgba(36,29,18,0.16);border-radius:8px}
::-webkit-scrollbar-track{background:transparent}

/* logo diamond */
.diamond{
  width:30px;height:30px;border-radius:8px;transform:rotate(45deg);flex-shrink:0;
  background:linear-gradient(135deg,var(--gold1),var(--gold3));
  box-shadow:0 6px 18px rgba(199,147,56,0.45),inset 0 1px 2px rgba(255,255,255,0.5);
}
.diamond.sm{width:22px;height:22px;border-radius:6px}

/* animations */
@keyframes bb-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.07)}}
@keyframes bb-ring{0%{transform:scale(.45);opacity:.55}100%{transform:scale(2);opacity:0}}
@keyframes bb-blink{0%,49%{opacity:1}50%,100%{opacity:0}}
@keyframes bb-pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.82)}}
@keyframes bb-up{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@keyframes spin{to{transform:rotate(360deg)}}
.bb-up{animation:bb-up .4s cubic-bezier(.2,.7,.3,1)}

/* ---------- LOGIN ---------- */
#login,#forgotPw,#resetPw,#acceptInvite,#orgSignup{position:fixed;inset:0;background:radial-gradient(120% 100% at 50% 0%,#faf7f0,#efe9dc);display:flex;align-items:center;justify-content:center;z-index:300;overflow:auto;padding:20px}
.login-card{width:394px;max-width:calc(100vw - 32px);background:var(--card);border-radius:22px;padding:38px 34px 26px;box-shadow:0 40px 90px rgba(36,29,18,0.22);border:1px solid var(--border)}
.login-brand{display:flex;align-items:center;gap:14px;margin-bottom:26px}
.login-brand .wm{font-size:17px;font-weight:700;letter-spacing:.2px}
.login-brand .wm span{color:var(--gold3)}
.login-card h2{font-size:16px;font-weight:600;margin-bottom:5px}
.login-card .sub{color:var(--muted);font-size:12.5px;margin-bottom:22px}
.fld{margin-bottom:14px}
.fld label{display:block;font-size:11px;color:var(--muted);font-weight:600;letter-spacing:.4px;margin-bottom:6px}
.fld input{width:100%;background:var(--warm);border:1px solid var(--border);color:var(--ink);padding:12px 13px;border-radius:11px;font-size:14px;outline:none;transition:.15s}
.fld input:focus{border-color:var(--gold2);background:#fff;box-shadow:0 0 0 3px rgba(207,164,79,0.12)}
.btn-gold{width:100%;padding:13px;border:none;border-radius:12px;color:#3a2c12;font-size:14px;font-weight:700;cursor:pointer;letter-spacing:.2px;background:linear-gradient(135deg,var(--gold1),var(--gold3));box-shadow:0 8px 20px rgba(199,147,56,0.35);transition:.15s}
.btn-gold:hover{filter:brightness(1.04);transform:translateY(-1px)}
.btn-gold:disabled{opacity:.55;cursor:not-allowed;transform:none}
.login-err{color:var(--red);font-size:12px;margin-top:10px;text-align:center;display:none}
.login-foot{margin-top:24px;text-align:center;font-size:11.5px;color:var(--muted2);display:flex;align-items:center;justify-content:center;gap:7px}
.gold-dot{width:7px;height:7px;border-radius:50%;background:linear-gradient(135deg,var(--gold1),var(--gold3))}

/* ---------- SHELL ---------- */
#app{display:none;height:100vh;height:100dvh}
.rail{position:fixed;left:0;top:0;bottom:0;width:228px;background:#fff;border-right:1px solid var(--border);display:flex;flex-direction:column;align-items:stretch;padding:14px 12px;z-index:120}
.rail-logo{margin:0 6px 16px;display:flex;align-items:center;height:40px}
.rail-nav{flex:1;display:flex;flex-direction:column;align-items:stretch;gap:2px;width:100%;overflow-y:auto;overflow-x:hidden}
.rail-nav::-webkit-scrollbar{display:none}
.rail-sep{height:1px;background:var(--border);margin:8px 6px}
.nav-btn{height:42px;flex-shrink:0;border-radius:11px;border:none;background:transparent;color:var(--muted);display:flex;align-items:center;justify-content:flex-start;gap:11px;padding:0 12px;cursor:pointer;position:relative;transition:.15s;width:100%;text-align:left;font:inherit}
.nav-btn:hover{background:var(--warm2);color:var(--ink)}
.nav-btn.active{background:linear-gradient(135deg,rgba(230,197,119,0.22),rgba(199,147,56,0.16));color:var(--gold3)}
.nav-btn.active::before{content:'';position:absolute;left:-12px;top:50%;transform:translateY(-50%);width:3px;height:22px;border-radius:3px;background:linear-gradient(var(--gold1),var(--gold3))}
.nav-btn svg{width:20px;height:20px;flex-shrink:0}
.nav-label{font-size:13px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1}
.nav-tip{display:none}
/* group header */
.nav-group .nav-caret{margin-left:auto;display:flex;transition:transform .18s;opacity:.55}
.nav-group .nav-caret svg{width:16px;height:16px}
.nav-group.open .nav-caret{transform:rotate(90deg)}
/* The group holding your active sub-module stays highlighted (open or closed) so the
   path is always visible: active group (soft gold) > active sub-module (solid gold). */
.nav-group.has-active{color:var(--gold3);background:linear-gradient(135deg,rgba(230,197,119,0.16),rgba(199,147,56,0.10))}
.nav-children{display:flex;flex-direction:column;flex-shrink:0;gap:2px;margin:1px 0 3px}
.nav-children.collapsed{display:none}
.nav-btn.nav-child{height:36px;padding-left:30px}
.nav-btn.nav-child .nav-label{font-size:12.5px;font-weight:450}
.nav-btn.nav-child::after{content:'';position:absolute;left:19px;top:50%;transform:translateY(-50%);width:5px;height:5px;border-radius:50%;background:var(--border)}
/* Active SUB-module: a distinct solid gold fill (different from the soft-gold used for
   an active top-level module), so it is easy to tell which sub-tab you are in. */
.nav-btn.nav-child.active{background:linear-gradient(135deg,var(--gold2),var(--gold3));color:#fff}
.nav-btn.nav-child.active .nav-label{color:#fff;font-weight:600}
.nav-btn.nav-child.active::after{background:#fff}
.nav-btn.nav-child.active::before{display:none}

/* header */
.main{margin-left:228px;height:100vh;height:100dvh;display:flex;flex-direction:column}
header{height:64px;flex-shrink:0;padding:0 24px;display:flex;align-items:center;justify-content:space-between;gap:14px;border-bottom:1px solid var(--border);background:rgba(244,241,234,0.78);backdrop-filter:blur(14px);position:sticky;top:0;z-index:90}
.hd-left{display:flex;align-items:center;gap:13px;min-width:0}
.hd-wm{font-size:14px;font-weight:700}.hd-wm span{color:var(--gold3)}
.hd-mod{font-size:12px;color:var(--muted);border-left:1px solid var(--border2);padding-left:13px}
.hd-right{display:flex;align-items:center;gap:11px}
.orb-btn{width:40px;height:40px;border-radius:50%;border:none;cursor:pointer;background:linear-gradient(135deg,var(--gold1),var(--gold3));box-shadow:0 6px 16px rgba(199,147,56,0.4);display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0;transition:.15s}
.orb-btn:hover{transform:scale(1.06)}
.orb-btn svg{width:18px;height:18px}
.cost-pill{font-size:12px;font-weight:600;color:var(--gold3);background:rgba(207,164,79,0.12);border:1px solid rgba(207,164,79,0.28);padding:7px 13px;border-radius:20px;cursor:pointer;white-space:nowrap}
.cost-pill.stale{opacity:.55;border-style:dashed}
.cost-wrap{position:relative}
.cost-pop{position:absolute;top:calc(100% + 8px);right:0;min-width:230px;max-height:60vh;overflow-y:auto;background:var(--card,#fff);border:1px solid rgba(207,164,79,0.28);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,0.12);padding:10px 12px;z-index:60}
.cost-pop-h{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted,#888);margin-bottom:6px}
.cost-pop-sub{font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted2,#aaa);margin:2px 0 3px}
.cost-pop-row{display:flex;justify-content:space-between;gap:18px;font-size:13px;padding:3px 0;white-space:nowrap}
.cost-pop-row em{font-style:normal;color:var(--muted,#999);font-size:11px}
.cost-pop-total{border-top:1px solid rgba(0,0,0,0.08);margin-top:5px;padding-top:6px;font-weight:700;color:var(--gold3)}
.cost-cap{margin:2px 0 8px;padding-bottom:8px;border-bottom:1px solid rgba(0,0,0,0.08)}
.cost-cap-top{display:flex;justify-content:space-between;gap:12px;font-size:12px;color:var(--muted,#888);margin-bottom:5px}
.cost-cap-bar{height:6px;border-radius:4px;background:var(--warm2,#eee);overflow:hidden}
.cost-cap-fill{height:100%;border-radius:4px;background:linear-gradient(90deg,var(--gold1),var(--gold3));transition:width .3s}
.cost-cap-fill.over{background:var(--red)}
.cost-cap-warn{font-size:11px;color:var(--red);margin-top:5px;line-height:1.4}
.cost-cap-edit{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:12px;color:var(--muted,#888);margin-top:8px;padding-top:8px;border-top:1px solid rgba(0,0,0,0.08)}
.cost-cap-edit input{width:64px;border:1px solid var(--border2);border-radius:7px;padding:4px 7px;font:inherit;font-size:12px;text-align:right}
.cost-cap-edit button{border:1px solid var(--border2);background:var(--warm);border-radius:7px;padding:4px 10px;font-size:12px;font-weight:600;cursor:pointer}
.cost-cap-edit button:hover{border-color:var(--gold3);color:var(--gold3)}
.vsw-wrap{position:relative}
.vsw-btn{display:flex;align-items:center;gap:7px;background:var(--card);border:1px solid var(--border2);border-radius:20px;padding:6px 11px;cursor:pointer;color:var(--ink);font-size:12.5px;font-weight:600;max-width:200px}
.vsw-btn:hover{border-color:var(--gold3)}
.vsw-dot{width:9px;height:9px;border-radius:50%;background:var(--gold3);flex:none}
.vsw-lbl{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vsw-menu{position:absolute;top:42px;right:0;min-width:230px;background:var(--card);border:1px solid var(--border2);border-radius:14px;box-shadow:0 24px 60px rgba(36,29,18,0.18);padding:6px;z-index:300;display:none;max-height:60vh;overflow:auto}
.vsw-menu.open{display:block}
.vsw-item{display:flex;align-items:center;gap:9px;width:100%;background:transparent;border:none;padding:9px 10px;border-radius:9px;cursor:pointer;color:var(--ink);font-size:13px;text-align:left}
.vsw-item:hover{background:var(--warm2)}
.vsw-item.active{background:rgba(207,164,79,0.14)}
.vsw-item .vd{width:10px;height:10px;border-radius:50%;flex:none}
.vsw-item .vn{flex:1;font-weight:600}
.vsw-item .vc{font-size:11px;color:var(--muted)}
.role-pill{display:flex;background:var(--warm2);border:1px solid var(--border);border-radius:20px;padding:3px}
.role-pill button{border:none;background:transparent;color:var(--muted);font-size:11.5px;font-weight:600;padding:5px 12px;border-radius:16px;cursor:pointer}
.role-pill button.active{background:#fff;color:var(--ink);box-shadow:var(--shadow-sm)}
.usr{display:flex;align-items:center;gap:9px;cursor:default}
.avatar{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:12px;font-weight:700;flex-shrink:0}
.usr-meta{line-height:1.2}.usr-meta .n{font-size:12.5px;font-weight:600}.usr-meta .r{font-size:10.5px;color:var(--muted)}
.icon-btn{width:36px;height:36px;border-radius:10px;border:1px solid var(--border);background:#fff;color:var(--muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.15s}
.icon-btn:hover{color:var(--red);border-color:var(--border2)}
.icon-btn svg{width:17px;height:17px}
/* Notifications bell + dropdown */
.bell-wrap{position:relative}
.bell-btn{width:38px;height:38px;border-radius:10px;border:1px solid var(--border);background:#fff;color:var(--muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.15s}
.bell-btn:hover{color:var(--gold3);border-color:var(--gold2)}
.bell-btn svg{width:18px;height:18px}
.bell-badge{position:absolute;top:-5px;right:-5px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--gold3,#cfa44f);color:#fff;font-size:10px;font-weight:700;display:none;align-items:center;justify-content:center;line-height:1;box-shadow:0 0 0 2px var(--warm,#f4f1ea)}
.nav-badge{position:absolute;top:3px;right:3px;min-width:16px;height:16px;padding:0 4px;border-radius:8px;background:var(--red,#d9534f);color:#fff;font-size:9.5px;font-weight:700;display:none;align-items:center;justify-content:center;line-height:1;box-shadow:0 0 0 2px var(--panel,#fff)}
.notif-panel{position:absolute;top:46px;right:0;width:360px;max-width:88vw;background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 18px 48px rgba(40,30,10,0.18);z-index:120;overflow:hidden;display:none}
.notif-panel.open{display:block}
.notif-h{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;border-bottom:1px solid var(--border)}
.notif-h .t{font-size:13.5px;font-weight:700}
.notif-h button{border:none;background:transparent;color:var(--gold3);font-size:11.5px;font-weight:600;cursor:pointer;padding:0}
.notif-h button:disabled{color:var(--muted);cursor:default}
.notif-list{max-height:420px;overflow-y:auto}
.notif-item{display:flex;gap:11px;padding:12px 16px;border-bottom:1px solid var(--border);cursor:pointer;transition:.12s}
.notif-item:last-child{border-bottom:none}
.notif-item:hover{background:var(--warm,#f4f1ea)}
.notif-item.unread{background:rgba(207,164,79,0.07)}
.notif-item .av{width:30px;height:30px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:11px;font-weight:700}
.notif-item .bd{flex:1;min-width:0}
.notif-item .msg{font-size:12.5px;line-height:1.4;color:var(--ink)}
.notif-item.unread .msg{font-weight:600}
.notif-item .tm{font-size:10.5px;color:var(--muted);margin-top:3px}
.notif-item .dotnew{width:7px;height:7px;border-radius:50%;background:var(--gold3,#cfa44f);flex-shrink:0;margin-top:8px}
.notif-empty{padding:34px 16px;text-align:center;color:var(--muted);font-size:12.5px}
/* Global search */
.gsearch-wrap{display:flex}
.gsearch-trigger{display:flex;align-items:center;gap:8px;height:38px;padding:0 11px;border-radius:10px;border:1px solid var(--border);background:#fff;color:var(--muted);cursor:pointer;transition:.15s;min-width:190px}
.gsearch-trigger:hover{border-color:var(--gold2);color:var(--gold3)}
.gsearch-trigger svg{width:16px;height:16px;flex:none}
.gsearch-ph{flex:1;text-align:left;font-size:12.5px;color:var(--muted)}
.gsearch-kbd{font-size:10.5px;font-weight:700;color:var(--muted);border:1px solid var(--border);border-radius:6px;padding:1px 5px;line-height:1.5}
.gs-overlay{position:fixed;inset:0;background:rgba(40,30,10,0.34);backdrop-filter:blur(2px);z-index:300;display:none;align-items:flex-start;justify-content:center;padding-top:11vh}
.gs-overlay.open{display:flex}
.gs-panel{width:620px;max-width:92vw;background:#fff;border:1px solid var(--border);border-radius:16px;box-shadow:0 28px 70px rgba(40,30,10,0.30);overflow:hidden;animation:gsIn .14s ease}
@keyframes gsIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
.gs-head{display:flex;align-items:center;gap:11px;padding:14px 16px;border-bottom:1px solid var(--border)}
.gs-head .gs-ic{width:19px;height:19px;color:var(--gold3);flex:none}
.gs-input{flex:1;border:none;outline:none;background:transparent;font-size:15px;color:var(--ink);font-family:inherit}
.gs-input::placeholder{color:var(--muted2)}
.gs-esc{border:1px solid var(--border);background:var(--warm,#f4f1ea);color:var(--muted);font-size:11px;font-weight:700;border-radius:6px;padding:3px 7px;cursor:pointer}
.gs-body{max-height:60vh;overflow-y:auto;padding:6px 0}
.gs-hint,.gs-empty{padding:34px 18px;text-align:center;color:var(--muted);font-size:12.5px}
.gs-err{padding:24px 18px;text-align:center;color:var(--red);font-size:12.5px}
.gs-group-h{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);padding:11px 18px 5px}
.gs-more{margin-left:8px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--muted);opacity:.7}
.gs-row{display:flex;align-items:center;gap:11px;padding:9px 18px;cursor:pointer;transition:.1s}
.gs-row:hover,.gs-row.sel{background:rgba(207,164,79,0.10)}
.gs-row .gs-rtype{width:30px;height:30px;border-radius:8px;background:var(--warm2,#efe9db);color:var(--gold2);display:flex;align-items:center;justify-content:center;flex:none}
.gs-row .gs-rtype svg{width:15px;height:15px}
.gs-row .gs-rbd{flex:1;min-width:0}
.gs-row .gs-rt{font-size:13px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gs-row .gs-rs{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.gs-loading{padding:30px 18px;text-align:center;color:var(--muted);font-size:12.5px}
@media(max-width:900px){.gsearch-trigger{min-width:0;padding:0 10px}.gsearch-ph,.gsearch-kbd{display:none}}
/* @mention autocomplete */
.mention-pop{position:absolute;background:#fff;border:1px solid var(--border);border-radius:11px;box-shadow:0 12px 32px rgba(40,30,10,0.16);z-index:200;overflow:hidden;min-width:190px;max-height:220px;overflow-y:auto;display:none}
.mention-pop.open{display:block}
.mention-row{display:flex;align-items:center;gap:9px;padding:8px 12px;cursor:pointer;font-size:12.5px}
.mention-row.active,.mention-row:hover{background:var(--warm,#f4f1ea)}
.mention-row .mav{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:10px;font-weight:700;flex-shrink:0}

.content{flex:1;overflow-y:auto;padding:26px 30px;-webkit-overflow-scrolling:touch}
.mod{display:none}.mod.active{display:block}

/* shared cards */
.card{background:#fff;border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow-sm)}
.sec-title{font-size:19px;font-weight:700;letter-spacing:-.2px}
.sec-sub{color:var(--muted);font-size:13px;margin-top:3px}
.page-head{margin-bottom:22px}
.label{font-size:10.5px;font-weight:700;letter-spacing:.7px;text-transform:uppercase;color:var(--muted)}
.empty-st{color:var(--muted);font-size:13px;padding:14px 0}
/* Empty-state illustration icons must never stretch to fill their container. */
.empty-st svg{width:48px;height:48px}
/* Gold action buttons: keep their leading icon small + aligned. */
.btn-gold svg{width:18px;height:18px;vertical-align:-3px}
.btn-gold span{vertical-align:middle}
.btn-ghost{border:1px solid var(--border2);background:#fff;color:var(--ink2);font-size:12.5px;font-weight:600;padding:9px 16px;border-radius:11px;cursor:pointer;transition:.15s}
.btn-ghost svg,.btn-sm-gold svg{width:15px;height:15px;vertical-align:-2px}
.btn-ghost:hover{background:var(--warm)}
.ib-act{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border2);background:#fff;color:var(--ink2);font-size:12px;font-weight:600;padding:7px 11px;border-radius:9px;cursor:pointer;transition:.15s}
.ib-act:hover{background:var(--warm)}
.ib-act:disabled{opacity:.45;cursor:default}
.ib-act svg{width:14px;height:14px}
.ib-act-gold{border-color:var(--gold3);color:var(--gold2)}
.ib-act-gold:hover{background:var(--warm2)}
.btn-sm-gold{border:none;border-radius:10px;color:#3a2c12;font-size:12.5px;font-weight:700;padding:9px 16px;cursor:pointer;background:linear-gradient(135deg,var(--gold1),var(--gold3));box-shadow:0 5px 14px rgba(199,147,56,0.3)}
.btn-sm-gold:hover{filter:brightness(1.04)}

/* VENTURES */
.vgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.vcard{background:#fff;border:1px solid var(--border);border-radius:18px;padding:20px;box-shadow:var(--shadow-sm);cursor:pointer;transition:.15s;position:relative;overflow:hidden;border-top:3px solid var(--gold3)}
.vcard-edit{flex-shrink:0;width:28px;height:28px;border-radius:8px;border:1px solid var(--border);background:#fff;color:var(--muted2);cursor:pointer;font-size:13px;line-height:1}
.vcard-edit:hover{border-color:var(--gold3);color:var(--gold3);background:var(--warm)}
.vcard:hover{box-shadow:0 10px 26px rgba(120,90,30,0.14);transform:translateY(-2px)}
.vcard .vtop{display:flex;align-items:flex-start;gap:12px;margin-bottom:10px}
.vdot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;vertical-align:middle}
.vcard .vdot{width:38px;height:38px;border-radius:11px;margin-right:0;flex:0 0 auto;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:15px}
.vcard .vname{font-size:16px;font-weight:700;letter-spacing:-.3px;line-height:1.2}
.kind-badge{display:inline-block;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;padding:2px 8px;border-radius:20px;margin-top:4px}
.vcard .vtag{font-size:12.5px;color:var(--muted);min-height:17px;margin-bottom:14px;line-height:1.4}
.vroll{display:flex;gap:14px;margin-bottom:12px}
.vroll .vr{flex:1}
.vroll .vr b{font-size:19px;font-weight:700;display:block;letter-spacing:-.5px}
.vroll .vr span{font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.3px;font-weight:600}
.vhealth{height:6px;border-radius:6px;background:var(--warm2);overflow:hidden}
.vhealth i{display:block;height:100%;border-radius:6px;background:linear-gradient(90deg,var(--gold1),var(--gold3))}
.vdetail-head{display:flex;align-items:flex-start;gap:16px;background:#fff;border:1px solid var(--border);border-radius:18px;padding:22px;box-shadow:var(--shadow-sm);border-top:3px solid var(--gold3)}
.vsec{background:#fff;border:1px solid var(--border);border-radius:18px;padding:20px;box-shadow:var(--shadow-sm);margin-top:16px}
.vsec h3{font-size:14px;font-weight:700;margin:0 0 14px;display:flex;align-items:center;justify-content:space-between}
.vsec-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
@media(max-width:900px){.vsec-grid{grid-template-columns:1fr}}
.vqa{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;align-items:center}
.vqa input,.vqa select{flex:1;min-width:120px;padding:8px 10px;font-size:12.5px;border:1px solid var(--border);border-radius:9px;font-family:inherit}
.vmini{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--border)}
.vmini:last-child{border-bottom:none}

/* HOME dashboard */
.dash-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:16px}
.vsum-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px;margin-top:14px}
.vsum-c{border:1px solid var(--border);border-radius:13px;padding:13px 14px;cursor:pointer;transition:.15s;background:var(--warm)}
.vsum-c:hover{border-color:var(--gold3);box-shadow:var(--shadow-sm);transform:translateY(-1px)}
.vsum-h{display:flex;align-items:center;gap:8px}
.vsum-h .vd{width:10px;height:10px;border-radius:50%;flex:none}
.vsum-n{font-weight:700;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vsum-stats{display:flex;gap:14px;margin-top:9px;font-size:12px;color:var(--muted)}
.vsum-stats b{color:var(--ink);font-size:14px}
.vsum-badges{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px}
.vsum-b{font-size:10.5px;font-weight:600;padding:2px 7px;border-radius:999px}
.vsum-b.od,.attn-pill.od,.attn-tag.od{background:rgba(217,83,79,0.13);color:#c0392b}
.vsum-b.dt,.attn-pill.dt,.attn-tag.dt{background:rgba(245,158,11,0.15);color:#b8770a}
.vsum-b.un,.attn-pill.un,.attn-tag.un{background:rgba(99,102,241,0.13);color:#4f46e5}
.vsum-b.ok{background:rgba(63,174,106,0.13);color:#2f8f54}
.attn-pill{font-size:11px;font-weight:600;padding:3px 9px;border-radius:999px}
.attn-tag{font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:999px;white-space:nowrap}
.dcard{background:#fff;border:1px solid var(--border);border-radius:18px;padding:20px 22px;box-shadow:var(--shadow-sm)}
.dcard .dh{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.dcard .dh .ic{width:34px;height:34px;border-radius:10px;background:var(--warm2);display:flex;align-items:center;justify-content:center;color:var(--gold3)}
.dcard .dh .ic svg{width:18px;height:18px}
.dcard .big{font-size:30px;font-weight:700;letter-spacing:-1px}
.dcard .cap{font-size:12px;color:var(--muted);margin-top:2px}
.av-row{display:flex;margin-top:14px}
.av-row .avatar{width:30px;height:30px;font-size:11px;border:2px solid #fff;margin-left:-8px}
.av-row .avatar:first-child{margin-left:0}
.mini-list{margin-top:12px;display:flex;flex-direction:column;gap:8px}
.mini-row{display:flex;align-items:center;gap:10px;font-size:12.5px}
.mini-row .dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.bar{height:6px;border-radius:6px;background:var(--warm2);overflow:hidden;margin-top:6px}
.bar i{display:block;height:100%;border-radius:6px;background:linear-gradient(90deg,var(--gold1),var(--gold3))}
.timeline{margin-top:16px;display:flex;flex-direction:column}
.tl-row{display:flex;align-items:center;gap:13px;padding:12px 0;border-bottom:1px solid var(--border)}
.tl-row:last-child{border-bottom:none}
.tl-row .txt{flex:1;font-size:13px}.tl-row .txt b{font-weight:600}
.tl-row .tm{font-size:11.5px;color:var(--muted2)}

/* status dot pulse */
.live-dot{width:9px;height:9px;border-radius:50%;background:var(--green);animation:bb-pulse 1.6s infinite}

/* MY WORK */
.track-banner{border:1.5px solid var(--gold2);background:linear-gradient(120deg,rgba(230,197,119,0.1),rgba(255,255,255,0.4));border-radius:18px;padding:20px 22px;display:flex;align-items:center;gap:18px;margin-bottom:22px}
.task-li{background:#fff;border:1px solid var(--border);border-radius:15px;padding:16px 18px;display:flex;align-items:center;gap:16px;margin-bottom:11px;box-shadow:var(--shadow-sm)}
.task-li .pdot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.task-li .ti{flex:1}.task-li .ti .t{font-size:14px;font-weight:600}.task-li .ti .m{font-size:11.5px;color:var(--muted);margin-top:2px}
.status-pill{font-size:10.5px;font-weight:700;padding:4px 10px;border-radius:20px;text-transform:capitalize}
.sp-todo{background:var(--warm2);color:var(--ink2)}
.sp-doing{background:rgba(59,130,246,0.12);color:var(--blue)}
.sp-review{background:rgba(230,197,119,0.2);color:var(--gold3)}
.sp-done{background:rgba(63,174,106,0.14);color:var(--green)}
.sp-available{background:rgba(63,174,106,0.14);color:var(--green)}
.sp-checked_out{background:rgba(59,130,246,0.12);color:var(--blue)}
.sp-maintenance{background:rgba(196,106,85,0.16);color:#b15239}
.eq-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.eq-card{background:#fff;border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow-sm);padding:16px;cursor:pointer;transition:box-shadow .15s,transform .15s}
.eq-card:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
.eq-filterbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:18px}
.eq-filterbar select,.eq-filterbar input{border:1px solid var(--border);background:#fff;border-radius:10px;padding:8px 11px;font-size:12.5px;color:var(--ink)}
.eq-meta{font-size:11.5px;color:var(--muted);display:flex;align-items:center;gap:6px;margin-top:5px}
.eq-vbadge{font-size:10px;font-weight:700;padding:3px 9px;border-radius:20px}
.sp-won{background:rgba(63,174,106,0.16);color:var(--green)}
.sp-lost{background:rgba(220,68,68,0.12);color:var(--red)}
.pipe{display:grid;grid-template-columns:repeat(6,minmax(180px,1fr));gap:12px;overflow-x:auto;padding-bottom:6px}
.pcol{background:var(--warm);border:1px solid var(--border);border-radius:16px;padding:12px;min-height:140px}
.pcol-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;padding:0 2px}
.pcol-h .nm{font-size:11.5px;font-weight:700;color:var(--ink2);text-transform:capitalize}
.pcol-h .ct{font-size:11px;color:var(--muted);background:#fff;border:1px solid var(--border);border-radius:10px;padding:1px 8px}
.pcard{background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow-sm);padding:11px;margin-bottom:9px;cursor:pointer;transition:box-shadow .15s,transform .15s}
.pcard:hover{box-shadow:var(--shadow);transform:translateY(-1px)}
.pcard .nm{font-weight:700;font-size:13px}
.pcard .co{font-size:11.5px;color:var(--muted);margin-top:2px}
.kpi-row{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:18px}
.kpi{background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow-sm);padding:14px 18px;min-width:130px}
.kpi .v{font-size:22px;font-weight:800;color:var(--ink)}
.kpi .l{font-size:11.5px;color:var(--muted);margin-top:2px}
.soc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;align-items:start}
@media(max-width:900px){.pipe{grid-template-columns:repeat(6,75vw)}.soc-grid{grid-template-columns:1fr}}

/* TIME */
.checkin-card{border:2px solid transparent;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,var(--gold1),var(--gold3)) border-box;border-radius:22px;padding:34px;text-align:center;box-shadow:var(--shadow-sm);max-width:480px;margin:0 auto 26px}
.orb{width:96px;height:96px;border-radius:50%;margin:0 auto 18px;background:linear-gradient(135deg,var(--gold1),var(--gold3));box-shadow:0 10px 30px rgba(199,147,56,0.45);display:flex;align-items:center;justify-content:center;color:#fff;animation:bb-breathe 3.4s ease-in-out infinite}
.orb svg{width:38px;height:38px}
.orb.lg{width:108px;height:108px}
.timer{font-size:42px;font-weight:700;letter-spacing:1px;font-variant-numeric:tabular-nums;margin:8px 0 4px}
.tbl{width:100%;border-collapse:collapse;font-size:13px}
.tbl th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);font-weight:700;padding:11px 12px;border-bottom:1px solid var(--border)}
.tbl td{padding:12px;border-bottom:1px solid var(--border)}
.tbl tr:last-child td{border-bottom:none}
.ts-grid{width:100%;border-collapse:collapse;font-size:12.5px}
.ts-grid th,.ts-grid td{padding:10px;text-align:center;border:1px solid var(--border)}
.ts-grid th:first-child,.ts-grid td:first-child{text-align:left;font-weight:600}
.ts-grid thead th{background:var(--warm);font-size:10.5px;text-transform:uppercase;color:var(--muted)}

/* PROJECTS */
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px;align-items:center}
.chip{font-size:12.5px;font-weight:600;padding:7px 14px;border-radius:20px;border:1px solid var(--border);background:#fff;color:var(--ink2);cursor:pointer;display:flex;align-items:center;gap:7px}
.chip.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.chip .cd{width:8px;height:8px;border-radius:50%}
.view-toggle{margin-left:auto;display:flex;background:var(--warm2);border-radius:11px;padding:3px}
.view-toggle button{border:none;background:transparent;color:var(--muted);font-size:12px;font-weight:600;padding:6px 13px;border-radius:9px;cursor:pointer}
.view-toggle button.active{background:#fff;color:var(--ink);box-shadow:var(--shadow-sm)}
.board{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.bcol{background:var(--warm);border:1px solid var(--border);border-radius:16px;padding:13px;min-height:120px}
.bcol-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:11px;padding:0 3px}
.bcol-h .nm{font-size:12px;font-weight:700;color:var(--ink2)}
.bcol-h .ct{font-size:11px;color:var(--muted);background:#fff;border:1px solid var(--border);border-radius:10px;padding:1px 8px}
.tcard{background:#fff;border:1px solid var(--border);border-radius:12px;padding:13px;margin-bottom:9px;cursor:pointer;box-shadow:var(--shadow-sm);transition:.12s}
.tcard:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(36,29,18,0.1)}
.tcard .pj{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--muted);margin-bottom:7px}
.tcard .pj .cd{width:7px;height:7px;border-radius:50%}
.tcard .tt{font-size:13px;font-weight:600;line-height:1.35}
.tcard .ft{display:flex;align-items:center;justify-content:space-between;margin-top:11px}
.tcard .ft .tm{font-size:11px;color:var(--muted2)}

/* DRAWER */
.drawer-bd{position:fixed;inset:0;background:rgba(36,29,18,0.32);backdrop-filter:blur(2px);z-index:200;display:none}
.drawer{position:fixed;top:0;right:0;bottom:0;width:420px;max-width:90vw;background:#fff;z-index:210;box-shadow:-20px 0 60px rgba(36,29,18,0.2);transform:translateX(100%);transition:transform .28s cubic-bezier(.2,.7,.3,1);display:flex;flex-direction:column}
.drawer.open{transform:translateX(0)}
.drawer-h{padding:20px 24px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
.drawer-b{padding:24px;overflow-y:auto;flex:1}
.kv2{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:20px 0}
.kv2 .k{font-size:10.5px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);font-weight:700;margin-bottom:6px}
.kv2 .v{font-size:14px;font-weight:600}
.disc{margin-top:24px;border-top:1px solid var(--border);padding-top:20px}
.disc-h{font-size:10.5px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);font-weight:700;margin-bottom:14px}
.disc-list{display:flex;flex-direction:column;gap:14px;max-height:300px;overflow-y:auto;margin-bottom:16px}
.disc-row{display:flex;gap:10px;align-items:flex-start}
.disc-row .ava{width:30px;height:30px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:10.5px;font-weight:700}
.disc-row .bod{flex:1;min-width:0}
.disc-row .meta{display:flex;align-items:center;gap:8px;margin-bottom:3px}
.disc-row .meta .nm{font-size:12.5px;font-weight:700;color:var(--ink)}
.disc-row .meta .tm{font-size:11px;color:var(--muted)}
.disc-row .meta .del{margin-left:auto;border:none;background:transparent;color:var(--muted);cursor:pointer;font-size:11px;opacity:0;transition:.15s;padding:0}
.disc-row:hover .meta .del{opacity:1}
.disc-row .del:hover{color:#c4564a}
.disc-row .txt{font-size:13px;line-height:1.55;color:var(--ink2);white-space:pre-wrap;word-break:break-word}
.disc-comp textarea{width:100%;border:1px solid var(--border2);border-radius:10px;padding:11px 12px;font:inherit;font-size:13px;resize:vertical;min-height:60px;background:var(--warm);color:var(--ink);box-sizing:border-box}
.disc-comp textarea:focus{outline:none;border-color:var(--gold2)}
.disc-comp .row{display:flex;justify-content:flex-end;margin-top:10px}
.disc-comp .btn-gold{width:auto;padding:9px 20px}

/* CHAT (task) */
.tchat{display:flex;flex-direction:column;height:calc(100vh - 64px - 0px);height:calc(100dvh - 64px - 0px);margin:-26px -30px;}
.tchat-ctx{padding:15px 30px;border-bottom:1px solid var(--border);background:#fff;display:flex;align-items:center;gap:12px;flex-shrink:0}
.tchat-ctx .nm{font-size:14px;font-weight:600}
.scope-badge{font-size:10.5px;font-weight:700;color:var(--gold3);background:rgba(207,164,79,0.14);border:1px solid rgba(207,164,79,0.3);padding:4px 10px;border-radius:20px}
.tchat-body{flex:1;overflow-y:auto;padding:24px 30px;display:flex;flex-direction:column;gap:16px}
.tbub{display:flex;gap:11px;max-width:680px}
.tbub.u{align-self:flex-end;flex-direction:row-reverse}
.tbub .ava{width:30px;height:30px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:11px;font-weight:700}
.tbub .ava.ai{background:linear-gradient(135deg,var(--gold1),var(--gold3))}
.tbub .bod{padding:11px 15px;border-radius:14px;font-size:13.5px;line-height:1.55;white-space:pre-wrap;word-break:break-word}
.tbub.a .bod{background:#fff;border:1px solid var(--border);border-top-left-radius:4px}
.tbub.u .bod{background:linear-gradient(135deg,rgba(230,197,119,0.22),rgba(207,164,79,0.16));border:1px solid rgba(207,164,79,0.25);border-top-right-radius:4px}
.deliv{margin-top:10px;border:1px solid var(--border2);border-radius:12px;overflow:hidden;max-width:340px}
.deliv .dh{display:flex;align-items:center;justify-content:space-between;padding:11px 13px;background:var(--warm)}
.deliv .dh .fn{font-size:12.5px;font-weight:600}.deliv .dh .fs{font-size:11px;color:var(--muted)}
.deliv .dl{border:none;background:var(--ink);color:#fff;font-size:11px;font-weight:600;padding:6px 12px;border-radius:8px;cursor:pointer;display:flex;align-items:center;gap:5px}
.composer{flex-shrink:0;border-top:1px solid var(--border);background:#fff;padding:14px 30px;display:flex;align-items:flex-end;gap:11px}
.composer .att{width:40px;height:40px;border-radius:11px;border:1px solid var(--border);background:var(--warm);color:var(--muted);display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}
.composer textarea{flex:1;border:1px solid var(--border);background:var(--warm);border-radius:13px;padding:11px 14px;font-size:13.5px;resize:none;height:44px;max-height:140px;outline:none;line-height:1.4}
.composer textarea:focus{border-color:var(--gold2);background:#fff}
.composer .send{width:40px;height:40px;border-radius:11px;border:none;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}

/* MEDIA */
.media-grid{display:grid;grid-template-columns:var(--m-w-side,300px) 8px minmax(0,1fr) 8px var(--m-w-chat,320px);gap:0;height:calc(100vh - 64px);height:calc(100dvh - 64px);margin:-26px -30px}
.media-side,.media-side-rail{grid-column:1;grid-row:1}.media-out{grid-column:3}.media-chat,.media-chat-rail{grid-column:5;grid-row:1}
.media-side-rail,.media-chat-rail{display:none}
.m-resizer{grid-row:1;align-self:stretch;cursor:col-resize;display:flex;align-items:center;justify-content:center;background:transparent;z-index:2}
.m-resizer::after{content:'';width:3px;height:40px;background:var(--border);border-radius:3px}
.m-resizer:hover::after,.m-resizer.dragging::after{background:var(--gold2)}
.m-resizer-side{grid-column:2}.m-resizer-chat{grid-column:4}
.media-grid.side-collapsed{grid-template-columns:40px 0 minmax(0,1fr) 8px var(--m-w-chat,320px)}
.media-grid.side-collapsed>.media-side,.media-grid.side-collapsed>.m-resizer-side{display:none}
.media-grid.side-collapsed>.media-side-rail{display:flex}
.media-grid.chat-collapsed{grid-template-columns:var(--m-w-side,300px) 8px minmax(0,1fr) 0 40px}
.media-grid.chat-collapsed>.media-chat,.media-grid.chat-collapsed>.m-resizer-chat{display:none}
.media-grid.chat-collapsed>.media-chat-rail{display:flex}
.media-grid.side-collapsed.chat-collapsed{grid-template-columns:40px 0 minmax(0,1fr) 0 40px}
.media-side{border-right:1px solid var(--border);overflow-y:auto;scrollbar-gutter:stable;background:#fff}
.media-side .ms{padding:14px 16px;border-bottom:1px solid var(--border)}
.media-out{display:flex;flex-direction:column;overflow:hidden;min-width:0}
.media-chat{border-left:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;background:#fff}
.type-toggle{display:flex;background:var(--warm2);border-radius:11px;padding:3px;gap:3px}
.type-toggle button{flex:1;padding:8px;border:none;background:transparent;color:var(--muted);border-radius:9px;cursor:pointer;font-size:12.5px;font-weight:600}
.type-toggle button.active{background:#fff;color:var(--ink);box-shadow:var(--shadow-sm)}
.media-side select,.media-side input[type=text],.media-side input[type=number]{width:100%;background:var(--warm);border:1px solid var(--border);color:var(--ink);padding:9px 11px;border-radius:10px;font-size:12.5px;outline:none}
.media-side textarea{width:100%;background:var(--warm);border:1px solid var(--border);color:var(--ink);padding:11px;border-radius:10px;font-size:13px;resize:none;height:90px;outline:none;line-height:1.5}
.model-desc{color:var(--muted);font-size:11.5px;margin-top:6px;line-height:1.4}
.mbadge{display:inline-block;font-size:9px;padding:2px 7px;border-radius:5px;margin-top:6px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;background:rgba(207,164,79,0.14);color:var(--gold3);border:1px solid rgba(207,164,79,0.3)}
.aspect-pills{display:flex;flex-wrap:wrap;gap:6px}
.aspect-pill{display:flex;flex-direction:column;align-items:center;gap:4px;padding:7px 6px;min-width:50px;background:var(--warm);border:1px solid var(--border);border-radius:9px;cursor:pointer;color:var(--muted);font-size:10px}
.aspect-pill.selected{border-color:var(--gold2);color:var(--gold3);background:rgba(207,164,79,0.08)}
.aspect-pill .ri{width:22px;height:22px;display:flex;align-items:center;justify-content:center}
.aspect-pill .ri span{display:block;border:1.5px solid currentColor;border-radius:2px}
.batch-pills{display:flex;gap:6px}
.batch-pill{flex:1;padding:9px;background:var(--warm);border:1px solid var(--border);border-radius:9px;cursor:pointer;color:var(--muted);font-size:13px;font-weight:700}
.batch-pill.selected{border-color:var(--gold2);background:linear-gradient(135deg,var(--gold1),var(--gold3));color:#3a2c12}
.upload-area{border:1.5px dashed var(--border2);border-radius:10px;padding:14px;text-align:center;cursor:pointer;color:var(--muted);font-size:11.5px;position:relative;min-height:64px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}
.upload-area:hover{border-color:var(--gold2);background:var(--warm)}
.upload-area input{position:absolute;inset:0;opacity:0;cursor:pointer}
.upload-area img{max-height:60px;border-radius:6px}
.gen-btn{width:100%;padding:13px;border:none;border-radius:12px;color:#3a2c12;font-size:13.5px;font-weight:700;cursor:pointer;background:linear-gradient(135deg,var(--gold1),var(--gold3));box-shadow:0 8px 20px rgba(199,147,56,0.35);display:flex;align-items:center;justify-content:center;gap:8px}
.gen-btn:disabled{opacity:.5;cursor:not-allowed}
.spinner{width:15px;height:15px;border:2px solid rgba(58,44,18,0.3);border-top-color:#3a2c12;border-radius:50%;animation:spin .7s linear infinite;display:none}
.media-out-main{flex:1;display:flex;align-items:center;align-items:safe center;justify-content:center;padding:28px;overflow-y:auto;min-height:0}
.media-out-main img,.media-out-main video{max-width:100%;max-height:100%;border-radius:12px}
.empty-media{text-align:center;color:var(--muted)}
.empty-media .ei{width:52px;height:52px;margin:0 auto 12px;color:var(--border2)}
.result-wrap{display:flex;flex-direction:column;align-items:center;gap:14px;width:100%;height:100%;min-height:0;justify-content:center;justify-content:safe center}
/* The preview shares this column with the actions row and the prompt strip. Without
   these, max-height:100% measured the image against the WHOLE panel, so image +
   actions + prompt overflowed and centring pushed the top of the picture out of the
   scroll area — a 1:1 image looked cropped from the top even though the saved file
   was perfect. flex-shrink + min-height:0 let the image give way instead. */
.result-wrap>img,.result-wrap>video{flex:0 1 auto;min-height:0;object-fit:contain}
.result-actions{display:flex;gap:8px}
.result-actions a,.result-actions button{padding:8px 16px;background:#fff;border:1px solid var(--border2);color:var(--ink);border-radius:9px;font-size:12px;cursor:pointer;text-decoration:none}
.prompt-strip{width:100%;max-width:560px;background:var(--warm);border:1px solid var(--border);border-radius:11px;padding:11px 13px;position:relative}
.prompt-strip .meta{font-size:10.5px;color:var(--muted);margin-bottom:4px}
.prompt-strip .txt{font-size:12.5px;color:var(--ink2);line-height:1.5;white-space:pre-wrap}
.prompt-copy{position:absolute;top:9px;right:11px;padding:4px 10px;background:#fff;border:1px solid var(--border2);border-radius:7px;font-size:10px;cursor:pointer}
.status-bar{height:36px;border-top:1px solid var(--border);padding:0 18px;display:flex;align-items:center;gap:9px;font-size:11.5px;color:var(--muted);flex-shrink:0}
.status-dot{width:7px;height:7px;border-radius:50%;background:var(--muted2)}
.status-dot.active{background:var(--green);animation:bb-pulse 1.5s infinite}
.status-dot.error{background:var(--red)}
.history-strip{border-top:1px solid var(--border);height:104px;flex-shrink:0;display:flex;align-items:center}
.history-lbl{font-size:9px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);writing-mode:vertical-rl;transform:rotate(180deg);padding:0 11px;height:100%;display:flex;align-items:center;border-right:1px solid var(--border);font-weight:700}
.history-scroll{flex:1;display:flex;align-items:center;gap:8px;overflow-x:auto;padding:10px 12px;height:100%}
.history-item{flex-shrink:0;width:72px;height:72px;border-radius:8px;overflow:hidden;border:1px solid var(--border);cursor:pointer;position:relative}
.history-item img,.history-item video{width:100%;height:100%;object-fit:cover}
/* The thumbnail whose asset is open in the viewer (arrow keys move this). */
.history-item.sel{border-color:var(--gold3);box-shadow:0 0 0 2px var(--gold3)}
/* Image reference thumbnails, each with a remove ×. Sit above the drop-zone so the
   file input (which covers the drop-zone) can't swallow the button's clicks. */
/* Drag a generated asset onto a reference/lip-sync slot. */
.history-item{cursor:grab}
.history-item:active{cursor:grabbing}
.m-drop-hot{border-color:var(--gold3)!important;background:var(--warm2)!important;box-shadow:0 0 0 2px var(--gold3) inset}
.m-voice-play{flex:none;width:34px;height:34px;border:1px solid var(--border2,var(--border));background:var(--card);color:var(--gold3);border-radius:9px;cursor:pointer;font-size:12px;line-height:1}
.m-voice-play:hover{background:var(--warm)}
/* Lip-sync source/audio slots: a filled chip with a thumbnail + remove ×. */
.m-lip-chip{display:flex;align-items:center;gap:9px;padding:7px;border:1px solid var(--border);border-radius:9px;background:var(--card)}
.m-lip-chip video{width:46px;height:46px;object-fit:cover;border-radius:6px;flex:none;background:#000}
.m-lip-chip .m-lip-aud{width:46px;height:46px;display:flex;align-items:center;justify-content:center;border-radius:6px;background:var(--warm2);color:var(--gold3);font-size:20px;flex:none}
.m-lip-chip .m-lip-name{flex:1;min-width:0;font-size:12px;color:var(--ink2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.m-lip-chip .m-lip-x{border:none;background:none;color:var(--red);cursor:pointer;font-size:17px;line-height:1;padding:2px 5px;flex:none}
.m-ref-list{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.m-ref-list:empty{display:none}
.m-ref-thumb{position:relative;width:52px;height:52px;border-radius:7px;overflow:hidden;border:1px solid var(--border)}
.m-ref-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.m-ref-thumb .m-ref-x{position:absolute;top:2px;right:2px;width:18px;height:18px;border:none;border-radius:50%;background:rgba(0,0,0,.6);color:#fff;font-size:13px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0}
.m-ref-thumb .m-ref-x:hover{background:var(--red)}
/* "Use as reference" role picker (video mode: reference / start frame / end frame). */
.m-ref-menu{position:fixed;z-index:9999;min-width:190px;background:#fff;border:1px solid var(--border);border-radius:10px;box-shadow:0 10px 30px rgba(36,29,18,.18);padding:5px}
.m-ref-menu .m-ref-menu-h{font-size:10.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--muted);padding:6px 10px 4px}
.m-ref-menu button{display:block;width:100%;text-align:left;background:none;border:none;font:inherit;font-size:13px;color:var(--ink);padding:8px 12px;border-radius:7px;cursor:pointer}
.m-ref-menu button:hover{background:var(--warm2)}
.h-badge{position:absolute;bottom:3px;right:3px;background:rgba(0,0,0,0.65);color:#fff;font-size:8px;padding:1px 4px;border-radius:3px;text-transform:uppercase}
.history-empty{color:var(--muted2);font-size:11.5px}
.mchat-bar{display:flex;gap:6px;padding:11px 13px;border-bottom:1px solid var(--border)}
.mchat-bar select{flex:1;background:var(--warm);border:1px solid var(--border);border-radius:9px;padding:8px;font-size:12px;outline:none}
.proj-btn{width:32px;border:1px solid var(--border);background:var(--warm);border-radius:9px;cursor:pointer;color:var(--muted);font-size:14px}
.mode-toggle{display:flex;background:var(--warm2);border-radius:8px;padding:2px}
.mode-opt{padding:5px 11px;border:none;background:transparent;color:var(--muted);border-radius:7px;cursor:pointer;font-size:11px;font-weight:600}
.mode-opt.active{background:#fff;color:var(--gold3);box-shadow:var(--shadow-sm)}
.mchat-msgs{flex:1;overflow-y:auto;padding:13px;display:flex;flex-direction:column;gap:10px}
.mmsg{display:flex;flex-direction:column}.mmsg.user{align-items:flex-end}.mmsg.assistant{align-items:flex-start}
.mmsg .b{padding:9px 12px;border-radius:11px;font-size:12.5px;line-height:1.55;max-width:250px;white-space:pre-wrap;word-break:break-word}
.mmsg.user .b{background:linear-gradient(135deg,rgba(230,197,119,0.25),rgba(207,164,79,0.18));border:1px solid rgba(207,164,79,0.25)}
.mmsg.assistant .b{background:#fff;border:1px solid var(--border)}
.apply-btn{margin-top:7px;padding:6px 13px;background:rgba(207,164,79,0.14);border:1px solid rgba(207,164,79,0.3);color:var(--gold3);border-radius:8px;font-size:11px;cursor:pointer;font-weight:600}
.mchat-foot{border-top:1px solid var(--border);padding:11px}
.mchat-foot textarea{width:100%;background:var(--warm);border:1px solid var(--border);border-radius:10px;padding:10px;font-size:12.5px;resize:none;height:60px;outline:none;margin-bottom:8px}
.file-deliverable{margin-top:7px;border:1px solid var(--border2);border-radius:10px;overflow:hidden}
.file-deliverable .fdh{display:flex;align-items:center;justify-content:space-between;padding:7px 10px;background:var(--warm);font-size:11px}
.file-deliverable .fda button{background:#fff;border:1px solid var(--border2);font-size:10px;padding:3px 8px;border-radius:6px;cursor:pointer;margin-left:4px}
.file-deliverable iframe{width:100%;height:260px;border:none;background:#fff;display:none}

/* VIBE CODING */
.vibe-grid{display:grid;grid-template-columns:420px 1fr;gap:0;height:calc(100vh - 64px);height:calc(100dvh - 64px);margin:-26px -30px}
.vibe-chat{border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;background:#fff;min-width:0}
.vibe-prev{display:flex;flex-direction:column;overflow:hidden;min-width:0;background:var(--warm)}
.vibe-prevbar{height:44px;border-bottom:1px solid var(--border);background:#fff;display:flex;align-items:center;gap:10px;padding:0 16px;flex-shrink:0}
.vibe-prevbar .nm{font-size:12.5px;font-weight:600;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vibe-lock{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:600;padding:3px 9px;border-radius:999px;background:rgba(217,154,43,0.14);color:var(--amber);border:1px solid rgba(217,154,43,0.3)}
.vibe-lock svg{width:11px;height:11px}
.vibe-prevwrap{flex:1;position:relative;overflow:hidden}
.vibe-prevwrap iframe{width:100%;height:100%;border:none;background:#fff}
.vibe-prevempty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--muted);padding:30px;gap:8px}
.vibe-prevempty .ei{width:48px;height:48px;color:var(--border2)}
.vibe-dels{border-top:1px solid var(--border);background:#fff;max-height:160px;overflow-y:auto;flex-shrink:0}
.vibe-dels .dh{font-size:9px;text-transform:uppercase;letter-spacing:1px;color:var(--muted);font-weight:700;padding:9px 16px 5px}
.vibe-del{display:flex;align-items:center;gap:9px;padding:8px 16px;border-top:1px solid var(--border)}
.vibe-del .nm{flex:1;font-size:12px;font-weight:600;color:var(--ink2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer}
.vibe-del button{background:#fff;border:1px solid var(--border2);font-size:10px;padding:4px 10px;border-radius:7px;cursor:pointer;color:var(--ink2)}
.vibe-del .tag{font-size:9px;text-transform:uppercase;color:var(--gold3);background:rgba(207,164,79,0.12);padding:2px 7px;border-radius:5px;font-weight:700}

/* SETTINGS / TEAM */
.set-block{background:#fff;border:1px solid var(--border);border-radius:16px;padding:22px;margin-bottom:18px;box-shadow:var(--shadow-sm)}
.set-block h3{font-size:15px;font-weight:700;margin-bottom:4px}
.set-block .d{color:var(--muted);font-size:12.5px;margin-bottom:16px}
/* Appearance / theme swatches */
.theme-swatches{display:flex;flex-wrap:wrap;gap:10px}
.theme-sw{display:flex;align-items:center;gap:8px;border:1px solid var(--border2);background:var(--card);border-radius:11px;padding:8px 13px;font:inherit;font-size:13px;font-weight:600;color:var(--ink2);cursor:pointer;transition:.14s}
.theme-sw:hover{border-color:var(--gold3);color:var(--ink)}
.theme-sw.active{border-color:var(--gold3);color:var(--gold3);box-shadow:0 0 0 3px rgba(207,164,79,0.14)}
.theme-sw-dot{width:18px;height:18px;border-radius:50%;flex:none;box-shadow:inset 0 0 0 1px rgba(0,0,0,0.08)}
.theme-custom{margin-top:16px}
.theme-custom input[type=color]{width:44px;height:34px;padding:0;border:1px solid var(--border2);border-radius:9px;background:var(--card);cursor:pointer}
.theme-custom input[type=color].active{border-color:var(--gold3);box-shadow:0 0 0 3px rgba(207,164,79,0.14)}
.np-row{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:12px 0;border-bottom:1px solid var(--border)}
.np-row:last-of-type{border-bottom:none}
.np-row input[type=checkbox]{width:18px;height:18px;accent-color:var(--gold);flex:none;margin-top:2px}
.key-row{display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--warm);border:1px solid var(--border);border-radius:11px;margin-bottom:9px}
.key-row .nm{flex:1;font-weight:600;font-size:13px}
.key-row .pv{font-size:11px;color:var(--gold3);background:rgba(207,164,79,0.12);padding:3px 9px;border-radius:6px}
.key-row .mv{font-family:monospace;font-size:12px;color:var(--muted)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.form-grid .fw{grid-column:1/-1}
.in{width:100%;background:var(--warm);border:1px solid var(--border);color:var(--ink);padding:11px 12px;border-radius:11px;font-size:13px;outline:none}
.in:focus{border-color:var(--gold2);background:#fff}
.cap-spin{display:inline-block;width:13px;height:13px;border:2px solid rgba(207,164,79,.3);border-top-color:var(--gold2);border-radius:50%;animation:spin .7s linear infinite;flex:none}
.pill-row{display:flex;gap:9px;flex-wrap:wrap}
/* Mobile portrait: stack Settings so nothing overflows the screen width. */
@media(max-width:560px){
  .set-block{padding:16px}
  .form-grid{grid-template-columns:1fr}
  .key-row{flex-wrap:wrap;gap:8px 10px}
  .key-row .nm{flex:1 1 100%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .key-row .mv{flex:1 1 100%;order:4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
.cl-pill{padding:9px 15px;border:1px solid var(--border2);background:#fff;border-radius:11px;font-size:12.5px;font-weight:600;cursor:pointer;color:var(--ink2)}
.cl-pill.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.color-swatches{display:flex;gap:8px;flex-wrap:wrap}
.sw{width:30px;height:30px;border-radius:9px;cursor:pointer;border:2px solid transparent}
.sw.active{border-color:var(--ink);box-shadow:0 0 0 2px #fff inset}

/* modal */
.sub-tab{border:1px solid var(--border);background:#fff;color:var(--muted);padding:7px 16px;border-radius:9px;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit}
.sub-tab.active{background:linear-gradient(135deg,var(--gold1),var(--gold3));border-color:var(--gold3);color:#3a2c12}
.modal-bd{position:fixed;inset:0;background:rgba(36,29,18,0.4);backdrop-filter:blur(3px);z-index:250;display:none;align-items:center;justify-content:center}
.modal{background:#fff;border-radius:18px;width:440px;max-width:92vw;max-height:90vh;overflow-y:auto;padding:26px;box-shadow:var(--shadow)}
.modal h3{font-size:16px;font-weight:700;margin-bottom:18px;display:flex;align-items:center;justify-content:space-between}
.modal h3 button{border:none;background:none;font-size:20px;color:var(--muted);cursor:pointer}

/* ── WorkDrive: three-dots action menu ── */
.drive-menu{background:#fff;border:1px solid var(--border2);border-radius:13px;box-shadow:0 14px 38px rgba(36,29,18,.17);padding:6px;min-width:186px}
.drive-menu .dm-item{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:none;background:transparent;color:var(--ink2);font:inherit;font-size:13px;font-weight:600;padding:9px 10px;border-radius:9px;cursor:pointer;transition:.12s}
.drive-menu .dm-item svg{width:16px;height:16px;color:var(--muted);flex:0 0 auto;transition:.12s}
.drive-menu .dm-item:hover{background:var(--warm2);color:var(--gold3)}
.drive-menu .dm-item:hover svg{color:var(--gold3)}
.drive-menu .dm-item.dm-danger{color:var(--red)}
.drive-menu .dm-item.dm-danger svg{color:var(--red);opacity:.85}
.drive-menu .dm-item.dm-danger:hover{background:rgba(217,83,79,.09);color:var(--red)}
.drive-menu .dm-sep{height:1px;background:var(--border);margin:5px 8px}

/* ── Share dialog ── */
.share-people{margin-bottom:2px}
.share-list{display:flex;flex-direction:column}
.share-row{display:flex;align-items:center;gap:11px;padding:10px 2px;border-bottom:1px solid var(--border)}
.share-row:last-child{border-bottom:none}
.share-av{width:32px;height:32px;flex:0 0 auto;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#3a2c12;background:linear-gradient(135deg,var(--gold1),var(--gold2));text-transform:uppercase}
.share-av svg{width:15px;height:15px;color:#3a2c12}
.share-row-main{flex:1;min-width:0}
.share-row-name{font-weight:700;font-size:13px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.share-row-type{font-size:11px;color:var(--muted);text-transform:capitalize;margin-top:1px}
.share-revoke{border:none;background:transparent;color:var(--muted);cursor:pointer;padding:6px;border-radius:8px;display:flex;transition:.12s}
.share-revoke svg{width:15px;height:15px}
.share-revoke:hover{background:rgba(217,83,79,.1);color:var(--red)}
.share-empty{padding:22px 16px;text-align:center;color:var(--muted);font-size:13px;line-height:1.6;background:var(--warm);border:1px solid var(--border);border-radius:13px}
.share-add{margin-top:16px;padding-top:16px;border-top:1px solid var(--border)}
.share-add-h{font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px}
.share-add-row{display:flex;gap:8px;margin-bottom:8px}
.share-sel{background:var(--warm);border:1px solid var(--border);border-radius:10px;padding:9px 11px;font:inherit;font-size:13px;color:var(--ink);cursor:pointer;outline:none;transition:.15s}
.share-sel:focus{border-color:var(--gold3);background:#fff}
.share-add-row #sharePType{flex:0 0 118px}
.share-add-row .btn-sm-gold{flex:0 0 auto;padding:0 20px}
.share-err{color:var(--red);font-size:12px;margin-top:8px;display:none}
.share-hint{font-size:11px;color:var(--muted);margin-top:8px;line-height:1.5}

/* research */
.rs-wrap{display:grid;grid-template-columns:300px 1fr;gap:18px;align-items:start}
@media(max-width:900px){.rs-wrap{grid-template-columns:1fr}}
.rs-card{background:var(--card);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);padding:18px}
/* Ask Chekmecha */
.ask-wrap{display:flex;flex-direction:column;height:calc(100vh - 132px);min-height:480px;max-width:860px;margin:0 auto}
.ask-intro{background:var(--card);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow-sm);padding:16px 18px;margin-bottom:14px}
.ask-intro h3{margin:0 0 4px;font-size:15px}
.ask-intro p{margin:0;font-size:12.5px;color:var(--muted);line-height:1.5}
.ask-feed{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:16px;padding:4px 2px 10px}
.ask-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--muted);gap:10px;height:100%;padding:30px}
.ask-empty svg{width:42px;height:42px;color:#cfa44f;opacity:.7}
.ask-sugs{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;max-width:540px}
.ask-sug{background:#fff;border:1px solid var(--border);border-radius:999px;padding:7px 13px;font-size:12.5px;color:var(--ink);cursor:pointer;font-family:inherit;transition:.15s}
.ask-sug:hover{border-color:#cfa44f;background:rgba(207,164,79,.07)}
.ask-row{display:flex;flex-direction:column;gap:4px}
.ask-q{align-self:flex-end;max-width:80%;background:linear-gradient(135deg,#cfa44f,#e6c577);color:#3a2e12;border-radius:14px 14px 4px 14px;padding:10px 14px;font-size:13.5px;line-height:1.5;box-shadow:var(--shadow-sm)}
.ask-a{align-self:flex-start;max-width:92%;background:var(--card);border:1px solid var(--border);border-radius:14px 14px 14px 4px;padding:12px 16px;font-size:13.5px;line-height:1.6;box-shadow:var(--shadow-sm)}
.ask-a.err{border-color:var(--red);color:var(--red)}
.ask-a h1,.ask-a h2,.ask-a h3{font-size:14px;margin:10px 0 4px}
.ask-a p{margin:6px 0}.ask-a ul,.ask-a ol{margin:6px 0;padding-left:20px}.ask-a li{margin:2px 0}
.ask-a code{background:rgba(0,0,0,.05);padding:1px 5px;border-radius:5px;font-size:12px}
.ask-cite{margin-top:10px;padding-top:10px;border-top:1px dashed var(--border);display:flex;flex-direction:column;gap:5px}
.ask-cite-lbl{font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.ask-cite a{display:flex;align-items:center;gap:7px;font-size:12.5px;color:#9c7a2e;text-decoration:none;padding:4px 8px;border-radius:8px;background:rgba(207,164,79,.08)}
.ask-cite a:hover{background:rgba(207,164,79,.16)}
.ask-cite .n{font-weight:700;min-width:18px}
.ask-cite .vt{margin-left:auto;font-size:11px;color:var(--muted)}
.ask-think{align-self:flex-start;display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px;padding:10px 14px}
.ask-dot{width:7px;height:7px;border-radius:50%;background:#cfa44f;animation:askb 1s infinite}
.ask-dot:nth-child(2){animation-delay:.15s}.ask-dot:nth-child(3){animation-delay:.3s}
@keyframes askb{0%,60%,100%{opacity:.25;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
.ask-bar{display:flex;gap:10px;align-items:flex-end;margin-top:12px;background:var(--card);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow-sm);padding:8px 8px 8px 14px}
.ask-bar textarea{flex:1;border:none;outline:none;resize:none;font-family:inherit;font-size:13.5px;background:transparent;color:var(--ink);max-height:140px;line-height:1.5;padding:6px 0}
.ask-send{border:none;background:linear-gradient(135deg,#cfa44f,#e6c577);color:#fff;width:40px;height:40px;border-radius:11px;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:.15s}
.ask-send:hover{filter:brightness(1.05)}.ask-send:disabled{opacity:.5;cursor:default}
.ask-send svg{width:18px;height:18px}
.em-note{font-size:11.5px;color:var(--muted);margin-top:10px;line-height:1.5}
.em-item .em-to{font-size:12px;color:var(--muted);margin:2px 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.em-badge{font-size:11px;font-weight:600;padding:2px 8px;border-radius:999px}
.em-badge.dr{background:rgba(207,164,79,.14);color:#9c7a2e}
.em-badge.sch{background:rgba(63,174,106,.15);color:#2f8a55}
.em-form{display:flex;flex-direction:column;gap:6px}
.em-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.em-head h3{font-size:15px;font-weight:700}
.em-del{background:none;border:1px solid var(--border);color:var(--red,#d9534f);font-size:12px;font-weight:600;padding:5px 10px;border-radius:9px;cursor:pointer}
.em-del:hover{background:rgba(217,83,79,.08)}
.em-row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:560px){.em-row2{grid-template-columns:1fr}}
.em-form label{display:block;font-size:12px;font-weight:600;color:var(--muted);margin:8px 0 5px}
.em-form input[type=text],.em-form select,.em-form textarea,.em-form input[type=datetime-local]{width:100%;border:1px solid var(--border);border-radius:11px;background:var(--warm);padding:10px 12px;font:inherit;font-size:14px;color:var(--ink);box-sizing:border-box}
.em-form textarea{min-height:200px;resize:vertical;line-height:1.55}
.em-ai{display:flex;gap:8px;margin-top:10px;align-items:stretch}
.em-ai input{flex:1}
.em-ai .btn-sm-gold{white-space:nowrap}
.em-aierr{display:none;color:var(--red,#d9534f);font-size:12px;margin-top:6px}
.em-sched{display:flex;align-items:center;gap:12px;margin-top:12px;flex-wrap:wrap}
.em-chk{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--ink);margin:0;cursor:pointer}
.em-chk input{width:auto}
.em-sched input[type=datetime-local]{width:auto;flex:0 0 auto}
.em-sched input:disabled{opacity:.5}
.em-actions{display:flex;align-items:center;gap:14px;margin-top:16px}
.em-status{font-size:13px;font-weight:600}
.em-foot{font-size:11px;color:var(--muted);margin-top:14px;border-top:1px solid var(--border);padding-top:10px}
/* ── Real mail client ── */
.mail-wrap{--mail-w-side:230px;--mail-w-main:420px;display:grid;grid-template-columns:var(--mail-w-side) 12px var(--mail-w-main) 12px minmax(0,1fr);gap:0;height:calc(100vh - 120px);height:calc(100dvh - 120px)}
/* Fixed track for each pane so hiding one never shifts the others. */
.mail-side,.mail-rail-side{grid-column:1}
.mail-resizer-side{grid-column:2}
.mail-main,.mail-rail-list{grid-column:3}
.mail-resizer-main{grid-column:4}
.mail-reader{grid-column:5}
/* Slim rail shown in place of a collapsed pane; click it to expand again. */
.mail-rail{display:none;align-self:stretch;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:#fff;border:1px solid var(--border);border-radius:16px;cursor:pointer;color:var(--muted);transition:.12s}
.mail-rail:hover{color:var(--gold3);border-color:var(--gold3)}
.mail-rail .mail-rail-ico{font-size:18px;font-weight:800;line-height:1}
.mail-rail .mail-rail-lbl{writing-mode:vertical-rl;text-orientation:mixed;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}
/* Collapse/expand controls (desktop only — mobile uses the drawer). */
@media(min-width:901px){
  .mail-wrap.side-collapsed{grid-template-columns:44px 0 var(--mail-w-main) 12px minmax(0,1fr)}
  .mail-wrap.side-collapsed>.mail-side{display:none}
  .mail-wrap.side-collapsed>.mail-rail-side{display:flex}
  .mail-wrap.side-collapsed>.mail-resizer-side{display:none}
  .mail-wrap.list-collapsed{grid-template-columns:var(--mail-w-side) 12px 44px 0 minmax(0,1fr)}
  .mail-wrap.list-collapsed>.mail-main{display:none}
  .mail-wrap.list-collapsed>.mail-rail-list{display:flex}
  .mail-wrap.list-collapsed>.mail-resizer-main{display:none}
  .mail-wrap.side-collapsed.list-collapsed{grid-template-columns:44px 0 44px 0 minmax(0,1fr)}
}
.mail-side-head-acts{display:flex;align-items:center;gap:4px}
.mail-side-col{border:none;background:transparent;color:var(--muted);cursor:pointer;font-size:15px;line-height:1;padding:2px 4px;border-radius:6px}
.mail-side-col:hover{color:var(--gold3);background:var(--warm)}
.mail-syncall{border:none;background:transparent;color:var(--muted);cursor:pointer;padding:2px 4px;border-radius:6px;display:inline-flex;align-items:center}
.mail-syncall svg{width:15px;height:15px}
.mail-syncall:hover{color:var(--gold3);background:var(--warm)}
.mail-syncall.spinning{color:var(--gold3);pointer-events:none}
.mail-syncall.spinning svg,.mail-syncall-btn.spinning svg{animation:spin .9s linear infinite}
.mail-syncall-btn.spinning{color:var(--gold3);pointer-events:none;opacity:.85}
/* Draggable splitters between the mail panes (side | list | reader). */
.mail-resizer{align-self:stretch;cursor:col-resize;display:flex;align-items:center;justify-content:center}
.mail-resizer::after{content:'';width:2px;height:38px;border-radius:2px;background:var(--border2);transition:.12s}
.mail-resizer:hover::after,.mail-resizer.dragging::after{background:var(--gold3);height:60px}
.mail-side{background:#fff;border:1px solid var(--border);border-radius:16px;display:flex;flex-direction:column;overflow:hidden}
.mail-side-head{display:flex;align-items:center;justify-content:space-between;padding:14px 14px 8px;font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.mail-add{width:24px;height:24px;border-radius:8px;border:1px solid var(--border);background:var(--warm);color:var(--gold3);font-size:16px;line-height:1;cursor:pointer}
.mail-acct-sel{width:100%;border:1px solid var(--border);border-radius:10px;background:var(--warm);padding:11px 13px;font:inherit;font-size:13.5px;font-weight:600;color:var(--ink);cursor:pointer}
.mail-folders{flex:1;overflow-y:auto;padding:4px 8px 8px}
.mail-fld{display:flex;align-items:center;justify-content:space-between;width:100%;border:none;background:transparent;color:var(--ink2);font-size:13px;font-weight:600;padding:9px 11px;border-radius:10px;cursor:pointer;text-align:left}
.mail-fld:hover{background:var(--warm2)}
.mail-fld.active{background:linear-gradient(135deg,rgba(230,197,119,0.22),rgba(199,147,56,0.14));color:var(--gold3)}
.mail-fld .fl-unread{background:var(--gold3);color:#fff;font-size:10.5px;font-weight:700;padding:1px 7px;border-radius:999px}
.mail-fld .fl-total{color:var(--muted2);font-size:11px;font-weight:600}
.mail-fld .fl-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mail-fld[disabled]{cursor:default;opacity:.8}
.mail-fld.fl-drop{background:linear-gradient(135deg,rgba(230,197,119,0.32),rgba(199,147,56,0.22));outline:1.5px dashed var(--gold3);outline-offset:-2px}
.mail-fld .fl-caret{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;margin:-4px 2px -4px -4px;background:none;border:none;color:var(--muted2);font-size:12px;cursor:pointer;border-radius:6px;transition:transform .12s,background .12s;transform:rotate(0deg);flex-shrink:0}
.mail-fld .fl-caret:hover{background:var(--warm2);color:var(--gold3)}
.mail-fld .fl-caret.open{transform:rotate(90deg)}
.mail-fld .fl-caret.open:hover{transform:rotate(90deg)}
.mail-fld .fl-caret-sp{display:inline-block;width:22px;flex-shrink:0}
.fl-children{display:block}
.mail-total-unread{display:inline-block;background:var(--gold3);color:#fff;font-size:11px;font-weight:700;padding:0 7px;border-radius:999px;margin-left:6px;vertical-align:middle}
.mail-newfolder{margin:4px 12px 0;background:none;border:1px dashed var(--border);color:var(--muted2);font-size:12px;font-weight:600;padding:6px 10px;border-radius:9px;cursor:pointer;width:calc(100% - 24px)}
.mail-newfolder:hover{border-color:var(--gold3);color:var(--gold3);background:var(--warm)}
.mail-ctx{background:#fff;border:1px solid var(--border);border-radius:10px;box-shadow:0 10px 30px rgba(36,29,18,.16);padding:5px;z-index:9999;min-width:170px}
.mail-ctx button{display:block;width:100%;text-align:left;background:none;border:none;font:inherit;font-size:13px;color:var(--ink);padding:8px 12px;border-radius:7px;cursor:pointer}
.mail-ctx button:hover{background:var(--warm2)}
.mail-ctx button.ctx-danger{color:var(--red)}
.mail-ctx button.ctx-danger:hover{background:rgba(217,83,79,.08)}
.mail-item[draggable=true]{cursor:grab}
.mail-imgbar{background:var(--warm);border:1px solid var(--border);border-radius:9px;padding:8px 12px;margin-bottom:10px;font-size:12.5px;color:var(--muted2);display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:space-between}
.mail-imgbar button{border:1px solid var(--gold3);background:#fff;color:var(--gold3);font-size:12px;font-weight:600;padding:3px 11px;border-radius:7px;cursor:pointer;margin-left:6px}
.mail-imgbar-btns{display:flex;gap:6px;flex-wrap:wrap}
.mail-imgbar button.ghost{border-color:var(--border2);color:var(--ink2);background:transparent;margin-left:0}
.mail-imgbar button.ghost:hover{border-color:var(--gold3);color:var(--gold3)}
.mail-imgbar.trusted{color:var(--ink2)}
.mail-imgbar.trusted b{color:var(--gold3)}
.mail-side-foot{padding:10px 12px;border-top:1px solid var(--border)}
.mail-del-acct{width:100%;background:none;border:1px solid var(--border);color:var(--red);font-size:11.5px;font-weight:600;padding:7px;border-radius:10px;cursor:pointer}
.mail-del-acct:hover{background:rgba(217,83,79,.07)}
.mail-drafts-btn{background:none;border:1px solid var(--border);color:var(--ink);font-size:12px;font-weight:600;padding:7px;border-radius:10px;cursor:pointer}
.mail-drafts-btn:hover{background:var(--warm2);border-color:var(--gold3);color:var(--gold3)}
/* Outlook-style stacked accounts pane */
.mail-side-actions{padding:2px 12px 8px;display:flex;flex-direction:column;gap:8px}
.mail-newmail{width:100%;font-size:12.5px}
.mail-side-links{display:flex;gap:6px}
.mail-side-links .mail-drafts-btn{flex:1}
.mail-settings-link{width:100%;display:flex;align-items:center;justify-content:center;gap:7px}
.mail-settings-link svg{width:15px;height:15px}
.mail-accts{flex:1;overflow-y:auto;padding:2px 8px 12px}
.mail-acct{border-radius:10px;margin-bottom:1px;position:relative}
/* Reorder drop indicator: a divider line between rows, not a highlight on the row
   itself — makes clear the dragged mailbox is being placed BETWEEN two others,
   not merged into the one under the cursor. */
.mail-acct.acct-drop-before::before,.mail-acct.acct-drop-after::after{content:'';position:absolute;left:4px;right:4px;height:2px;border-radius:2px;background:var(--gold3);box-shadow:0 0 0 3px rgba(199,147,56,0.15)}
.mail-acct.acct-drop-before::before{top:-2px}
.mail-acct.acct-drop-after::after{bottom:-2px}
.mail-acct-head{display:flex;align-items:center;gap:6px;padding:8px;border-radius:9px;cursor:pointer;font-size:12.5px;font-weight:700;color:var(--ink)}
.mail-acct-head:hover{background:var(--warm2)}
.mail-acct.cur>.mail-acct-head{color:var(--gold3)}
.mail-acct-caret{display:inline-flex;align-items:center;justify-content:center;width:16px;color:var(--muted2);font-size:11px;transition:transform .12s;transform:rotate(0)}
.mail-acct-caret.open{transform:rotate(90deg)}
.mail-acct-email{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mail-acct-unread{background:var(--gold3);color:#fff;font-size:10.5px;font-weight:700;padding:1px 7px;border-radius:999px;cursor:pointer}
.mail-acct-unread:hover{filter:brightness(1.08)}
.mail-acct-warn{color:var(--red);font-weight:800;width:14px;text-align:center}
.mail-acct-menu{opacity:.55;border:none;background:none;color:var(--muted2);font-size:15px;cursor:pointer;padding:0 4px;border-radius:6px;line-height:1;transition:.12s}
.mail-acct-head:hover .mail-acct-menu{opacity:1}
.mail-acct-menu:hover{color:var(--gold3);opacity:1}
.mail-acct-move{opacity:0;border:none;background:none;color:var(--muted2);font-size:12px;cursor:pointer;padding:0 2px;border-radius:5px;line-height:1;transition:.12s}
.mail-acct-head:hover .mail-acct-move{opacity:.6}
.mail-acct-move:hover{color:var(--gold3);opacity:1}
.mail-acct.low-pri>.mail-acct-head{opacity:.5}
.mail-acct.low-pri.cur>.mail-acct-head,.mail-acct.low-pri>.mail-acct-head:hover{opacity:.85}
.mail-acct.discon .mail-acct-email{color:var(--muted)!important}
.mail-acct-discon-badge{font-size:9.5px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;color:var(--muted);background:var(--warm2,#f1ece0);border-radius:5px;padding:2px 6px;flex:none}
.mail-acct-discon-badge.exporting{color:#8a5a12;background:#fbe6c9}
.sw-none{display:flex;align-items:center;justify-content:center;background:var(--warm2,#f1ece0);color:var(--muted);font-size:13px}
.mail-acct-folders{padding:1px 0 5px 6px}
.mail-acct-empty{padding:6px 12px;font-size:11.5px;color:var(--muted)}
.mail-drafts-view{padding:0}
.mail-drafts-head{padding:20px 22px 14px;border-bottom:1px solid var(--border)}
.mail-drafts-title{font-size:18px;font-weight:800;color:var(--ink);letter-spacing:-.01em}
.mail-drafts-sub{font-size:12px;color:var(--muted);margin-top:3px}
.mail-drafts-list{display:flex;flex-direction:column;gap:6px;padding:14px}
.mail-draft-row{display:flex;align-items:center;gap:12px;text-align:left;background:#fff;border:1px solid var(--border);padding:13px 14px;cursor:pointer;border-radius:12px;transition:.13s}
.mail-draft-row:hover{background:var(--warm);border-color:var(--border2);box-shadow:0 3px 12px rgba(36,29,18,.05)}
.mail-draft-row .mdr-body{flex:1;min-width:0}
.mail-draft-row .mdr-top{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.mail-draft-row .mdr-to{font-weight:700;font-size:13.5px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mail-draft-row .mdr-badge{flex:0 0 auto;font-size:10px;font-weight:700;color:#3a2c12;background:linear-gradient(135deg,var(--gold1),var(--gold3));padding:2px 8px;border-radius:999px;text-transform:uppercase;letter-spacing:.03em}
.mail-draft-row .mdr-badge.mdr-badge-spam{color:#fff;background:var(--red)}
.mail-draft-row .mdr-subj{font-size:12.5px;color:var(--ink2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:5px}
.mail-draft-row .mdr-meta{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted2);min-width:0}
.mail-draft-row .mdr-meta>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mail-draft-row .mdr-from{flex:0 0 auto;font-weight:600;color:var(--gold3);background:rgba(199,147,56,.1);padding:2px 8px;border-radius:6px;max-width:55%}
.mail-draft-row .mdr-clip{flex:0 0 auto}
.mail-draft-row .mdr-del{flex:0 0 auto;background:none;border:none;color:var(--muted2);font-size:19px;line-height:1;cursor:pointer;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:8px;transition:.12s}
.mail-draft-row .mdr-del:hover{background:rgba(217,83,79,.1);color:var(--red)}
/* Reader: which mailbox this message lives in (you have many connected). */
.mail-rd-acct{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;color:var(--gold3);background:rgba(199,147,56,.1);border:1px solid rgba(199,147,56,.22);padding:2px 9px;border-radius:999px;margin-bottom:7px;max-width:100%;overflow:hidden}
.mail-rd-acct svg{width:14px;height:14px;flex:0 0 auto}
.mail-rd-acct span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Compose: quoted original (reply/forward) kept visible below the message. */
.mail-quote-block{border-top:1px solid var(--border);margin-top:16px;padding-top:14px}
.mail-quote-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted2);margin-bottom:10px}
.mail-quote-hd{font-size:12px;color:var(--ink2);line-height:1.7;background:var(--warm);border:1px solid var(--border);border-radius:10px;padding:10px 13px;margin-bottom:10px}
.mail-quote-frame{width:100%;height:360px;border:1px solid var(--border);border-radius:10px;background:#fff}
.mail-quote-text{white-space:pre-wrap;font-size:13px;line-height:1.6;color:var(--ink2);background:#fff;border:1px solid var(--border);border-radius:10px;padding:12px 14px;max-height:360px;overflow:auto}
/* Filing suggestions: padded panel, grouped by mailbox. */
.mail-filing-view{padding:0}
.mail-filing-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.mail-filing-empty{padding:6px 22px 26px;font-size:13.5px;line-height:1.7;color:var(--ink2);max-width:640px}
.mail-filing-sec{margin-top:4px}
.mail-filing-acct{display:flex;align-items:center;gap:8px;padding:16px 20px 6px;font-size:12.5px;font-weight:700;color:var(--gold3)}
.mail-filing-count{font-size:10px;font-weight:700;color:var(--ink2);background:var(--warm2);border-radius:999px;padding:1px 8px}
/* Drafts & scheduled: separate labelled sections. */
.mail-drafts-sec{margin-top:6px}
.mail-drafts-sechd{display:flex;align-items:center;gap:8px;padding:14px 16px 6px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}
.mail-drafts-sechd.sched{color:var(--gold3)}
.mail-drafts-sechd.failed{color:var(--red)}
.mail-drafts-count{font-size:10px;font-weight:700;color:var(--ink2);background:var(--warm2);border-radius:999px;padding:1px 8px}
.mail-drafts-sechd.failed .mail-drafts-count{background:rgba(217,83,79,.12);color:var(--red)}
.mail-draft-row .mdr-err{font-size:11px;color:var(--red);margin-top:5px;line-height:1.4}
.mail-settings-btn{width:100%;background:none;border:1px solid var(--border);color:var(--ink);font-size:11.5px;font-weight:600;padding:7px;border-radius:10px;cursor:pointer;margin-bottom:8px}
.mail-settings-btn:hover{background:var(--warm2);border-color:var(--gold3);color:var(--gold3)}
.mail-settings .mset-sec{border:1px solid var(--border);border-radius:12px;padding:14px 16px;margin-bottom:16px;background:var(--warm)}
.mail-settings .mset-title{font-size:14px;font-weight:700;color:var(--ink);margin-bottom:6px}
.mail-settings .mset-hint{font-size:12px;color:var(--muted2);line-height:1.5;margin-bottom:10px}
.mail-settings .mset-hint code{background:var(--warm2);padding:1px 5px;border-radius:5px;font-size:11px}
.mail-settings .mset-code{width:100%;min-height:120px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.5px;line-height:1.5;resize:vertical}
.mail-settings .mset-preview-lbl{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted2);margin:10px 0 6px}
.mail-settings .mset-preview{border:1px dashed var(--border);border-radius:10px;padding:12px 14px;background:#fff;font-size:13px;color:var(--ink);min-height:36px;overflow:auto}
.mail-settings .mset-dates{display:flex;gap:14px;flex-wrap:wrap}
.mail-settings .mset-dates>div{flex:1;min-width:150px;display:flex;flex-direction:column}
.mail-syncerr{margin:0 12px 8px;font-size:11px;color:var(--red);background:rgba(217,83,79,.08);padding:7px 9px;border-radius:9px;line-height:1.4}
.mail-main{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--border);border-radius:16px;overflow:hidden}
/* Wraps to a second line when the column is narrow, so the controls never overlap. */
.mail-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;padding:11px 14px;border-bottom:1px solid var(--border)}
.mail-tb-title{flex:0 0 auto;white-space:nowrap;font-weight:600}
.mail-sync-btn{flex:0 0 auto}
.mail-mobtn{flex:0 0 auto}
.mail-col-btn{flex:0 0 auto;width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--border2);background:var(--card);color:var(--muted);border-radius:9px;cursor:pointer;font-size:14px;line-height:1}
.mail-col-btn:hover{color:var(--gold3);border-color:var(--gold3)}
.mail-unread-chip{flex:0 0 auto;font:inherit;font-size:12px;font-weight:600;padding:6px 11px;border-radius:9px;border:1px solid var(--border2);background:var(--card);color:var(--ink2);cursor:pointer;white-space:nowrap}
.mail-unread-chip:hover{border-color:var(--gold3);color:var(--gold3)}
.mail-unread-chip.on{background:linear-gradient(135deg,var(--gold1),var(--gold3));color:#3a2c12;border-color:transparent}
/* Bulk selection */
.mail-bulkbar{display:none}
/* Floats over the bottom of the message list as a pill, so selecting emails never
   pushes the list down (it used to sit in the flow and shove every row). */
.mail-bulkbar.show{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);z-index:8;display:flex;align-items:center;gap:8px;flex-wrap:wrap;max-width:calc(100% - 26px);padding:8px 12px;border:1px solid var(--gold3);border-radius:13px;background:#fff;box-shadow:0 12px 32px rgba(40,30,10,.20)}
.mail-bulkbar .mbb-count{font-size:12.5px;font-weight:700;color:var(--gold3);margin-right:4px}
.mail-bulkbar button{border:1px solid var(--border);background:#fff;color:var(--ink);font-size:12px;font-weight:600;padding:6px 11px;border-radius:8px;cursor:pointer}
.mail-bulkbar button:hover{background:var(--warm2);border-color:var(--gold3);color:var(--gold3)}
.mail-bulkbar button.mbb-danger:hover{border-color:var(--red);color:var(--red);background:rgba(217,83,79,.07)}
.mail-bulkbar button.mbb-clear{margin-left:auto;padding:6px 10px}
.mail-item-row{display:flex;align-items:stretch;gap:0}
.mail-item-row .mi-check{flex-shrink:0;width:24px;display:flex;align-items:center;justify-content:center;color:transparent;font-size:12px;font-weight:800;cursor:pointer;border-radius:6px;margin:6px 0 6px 6px;border:1.5px solid var(--border);align-self:center;height:20px;background:#fff}
.mail-item-row:hover .mi-check{border-color:var(--gold3);color:var(--muted2)}
.mail-item-row .mi-check.sel{background:var(--gold3);border-color:var(--gold3);color:#fff}
.mail-item-row.sel{background:rgba(199,147,56,.06)}
.mail-item-row .mail-item{flex:1;min-width:0}
.mail-search{flex:1 1 260px;min-width:0;display:flex;align-items:center;background:var(--warm);border:1px solid var(--border);border-radius:10px;padding:0 4px 0 10px}
.mail-search input{flex:1 1 auto;min-width:0;border:none;background:transparent;padding:8px 6px;font:inherit;font-size:13px;color:var(--ink);outline:none}
.mail-search .mail-scope,.mail-search .mail-adv-toggle,.mail-search>button{flex:0 0 auto}
.mail-search .mail-scope{border:none;background:transparent;font:inherit;font-size:12px;color:var(--muted2);cursor:pointer;outline:none;border-left:1px solid var(--border);padding:0 4px}
.mail-search .mail-adv-toggle{border:none;background:transparent;font:inherit;font-size:12px;font-weight:600;color:var(--muted2);cursor:pointer;padding:0 6px;border-left:1px solid var(--border)}
.mail-search .mail-adv-toggle:hover{color:var(--gold3)}
.mail-adv{display:none}
.mail-adv.show{display:block;padding:12px 14px;border-bottom:1px solid var(--border);background:var(--warm)}
.mail-adv-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px}
.mail-adv-grid label{display:flex;flex-direction:column;font-size:11px;font-weight:600;color:var(--muted2);gap:4px}
.mail-adv-grid input{border:1px solid var(--border);border-radius:8px;padding:7px 10px;font:inherit;font-size:13px;color:var(--ink);background:#fff;outline:none}
.mail-adv-grid input:focus{border-color:var(--gold3)}
.mail-adv-foot{display:flex;align-items:center;gap:14px;margin-top:12px;font-size:12.5px}
@media(max-width:640px){.mail-adv-grid{grid-template-columns:1fr}}
.mail-item .mi-folder{display:inline-block;font-size:10px;font-weight:700;color:var(--gold3);background:rgba(199,147,56,.12);padding:1px 6px;border-radius:999px;margin-right:6px;vertical-align:middle}
.mail-search button{border:none;background:transparent;color:var(--muted);cursor:pointer;padding:4px;display:flex}
.mail-search button svg{width:16px;height:16px}
.mail-tb-title{font-size:13px;font-weight:700;color:var(--ink)}
.mail-sync-btn{border:1px solid var(--border);background:var(--warm);color:var(--gold3);font-size:12.5px;font-weight:700;padding:8px 14px;border-radius:10px;cursor:pointer;white-space:nowrap}
.mail-sync-btn:hover{background:var(--warm2)}
.mail-sync-btn.syncing{opacity:.7;pointer-events:none}
.mail-list{flex:1;overflow-y:auto}
.mail-item{display:block;width:100%;text-align:left;border:none;border-bottom:1px solid var(--border);background:transparent;padding:12px 16px;cursor:pointer}
.mail-item:hover{background:var(--warm)}
.mail-item.active{background:linear-gradient(135deg,rgba(230,197,119,0.16),rgba(199,147,56,0.08))}
.mail-item.unread{background:rgba(207,164,79,.045)}
.mi-top{display:flex;justify-content:space-between;gap:8px;margin-bottom:3px}
.mi-from{font-size:13px;color:var(--ink2);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mail-item.unread .mi-from{color:var(--ink);font-weight:800}
.mi-date{font-size:11px;color:var(--muted);white-space:nowrap;flex:none}
.mi-subj{font-size:13.5px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mail-item.unread .mi-subj{font-weight:700}
.mi-flag{color:var(--gold3);margin-right:4px}
.mi-clip{font-size:11px}
.mi-snip{font-size:12px;color:var(--muted2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:2px}
.mail-pager{display:flex;align-items:center;justify-content:center;gap:14px;padding:10px;border-top:1px solid var(--border);font-size:12px;color:var(--muted)}
.mail-pager button{border:1px solid var(--border);background:var(--warm);color:var(--ink2);font-size:12px;font-weight:600;padding:6px 12px;border-radius:9px;cursor:pointer}
.mail-pager button:disabled{opacity:.4;cursor:default}
.mp-info{font-weight:600}
.mail-reader{background:#fff;border:1px solid var(--border);border-radius:16px;overflow-y:auto;padding:0}
.mail-reader .rs-blank{display:flex;align-items:center;justify-content:center;height:100%;color:var(--muted);padding:30px;text-align:center}
/* Compact Mailbox/Automation switch — a thin segmented control, not a full button row,
   so it stops eating vertical space above the mail body. */
.mail-modtabs{display:inline-flex;gap:2px;margin-bottom:8px;background:var(--warm);border:1px solid var(--border);border-radius:9px;padding:2px}
.mail-modtab{border:none;background:none;color:var(--muted2);font-size:12.5px;font-weight:600;padding:5px 12px;border-radius:7px;cursor:pointer}
.mail-modtab.active{background:var(--card);color:var(--gold3);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.mail-reader-inner,.mail-compose,.mail-connect{padding:14px 18px}
.mail-rd-subj{font-size:16px;font-weight:800;line-height:1.3;color:var(--ink);margin-bottom:7px;word-break:break-word}
.mail-rd-acts{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.mail-rd-acts button{border:1px solid var(--border);background:var(--warm);color:var(--ink2);font-size:12px;font-weight:600;padding:5px 9px;border-radius:8px;cursor:pointer}
.mail-rd-acts button:hover{background:var(--warm2)}
.mail-rd-acts button.ic{width:32px;padding:6px 0;text-align:center}
.mail-rd-acts button.ic.on{color:var(--gold3);border-color:var(--gold2)}
.mail-rd-acts button.danger{color:var(--red)}
.mail-rd-meta{font-size:12px;color:var(--ink2);line-height:1.45;border-bottom:1px solid var(--border);padding-bottom:8px;margin-bottom:10px}
.mail-rd-meta strong{color:var(--muted);font-weight:700}
.mail-rd-date{color:var(--muted);font-size:11.5px;margin-top:3px}
/* ── Studio asset library: multi-select + floating Save-all bar ─────────────── */
.m-lib-card.sel{border-color:var(--gold3)!important;box-shadow:0 0 0 2px var(--gold3) inset}
.m-lib-tick{position:absolute;top:6px;right:6px;width:22px;height:22px;border-radius:50%;border:1.5px solid rgba(255,255,255,.85);background:rgba(0,0,0,.45);color:#fff;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;line-height:1;cursor:pointer;opacity:0;transition:opacity .12s}
.m-lib-card:hover .m-lib-tick,.m-lib-tick.on{opacity:1}
.m-lib-tick.on{background:var(--gold3);border-color:var(--gold3)}
.m-lib-selbar{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);z-index:900;display:flex;align-items:center;gap:8px;flex-wrap:wrap;max-width:calc(100% - 26px);padding:8px 12px;border:1px solid var(--gold3);border-radius:13px;background:#fff;box-shadow:0 12px 32px rgba(40,30,10,.22)}
.m-lib-selbar .mbb-count{font-size:12.5px;font-weight:700;color:var(--gold3);margin-right:4px}
.m-lib-selbar button{border:1px solid var(--border);background:#fff;color:var(--ink);font-size:12px;font-weight:600;padding:6px 11px;border-radius:8px;cursor:pointer}
.m-lib-selbar button:hover{background:var(--warm2);border-color:var(--gold3);color:var(--gold3)}
.m-lib-selbar button.m-lib-save{background:var(--gold3);border-color:var(--gold3);color:#fff}
.m-lib-selbar button.m-lib-save:hover{color:#fff;opacity:.92}
.m-lib-selbar button:disabled{opacity:.6;cursor:default}
.mail-atts-wrap{margin-bottom:14px}
.mail-atts-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.mail-atts-saveall{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--gold3);background:var(--warm);color:var(--gold3);border-radius:10px;padding:8px 12px;font-size:12.5px;font-weight:600;cursor:pointer}
.mail-atts-saveall svg{width:15px;height:15px}
.mail-atts-saveall:hover{background:var(--warm2)}
.mail-atts-saveall:disabled{opacity:.6;cursor:default}
.mail-atts-toggle{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border);background:var(--warm);border-radius:10px;padding:8px 12px;font-size:12.5px;font-weight:600;color:var(--ink2);cursor:pointer}
.mail-atts-toggle:hover{background:var(--warm2);border-color:var(--gold3)}
.mail-atts-toggle svg{width:15px;height:15px;color:var(--gold3)}
.mail-atts-toggle em{color:var(--muted);font-style:normal;font-weight:500;font-size:11px}
.mail-atts-caret{margin-left:2px;color:var(--muted);transition:transform .15s;font-size:15px;line-height:1}
.mail-atts-toggle.open .mail-atts-caret{transform:rotate(90deg)}
.mail-rd-atts{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.mail-rd-atts[hidden]{display:none}
.mail-att{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--border);background:var(--warm);border-radius:10px;padding:7px 11px;font-size:12.5px;color:var(--ink2);text-decoration:none;cursor:pointer}
.mail-att:hover{background:var(--warm2)}
.mail-att svg{width:15px;height:15px;color:var(--gold3)}
.mail-att em{color:var(--muted);font-style:normal;font-size:11px}
.mail-rd-body{font-size:14px;line-height:1.6;color:var(--ink)}
.mail-bodytext{white-space:pre-wrap;word-break:break-word}
.mail-bodyframe{width:100%;min-height:420px;border:none;background:#fff}
.mail-bodyframe-wrap{position:relative}
.mail-bodyframe.is-sizing{opacity:0}
.mail-frame-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#fff}
.mail-bodyframe-wrap.sized .mail-frame-loading{display:none}
.mail-welcome,.mail-cn-help+*{}
.mail-welcome{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:50px 30px;color:var(--muted)}
.mail-welcome h3{font-size:17px;color:var(--ink);margin-bottom:8px}
.mail-welcome p{max-width:360px;font-size:13px;line-height:1.6;margin-bottom:18px}
.mail-cform label{display:block;font-size:12px;font-weight:600;color:var(--muted);margin:12px 0 5px}
.mail-cform input,.mail-cform textarea{width:100%;border:1px solid var(--border);border-radius:11px;background:var(--warm);padding:10px 12px;font:inherit;font-size:14px;color:var(--ink);box-sizing:border-box}
.mail-cform textarea{min-height:200px;resize:vertical;line-height:1.55}
/* Rich-text message editor + formatting toolbar */
.mail-editor-wrap{position:relative;border:1px solid var(--border);border-radius:11px;background:var(--warm);overflow:hidden}
.mail-fmt-sep{width:1px;height:20px;background:var(--border);margin:0 3px;align-self:center;flex:0 0 auto}
.mail-fmt-btn svg{width:15px;height:15px;display:block;margin:0 auto}
.mail-fmt-btn.active,.mail-fmt-btn[aria-pressed="true"]{background:var(--gold-soft,#f3ead4);border-color:var(--gold,#c8a24a);color:#7a5c17}
/* Hyperlink popup, floats over the editor. */
.mail-link-pop{position:absolute;top:46px;left:50%;transform:translateX(-50%);z-index:40;width:min(340px,92%);background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:0 12px 32px rgba(0,0,0,.18);padding:12px 13px}
.mail-link-pop .mlp-row{display:flex;flex-direction:column;gap:4px;margin-bottom:9px}
.mail-link-pop .mlp-row label{font-size:11px;font-weight:600;color:var(--muted);letter-spacing:.02em}
.mail-link-pop .mlp-row input{height:34px;border:1px solid var(--border);border-radius:8px;padding:0 10px;font-size:13px;color:var(--ink,#222);background:var(--warm)}
.mail-link-pop .mlp-row input:focus{outline:none;border-color:var(--gold,#c8a24a);background:#fff}
.mail-link-pop .mlp-note{font-size:12px;color:var(--muted);margin-bottom:9px}
.mail-link-pop .mlp-actions{display:flex;justify-content:flex-end;gap:7px}
.mail-link-pop .btn-sm-ghost{height:30px;padding:0 12px;border:1px solid var(--border);background:#fff;border-radius:8px;font-size:12px;cursor:pointer;color:var(--ink,#222)}
.mail-link-pop .btn-sm-gold{height:30px;padding:0 14px;border:1px solid var(--gold,#c8a24a);background:var(--gold,#c8a24a);color:#3a2c07;border-radius:8px;font-size:12px;font-weight:600;cursor:pointer}
.mail-link-pop .btn-sm-danger{height:30px;padding:0 12px;border:1px solid var(--red,#c0392b);background:#fff;color:var(--red,#c0392b);border-radius:8px;font-size:12px;font-weight:600;cursor:pointer}
.mail-link-pop .mlp-actions{align-items:center}
.mail-fmtbar{display:flex;flex-wrap:wrap;align-items:center;gap:3px;padding:6px 7px;border-bottom:1px solid var(--border);background:rgba(0,0,0,.02)}
.mail-fmt-btn{min-width:28px;height:28px;padding:0 7px;border:1px solid transparent;background:transparent;border-radius:7px;cursor:pointer;font-size:13px;color:var(--ink,#222);line-height:1}
.mail-fmt-btn:hover{background:#fff;border-color:var(--border)}
.mail-fmt-sel{height:28px;border:1px solid var(--border);border-radius:7px;background:#fff;font-size:12px;padding:0 6px;color:var(--ink,#222)}
.mail-richbody{min-height:220px;max-height:52vh;overflow:auto;padding:12px 14px;font-size:14px;line-height:1.6;color:var(--ink,#222);outline:none}
.mail-richbody:empty:before{content:attr(data-ph);color:var(--muted)}
/* Uniform block spacing: every line (whether the browser makes it a <p> or a <div>
   on Enter) has the same margin, so line spacing is consistent. A blank line comes from
   an empty block (a second Enter), exactly like a plain text editor. */
.mail-richbody p,.mail-richbody div{margin:0}
.mail-richbody ul,.mail-richbody ol{margin:.3em 0;padding-left:22px}
.mail-richbody a{color:#1a56db;text-decoration:underline;cursor:pointer}
/* Outlook-style recipient chips (To / Cc / Bcc) */
.mail-recip{width:100%;min-height:44px;border:1px solid var(--border);border-radius:11px;background:var(--warm);padding:6px 8px;display:flex;flex-wrap:wrap;gap:6px;align-items:center;box-sizing:border-box;cursor:text}
.mail-recip:focus-within{border-color:var(--gold3);background:#fff}
.mail-recip-chip{display:inline-flex;align-items:center;gap:5px;background:#fff;border:1px solid var(--border2);border-radius:8px;padding:3px 5px 3px 10px;font-size:13px;color:var(--ink);max-width:100%;cursor:grab}
.mail-recip-chip:active{cursor:grabbing}
.mail-recip.drag-over{border-color:var(--gold3,#cfa44f);background:rgba(207,164,79,.12);box-shadow:inset 0 0 0 1px var(--gold3,#cfa44f)}
.mail-recip-chip .mrc-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:260px;cursor:pointer;user-select:none}
.mail-recip-chip button{border:none;background:none;color:var(--muted2);cursor:pointer;font-size:15px;line-height:1;padding:0 3px;border-radius:5px}
.mail-recip-chip button:hover{background:rgba(217,83,79,.1);color:var(--red)}
.mail-cform input.mail-recip-in{flex:1;min-width:140px;width:auto;border:none;background:transparent;border-radius:0;padding:4px 2px;font-size:14px}
.mail-cactions{display:flex;align-items:center;gap:12px;margin-top:16px;flex-wrap:wrap}
.mail-secbtn{border:1px solid var(--border);background:#fff;color:var(--ink2);font-size:13px;font-weight:600;padding:9px 16px;border-radius:11px;cursor:pointer}
.mail-secbtn:hover{background:var(--warm)}
.mail-cn-help{font-size:12.5px;color:var(--ink2);line-height:1.55;margin-bottom:6px}
.mail-cn-hints{font-size:11px;color:var(--muted);margin-top:12px;line-height:1.5}
.mail-attach-row{margin-top:12px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.mail-attach-btn{border:1px dashed var(--border2);background:var(--warm);color:var(--ink2);font-size:12.5px;font-weight:600;padding:8px 14px;border-radius:10px;cursor:pointer}
.mail-attach-hint{font-size:12px;color:var(--muted2)}
/* Drag files anywhere over the compose to attach them. */
.mail-compose{position:relative;border-radius:12px}
.mail-compose.mail-dragover{outline:2px dashed var(--gold3);outline-offset:-6px;background:rgba(199,147,56,.05)}
.mail-compose.mail-dragover::after{content:'Drop files to attach';position:absolute;top:10px;right:14px;background:var(--gold3);color:#fff;font-size:11px;font-weight:700;padding:4px 10px;border-radius:999px;pointer-events:none}
.mail-attlist{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.mail-attchip{display:inline-flex;align-items:center;gap:6px;background:var(--warm2);border-radius:8px;padding:4px 8px;font-size:12px;color:var(--ink2)}
.mail-attchip em{color:var(--muted);font-style:normal;font-size:10.5px}
.mail-attchip button{border:none;background:none;color:var(--red);font-size:14px;cursor:pointer;line-height:1}
.mail-sched-row{display:flex;align-items:center;gap:12px;margin-top:14px;flex-wrap:wrap}
.mail-sched-row input[type=datetime-local]{width:auto;border:1px solid var(--border);border-radius:10px;background:var(--warm);padding:8px 10px;font:inherit;font-size:13px}
.mail-sched-row input:disabled{opacity:.5}
.mail-voice-row{display:flex;align-items:center;gap:12px;margin-top:14px;flex-wrap:wrap}
.mail-voice-btn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--gold2);background:linear-gradient(180deg,var(--warm),var(--warm2));color:var(--gold3);font-size:13px;font-weight:600;padding:9px 15px;border-radius:11px;cursor:pointer;transition:background .15s,box-shadow .15s}
.mail-voice-btn svg{width:16px;height:16px}
.mail-voice-btn:hover{background:#fff;box-shadow:0 2px 10px rgba(207,164,79,.18)}
.mail-voice-btn.recording{border-color:var(--red);color:var(--red);background:rgba(217,83,79,.08);animation:mvPulse 1.3s ease-in-out infinite}
.mail-voice-btn.working{opacity:.7;cursor:progress}
@keyframes mvPulse{0%,100%{box-shadow:0 0 0 0 rgba(217,83,79,.35)}50%{box-shadow:0 0 0 6px rgba(217,83,79,0)}}
.mail-voice-time{font-size:12.5px;font-weight:600;color:var(--ink2);font-variant-numeric:tabular-nums;min-width:38px}
.mail-voice-undo{border:none;background:none;color:var(--gold3);font-size:12.5px;font-weight:600;text-decoration:underline;cursor:pointer;padding:0 4px}
.mail-voice-undo:hover{color:var(--gold2)}
@media(max-width:1100px){.mail-wrap{--mail-w-side:200px;--mail-w-main:340px}}
/* Mobile-only mail controls (hidden on desktop). */
.mail-mobtn{display:none}
.mail-back{display:none}
@media(max-width:900px){
  /* The off-screen (translated) folders drawer + reader are position:fixed; without
     this they'd extend the page past the right edge and let it scroll sideways.
     overflow-x:clip hides that WITHOUT creating a scroll container (keeps sticky). */
  html,body{overflow-x:clip}
  /* !important beats the inline height renderEmail sets, which would otherwise
     pin the wrapper to a fixed height and clip / un-scroll the message list. */
  .mail-wrap{display:block !important;height:auto !important;min-height:0 !important}
  .mail-resizer{display:none}
  /* One pane at a time. Message list is the base full-width view. On iOS the
     nested flex scroll region (.mail-list overflow:auto inside a dvh-sized
     .mail-main) doesn't reliably scroll and gets stuck — so on mobile the list
     flows into the PAGE scroll instead (same fix as the mailboxes drawer):
     .mail-main stops clipping, and .mail-list grows to its natural height while
     the page (.content) scrolls it. */
  .mail-main{height:auto;min-height:0;overflow:visible}
  .mail-list{overflow:visible;flex:0 0 auto}
  /* On mobile the list flows into the page scroll, so an absolute pill would sit far
     below the fold. Pin the selection bar to the viewport bottom instead. */
  .mail-bulkbar.show{position:fixed;bottom:14px;left:50%}
  .mail-mobtn{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;flex:none;border:1px solid var(--border2);background:var(--card);color:var(--ink);border-radius:10px;font-size:17px;cursor:pointer}
  /* Mailboxes/folders: slide-in drawer from the left, hidden by default.
     The whole drawer scrolls as one column (accounts + expanded folders can run
     taller than the screen); overscroll-behavior:contain stops that scroll from
     chaining through to the message list behind it (the old bug where dragging
     the drawer scrolled the inbox instead). The base .mail-side sets
     overflow:hidden, so re-enable vertical scrolling here. */
  /* display:block (not flex) so iOS Safari reliably momentum-scrolls the drawer —
     a fixed flex column with overflow:auto is exactly the case iOS refuses to
     scroll. Its children (head/actions/accounts) stack as normal blocks and the
     drawer itself is the scroll container. */
  .mail-side{position:fixed;top:0;left:0;bottom:0;width:min(310px,86vw);z-index:350;margin:0;border-radius:0;border:none;border-right:1px solid var(--border);transform:translateX(-102%);transition:transform .22s ease;box-shadow:0 0 50px rgba(36,29,18,.28);display:block;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
  /* While the drawer is open, freeze the page behind it so a drag scrolls the
     DRAWER, not the message list underneath (iOS otherwise chains the scroll). */
  body.mail-drawer-open .content{overflow:hidden!important}
  .mail-wrap.m-folders .mail-side{transform:translateX(0)}
  /* Let the accounts list grow to its natural height so the DRAWER is the single
     scroll container (a nested flex:1 scroll region doesn't reliably catch touch
     inside a translated drawer on iOS). */
  .mail-accts{flex:0 0 auto;overflow:visible}
  .mail-mobile-bd{position:fixed;inset:0;background:rgba(36,29,18,.35);z-index:345}
  /* Reader: full-screen slide-in from the right. */
  .mail-reader{position:fixed;inset:0;z-index:352;margin:0;border-radius:0;border:none;transform:translateX(102%);transition:transform .22s ease;overflow-y:auto}
  .mail-wrap.m-reader .mail-reader{transform:translateX(0)}
  /* Full-bleed, sticky, high-contrast bar so getting back to the list is obvious
     (it used to be a faint "‹ Back" text link tucked inside the reader padding). The
     negative margins pull it out to the panel edges past .mail-reader-inner's padding. */
  .mail-back{display:flex;align-items:center;gap:6px;position:sticky;top:0;margin:-20px -22px 16px;width:calc(100% + 44px);background:var(--card);border:none;border-bottom:1px solid var(--border);color:var(--gold3);font-size:15px;font-weight:700;cursor:pointer;padding:15px 18px;z-index:5;box-shadow:0 2px 10px rgba(36,29,18,.06)}
  .mail-back .mb-arrow{font-size:22px;line-height:1;margin-top:-2px}
}
.rs-ask h3{font-size:15px;font-weight:700;margin-bottom:12px}
.rs-ask label{display:block;font-size:12px;font-weight:600;color:var(--muted);margin:0 0 6px}
.rs-ask textarea{width:100%;min-height:120px;resize:vertical;border:1px solid var(--border);border-radius:12px;background:var(--warm);padding:12px;font:inherit;font-size:14px;color:var(--ink);box-sizing:border-box}
.rs-ask select{width:100%;border:1px solid var(--border);border-radius:12px;background:var(--warm);padding:11px 12px;font:inherit;font-size:14px;color:var(--ink);margin-bottom:14px;box-sizing:border-box}
.rs-ask textarea:focus,.rs-ask select:focus{outline:none;border-color:var(--gold2)}
.rs-err{color:var(--red);font-size:12.5px;margin-top:10px;display:none}
.rs-list h3{font-size:13px;font-weight:700;color:var(--muted);margin:22px 0 10px;text-transform:uppercase;letter-spacing:.4px}
.rs-item{width:100%;text-align:left;border:1px solid var(--border);background:var(--card);border-radius:12px;padding:11px 13px;margin-bottom:8px;cursor:pointer;transition:.12s;display:block}
.rs-item:hover{border-color:var(--gold2);transform:translateY(-1px)}
.rs-item.active{border-color:var(--gold3);box-shadow:0 0 0 1px var(--gold3) inset}
.rs-item .q{font-size:13.5px;font-weight:600;color:var(--ink);line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rs-item .meta{font-size:11.5px;color:var(--muted);margin-top:5px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.rs-vt{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;color:var(--gold3);background:rgba(199,147,56,0.1);border-radius:999px;padding:2px 9px}
.rs-vt .vd{width:7px;height:7px;border-radius:50%;background:var(--gold3)}
.rs-report{min-height:200px}
.rs-rhead{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;flex-wrap:wrap;margin-bottom:14px;padding-bottom:14px;border-bottom:1px solid var(--border)}
.rs-rhead .qz{font-size:12px;color:var(--muted);margin-top:4px;max-width:560px}
.rs-rhead h2{font-size:18px;font-weight:700;line-height:1.3}
.rs-acts{display:flex;gap:8px;flex-wrap:wrap}
.rs-btn{border:1px solid var(--border);background:var(--card);border-radius:10px;color:var(--ink2);font-size:12.5px;font-weight:600;padding:8px 13px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:.12s}
.rs-btn:hover{border-color:var(--gold2);color:var(--ink)}
.rs-btn svg{width:15px;height:15px}
.rs-btn.danger:hover{border-color:var(--red);color:var(--red)}
.rs-body{font-size:14px;line-height:1.65;color:var(--ink)}
.rs-body h1{font-size:21px;font-weight:700;margin:18px 0 10px}
.rs-body h2{font-size:17px;font-weight:700;margin:22px 0 10px;padding-top:6px}
.rs-body h3{font-size:15px;font-weight:700;margin:16px 0 8px}
.rs-body p{margin:10px 0}
.rs-body ul,.rs-body ol{margin:10px 0;padding-left:22px}
.rs-body li{margin:4px 0}
.rs-body blockquote{border-left:3px solid var(--gold2);padding:2px 0 2px 14px;margin:12px 0;color:var(--muted)}
.rs-body code{background:var(--warm);border-radius:5px;padding:1px 6px;font-size:13px}
.rs-body pre{background:var(--warm);border:1px solid var(--border);border-radius:12px;padding:14px;overflow:auto;margin:12px 0}
.rs-body pre code{background:none;padding:0}
.rs-body hr{border:none;border-top:1px solid var(--border);margin:18px 0}
.rs-body a{color:var(--gold3)}
.rs-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;color:var(--muted);text-align:center}
.rs-spin{width:34px;height:34px;border:3px solid var(--border);border-top-color:var(--gold3);border-radius:50%;animation:bb-spin .8s linear infinite;margin-bottom:16px}
@keyframes bb-spin{to{transform:rotate(360deg)}}
.rs-blank{text-align:center;color:var(--muted);padding:50px 20px;font-size:14px}

/* voice overlay */
.voice-ov{position:fixed;inset:0;z-index:400;background:rgba(244,241,234,0.72);backdrop-filter:blur(16px);display:none;flex-direction:column;align-items:center;justify-content:center;cursor:pointer}
.voice-orb-wrap{position:relative;width:108px;height:108px;margin-bottom:32px}
.voice-orb-wrap .ring{position:absolute;inset:0;border-radius:50%;border:2px solid var(--gold2);animation:bb-ring 2.4s ease-out infinite}
.voice-orb-wrap .ring:nth-child(2){animation-delay:.8s}
.voice-orb-wrap .ring:nth-child(3){animation-delay:1.6s}
.voice-listen{font-size:20px;font-weight:700;display:flex;align-items:center;gap:4px}
.voice-listen .cur{width:3px;height:22px;background:var(--gold3);animation:bb-blink 1s steps(1) infinite}
.voice-trans{color:var(--muted);font-size:14px;margin:14px 0 8px;min-height:20px;max-width:480px;text-align:center}
.voice-stop{font-size:12px;color:var(--muted2)}

/* CLOUD TEAM VAULT */
.btn-sm-ghost{border:1px solid var(--border2,var(--border));background:#fff;color:var(--ink2,var(--muted));font-size:12.5px;font-weight:600;padding:9px 14px;border-radius:10px;cursor:pointer;transition:.15s}
.btn-sm-ghost:hover{background:var(--warm,#f4f1ea)}
.btn-sm-ghost.is-active{background:var(--gold,#c8a24a);border-color:var(--gold,#c8a24a);color:#3a2c07}
.btn-sm-ghost.is-active:hover{background:var(--gold,#c8a24a)}
.vault-wrap{display:grid;grid-template-columns:var(--vault-side-w,320px) 7px 1fr;gap:9px;height:calc(100vh - 132px);min-height:480px}
.vault-side{background:#fff;border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;overflow:hidden;min-width:0}
/* Drag handle to widen the tree so long, deeply-nested folder names are readable. */
.vault-resizer{cursor:col-resize;border-radius:4px;background:transparent;transition:background .12s;align-self:stretch}
.vault-resizer:hover,.vault-resizer.dragging{background:var(--gold3,#cfa44f)}
.vault-side-top{padding:12px;border-bottom:1px solid var(--border);display:flex;flex-direction:column;gap:8px}
.vault-scope{display:flex;align-items:center;gap:4px;background:var(--panel-2,rgba(127,127,127,.08));padding:3px;border-radius:8px}
.vault-scope-tab{flex:1;border:0;background:transparent;color:var(--muted);font-size:12px;font-weight:600;padding:5px 8px;border-radius:6px;cursor:pointer}
.vault-scope-tab.active{background:var(--bg,#fff);color:var(--text);box-shadow:0 1px 2px rgba(0,0,0,.08)}
.vault-scope-sync{border:0;background:transparent;color:var(--muted);font-size:11.5px;font-weight:600;padding:5px 8px;border-radius:6px;cursor:pointer;white-space:nowrap}
.vault-scope-sync:hover{color:var(--gold,#cfa44f)}
.vault-search,.vault-vfilter,.vault-title-in,.vault-path-in,.vault-venture-sel,.vault-venture-sel{font-family:inherit}
.vault-search{border:1px solid var(--border);border-radius:9px;padding:8px 10px;font-size:13px;outline:none}
.vault-search:focus{border-color:var(--gold3)}
.vault-vfilter{border:1px solid var(--border);border-radius:9px;padding:7px 9px;font-size:12.5px;background:#fff;cursor:pointer}
.vault-side-actions{display:flex;gap:7px;flex-wrap:wrap}
.vault-side-actions button{flex:1 1 auto;min-width:70px;padding:8px 6px;white-space:nowrap}
.vault-tree-tools{display:flex;gap:6px;padding:6px 12px 0}
.vault-tool-btn{flex:1;border:0;background:transparent;color:var(--muted);font-size:11px;font-weight:600;padding:4px 6px;border-radius:6px;cursor:pointer}
.vault-tool-btn:hover{background:var(--warm,#f4f1ea);color:var(--text)}
.vault-tree{flex:1;overflow:auto;padding:8px}
.vault-folder{margin-bottom:2px}
.vault-folder-h{display:flex;align-items:center;gap:7px;padding:7px 8px;border-radius:9px;cursor:pointer;font-size:13px;font-weight:600;color:var(--ink2,#333)}
.vault-folder-h:hover{background:var(--warm,#f4f1ea)}
.vault-fact{font-size:11px;opacity:0;cursor:pointer;padding:1px 3px;border-radius:5px;color:var(--muted);transition:opacity .12s}
.vault-folder-h:hover .vault-fact{opacity:.75}
.vault-fact:hover{opacity:1;background:#fff}
.vault-fact-del:hover{color:#c0392b}
.vault-caret{font-size:10px;color:var(--muted);transition:transform .15s;display:inline-block}
.vault-caret.open{transform:rotate(90deg)}
.vault-fdot{width:9px;height:9px;border-radius:50%;flex:0 0 auto}
.vault-fname{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vault-fcount{font-size:11px;color:var(--muted);background:var(--warm,#f4f1ea);border-radius:10px;padding:1px 7px}
.vault-folder-docs{padding-left:14px}
.vault-doc{display:flex;align-items:center;gap:7px;padding:6px 8px;border-radius:8px;cursor:pointer;font-size:12.5px;color:var(--muted2,#555)}
.vault-doc svg{width:14px;height:14px;flex:0 0 auto;color:var(--gold3)}
.vault-doc span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vault-doc small{margin-left:auto;font-size:10px;color:var(--muted)}
.vault-doc:hover{background:var(--warm,#f4f1ea)}
.vault-doc.active{background:linear-gradient(135deg,rgba(207,164,79,.18),rgba(230,197,119,.12));color:var(--ink,#222);font-weight:600}
.vault-doc-empty{font-size:11.5px;color:var(--muted);padding:4px 8px}
.vault-main{background:#fff;border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;overflow:hidden}
.vault-placeholder{margin:auto;color:var(--muted);font-size:14px;max-width:360px;text-align:center;padding:30px}
.vault-doc-head{padding:14px 16px 10px;border-bottom:1px solid var(--border)}
.vault-title-in{width:100%;border:none;outline:none;font-size:20px;font-weight:700;letter-spacing:-.3px;color:var(--ink,#222);padding:0 0 6px}
.vault-doc-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.vault-path-in{flex:1;min-width:140px;border:1px solid var(--border);border-radius:8px;padding:6px 9px;font-size:12px;color:var(--muted2);outline:none}
.vault-path-in:focus{border-color:var(--gold3)}
.vault-venture-sel{border:1px solid var(--border);border-radius:8px;padding:6px 8px;font-size:12px;background:#fff;cursor:pointer}
.vault-savestate{font-size:11.5px;color:var(--muted)}
.vault-savestate.saved{color:#7fa56b}
.vault-savestate.dirty{color:#c98a4f}
.vault-del{color:#c0392b;border-color:#e8c7c2}
/* Single content pane: reading (rendered) OR editing (raw) — never both at once. */
.vault-body{flex:1;display:flex;overflow:hidden;min-height:0}
.vault-editor-full,.vault-preview-full{flex:1;min-height:0;width:100%}
.vault-editor-row{flex:1;display:grid;grid-template-columns:1fr 1fr;overflow:hidden;min-height:0}
.vault-editor{border:none;outline:none;resize:none;padding:16px 20px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;line-height:1.6;color:var(--ink,#222);background:#fcfbf8}
.vault-preview{overflow:auto;padding:16px 20px;font-size:14px;line-height:1.65;color:var(--ink,#222)}
.vault-preview h1{font-size:22px;margin:.4em 0 .3em}.vault-preview h2{font-size:18px;margin:.5em 0 .3em}.vault-preview h3{font-size:15.5px;margin:.5em 0 .3em}
.vault-preview p{margin:.5em 0}.vault-preview ul,.vault-preview ol{margin:.4em 0;padding-left:22px}.vault-preview li{margin:2px 0}
.vault-preview code{background:var(--warm,#f4f1ea);padding:1px 5px;border-radius:5px;font-size:12.5px}
.vault-preview pre{background:#2b2620;color:#f4f1ea;padding:12px 14px;border-radius:10px;overflow:auto}
.vault-preview pre code{background:none;color:inherit;padding:0}
.vault-preview blockquote{border-left:3px solid var(--gold3);margin:.5em 0;padding:2px 12px;color:var(--muted2)}
.vault-preview hr{border:none;border-top:1px solid var(--border);margin:1em 0}
.vault-preview a{color:#8a6d2f}
.vault-wl{color:#a87f2e;font-weight:600;text-decoration:none;border-bottom:1px dashed rgba(168,127,46,.5)}
.vault-wl:hover{background:rgba(207,164,79,.15)}
.vault-empty-prev{color:var(--muted)}
/* Live Preview editor: one editable pane, formatted, with per-line raw reveal. */
.vault-live{overflow:auto;padding:16px 20px;font-size:14px;line-height:1.65;color:var(--ink,#222);outline:none;background:#fcfbf8;caret-color:var(--gold3,#c8a24a)}
.vault-live .lp-ln{min-height:1.5em;padding:1px 0;white-space:pre-wrap;word-break:break-word}
/* Active line: no font change, no box highlight — just the caret, like Obsidian. It keeps
   its block styling (headings stay big) and only the markdown markers become visible. */
.vault-live .lp-h1{font-size:22px;font-weight:800;margin-top:.3em}
.vault-live .lp-h2{font-size:18px;font-weight:800;margin-top:.3em}
.vault-live .lp-h3{font-size:15.5px;font-weight:700;margin-top:.2em}
.vault-live .lp-h4,.vault-live .lp-h5,.vault-live .lp-h6{font-size:14px;font-weight:700}
.vault-live .lp-li{padding-left:6px}
.vault-live .lp-bullet{color:var(--gold3);font-weight:700}
.vault-live .lp-quote{border-left:3px solid var(--gold3);padding-left:12px;color:var(--muted2)}
.vault-live .lp-hrline{display:block;border-top:1px solid var(--border);margin:.4em 0}
.vault-live code{background:var(--warm,#f4f1ea);padding:1px 5px;border-radius:5px;font-size:12.5px}
.vault-live a{color:#8a6d2f}
.vault-live strong{font-weight:800}
/* Live-preview inline tokens: markers (.lp-mk) stay in the text so the source is
   never lost, but collapse to zero width until the caret enters the token
   (.lp-open), which reveals them dimmed — only that one token, not the line. */
.vault-live .lp-mk{font-size:0;letter-spacing:-1px;opacity:0}
.vault-live .lp-tok.lp-open .lp-mk{font-size:inherit;letter-spacing:normal;opacity:1;font-weight:400;color:var(--muted2,#a39c8c)}
.vault-backlinks{border-top:1px solid var(--border);padding:11px 16px;max-height:140px;overflow:auto;background:#fcfbf8}
.vault-bl-title{font-size:10.5px;font-weight:700;letter-spacing:.7px;text-transform:uppercase;color:var(--muted);margin-bottom:7px}
.vault-bl-list{display:flex;flex-wrap:wrap;gap:7px}
.vault-bl-item{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--ink2,#444);background:#fff;border:1px solid var(--border);border-radius:9px;padding:5px 10px;text-decoration:none}
.vault-bl-item svg{width:13px;height:13px;color:var(--gold3)}
.vault-bl-item:hover{border-color:var(--gold3);background:var(--warm,#f4f1ea)}
.vault-bl-empty{font-size:12px;color:var(--muted)}

@media(max-width:900px){
  .vault-wrap{grid-template-columns:1fr;height:auto}
  .vault-side{max-height:300px}
  .vault-resizer{display:none}
  .vault-main{min-height:520px}
  .vault-editor-row{grid-template-columns:1fr}
  .vault-editor{border-right:none;border-bottom:1px solid var(--border);min-height:220px}
  /* Mobile bottom bar: fixed height, horizontal scroll ONLY (no vertical drift).
     It shows main categories (group icons) plus the direct items; tapping a
     group opens a popover of its sub modules above the bar (like desktop, just
     grouped instead of one long flat list). */
  .rail{top:auto;bottom:0;right:0;left:0;width:auto;height:calc(58px + env(safe-area-inset-bottom));flex-direction:row;align-items:center;border-right:none;border-top:1px solid var(--border);padding:0 calc(8px + env(safe-area-inset-right)) env(safe-area-inset-bottom) calc(8px + env(safe-area-inset-left));overflow:visible;z-index:120}
  .rail-logo{display:none}
  .rail-nav{flex-direction:row;gap:4px;height:56px;overflow-x:auto;overflow-y:hidden;align-items:center;flex-wrap:nowrap;-webkit-overflow-scrolling:touch}
  .rail-nav::-webkit-scrollbar{display:none}
  .rail-sep{display:none}
  .nav-expand-toggle{display:none}
  /* Items that live directly in the bar (direct modules + group headers): fixed
     square icons so the row never shifts vertically while scrolling sideways. */
  .rail-nav > .nav-btn{flex:0 0 auto;width:46px;height:46px;padding:0;justify-content:center;gap:0}
  .rail-nav > .nav-btn .nav-label,.rail-nav > .nav-btn .nav-caret{display:none}
  .nav-group{display:flex !important}
  /* The in-bar children list is replaced on mobile by the body-level overlay
     (#bbMobileSheet) so iOS does not clip it. Always hide it here. */
  .nav-children{display:none !important}
  .nav-btn.active::before{left:50%;top:auto;bottom:-2px;transform:translateX(-50%);width:20px;height:3px}
  /* On mobile the active module lives inside a group popover, so highlight the GROUP
     icon in the bottom bar (background + underline) the same way an active module is,
     so you can always see which section you are in. */
  .rail-nav > .nav-group.has-active{background:linear-gradient(135deg,rgba(230,197,119,0.22),rgba(199,147,56,0.16));color:var(--gold3)}
  .rail-nav > .nav-group.has-active::before{content:'';position:absolute;left:50%;top:auto;bottom:-2px;transform:translateX(-50%);width:20px;height:3px;border-radius:3px;background:linear-gradient(var(--gold1),var(--gold3))}
  .main{margin-left:0}
  /* Keep the current module NAME visible in the header on mobile — it is the clearest
     'where am I' signal on a small screen. */
  header{padding:0 12px}.hd-mod{display:block;border-left:none;padding-left:0;font-size:14px;font-weight:700;color:var(--ink);max-width:42vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.usr-meta{display:none}.role-pill{display:none}
  /* Free up header space on phones so nothing overlaps: drop the wordmark (keep the
     diamond) and the venture label (keep the dot), and tighten the gaps. */
  .hd-wm{display:none}
  .hd-right{gap:7px}
  .vsw-lbl{display:none}.vsw-btn{padding:0 9px}
  /* Header dropdowns anchor to tiny wrappers with right:0, so on a narrow screen they
     open off the left edge / cropped. Pin them to the viewport instead, centered under
     the header, so they always show fully on screen. */
  .notif-panel{position:fixed;top:62px;left:10px;right:10px;width:auto;max-width:none}
  .notif-list{max-height:66vh}
  .cost-pop{position:fixed;top:62px;left:10px;right:10px;min-width:0;max-width:none}
  .vsw-menu{position:fixed;top:62px;left:10px;right:10px;min-width:0;max-width:none}
  .content{padding:18px 14px calc(80px + env(safe-area-inset-bottom));overflow-x:hidden}
  .board{grid-template-columns:1fr;gap:10px}
  .media-grid{display:flex;flex-direction:column;height:auto;margin:0}
  .m-resizer{display:none}
  .media-grid.side-collapsed>.media-side,.media-grid.chat-collapsed>.media-chat{display:block}
  .media-side,.media-chat{border:none;border-bottom:1px solid var(--border)}
  .vibe-grid{display:flex;flex-direction:column;height:auto;margin:0}
  .vibe-chat{border:none;border-bottom:1px solid var(--border);max-height:60vh}
  .vibe-prevwrap{min-height:360px}
  .drawer{width:100%}
  .modal-bd{align-items:flex-end;padding:0}
  /* Beat per-modal inline width:NNNpx so wide modals (leads, equipment, social, workload) never overflow on phones. */
  .modal{width:100%!important;max-width:100%!important;max-height:88vh;max-height:88dvh;border-radius:18px 18px 0 0;padding:22px 18px calc(22px + env(safe-area-inset-bottom))}
  .composer{padding:12px 14px}
  /* Any 4-up inline grid (workload split, equipment KPIs) collapses on phones. */
  [style*="grid-template-columns:repeat(4,1fr)"]{grid-template-columns:repeat(2,1fr)!important}
  .soc-grid{grid-template-columns:1fr!important}
  .kpi{min-width:0}
  /* Search/filter inputs declare fixed min-widths (220–240px); cap them so they never overrun a phone row. */
  .eq-filterbar input,.eq-filterbar select{min-width:0!important;flex:1 1 100%;max-width:100%}
  .vqa input,.vqa select{min-width:0!important}
  /* Wide multi-column .tbl tables (Tasks list, Team Attendance) get a real scroll
     width so their overflow-x:auto wrappers scroll on a phone instead of crushing. */
  .tbl{min-width:560px}
  /* Task drawer key/value pairs (Due+Priority, Assignee+Time) stack on mobile. */
  .kv2{grid-template-columns:1fr;gap:12px}
  /* Time Report per-user "By module" / "Top tasks" pair stacks on mobile. */
  .tr-modtask{grid-template-columns:1fr!important;gap:14px}
  /* Knowledge Graph canvas: use viewport height on a phone (the inline 560px is too
     tall and the fixed value can't be overridden without !important). */
  #grCanvas{height:60vh!important;min-height:340px}
  /* Media Studio: when the grid stacks (flex column), give the output + chat
     panels real height so flex:1 children (result viewport, transcript) don't collapse. */
  .media-out{min-height:70vh}
  .media-out-main{min-height:48vh}
  .media-chat{min-height:60vh}
  .mchat-msgs{min-height:200px}
  /* Coding Agent repo header: let the title/URL/actions wrap and truncate the URL
     so a long GitHub https URL can't scroll the page sideways. */
  .code-repohead{flex-wrap:wrap}
  .code-repohead-url{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  /* Bigger tap targets for the +new / attach / vibe session +/× buttons. */
  .proj-btn{min-width:38px;min-height:38px}
  /* Calendar event modal: stack the two datetime-local inputs (they have a large
     native min-width on mobile and overflow a 2-col grid). */
  .cal-form-row{grid-template-columns:1fr}
  /* Calendar grid: shrink cells/typography so 7 day columns stay legible on a phone. */
  .cal-grid .cal-cell{min-height:72px;padding:4px}
  .cal-grid.cal-week .cal-cell{min-height:200px}
  .cal-dow{padding:6px 2px;font-size:10px}
  .cal-chip{font-size:10px;padding:2px 4px}
  .cal-daynum{width:20px;height:20px;font-size:11px}
  /* Calendar modal uses .cal-modal (not .modal), so give it the bottom-sheet treatment too. */
  #calModalBd.modal-bd{align-items:flex-end;padding:0}
  .cal-modal{width:100%!important;max-width:100%!important;border-radius:18px 18px 0 0;max-height:90vh}
  /* Over-wide HTML emails (fixed-width newsletters) scroll inside the reader, not the page. */
  .mail-rd-body,.mail-reader-inner{overflow-x:auto}
  /* Long recipient/subject in the AI email draft wraps instead of forcing overflow. */
  .cmd-draft-row b{min-width:0;word-break:break-word;overflow-wrap:anywhere}
  /* Bottom-bar scroll affordance: fade the right edge so off-screen group icons are discoverable. */
  .rail-nav{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 18px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 18px),transparent)}
}

/* ════════════════ CALENDAR ════════════════ */
.cal-wrap{display:grid;grid-template-columns:1fr 320px;gap:20px;align-items:start}
.cal-main{min-width:0}
.cal-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:16px;flex-wrap:wrap}
.cal-nav{display:flex;align-items:center;gap:8px}
.cal-period{font-size:18px;font-weight:700;margin:0 0 0 6px;color:var(--ink)}
.cal-iconbtn{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--border);background:var(--card);border-radius:9px;cursor:pointer;color:var(--ink2);transition:.15s}
.cal-iconbtn:hover{background:var(--warm2);color:var(--ink)}
.cal-iconbtn svg{width:18px;height:18px}
.cal-iconbtn.sm{width:26px;height:26px}.cal-iconbtn.sm svg{width:14px;height:14px}
.cal-today{padding:7px 14px;border:1px solid var(--border);background:var(--card);border-radius:9px;cursor:pointer;font-weight:600;font-size:13px;color:var(--ink2)}
.cal-today:hover{background:var(--warm2);color:var(--ink)}
.cal-right{display:flex;align-items:center;gap:10px}
.cal-seg{display:flex;background:var(--warm2);border:1px solid var(--border);border-radius:10px;padding:3px}
.cal-seg button{border:none;background:transparent;padding:6px 14px;border-radius:7px;cursor:pointer;font-weight:600;font-size:13px;color:var(--ink2)}
.cal-seg button.on{background:var(--card);color:var(--ink);box-shadow:0 1px 3px rgba(36,29,18,0.12)}
.cal-newbtn{width:auto!important;padding:9px 16px!important;display:inline-flex;align-items:center;gap:7px}
.cal-newbtn svg{width:16px;height:16px}
.cal-grid-host{background:var(--card);border:1px solid var(--border);border-radius:14px;overflow:hidden}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr)}
.cal-dow{padding:10px 8px;text-align:center;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);border-bottom:1px solid var(--border);background:var(--warm)}
.cal-cell{min-height:104px;border-right:1px solid var(--border);border-bottom:1px solid var(--border);padding:6px;cursor:pointer;transition:.12s;display:flex;flex-direction:column;gap:3px}
.cal-grid.cal-week .cal-cell{min-height:360px}
.cal-cell:nth-child(7n+7){border-right:none}
.cal-cell:hover{background:var(--warm)}
.cal-out{background:var(--warm);opacity:.6}
.cal-today-cell .cal-daynum{background:linear-gradient(135deg,var(--gold1),var(--gold3));color:#3a2c12}
.cal-daynum{font-size:12px;font-weight:600;color:var(--ink2);width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;border-radius:7px}
.cal-chip{font-size:11px;line-height:1.3;padding:3px 6px;border-radius:6px;background:var(--warm2);border-left:3px solid var(--c,#cfa44f);color:var(--ink);cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cal-chip:hover{filter:brightness(0.97)}
.cal-chip-t{font-weight:700;color:var(--ink2)}
.cal-chip-ext{background:var(--warm);border-left-style:dashed;font-style:italic;color:var(--ink2);cursor:default}
/* External calendar sync panel */
.cal-card h3 svg{width:15px;height:15px;vertical-align:-2px}
.cal-sync-add{display:flex;flex-direction:column;gap:8px;margin:12px 0}
.cal-sync-add select,.cal-sync-add input{background:var(--warm);border:1px solid var(--border);border-radius:9px;padding:8px;font-size:12.5px;color:var(--ink);width:100%}
.cal-sync-add .btn-gold{width:100%}
.cal-sync-item{border:1px solid var(--border);border-radius:11px;padding:10px;margin-bottom:10px;background:var(--warm)}
.cal-sync-head{display:flex;align-items:center;gap:7px}
.cal-sync-prov svg{width:14px;height:14px;display:block;color:var(--muted)}
.cal-sync-name{flex:1;font-size:12.5px;font-weight:600;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cal-sync-pill{font-size:10.5px;font-weight:700;text-transform:capitalize;color:#fff;background:var(--c,#888);padding:2px 7px;border-radius:20px}
.cal-sync-meta{font-size:11.5px;color:var(--muted);margin-top:5px}
.cal-sync-err{font-size:11.5px;color:#c0563f;margin-top:5px;line-height:1.4}
.cal-sync-actions{display:flex;align-items:center;gap:6px;margin-top:9px}
.cal-sync-actions .btn-line{padding:6px 11px;font-size:12px;display:inline-flex;align-items:center;gap:5px}
.cal-sync-actions .btn-line svg{width:13px;height:13px}
.cal-sync-x{margin-left:auto;background:none;border:1px solid var(--border);border-radius:8px;width:30px;height:30px;cursor:pointer;color:var(--muted);display:inline-flex;align-items:center;justify-content:center}
.cal-sync-x:hover{color:#c0563f;border-color:#c0563f}
.cal-sync-x svg{width:14px;height:14px}
.cal-sync-msg{font-size:11.5px;color:var(--ink2);margin-top:8px;line-height:1.4}
.cal-sync-msg-err{color:#c0563f}
.cal-more{font-size:10.5px;font-weight:600;color:var(--muted);padding:1px 6px}
.cal-side{display:flex;flex-direction:column;gap:16px;position:sticky;top:0}
.cal-card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:16px}
.cal-card h3{font-size:13px;font-weight:700;margin:0 0 12px;color:var(--ink)}
.cal-suggest-row{display:flex;gap:8px;flex-wrap:wrap}
.cal-suggest-row select{flex:1 1 0;min-width:90px;background:var(--warm);border:1px solid var(--border);border-radius:9px;padding:8px;font-size:12.5px;color:var(--ink)}
.cal-hint{font-size:12px;color:var(--muted);line-height:1.5}
.cal-sug-list{margin-top:12px;display:flex;flex-direction:column;gap:6px;max-height:240px;overflow:auto}
.cal-slot{display:flex;flex-direction:column;align-items:flex-start;gap:1px;text-align:left;border:1px solid var(--border);background:var(--warm);border-radius:9px;padding:7px 10px;cursor:pointer;transition:.12s}
.cal-slot:hover{border-color:var(--gold2);background:var(--card)}
.cal-slot span{font-size:11px;color:var(--muted)}
.cal-slot strong{font-size:13px;color:var(--ink)}
.cal-req{border:1px solid var(--border);border-radius:11px;padding:11px;margin-bottom:10px;background:var(--warm)}
.cal-req-h{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.cal-req-sub{font-size:13px;font-weight:700;color:var(--ink)}
.cal-req-from{font-size:11.5px;color:var(--muted);margin-top:2px}
.cal-req-times{display:flex;flex-direction:column;gap:5px;margin-top:9px}
.cal-reqtime{display:flex;align-items:center;gap:6px;border:1px solid var(--border);background:var(--card);border-radius:8px;padding:6px 9px;cursor:pointer;font-size:12px;font-weight:600;color:var(--ink);text-align:left;transition:.12s}
.cal-reqtime:hover{border-color:var(--gold2);background:var(--warm2)}
.cal-reqtime svg{width:14px;height:14px;color:var(--gold3);flex-shrink:0}
.cal-force{margin-top:7px;border:none;background:var(--gold3);color:#fff;border-radius:7px;padding:5px 11px;font-size:12px;font-weight:600;cursor:pointer}
/* calendar form + buttons (no shared modal shell in this app) */
.cal-form label{display:block;font-size:12px;font-weight:600;color:var(--ink2);margin:12px 0 5px}
.cal-form label:first-child{margin-top:0}
.cal-form input,.cal-form select,.cal-form textarea{width:100%;background:var(--warm);border:1px solid var(--border);border-radius:10px;padding:10px 12px;font-size:13.5px;color:var(--ink);outline:none;transition:.15s;font-family:inherit}
.cal-form input:focus,.cal-form select:focus,.cal-form textarea:focus{border-color:var(--gold2);background:var(--card)}
.cal-form textarea{min-height:64px;resize:vertical}
.cal-form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cal-modal-err{display:none;margin-top:10px;font-size:12.5px;color:#b4452e;background:rgba(180,69,46,0.08);border:1px solid rgba(180,69,46,0.2);border-radius:9px;padding:9px 11px;line-height:1.5}
.cal-req-err{margin-top:8px}
.cal-modal .btn-line,.cal-card .btn-line{width:auto;padding:9px 16px;border:1px solid var(--border);background:var(--card);border-radius:10px;cursor:pointer;font-weight:600;font-size:13px;color:var(--ink2);transition:.15s}
.cal-modal .btn-line:hover,.cal-card .btn-line:hover{background:var(--warm2);color:var(--ink)}
.cal-modal .btn-gold{width:auto;padding:9px 18px}
.cal-modal .btn-danger-line{width:auto;padding:9px 16px;border:1px solid rgba(180,69,46,0.35);background:var(--card);border-radius:10px;cursor:pointer;font-weight:600;font-size:13px;color:#b4452e;transition:.15s}
.cal-modal .btn-danger-line:hover{background:rgba(180,69,46,0.08)}
@media (max-width:980px){.cal-wrap{grid-template-columns:1fr}.cal-side{position:static}}

/* ════════════════ COMMAND CENTER ════════════════ */
.cmd-wrap{max-width:760px;margin:0 auto;padding:8px 4px 40px}
.cmd-hero{text-align:center;margin:14px 0 26px}
.cmd-orb{width:74px;height:74px;border-radius:50%;margin:0 auto 16px;display:flex;align-items:center;justify-content:center;color:#fff;background:linear-gradient(135deg,var(--gold1),var(--gold3));box-shadow:0 14px 34px rgba(199,147,56,0.42);transition:.2s}
.cmd-orb svg{width:34px;height:34px;fill:rgba(255,255,255,0.18);stroke:#fff}
.cmd-orb.listening{animation:cmdPulse 1.3s ease-in-out infinite}
.cmd-orb.working{animation:cmdSpin 1.1s linear infinite}
@keyframes cmdPulse{0%,100%{box-shadow:0 14px 34px rgba(199,147,56,0.42)}50%{box-shadow:0 14px 50px rgba(217,83,79,0.55);transform:scale(1.05)}}
@keyframes cmdSpin{to{transform:rotate(360deg)}}
.cmd-title{font-size:24px;font-weight:700;letter-spacing:-.4px;margin:0 0 6px}
.cmd-sub{color:var(--muted);font-size:13px;max-width:460px;margin:0 auto;line-height:1.5}
.cmd-box{background:var(--card);border:1px solid var(--border2);border-radius:18px;padding:14px;box-shadow:0 10px 30px rgba(36,29,18,0.06);transition:.15s}
.cmd-box:focus-within{border-color:var(--gold2);box-shadow:0 0 0 3px rgba(207,164,79,0.14),0 10px 30px rgba(36,29,18,0.08)}
.cmd-input{width:100%;border:none;background:transparent;resize:vertical;min-height:48px;font:inherit;font-size:15px;color:var(--ink);outline:none;line-height:1.5}
.cmd-input::placeholder{color:var(--muted2)}
.cmd-actions{display:flex;align-items:center;justify-content:space-between;margin-top:10px;gap:10px}
.cmd-mic{display:flex;align-items:center;gap:7px;background:transparent;border:1px solid var(--border2);border-radius:22px;padding:8px 14px;cursor:pointer;color:var(--ink2);font-size:13px;font-weight:600;transition:.15s}
.cmd-mic:hover{border-color:var(--gold2);color:var(--gold3)}
.cmd-mic svg{width:17px;height:17px}
.cmd-mic.recording{background:rgba(217,83,79,0.1);border-color:var(--red);color:var(--red)}
.cmd-mictime{font-variant-numeric:tabular-nums;font-size:12px}
.cmd-go{display:inline-flex;align-items:center;gap:7px;border:none;border-radius:12px;color:#3a2c12;font-size:14px;font-weight:700;cursor:pointer;padding:10px 20px;background:linear-gradient(135deg,var(--gold1),var(--gold3));box-shadow:0 8px 18px rgba(199,147,56,0.32);transition:.15s}
.cmd-go:hover{filter:brightness(1.04)}
.cmd-go:disabled{opacity:.5;cursor:default}
.cmd-go svg{width:16px;height:16px}
.cmd-ghost{background:transparent;border:1px solid var(--border2);border-radius:11px;padding:9px 16px;font-size:13px;font-weight:600;color:var(--ink2);cursor:pointer;transition:.15s}
.cmd-ghost:hover{border-color:var(--gold2);color:var(--gold3)}
.cmd-status{min-height:18px;text-align:center;color:var(--muted);font-size:12.5px;margin-top:10px}
.cmd-status.busy{color:var(--gold3)}
.cmd-result{margin-top:16px}
.cmd-card{display:flex;gap:13px;background:var(--card);border:1px solid var(--border2);border-radius:16px;padding:16px;box-shadow:0 8px 24px rgba(36,29,18,0.06)}
.cmd-card.ok{border-left:3px solid var(--green)}
.cmd-card.refused{border-left:3px solid var(--red)}
.cmd-card.draft{border-left:3px solid var(--gold2)}
.cmd-card-ic{width:34px;height:34px;border-radius:10px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:rgba(207,164,79,0.12);color:var(--gold3)}
.cmd-card.refused .cmd-card-ic{background:rgba(217,83,79,0.12);color:var(--red)}
.cmd-card.ok .cmd-card-ic{background:rgba(63,174,106,0.12);color:var(--green)}
.cmd-card-ic svg{width:18px;height:18px}
.cmd-card-body{flex:1;min-width:0}
.cmd-card-line{font-size:14px;color:var(--ink);line-height:1.5}
.cmd-draft{margin-top:12px;background:var(--bg);border:1px solid var(--border);border-radius:12px;padding:12px}
.cmd-draft-row{display:flex;gap:10px;font-size:13px;margin-bottom:6px}
.cmd-draft-row span{color:var(--muted);min-width:56px}
.cmd-draft-row b{color:var(--ink);font-weight:600}
.cmd-draft-body{margin:8px 0 0;white-space:pre-wrap;word-break:break-word;font:inherit;font-size:13px;color:var(--ink2);line-height:1.55;max-height:240px;overflow:auto}
.cmd-warn{margin-top:10px;font-size:12.5px;color:var(--amber)}
.cmd-confirm{display:flex;align-items:center;gap:10px;margin-top:14px;flex-wrap:wrap}
.cmd-confirm-from{font-size:12px;color:var(--muted)}
.cmd-mini-sel{font:inherit;font-size:12px;border:1px solid var(--border2);border-radius:8px;padding:4px 6px;color:var(--ink);background:var(--card)}
.cmd-img{margin-top:12px;max-width:100%;border-radius:12px;border:1px solid var(--border)}
.cmd-search-list{margin-top:12px;display:flex;flex-direction:column;gap:7px}
.cmd-search-item{text-align:left;background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:9px 12px;cursor:pointer;display:block;width:100%;transition:.15s}
.cmd-search-item:hover{border-color:var(--gold2)}
.cmd-search-item b{display:block;font-size:13px;color:var(--ink)}
.cmd-search-item small{display:block;color:var(--muted);font-size:12px;margin-top:2px}
.cmd-caps{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:30px}
@media(max-width:640px){.cmd-caps{grid-template-columns:1fr}}
.cmd-cap-col{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px}
.cmd-cap-h{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;letter-spacing:.3px;text-transform:uppercase;margin-bottom:12px}
.cmd-cap-h svg{width:15px;height:15px}
.cmd-cap-can{color:var(--green)}.cmd-cap-cannot{color:var(--red)}
.cmd-cap-row{display:flex;gap:10px;align-items:flex-start;padding:7px 0}
.cmd-cap-ic{width:28px;height:28px;border-radius:8px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.cmd-cap-ic.can{background:rgba(63,174,106,0.1);color:var(--green)}
.cmd-cap-ic.cannot{background:rgba(217,83,79,0.1);color:var(--red)}
.cmd-cap-ic svg{width:15px;height:15px}
.cmd-cap-row b{display:block;font-size:13px;color:var(--ink)}
.cmd-cap-row small{display:block;font-size:12px;color:var(--muted);margin-top:1px;line-height:1.4}
.cmd-history-h{margin:30px 0 12px;font-size:12px;font-weight:700;letter-spacing:.3px;text-transform:uppercase;color:var(--muted)}
.cmd-history{display:flex;flex-direction:column;gap:8px}
.cmd-hrow{display:flex;align-items:center;gap:11px;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:11px 13px}
.cmd-hrow.refused{border-left:3px solid var(--red)}
.cmd-hic{width:26px;height:26px;border-radius:8px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:rgba(207,164,79,0.1);color:var(--gold3)}
.cmd-hrow.refused .cmd-hic{background:rgba(217,83,79,0.1);color:var(--red)}
.cmd-hic svg{width:14px;height:14px}
.cmd-hbody{flex:1;min-width:0}
.cmd-htext{font-size:13px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmd-hsumm{font-size:12px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cmd-htime{font-size:11.5px;color:var(--muted2);flex-shrink:0}

/* ════════════════ Coding Agent module ════════════════ */
.code-wrap{ max-width:1100px; margin:0 auto; }
.code-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:18px; }
.code-head>div:first-child{ flex:1; min-width:0; }
.code-title{ margin:0; font-size:20px; color:#1c1a16; }
.code-sub{ margin:5px 0 0; font-size:13px; color:#7a7567; max-width:640px; line-height:1.5; }
.code-newbtn{ flex-shrink:0; width:auto; padding:11px 18px; white-space:nowrap; display:inline-flex; align-items:center; gap:7px; }
.code-loading,.code-empty-sm{ color:#7a7567; font-size:13px; padding:24px 4px; }
.code-empty{ text-align:center; padding:48px 20px; color:#7a7567; }
.code-empty svg{ width:38px; height:38px; color:#cdbf9a; margin-bottom:10px; }
.code-empty p{ margin:6px 0; font-size:14px; color:#1c1a16; }
.code-empty-sub{ font-size:12.5px !important; color:#7a7567 !important; max-width:440px; margin:6px auto 16px !important; line-height:1.5; }
.code-layout{ display:grid; grid-template-columns:240px 1fr; gap:18px; align-items:start; }
.code-repos{ display:flex; flex-direction:column; gap:8px; }
.code-repo{ display:flex; gap:10px; align-items:center; text-align:left; background:#fff; border:1px solid var(--line,#e7e1d4); border-radius:11px; padding:11px 12px; cursor:pointer; }
.code-repo.on{ border-color:#cdbf9a; box-shadow:0 0 0 2px #f3ead2; }
.code-repo-ic svg{ width:18px; height:18px; color:#a07a32; }
.code-repo-name{ display:block; font-size:13.5px; font-weight:600; color:#1c1a16; }
.code-repo-sub{ display:block; font-size:11px; color:#7a7567; margin-top:2px; }
.code-tok.ok{ color:#5d7a47; } .code-tok.bad{ color:#a05047; }
.code-main{ background:#fff; border:1px solid var(--line,#e7e1d4); border-radius:14px; padding:18px; }
.code-repohead{ display:flex; justify-content:space-between; align-items:flex-start; gap:12px; }
.code-repohead-name{ font-size:16px; font-weight:700; color:#1c1a16; }
.code-repohead-url{ display:inline-flex; align-items:center; gap:4px; font-size:12px; color:#7a7567; text-decoration:none; margin-top:2px; }
.code-repohead-url svg{ width:12px; height:12px; }
.code-repohead-branch{ display:flex; align-items:center; gap:5px; font-size:12px; color:#7a7567; margin-top:6px; }
.code-repohead-branch svg{ width:13px; height:13px; }
.code-repohead-act{ display:flex; gap:6px; }
.code-mini{ border:1px solid var(--line,#e7e1d4); background:#fff; border-radius:8px; padding:7px; cursor:pointer; color:#7a7567; display:inline-flex; }
.code-mini svg{ width:15px; height:15px; }
.code-mini.danger:hover{ color:#a05047; border-color:#e3b8b2; }
.code-warn{ margin:14px 0 0; background:#f4efe0; border:1px solid #e7dcc0; color:#8a7c54; font-size:12.5px; padding:9px 12px; border-radius:9px; }
.code-warn a{ color:#a07a32; }
.code-instruct{ margin:16px 0 18px; }
.code-instruct textarea{ width:100%; padding:11px 13px; border:1px solid var(--line,#e7e1d4); border-radius:11px; font-size:13.5px; font-family:inherit; resize:vertical; background:#fdfbf6; }
.code-runbtn{ margin-top:0; }
.code-runbtn svg{ width:15px; height:15px; }
.code-runrow{ display:flex; align-items:flex-end; gap:12px; margin-top:10px; flex-wrap:wrap; }
.code-runrow .code-runbtn{ margin-left:auto; }
.code-sel-lbl{ display:flex; flex-direction:column; gap:4px; font-size:11px; font-weight:600; letter-spacing:.03em; text-transform:uppercase; color:var(--muted,#999); }
.code-sel{ padding:7px 10px; border:1px solid var(--line,#e7e1d4); border-radius:9px; font-size:13px; font-family:inherit; background:#fdfbf6; cursor:pointer; }
.code-cost-hint{ margin-top:8px; font-size:11.5px; color:var(--muted,#999); }
.code-job-model{ font-size:11px; color:var(--muted,#999); text-transform:capitalize; }
.code-job-cost{ font-size:11px; font-weight:600; color:var(--gold3); }
.code-jobs{ display:flex; flex-direction:column; gap:9px; }
.code-job{ border:1px solid var(--line,#e7e1d4); border-radius:11px; overflow:hidden; background:#fdfbf6; }
.code-job.open{ border-color:#cdbf9a; }
.code-job-hd{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:11px 14px; cursor:pointer; }
.code-job-instr{ font-size:13px; color:#1c1a16; }
.code-job-meta{ display:flex; align-items:center; gap:9px; flex-shrink:0; }
.code-job-when{ font-size:11px; color:#9a9484; }
.code-job-body:empty{ display:none; }
.code-job-body{ padding:0 14px 14px; }
.code-job-line{ display:flex; align-items:center; gap:8px; font-size:12.5px; color:#7a7567; margin-bottom:8px; flex-wrap:wrap; }
.code-job-line svg{ width:13px; height:13px; }
.code-prlink{ display:inline-flex; align-items:center; gap:5px; color:#477a8a; text-decoration:none; font-weight:600; }
.code-approve{ padding:5px 11px !important; font-size:12px !important; }
.code-approve svg{ width:13px; height:13px; }
.code-log{ background:#1c1a16; color:#e8e2d4; font-size:11.5px; line-height:1.5; padding:12px 14px; border-radius:9px; max-height:320px; overflow:auto; white-space:pre-wrap; word-break:break-word; font-family:ui-monospace,Menlo,monospace; margin:0; }
.code-pill{ display:inline-block; font-size:11px; font-weight:600; padding:3px 9px; border-radius:999px; }
.mono{ font-family:ui-monospace,Menlo,monospace; }
.code-modal-bg{ position:fixed; inset:0; background:rgba(28,26,22,.4); display:flex; align-items:center; justify-content:center; z-index:1000; padding:20px; }
.code-modal{ background:#fff; border-radius:16px; width:100%; max-width:480px; max-height:90vh; overflow:auto; box-shadow:0 18px 50px rgba(0,0,0,.25); }
.code-modal-hd{ display:flex; justify-content:space-between; align-items:center; padding:16px 20px; border-bottom:1px solid var(--line,#e7e1d4); font-size:15px; }
.code-modal-bd{ padding:18px 20px; }
.code-modal-bd label{ display:block; font-size:12px; color:#7a7567; margin:12px 0 5px; font-weight:600; }
.code-modal-bd label:first-child{ margin-top:0; }
.code-modal-bd input{ width:100%; padding:9px 11px; border:1px solid var(--line,#e7e1d4); border-radius:9px; font-size:13px; font-family:inherit; }
.code-opt{ font-weight:400; color:#9a9484; }
.code-modal-hint{ font-size:11.5px; color:#9a9484; line-height:1.5; margin:10px 0 0; }
.code-modal-err{ color:#a05047; font-size:12.5px; margin-top:10px; min-height:1px; }
.code-modal-ft{ display:flex; justify-content:flex-end; gap:9px; padding:14px 20px; border-top:1px solid var(--line,#e7e1d4); }

/* ── Coding Agent v2: threads + chat ─────────────────────────────────────────── */
.code-mode-chip{ display:inline-flex; align-items:center; gap:3px; font-size:10.5px; font-weight:700; padding:2px 7px; border-radius:20px; background:var(--warm2,#f0ece1); color:var(--ink2,#7a7160); vertical-align:middle; }
.code-mode-chip.auto{ background:linear-gradient(135deg,rgba(230,197,119,0.28),rgba(199,147,56,0.2)); color:var(--gold3); }
.code-mode-chip svg{ width:12px; height:12px; }
.code-modetoggle{ display:inline-flex; border:1px solid var(--line,#e7e1d4); border-radius:9px; overflow:hidden; background:#fdfbf6; }
.code-modetoggle button{ border:none; background:transparent; padding:6px 11px; font-size:12px; font-weight:600; cursor:pointer; color:var(--ink2,#7a7160); display:inline-flex; align-items:center; gap:4px; }
.code-modetoggle button svg{ width:12px; height:12px; }
.code-modetoggle button.on{ background:linear-gradient(135deg,var(--gold1),var(--gold3)); color:#3a2c12; }
.code-modetoggle button.auto.on{ background:linear-gradient(135deg,#e6c577,#cfa44f); }
.code-warn.auto{ background:linear-gradient(135deg,rgba(230,197,119,0.16),rgba(199,147,56,0.1)); border-color:rgba(199,147,56,0.3); color:#7a5e1f; display:flex; align-items:center; gap:6px; }
.code-warn.auto svg{ width:15px; height:15px; flex:none; }

.code-tlayout{ display:grid; grid-template-columns:230px 1fr; gap:14px; align-items:start; min-height:420px; }
.code-threadlist{ display:flex; flex-direction:column; gap:6px; }
.code-threadhd{ display:flex; align-items:center; justify-content:space-between; font-size:11.5px; font-weight:700; letter-spacing:.4px; text-transform:uppercase; color:var(--muted,#9a9484); padding:2px 4px 4px; }
.code-thread{ display:flex; align-items:center; gap:8px; text-align:left; border:1px solid var(--line,#e7e1d4); border-radius:11px; background:#fdfbf6; padding:9px 10px; cursor:pointer; transition:.12s; position:relative; }
.code-thread:hover{ border-color:var(--gold2); }
.code-thread.on{ border-color:var(--gold3); background:linear-gradient(135deg,rgba(230,197,119,0.14),rgba(199,147,56,0.08)); }
.code-thread-ic{ color:var(--gold3); flex:none; display:flex; }
.code-thread-ic svg{ width:16px; height:16px; }
.code-thread-meta{ display:flex; flex-direction:column; gap:2px; min-width:0; flex:1; }
.code-thread-title{ font-size:13px; font-weight:600; color:var(--ink,#2c2c2c); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.code-thread-sub{ font-size:11px; color:var(--muted,#9a9484); }
.code-thread-del{ opacity:0; color:var(--muted,#bbb); flex:none; transition:.12s; }
.code-thread:hover .code-thread-del{ opacity:1; }
.code-thread-del:hover{ color:#a05047; }
.code-thread-del svg{ width:14px; height:14px; }

.code-conv{ display:flex; flex-direction:column; border:1px solid var(--line,#e7e1d4); border-radius:13px; background:#fff; overflow:hidden; max-height:640px; }
.code-conv-hd{ display:flex; align-items:center; justify-content:space-between; padding:11px 15px; border-bottom:1px solid var(--line,#e7e1d4); background:#fdfbf6; }
.code-conv-title{ font-size:13.5px; font-weight:700; color:var(--ink,#2c2c2c); }
.code-msgs{ flex:1; overflow-y:auto; padding:15px; display:flex; flex-direction:column; gap:12px; min-height:200px; }
.code-bubble{ display:flex; gap:9px; align-items:flex-start; max-width:92%; }
.code-bubble.user{ flex-direction:row-reverse; align-self:flex-end; }
.code-bubble[onclick]{ cursor:pointer; }
.code-bub-ic{ width:28px; height:28px; border-radius:50%; flex:none; display:flex; align-items:center; justify-content:center; }
.code-bubble.agent .code-bub-ic{ background:linear-gradient(135deg,var(--gold1),var(--gold3)); color:#fff; }
.code-bubble.user .code-bub-ic{ background:var(--warm2,#f0ece1); color:var(--ink2,#7a7160); }
.code-bubble.sys .code-bub-ic{ background:#ece6f0; color:#6a5a8a; }
.code-bub-ic svg{ width:16px; height:16px; }
.code-bub-body{ background:#fdfbf6; border:1px solid var(--line,#e7e1d4); border-radius:13px; padding:9px 12px; min-width:0; }
.code-bubble.user .code-bub-body{ background:linear-gradient(135deg,rgba(230,197,119,0.16),rgba(199,147,56,0.09)); border-color:rgba(199,147,56,0.22); }
.code-bubble.agent.open .code-bub-body{ width:100%; }
.code-bub-hd{ display:flex; align-items:center; gap:7px; flex-wrap:wrap; margin-bottom:4px; }
.code-bub-who{ font-size:11px; font-weight:700; color:var(--muted,#9a9484); text-transform:uppercase; letter-spacing:.3px; }
.code-bub-text{ font-size:13.5px; line-height:1.55; color:var(--ink,#2c2c2c); word-break:break-word; }
.code-bub-expand{ font-size:11px; font-weight:600; color:var(--gold3); display:inline-flex; align-items:center; gap:2px; margin-left:auto; }
.code-bub-expand svg{ width:12px; height:12px; }
.code-msg-line{ font-size:12.5px; margin-top:7px; display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.code-msg-line svg{ width:14px; height:14px; }
.code-msg-model{ font-size:10.5px; color:var(--muted,#9a9484); text-transform:capitalize; }
.code-msg-cost{ font-size:10.5px; font-weight:700; color:var(--gold3); }
.code-joblog{ margin-top:9px; }
.code-joblog-hd{ font-size:11px; font-weight:700; color:var(--muted,#9a9484); text-transform:uppercase; letter-spacing:.3px; margin-bottom:5px; }
.code-approve{ width:auto; padding:5px 11px; font-size:12px; display:inline-flex; align-items:center; gap:4px; }
.code-approve svg{ width:13px; height:13px; }

.code-composer{ border-top:1px solid var(--line,#e7e1d4); padding:11px 13px; background:#fdfbf6; }
.code-composer textarea{ width:100%; padding:10px 12px; border:1px solid var(--line,#e7e1d4); border-radius:11px; font-size:13.5px; font-family:inherit; resize:vertical; background:#fff; }
.code-composer textarea:focus{ border-color:var(--gold2); outline:none; box-shadow:0 0 0 3px rgba(207,164,79,0.12); }
.code-composer-row{ display:flex; align-items:center; gap:11px; margin-top:8px; flex-wrap:wrap; }
.code-composer-mode{ margin-left:auto; }
.code-sendbtn{ width:auto; padding:8px 16px; font-size:13px; display:inline-flex; align-items:center; gap:6px; }
.code-sendbtn svg{ width:15px; height:15px; }

.code-spin{ display:inline-block; width:10px; height:10px; border:2px solid rgba(199,147,56,0.3); border-top-color:var(--gold3); border-radius:50%; animation:codespin .7s linear infinite; vertical-align:middle; }
@keyframes codespin{ to{ transform:rotate(360deg); } }

@media(max-width:900px){ .code-layout{ grid-template-columns:1fr; } .code-tlayout{ grid-template-columns:1fr; } .code-bubble{ max-width:100%; } .code-repos{ flex-direction:row; flex-wrap:wrap; } .code-repo{ flex:1 1 220px; } }

/* ════════════════ VOICE DICTATION (global, app-wide) ════════════════ */
/* Mobile sub-menu overlay (rendered on document.body, outside the bottom bar). */
#bbMobileSheetBd{position:fixed;inset:0;background:rgba(20,16,10,0.28);z-index:300}
#bbMobileSheet{position:fixed;left:calc(8px + env(safe-area-inset-left));right:calc(8px + env(safe-area-inset-right));bottom:calc(58px + env(safe-area-inset-bottom) + 10px);background:var(--card);border:1px solid var(--border);border-radius:18px;box-shadow:0 -14px 44px rgba(0,0,0,0.24);padding:10px;z-index:310;max-height:62vh;max-height:min(62dvh, calc(100dvh - 58px - env(safe-area-inset-bottom) - 24px));overflow:auto}
.bbms-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);padding:4px 8px 9px}
.bbms-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.bbms-item{display:flex;align-items:center;gap:9px;padding:13px 12px;border:1px solid var(--border);border-radius:12px;background:var(--warm);color:var(--ink);font-size:13px;font-weight:600;cursor:pointer;text-align:left;min-width:0}
.bbms-item svg{width:18px;height:18px;flex:0 0 auto}
.bbms-item span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bbms-item.active{border-color:var(--gold3);color:#fff;background:linear-gradient(135deg,var(--gold2),var(--gold3))}
.bbms-item.active svg{color:#fff}

/* Floating mic — superwhisper-style. Fixed bottom-right, above content. */
#bbDict{ position:fixed; right:20px; bottom:20px; z-index:400; display:none;
  flex-direction:column; align-items:flex-end; gap:8px; }
#bbDict.on{ display:flex; }
/* On mobile, sit above the bottom navigation bar so the mic never overlaps it. */
@media(max-width:900px){ #bbDict{ right:14px; bottom:calc(58px + env(safe-area-inset-bottom) + 14px); } }
.bb-dict-btn{ width:48px; height:48px; border-radius:50%; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center; color:#fff;
  background:linear-gradient(135deg,var(--gold1),var(--gold3));
  box-shadow:0 8px 22px rgba(199,147,56,0.45); transition:.15s; }
.bb-dict-btn:hover{ transform:translateY(-1px); box-shadow:0 12px 28px rgba(199,147,56,0.55); }
.bb-dict-btn:disabled{ opacity:.55; cursor:default; transform:none; }
.bb-dict-btn.rec{ background:linear-gradient(135deg,#e06b5a,#c14635);
  box-shadow:0 0 0 0 rgba(193,70,53,0.5); animation:bbDictPulse 1.4s infinite; }
@keyframes bbDictPulse{ 0%{box-shadow:0 0 0 0 rgba(193,70,53,0.55)} 70%{box-shadow:0 0 0 14px rgba(193,70,53,0)} 100%{box-shadow:0 0 0 0 rgba(193,70,53,0)} }
.bb-dict-btn.busy{ pointer-events:none; }
.bb-dict-spin{ width:20px; height:20px; border-radius:50%;
  border:2.5px solid rgba(255,255,255,0.45); border-top-color:#fff;
  animation:bbDictRot .7s linear infinite; }
@keyframes bbDictRot{ to{transform:rotate(360deg)} }
.bb-dict-hint{ background:var(--card); border:1px solid var(--border2); color:var(--ink);
  font-size:12px; font-weight:600; padding:6px 11px; border-radius:14px;
  box-shadow:0 8px 22px rgba(36,29,18,0.16); max-width:230px; white-space:normal;
  line-height:1.35; display:none; }
.bb-dict-hint.show{ display:block; }
.bb-dict-hint.warn{ color:#a05047; border-color:rgba(160,80,71,0.4); }
/* In-field mic affordance (inside a relatively-positioned wrapper). */
.bb-dict-inline{ position:absolute; right:8px; bottom:8px; width:26px; height:26px;
  border-radius:7px; border:1px solid var(--border); background:#fff; color:var(--muted);
  cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:.15s; z-index:5; padding:0; }
.bb-dict-inline:hover{ color:var(--gold3); border-color:var(--gold2);
  box-shadow:0 0 0 3px rgba(207,164,79,0.12); }
.bb-dict-inline.rec{ color:#fff; background:linear-gradient(135deg,#e06b5a,#c14635);
  border-color:transparent; animation:bbDictPulse 1.4s infinite; }
.bb-dict-inline.busy{ pointer-events:none; }

/* Restructure: responsive split layouts for the new Tasks board + Team Chat. */
.bb-split{ display:grid; grid-template-columns:280px 1fr; gap:16px; align-items:start; }
.bb-split.tall{ height:calc(100vh - 200px); }
@media(max-width:900px){
  .bb-split{ grid-template-columns:1fr; }
  .bb-split.tall{ height:auto; }
  /* Tab button rows already wrap; keep board columns from overflowing on phones. */
  .bb-board{ grid-template-columns:1fr 1fr !important; }
}
@media(max-width:560px){
  .bb-board{ grid-template-columns:1fr !important; }
}

/* Recipient autocomplete dropdown (compose To/Cc/Bcc). */
.mail-ac{ background:#fff; border:1px solid var(--border2); border-radius:11px; box-shadow:0 16px 40px rgba(36,29,18,.18); padding:5px; max-height:280px; overflow:auto; }
.mail-ac-item{ display:flex; flex-direction:column; align-items:flex-start; gap:1px; width:100%; text-align:left; background:none; border:none; font:inherit; padding:7px 10px; border-radius:8px; cursor:pointer; }
.mail-ac-item:hover, .mail-ac-item.on{ background:var(--warm2); }
.mail-ac-em{ font-size:13px; color:var(--ink); font-weight:600; }
.mail-ac-nm{ font-size:11.5px; color:var(--muted); }

/* Collapsible icon-only sidebar (desktop). Toggle pins to the rail bottom. */
.rail-collapse{ margin-top:8px; height:34px; border:none; background:transparent; color:var(--muted); border-radius:9px; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:8px; font:inherit; font-size:12px; transition:.15s; flex-shrink:0; }
.rail-collapse:hover{ background:var(--warm2); color:var(--ink); }
.rail-collapse svg{ width:18px; height:18px; transition:transform .2s; }
.rail-collapse.collapsed svg{ transform:rotate(180deg); }
.rail-collapse .rc-lbl{ font-weight:500; }
@media(max-width:900px){ .rail-collapse{ display:none; } }
@media(min-width:901px){
  body.sidebar-collapsed .rail{ width:66px; padding-left:9px; padding-right:9px; }
  body.sidebar-collapsed .main{ margin-left:66px; }
  body.sidebar-collapsed .rail-logo{ justify-content:center; margin-left:0; margin-right:0; }
  body.sidebar-collapsed .rail-collapse .rc-lbl{ display:none; }
  body.sidebar-collapsed .nav-btn{ justify-content:center; padding:0; gap:0; }
  body.sidebar-collapsed .nav-label{ display:none; }
  body.sidebar-collapsed .nav-group .nav-caret{ display:none; }
  body.sidebar-collapsed .nav-btn.nav-child{ padding-left:0; }
  body.sidebar-collapsed .nav-btn.nav-child::after{ display:none; }
  body.sidebar-collapsed .nav-btn.active::before{ left:-9px; }
  /* Icon-only: reveal the label as a hover tooltip to the right. */
  body.sidebar-collapsed .nav-btn .nav-tip{ display:none; position:absolute; left:calc(100% + 12px); top:50%; transform:translateY(-50%);
    background:var(--ink); color:#fff; font-size:12px; font-weight:600; padding:5px 9px; border-radius:7px; white-space:nowrap;
    z-index:400; pointer-events:none; box-shadow:0 6px 18px rgba(36,29,18,.22); }
  body.sidebar-collapsed .nav-btn:hover .nav-tip{ display:block; }
}

/* WorkDrive file/folder tiles — type-aware icons + thumbnails */
.drive-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}
.drive-tile{position:relative;border:1px solid var(--border);border-radius:14px;padding:12px;background:#fff;transition:.14s}
.drive-tile:hover{border-color:var(--border2);box-shadow:var(--shadow-sm);transform:translateY(-1px)}
.drive-tile.folder{cursor:pointer}
.drive-tile-menu{position:absolute;top:8px;right:8px;z-index:6}
.drive-open{cursor:pointer}
.drive-thumb{height:92px;border-radius:10px;background:var(--warm);display:flex;align-items:center;justify-content:center;overflow:hidden}
.drive-thumb.folder-thumb{background:transparent}
.drive-thumb-img{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .2s}
.drive-thumb-img.loaded{opacity:1}
.drive-ic{position:relative;display:flex;align-items:center;justify-content:center}
.drive-ic svg{width:44px;height:52px;display:block}
.drive-ic-ext{position:absolute;bottom:9px;left:50%;transform:translateX(-50%);font-size:8px;font-weight:800;letter-spacing:.03em;color:#fff;background:var(--ic);padding:1px 5px;border-radius:4px;line-height:1.3}
.drive-thumb.folder-thumb svg{width:54px;height:46px}
.drive-name{font-weight:600;font-size:12.5px;margin-top:10px;word-break:break-word;line-height:1.3;max-height:2.6em;overflow:hidden}
.drive-meta{font-size:11px;color:var(--muted);margin-top:3px}
.drive-tags{margin-top:6px;display:flex;gap:5px;flex-wrap:wrap;min-height:0}

/* Nav drag-reorder drop indicator + collapsed-sidebar flyout */
.nav-btn.nav-drop{box-shadow:inset 0 2px 0 var(--gold3)}
.nav-btn.nav-group.nav-drop{box-shadow:inset 0 2px 0 var(--gold3)}
.nav-btn[draggable=true]{cursor:pointer}
.nav-flyout{background:var(--card);border:1px solid var(--border2);border-radius:12px;box-shadow:0 18px 44px rgba(36,29,18,0.22);padding:6px;min-width:190px;max-height:70vh;overflow:auto}
.nav-flyout-title{font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);padding:6px 10px 4px}
.nav-flyout-item{display:flex;align-items:center;gap:10px;width:100%;background:transparent;border:none;border-radius:9px;padding:9px 10px;cursor:pointer;color:var(--ink);font-size:13px;font-weight:600;text-align:left}
.nav-flyout-item svg{width:18px;height:18px;flex:0 0 auto;color:var(--muted2)}
.nav-flyout-item:hover{background:var(--warm2)}
.nav-flyout-item.active{background:rgba(207,164,79,0.14);color:var(--gold3)}
.nav-flyout-item.active svg{color:var(--gold3)}

/* ── AI Visibility (GEO) — layout only; colours come from inline house styles ── */
@media(max-width:900px){
  .aiv-topgrid{grid-template-columns:1fr!important}
  .aiv-twogrid{grid-template-columns:1fr!important}
}

/* ── Phones: trim the header so items never overlap the logo ──────────────── */
@media(max-width:560px){
  .orb-btn{display:none}      /* global voice orb — voice is still available inside compose */
  .cost-wrap{display:none}    /* AI spend pill — kept on tablet/desktop */
  header{gap:8px}
  .hd-mod{max-width:32vw}
  .hd-right{gap:6px}
}

/* ── Download module ─────────────────────────────────────────────────────── */
.dl-wrap{max-width:760px;margin:0 auto;padding:28px 22px 60px}
.dl-head h2{font-size:26px;font-weight:800;color:var(--ink);margin:0 0 8px}
.dl-head p{font-size:14.5px;line-height:1.6;color:var(--ink2);margin:0 0 22px;max-width:600px}
.dl-inapp{padding:12px 16px;font-size:13px;color:var(--ink2);margin-bottom:20px;border-radius:12px;background:var(--warm)}
.dl-inapp b{color:var(--ink)}
.dl-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.dl-card{padding:22px 20px;display:flex;flex-direction:column;gap:14px}
.dl-card.is-you{border-color:var(--gold3,#c79338);box-shadow:0 6px 22px rgba(199,147,56,0.18)}
.dl-os{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:700;color:var(--ink)}
.dl-os svg{color:var(--ink)}
.dl-you{margin-left:auto;font-style:normal;font-size:11px;font-weight:700;color:#3a2c12;background:linear-gradient(135deg,var(--gold1,#e6c069),var(--gold3,#c79338));padding:3px 9px;border-radius:999px}
.dl-btns{display:flex;flex-direction:column;gap:8px}
.dl-btn{text-align:center;text-decoration:none;display:block}
.dl-btn[aria-disabled="true"]{opacity:.55;pointer-events:none}
.dl-alt{font-size:12.5px;color:var(--ink2);text-align:center;text-decoration:underline;cursor:pointer}
.dl-note{font-size:12px;line-height:1.5;color:var(--muted)}
.dl-meta{margin-top:20px;font-size:13px;color:var(--ink2);text-align:center}
.dl-meta a,.dl-foot a{color:var(--amber)}
.dl-foot{margin-top:14px;font-size:12px;line-height:1.6;color:var(--muted);text-align:center;max-width:620px;margin-left:auto;margin-right:auto}
.dl-foot ol.dl-steps{margin:10px auto 4px;padding-left:20px;text-align:left;max-width:560px}
.dl-steps li{margin:6px 0;line-height:1.55}
.dl-cmd{margin:6px 0;background:var(--ink);border-radius:8px;padding:8px 12px;overflow-x:auto}
.dl-cmd code{font-family:ui-monospace,Menlo,monospace;font-size:12px;color:#fff;white-space:nowrap}
@media(max-width:640px){ .dl-grid{grid-template-columns:1fr} }

/* ── Vault Security (admin) ──────────────────────────────────────────────── */
.vsec-wrap{max-width:1000px;margin:0 auto;padding:24px 22px 60px}
.vsec-head h2{font-size:24px;font-weight:800;color:var(--ink);margin:0 0 14px}
.vsec-tabs{display:flex;gap:8px;margin-bottom:18px}
.vsec-tab{border:1px solid var(--border2);background:#fff;color:var(--ink2);font-size:13px;font-weight:600;padding:8px 16px;border-radius:10px;cursor:pointer}
.vsec-tab.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.vsec-note{font-size:12.5px;color:var(--muted);margin:0 0 14px;line-height:1.5}
.vsec-empty{padding:40px;text-align:center;color:var(--muted);font-size:14px}
.vsec-table{width:100%;border-collapse:collapse;font-size:13px;background:#fff;border:1px solid var(--border);border-radius:12px;overflow:hidden}
.vsec-table th{text-align:left;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);padding:10px 12px;border-bottom:1px solid var(--border);background:var(--warm)}
.vsec-table td{padding:9px 12px;border-bottom:1px solid var(--border);color:var(--ink);vertical-align:top}
.vsec-table tr:last-child td{border-bottom:none}
.vsec-dim{color:var(--muted)}
.vsec-path{font-size:12px;word-break:break-word}
.vsec-badge{display:inline-block;font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;background:var(--warm2,#f1ece0);color:var(--ink2)}
.vsec-badge.vsec-warn{background:#fbe6c9;color:#8a5a12}
.vsec-badge.vsec-del{background:#f7d9d7;color:#a3312b}
.vsec-stale{background:#fdf6ea}
