/* ============================================================
   QVIC Precision UI

   System-wide, reversible polish layer. Every rule is gated by
   `html[data-ui="pro"]`; remove that attribute and this link to restore the
   previous workspace styling.
   ============================================================ */

html[data-ui="pro"] body{
  --bg:#09090b;
  --surface:color-mix(in srgb,#131318 94%,var(--accent));
  --surface-2:color-mix(in srgb,#1B1B21 92%,var(--accent));
  --glass:rgba(255,255,255,.048);
  --glass-2:rgba(255,255,255,.082);
  --hover-bg:rgba(255,255,255,.072);
  --border:rgba(255,255,255,.12);
  --border-strong:rgba(255,255,255,.21);
  --txt:#F8F6F9;
  --txt-2:#C7C1CA;
  --txt-3:#9E97A2;
  --stroke-dim:rgba(255,255,255,.18);
  --chrome-bg:rgba(10,10,12,.97);
  --chrome-soft:#0D0D10;
  --chrome-strong:rgba(10,10,12,.985);
  --card-bg:color-mix(in srgb,#121216 95%,var(--accent));
  --panel-bg:color-mix(in srgb,#121216 95%,var(--accent));
  --input-bg:#101015;
  --overlay-bg:rgba(3,3,5,.72);
  --surface-highlight:rgba(255,255,255,.06);
  --ambient-one:rgb(var(--accent-rgb) / .17);
  --ambient-two:rgb(var(--accent-rgb) / .09);
  --ambient-three:rgb(var(--accent-rgb) / .065);
  --shadow:0 18px 46px rgba(0,0,0,.22);
  --shadow-card:none;
  --shadow-lift:0 18px 46px rgba(0,0,0,.26);
  --shadow-glass:0 24px 70px rgba(0,0,0,.42);
  --inset-glow:inset 0 1px 0 rgba(255,255,255,.045);
  --inset-glow-subtle:inset 0 1px 0 rgba(255,255,255,.03);
  --r-card:14px;
  --r-input:9px;
  --r-chip:8px;
  --sidebar-w:248px;
  --topbar-h:64px;
  --text-2xs:14px;
  --text-xs:15px;
  --text-sm:16px;
  --text-base:17px;
  --text-md:17px;
  --text-lg:19px;
  background:var(--bg);
  font-size:17px;
  line-height:1.52;
}

html[data-theme="light"][data-ui="pro"] body{
  --bg:#D5D3DB;
  --surface:#FFFFFF;
  --surface-2:#E5E3EA;
  --glass:rgba(14,12,18,.08);
  --glass-2:rgba(14,12,18,.13);
  --hover-bg:rgba(14,12,18,.09);
  --border:rgba(14,12,18,.24);
  --border-strong:rgba(14,12,18,.38);
  --txt:#0C0A0F;
  --txt-2:#26212C;
  --txt-3:#463F4C;
  --stroke-dim:rgba(14,12,18,.30);
  --chrome-bg:rgba(244,243,247,.99);
  --chrome-soft:#E8E6ED;
  --chrome-strong:#FFFFFF;
  --card-bg:#FFFFFF;
  --panel-bg:#FFFFFF;
  --input-bg:#FFFFFF;
  --overlay-bg:rgba(14,12,18,.34);
  --surface-highlight:rgba(255,255,255,.96);
  --ambient-one:rgb(var(--accent-rgb) / .09);
  --ambient-two:rgb(var(--accent-rgb) / .05);
  --ambient-three:rgb(var(--accent-rgb) / .03);
  --shadow:0 16px 40px rgba(20,16,28,.14);
  --shadow-card:0 10px 26px rgba(20,16,28,.10);
  --shadow-lift:0 18px 44px rgba(20,16,28,.16);
  --shadow-glass:0 22px 60px rgba(20,16,28,.18);
  --inset-glow:inset 0 1px 0 rgba(255,255,255,.96);
  --inset-glow-subtle:inset 0 1px 0 rgba(255,255,255,.88);
}

html[data-ui="pro"] body::before{
  background:
    radial-gradient(ellipse 1220px 680px at 76% -18%,var(--ambient-one),transparent 61%),
    radial-gradient(ellipse 960px 580px at 15% 108%,var(--ambient-two),transparent 68%);
}

html[data-theme="dark"][data-design="black"][data-ui="pro"] body{
  --surface:#121215;
  --surface-2:#19191D;
  --card-bg:#121215;
  --panel-bg:#121215;
  --ambient-one:rgba(255,255,255,.03);
  --ambient-two:rgba(255,255,255,.018);
  --ambient-three:rgba(255,255,255,.02);
}

html[data-theme="light"][data-design="black"][data-ui="pro"] body{
  --ambient-one:rgba(20,20,24,.055);
  --ambient-two:rgba(20,20,24,.03);
  --ambient-three:rgba(20,20,24,.02);
}

html[data-theme="dark"][data-design="red"][data-ui="pro"] body{
  --ambient-one:rgb(var(--accent-rgb) / .22);
  --ambient-two:rgb(var(--accent-rgb) / .12);
  --ambient-three:rgb(var(--accent-rgb) / .08);
}

html[data-theme="light"][data-design="red"][data-ui="pro"] body{
  --ambient-one:rgb(var(--accent-rgb) / .13);
  --ambient-two:rgb(var(--accent-rgb) / .07);
  --ambient-three:rgb(var(--accent-rgb) / .045);
}

html[data-ui="pro"] [data-lucide]{stroke-width:1.75;}
html[data-ui="pro"] :where(.qs-num,.kpi .v,.review-stat strong,.count,.wc-day,.cal-month-label){
  font-variant-numeric:tabular-nums;
}

/* ---------- Application shell ---------- */
html[data-ui="pro"] .app{
  grid-template-columns:var(--sidebar-w) minmax(0,1fr);
  background:transparent;
}

html[data-ui="pro"] .sidebar{
  gap:3px;
  padding:15px 12px;
  border-right:1px solid var(--border);
  background:var(--chrome-bg);
  box-shadow:none;
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
}

html[data-ui="pro"] .brand{gap:11px;padding:5px 9px 17px;}
html[data-ui="pro"] .brand-mark{
  position:relative;width:42px;height:42px;border-radius:50%!important;overflow:hidden;isolation:isolate;
  border:1px solid color-mix(in srgb,var(--accent) 40%,var(--border));
  background:#080708;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.14),0 0 0 3px color-mix(in srgb,var(--accent) 14%,transparent);
}
html[data-ui="pro"] .brand-mark img{
  position:absolute;left:calc(50% + .4px);top:calc(50% - 1.2px);width:42px;height:41px;max-width:none;
  object-fit:contain;transform:translate(-50%,-50%);
}
html[data-ui="pro"] .brand:hover .brand-mark img,
html[data-ui="pro"] .brand-mark:hover img{transform:translate(-50%,-50%) scale(1.04);}
html[data-ui="pro"] .brand-name{font-size:16.5px;font-weight:650;letter-spacing:.75px;}

html[data-ui="pro"] .nav-group-label{
  padding:16px 11px 6px;color:var(--txt-3);font-size:12px;font-weight:700;letter-spacing:1.15px;
}

html[data-ui="pro"] .nav-group-label.academy{
  margin-top:12px;padding-top:19px;border-top-color:var(--border);
}

html[data-ui="pro"] .nav-item{
  gap:12px;min-height:50px;padding:12px 12px;border-radius:10px;
  color:var(--txt-2);font-size:16.5px;font-weight:580;transition:background .14s ease,color .14s ease,border-color .14s ease;
}

html[data-ui="pro"] .nav-item:hover{background:var(--glass);color:var(--txt);}
html[data-ui="pro"] .nav-item.active{
  border-color:color-mix(in srgb,var(--accent) 24%,var(--border));
  background:color-mix(in srgb,var(--accent) 8%,var(--surface-2));
  color:var(--txt);box-shadow:none;
}

html[data-ui="pro"] .nav-item.active::before{
  left:-1px;width:2px;height:18px;border-radius:0 2px 2px 0;background:var(--accent);box-shadow:none;
}

html[data-ui="pro"] .nav-item [data-lucide]{width:19px;height:19px;color:var(--txt-3);}
html[data-ui="pro"] .nav-item.active [data-lucide]{color:var(--txt);}
html[data-ui="pro"] .nav-item .count{
  min-width:22px;height:22px;padding:0 7px;border:0;border-radius:999px;
  background:#C9C6CC;color:#121016;font-size:12px;font-weight:780;
}
html[data-theme="light"][data-ui="pro"] .nav-item .count{background:#2A2630;color:#F4F2F6;}

html[data-ui="pro"] .sidebar-foot{padding:12px 8px 3px;border-top-color:var(--border);gap:12px;}
html[data-ui="pro"] .sidebar-user-name{font-size:14.5px;}
html[data-ui="pro"] .sidebar-user-role{font-size:13px;color:var(--txt-3);}
html[data-ui="pro"] .sidebar-settings-btn{
  width:40px;height:40px;border-radius:50%;border-color:var(--border-strong);
  background:var(--surface-2);box-shadow:none;
}
html[data-ui="pro"] .sidebar-settings-btn:hover{
  border-color:color-mix(in srgb,var(--accent) 40%,var(--border));
  background:color-mix(in srgb,var(--accent) 12%,var(--surface-2));
}

html[data-ui="pro"] .topbar{
  height:var(--topbar-h);min-height:var(--topbar-h);gap:11px;padding:0 clamp(20px,2.5vw,34px);
  border-bottom:1px solid var(--border);background:var(--chrome-bg);box-shadow:none;
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
}

html[data-ui="pro"] .page-title{font-size:24px;font-weight:650;letter-spacing:-.35px;}
html[data-ui="pro"] .page-sub{margin-top:1px;color:var(--txt-2);font-size:15px;}
html[data-ui="pro"] .search-trigger{
  min-width:228px;min-height:46px;padding:10px 14px;border-radius:10px;background:var(--input-bg);font-size:15.5px;
  border-color:var(--border-strong);color:var(--txt-2);
}
html[data-theme="light"][data-ui="pro"] .chip,
html[data-theme="light"][data-ui="pro"] .btn:not(.btn-primary):not(.btn-ghost),
html[data-theme="light"][data-ui="pro"] .icon-btn,
html[data-theme="light"][data-ui="pro"] .input,
html[data-theme="light"][data-ui="pro"] textarea.input,
html[data-theme="light"][data-ui="pro"] select.input,
html[data-theme="light"][data-ui="pro"] .card,
html[data-theme="light"][data-ui="pro"] .list-row,
html[data-theme="light"][data-ui="pro"] .dash-task-row,
html[data-theme="light"][data-ui="pro"] .board-tile,
html[data-theme="light"][data-ui="pro"] .board-card,
html[data-theme="light"][data-ui="pro"] .notes-shell{
  border-color:rgba(14,12,18,.24);
}
html[data-theme="light"][data-ui="pro"] .nav-item{color:#2A2430;}
html[data-theme="light"][data-ui="pro"] .nav-item.active{color:#0C0A0F;border-color:rgba(14,12,18,.28);background:rgba(14,12,18,.06);}
html[data-theme="light"][data-ui="pro"] .nav-group-label{color:#463F4C;}
html[data-theme="light"][data-ui="pro"] .sidebar-user-role,
html[data-theme="light"][data-ui="pro"] .page-sub,
html[data-theme="light"][data-ui="pro"] .tiny.muted,
html[data-theme="light"][data-ui="pro"] .field label{color:#2A2430;}
html[data-theme="light"][data-ui="pro"] .card-title{color:#0C0A0F;font-size:16px;}
html[data-theme="light"][data-ui="pro"] .btn-ghost{color:#2A2430;}
html[data-theme="light"][data-ui="pro"] .btn-ghost:hover{color:#0C0A0F;border-color:rgba(14,12,18,.24);background:rgba(14,12,18,.05);}

html[data-ui="pro"] .topbar .icon-btn{
  width:40px;height:40px;border-radius:50%;background:var(--surface);border-color:var(--border);box-shadow:none;
}

html[data-ui="pro"] .view{
  padding:clamp(20px,2.4vw,34px) clamp(20px,2.8vw,40px) 96px;
}

html[data-ui="pro"] .view > .view-anim:not(.board-page):not(.canvas-page):not(.reviews-page):not(.review-detail-page):not(.notes-shell){
  width:min(100%,1512px);
  margin-inline:auto;
}

/* ---------- Typography and shared primitives ---------- */
html[data-ui="pro"] :where(.page-kicker,.eyebrow){
  color:var(--txt-3);font-size:12.5px;font-weight:750;letter-spacing:1.2px;
}

html[data-ui="pro"] .page-lead{
  color:var(--txt);font-size:clamp(28px,3vw,40px);font-weight:650;letter-spacing:-.8px;
}

html[data-ui="pro"] .page-lead-sub{color:var(--txt-2);font-size:16.5px;line-height:1.6;}

html[data-ui="pro"] :where(
  .card,.resource-card,.task-page-row,.review-project-filter,.review-library,
  .review-comments-panel,.notes-shell,.chat-main,.chat-channels,.board-list,
  .customer-welcome,.customer-review-focus,.customer-board-mini,.customer-mcp-card
){
  border-color:var(--border);border-radius:14px;background:var(--surface);box-shadow:var(--inset-glow-subtle);
}

html[data-ui="pro"] :where(
  .list-row,.board-card,.acq-card,.review-stat,.chat-msg,.kpi,.day-cell,
  .agenda-row,.live-camp-row,.health-row,.pipe-mini-row,.dash-event-row,.dash-task-row
){
  border-color:var(--border);border-radius:10px;background:var(--surface-2);box-shadow:none;
}

html[data-ui="pro"] .card:hover,
html[data-ui="pro"] .card.lift:hover,
html[data-ui="pro"] .resource-card:hover,
html[data-ui="pro"] .task-page-row:hover,
html[data-ui="pro"] .review-card:hover{
  border-color:var(--border-strong);box-shadow:var(--inset-glow-subtle);transform:none;
}

html[data-ui="pro"] .card.lift::after,
html[data-ui="pro"] .btn-primary::after{display:none;}

html[data-ui="pro"] .card-head{margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--border);}
html[data-ui="pro"] .card-title{font-size:16px;font-weight:650;letter-spacing:-.12px;}
html[data-ui="pro"] .card-title > [data-lucide]{width:18px;height:18px;color:var(--txt-2);}
html[data-ui="pro"] .chip{font-size:13px;padding:5px 10px;}
html[data-ui="pro"] .field label{font-size:14px;}
html[data-ui="pro"] .tiny{font-size:13px;}
html[data-ui="pro"] .input,html[data-ui="pro"] textarea.input,html[data-ui="pro"] select.input{
  font-size:15px;min-height:44px;border-color:var(--border-strong);
}

html[data-ui="pro"] :where(.chip,.badge,.company-tag,.due-badge,.project-due-badge,.task-due-badge,.board-due-badge){
  box-shadow:none;
}
html[data-ui="pro"] :where(.due-badge,.project-due-badge,.task-due-badge,.board-due-badge,.badge,.prio){
  border:0;
}
html[data-ui="pro"] :where(.due-overdue,[data-due-tone="overdue"],.board-due-overdue,.project-hub-due.overdue,.overdue-date,.dash-overdue-label){
  background:var(--red)!important;color:#fff!important;border:0!important;
}
html[data-ui="pro"] :where(.due-overdue,[data-due-tone="overdue"],.board-due-overdue,.project-hub-due.overdue,.overdue-date,.dash-overdue-label) i,
html[data-ui="pro"] :where(.due-overdue,[data-due-tone="overdue"],.board-due-overdue,.project-hub-due.overdue,.overdue-date,.dash-overdue-label) svg{
  color:#fff!important;
}
html[data-ui="pro"] :where(.due-today,[data-due-tone="today"],.board-due-today,.project-hub-due.today){
  background:#c2410c!important;color:#fff!important;border:0!important;
}
html[data-ui="pro"] :where(.due-soon,[data-due-tone="soon"],.board-due-soon,.project-hub-due.soon){
  background:var(--warn)!important;color:#1a1408!important;border:0!important;
}
html[data-ui="pro"] :where(.due-future,[data-due-tone="future"],.board-due-future){
  background:var(--accent-button)!important;color:#fff!important;border:0!important;
}
html[data-ui="pro"] .board-card-labels span,
html[data-ui="pro"] .board-label-chip{
  background:var(--label);border:0;color:#fff;
}

html[data-ui="pro"] .list-row{min-height:50px;padding:12px 14px;}
html[data-ui="pro"] .empty{color:var(--txt-3);}
html[data-ui="pro"] .empty [data-lucide]{animation:none;}

/* ---------- Controls ---------- */
html[data-ui="pro"] .btn{
  min-height:46px;padding:11px 17px;border-radius:9px;border-color:var(--border-strong);
  background:var(--surface-2);box-shadow:none;color:var(--txt);font-size:15px;font-weight:650;
  transition:background .14s ease,border-color .14s ease,color .14s ease;
}

html[data-ui="pro"] .btn:hover{border-color:var(--border-strong);background:var(--hover-bg);box-shadow:none;transform:none;}
html[data-ui="pro"] .btn-primary{
  border-color:var(--accent-button);
  background:var(--accent-button);color:var(--on-accent);box-shadow:none;
}
html[data-ui="pro"] .btn-primary:hover{
  border-color:var(--accent-button-hover);background:var(--accent-button-hover);box-shadow:none;
}
html[data-ui="pro"] .btn-ghost{border-color:transparent;background:transparent;color:var(--txt-2);}
html[data-ui="pro"] .btn-ghost:hover{border-color:var(--border);background:var(--glass);color:var(--txt);}
html[data-ui="pro"] .btn-danger{border-color:color-mix(in srgb,var(--red) 32%,var(--border));background:transparent;color:var(--red-soft);}
html[data-ui="pro"] .btn.sm{min-height:42px;padding:9px 14px;font-size:14px;}

html[data-ui="pro"] .icon-btn{
  width:42px;height:42px;border-radius:9px;border-color:var(--border-strong);background:var(--surface-2);box-shadow:none;
}
html[data-ui="pro"] .icon-btn:hover{border-color:var(--border-strong);background:var(--hover-bg);transform:none;}

html[data-ui="pro"] :where(.input,select.input,textarea.input){
  min-height:46px;border-color:var(--border);border-radius:9px;background:var(--input-bg);box-shadow:none;
  color:var(--txt);font-size:14.5px;
}

html[data-ui="pro"] :where(.input,select.input,textarea.input):focus{
  border-color:color-mix(in srgb,var(--accent) 68%,var(--border));
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 13%,transparent);
}

html[data-ui="pro"] .field{gap:7px;}
html[data-ui="pro"] .field label{color:var(--txt-2);font-size:13px;font-weight:600;}
html[data-ui="pro"] .checkbox{border-color:var(--border-strong);border-radius:7px;background:var(--input-bg);}
html[data-ui="pro"] .checkbox.on{border-color:var(--accent);background:var(--accent);box-shadow:none;}

/* ---------- Overlays ---------- */
html[data-ui="pro"] :where(.modal,.palette,.drawer,.notif-panel,.bn-more-sheet){
  border-color:var(--border);background:var(--chrome-strong);box-shadow:var(--shadow-glass);
}

html[data-ui="pro"] .modal{border-radius:16px;}
html[data-ui="pro"] :where(.modal-head,.modal-foot,.drawer-head,.notif-head){
  border-color:var(--border);background:var(--chrome-strong);
}
html[data-ui="pro"] .palette-overlay{background:rgba(0,0,0,.58);backdrop-filter:blur(10px);}
html[data-ui="pro"] .palette-item{border-radius:8px;}
html[data-ui="pro"] .palette-item:hover,
html[data-ui="pro"] .palette-item.active{background:var(--surface-2);}
html[data-ui="pro"] .notif-item{border-color:var(--border);border-radius:10px;background:var(--surface-2);box-shadow:none;}
html[data-ui="pro"] .toast{border-color:var(--border);border-radius:10px;background:var(--chrome-strong);box-shadow:var(--shadow-glass);}

/* ---------- Dashboard ---------- */
html[data-ui="pro"] #view > .dashboard-pro-preview{
  --dash-pro-panel:var(--surface);
  --dash-pro-panel-strong:var(--surface);
  --dash-pro-cell:var(--surface-2);
  --dash-pro-cell-hover:var(--hover-bg);
  --dash-pro-line:var(--border-strong);
  --dash-pro-line-soft:var(--border);
  --dash-pro-shadow:none;
}

html[data-ui="pro"] #view > .dashboard-pro-preview::before{opacity:.16;}
html[data-ui="pro"] #view > .dashboard-pro-preview .greeting-text{font-size:28px;font-weight:650;letter-spacing:-.65px;}
html[data-ui="pro"] #view > .dashboard-pro-preview .greeting-text .name{
  margin-left:.22em;font-family:inherit;font-size:1em;font-weight:650;letter-spacing:-.65px;
}

html[data-ui="pro"] #view > .dashboard-pro-preview .greeting-text::before{
  width:7px;height:7px;border:0;box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 12%,transparent);
}

html[data-ui="pro"] #view > .dashboard-pro-preview .week-strip{
  min-height:76px;padding:9px 8px;overflow:visible;align-items:center;border-radius:14px;background:var(--surface);
}

html[data-ui="pro"] #view > .dashboard-pro-preview .week-cell{
  min-height:56px;padding:7px 5px;border-radius:10px;
}

html[data-ui="pro"] #view > .dashboard-pro-preview .week-cell.today{
  min-height:104px;margin-block:-14px;padding-block:16px;border-radius:16px;
  border-color:rgba(255,255,255,.84);
  background:color-mix(in srgb,var(--accent) 13%,var(--surface-2));
  box-shadow:
    0 0 0 1.5px rgba(255,255,255,.88),
    0 0 0 4px rgba(255,255,255,.12),
    0 0 28px rgba(255,255,255,.24),
    0 10px 24px rgba(0,0,0,.18);
}
html[data-theme="light"][data-ui="pro"] #view > .dashboard-pro-preview .week-cell.today{
  border-color:rgba(18,16,22,.78);
  background:color-mix(in srgb,var(--accent) 9%,#fff);
  box-shadow:
    0 0 0 1.5px rgba(18,16,22,.78),
    0 0 0 4px rgba(18,16,22,.08),
    0 0 22px rgba(18,16,22,.14),
    0 8px 18px rgba(18,16,22,.08);
}

html[data-ui="pro"] #view > .dashboard-pro-preview .week-cell.today .wc-day{font-size:22px;font-weight:680;}

html[data-ui="pro"] #view > .dashboard-pro-preview .dash-card{
  border-radius:14px;background:var(--surface);box-shadow:var(--inset-glow-subtle);
}

html[data-ui="pro"] #view > .dashboard-pro-preview .card-title > svg{
  box-sizing:content-box;width:17px;height:17px;padding:8px;border:0;
  border-radius:50%;background:color-mix(in srgb,var(--accent) 14%,var(--surface-2));
  color:var(--accent-ink);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 22%,transparent);
}

/* Overview values are metrics, not folders. */
html[data-ui="pro"] #view > .dashboard-pro-preview .quick-stats-grid{gap:10px;padding-top:0;}
html[data-ui="pro"] #view > .dashboard-pro-preview .qs-item{
  min-height:110px;margin-top:0;padding:16px 17px;overflow:hidden;
  border-color:var(--border);border-radius:18px;background:var(--surface-2);box-shadow:none;
}
html[data-ui="pro"] #view > .dashboard-pro-preview .qs-item::before{content:none;}
html[data-ui="pro"] #view > .dashboard-pro-preview .qs-item:hover{
  border-color:var(--border-strong);background:var(--hover-bg);transform:none;
}
html[data-ui="pro"] #view > .dashboard-pro-preview .qs-num{margin-bottom:8px;font-size:28px;font-weight:650;}
html[data-ui="pro"] #view > .dashboard-pro-preview .qs-lbl{font-size:13.5px;font-weight:580;}
html[data-ui="pro"] #view > .dashboard-pro-preview .qs-image-icon{
  top:auto;right:8px;bottom:6px;box-sizing:content-box;
  width:66px!important;height:66px!important;padding:0;border-radius:0;
  opacity:.11!important;object-fit:contain;filter:grayscale(1) invert(1);
  background:transparent;box-shadow:none;
}
html[data-theme="light"][data-ui="pro"] #view > .dashboard-pro-preview .qs-image-icon{
  opacity:.09!important;filter:grayscale(1);
}

/* ---------- Board ---------- */
html[data-ui="pro"] .board-picker-page{max-width:1344px;}
html[data-ui="pro"] .board-picker-intro{margin-bottom:22px;}
html[data-ui="pro"] .board-picker-intro .page-lead{font-size:clamp(28px,3.1vw,40px);font-weight:650;}
html[data-ui="pro"] .board-picker{gap:12px;}
html[data-ui="pro"] .board-tile{
  min-height:142px;padding:18px;border-width:1px;border-top-width:4px;border-radius:12px;
  border-top-color:color-mix(in srgb,var(--client-color,var(--company-color,var(--accent))) 88%,#4a1a5c);
  background:var(--surface);box-shadow:none;
}
html[data-ui="pro"] .board-tile:hover{
  border-color:var(--border-strong);
  border-top-color:color-mix(in srgb,var(--client-color,var(--company-color,var(--accent))) 92%,#5c2470);
  box-shadow:none;transform:translateY(-1px);
}
html[data-ui="pro"] .board-tile .bt-name{font-size:17px;font-weight:650;}
html[data-ui="pro"] .board-tile-meta{font-size:13.5px;font-weight:550;}
html[data-ui="pro"] .board-list{overflow:hidden;border-radius:14px;background:var(--surface);}
html[data-ui="pro"] .board-list-head{min-height:49px;padding:12px 14px;border-bottom:1px solid var(--border);font-size:13.5px;}
html[data-ui="pro"] .board-cards{gap:7px;padding:8px;}
html[data-ui="pro"] .board-card{border-radius:10px;background:var(--surface-2);box-shadow:none;}
html[data-ui="pro"] .board-card:hover{border-color:var(--border-strong);background:var(--hover-bg);transform:none;}
html[data-ui="pro"] .board-card-modal{border-radius:16px;}
html[data-ui="pro"] .board-card-activity{background:var(--chrome-soft);}
html[data-ui="pro"] :where(.board-review-section,.board-comments-section){border-color:var(--border);background:var(--surface);}

/* ---------- Chat ---------- */
html[data-ui="pro"] .chat-layout{gap:12px;}
html[data-ui="pro"] :where(.chat-channels,.chat-main){border-radius:14px;background:var(--surface);}
html[data-ui="pro"] .chat-ch{min-height:44px;border-radius:8px;font-size:13.5px;}
html[data-ui="pro"] .chat-ch.active{background:var(--surface-2);color:var(--txt);box-shadow:inset 2px 0 0 var(--accent);}
html[data-ui="pro"] .chat-msg{
  padding:10px 13px;border-radius:12px;background:var(--surface-2);border-color:var(--border);
  box-shadow:none;font-size:14px;
}
html[data-ui="pro"] .chat-msg.mine{
  background:color-mix(in srgb,var(--accent) 11%,var(--surface-2));
  border-color:color-mix(in srgb,var(--accent) 30%,var(--border));
}
html[data-ui="pro"] .chat-input{padding:10px;border-top-color:var(--border);background:var(--chrome-soft);}
html[data-ui="pro"] .chat-file-button{min-width:48px;min-height:44px;}
html[data-ui="pro"] .chat-attachment{border-color:var(--border);border-radius:10px;background:var(--input-bg);}

/* ---------- Notes and real folders ---------- */
html[data-ui="pro"] .notes-shell{
  width:100%;max-width:none;min-height:calc(100dvh - 118px);border-radius:14px;background:var(--surface);
}
html[data-ui="pro"] #view:has(> .notes-shell){
  padding-inline:clamp(10px,1.1vw,16px);padding-top:clamp(10px,1.2vw,16px);padding-bottom:18px;
}
html[data-ui="pro"] .view > .notes-shell{width:100%;max-width:none;margin:0;}
html[data-ui="pro"] .notes-sidebar{background:var(--chrome-soft);}
html[data-ui="pro"] .notes-library-tabs{border-radius:10px;background:var(--input-bg);}
html[data-ui="pro"] .notes-library-tabs button{min-height:36px;border-radius:7px;}
html[data-ui="pro"] .notes-library-tabs button.active{background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border);}
html[data-ui="pro"] .notes-folder > summary{
  min-height:36px;border:1px solid transparent;border-radius:8px;color:var(--txt-2);
}
html[data-ui="pro"] .notes-folder > summary > svg{color:var(--accent-ink);}
html[data-ui="pro"] .notes-folder > summary:hover{border-color:var(--border);background:var(--surface-2);}
html[data-ui="pro"] .notes-list-item{border-radius:9px;}
html[data-ui="pro"] .notes-list-item.active{border-color:color-mix(in srgb,var(--accent) 32%,var(--border));background:var(--accent-aura);}
html[data-ui="pro"] .notes-editor{background:var(--surface);}
html[data-ui="pro"] .notes-format-toolbar{border-radius:9px;background:var(--input-bg);}

/* Assets and Review Media are actual folder collections. */
html[data-ui="pro"] .resource-page-assets .resource-card,
html[data-ui="pro"] .review-folder-tile{
  position:relative;margin-top:11px;overflow:visible;border-radius:3px 12px 12px 12px;
  background:var(--surface-2);
}
html[data-ui="pro"] .resource-page-assets .resource-card::before,
html[data-ui="pro"] .review-folder-tile::before{
  content:"";position:absolute;left:-1px;top:-10px;width:42%;height:11px;
  border:1px solid var(--border);border-bottom:0;border-radius:8px 9px 0 0;
  background:var(--surface-2);clip-path:polygon(0 0,82% 0,100% 100%,0 100%);
}

/* ---------- Reviews, resources, operational pages ---------- */
html[data-ui="pro"] .reviews-hero{
  border-color:var(--border);border-radius:14px;background:var(--surface);box-shadow:var(--inset-glow-subtle);
}
html[data-ui="pro"] .reviews-hero::after{
  width:270px;height:270px;background:rgb(var(--accent-rgb) / .16);filter:blur(54px);opacity:.22;
}
html[data-ui="pro"] .reviews-hero h2{
  font-size:clamp(26px,2.6vw,36px);font-weight:650;letter-spacing:-.75px;
}
html[data-ui="pro"] .review-summary{gap:8px;}
html[data-ui="pro"] .review-stat{min-height:76px;padding:13px 15px;border-radius:11px;background:var(--surface-2);}
html[data-ui="pro"] .review-stat > svg{padding:7px;border-radius:8px;background:var(--input-bg);color:var(--txt-3);}
html[data-ui="pro"] .review-stat strong{font-size:20px;}
html[data-ui="pro"] .review-stat span{font-size:11.5px;}
html[data-ui="pro"] :where(.review-project-filter,.review-library,.review-comments-panel){border-radius:14px;background:var(--surface);}
html[data-ui="pro"] .review-filter.active,
html[data-ui="pro"] .review-folder-tree-row.active{background:var(--surface-2);box-shadow:inset 2px 0 0 var(--accent);}
html[data-ui="pro"] .review-card{border-radius:12px;background:var(--surface);box-shadow:none;}
html[data-ui="pro"] .review-card-preview{background:#09090b;}
html[data-ui="pro"] .review-decision-bar{border-radius:12px;background:var(--surface);box-shadow:none;}
html[data-ui="pro"] .review-stage{border-radius:14px;}

html[data-ui="pro"] .resource-hero{margin-bottom:22px;padding-bottom:18px;}
html[data-ui="pro"] .resource-grid{gap:13px;}
html[data-ui="pro"] .resource-card{min-height:210px;padding:18px;border-radius:12px;background:var(--surface);box-shadow:none;}
html[data-ui="pro"] .resource-card:hover{transform:none;}
html[data-ui="pro"] .resource-icon{width:40px;height:40px;border-radius:10px;background:var(--surface-2);color:var(--txt-2);}

html[data-ui="pro"] .task-page-row,
html[data-ui="pro"] [data-task-list] > .list-row{border-radius:10px;background:var(--surface);box-shadow:none;}
html[data-ui="pro"] .acq-card{border-radius:10px;background:var(--surface-2);box-shadow:none;}
html[data-ui="pro"] .acq-card:hover{border-color:var(--border-strong);transform:none;}
html[data-ui="pro"] .kpi{border-radius:10px;background:var(--surface-2);}
html[data-ui="pro"] .kpi .v{font-size:19px;font-weight:650;}
html[data-ui="pro"] .kpi .k{font-size:11px;}
html[data-ui="pro"] .learning-page .card{box-shadow:none;}

html[data-ui="pro"] :where(.canvas-top-bar,.canvas-toolbar,.canvas-props){
  border-color:var(--border);background:var(--chrome-bg);box-shadow:none;
}
html[data-ui="pro"] .canvas-tool-btn.active{border-color:var(--accent);background:var(--accent-aura);box-shadow:none;}
html[data-ui="pro"] .canvas-card{border-radius:12px;box-shadow:none;}
html[data-ui="pro"] .canvas-card-thumb{background:var(--surface-2);}

html[data-ui="pro"] :where(.settings-theme-card,.setting-row){border-color:var(--border);background:var(--surface);box-shadow:none;}

/* ---------- Mobile shell ---------- */
@media(max-width:1120px){
  html[data-ui="pro"] body{--sidebar-w:224px;}
  html[data-ui="pro"] .search-trigger{
    min-width:44px;width:44px;flex:0 0 44px;padding:0;justify-content:center;
  }
}

@media(max-width:920px){
  html[data-ui="pro"] body{--sidebar-w:0px;--topbar-h:64px;}
  html[data-ui="pro"] .app{grid-template-columns:minmax(0,1fr);}
  html[data-ui="pro"] .topbar{height:64px;min-height:64px;padding-inline:16px;}
  html[data-ui="pro"] .btn,
  html[data-ui="pro"] .btn.sm{min-height:44px;}
  html[data-ui="pro"] .icon-btn,
  html[data-ui="pro"] .topbar .icon-btn{width:44px;height:44px;}
  html[data-ui="pro"] .view{padding:18px 16px calc(96px + var(--safe-b));}
  html[data-ui="pro"] .bottomnav{
    border-top:1px solid var(--border);background:var(--chrome-strong);box-shadow:0 -12px 34px rgba(0,0,0,.18);
  }
  html[data-ui="pro"] .bn-item{color:var(--txt-3);}
  html[data-ui="pro"] .bn-item.active{color:var(--txt);}
  html[data-ui="pro"] .bn-item.active i{filter:none;transform:none;}
  html[data-ui="pro"] .bn-item:not(.bn-menu-trigger).active::before{background:var(--txt);box-shadow:none;}
  html[data-ui="pro"] .bottomnav .bn-menu-trigger,
  html[data-ui="pro"] .bottomnav .bn-menu-trigger.open{box-shadow:0 0 0 5px var(--chrome-strong),0 10px 24px rgba(0,0,0,.26);}

  html[data-ui="pro"] #view > .dashboard-pro-preview .week-strip{
    display:grid;grid-template-columns:repeat(7,minmax(0,1fr));overflow:visible;padding:9px 5px;
  }
  html[data-ui="pro"] #view > .dashboard-pro-preview .week-cell{width:auto;min-height:54px;}
  html[data-ui="pro"] #view > .dashboard-pro-preview .week-cell.today{min-height:90px;margin-block:-12px;}
  html[data-ui="pro"] #view > .dashboard-pro-preview .qs-item{min-height:92px;padding:14px;}
  html[data-ui="pro"] #view > .dashboard-pro-preview .qs-image-icon{top:10px;right:10px;width:34px!important;height:34px!important;}
}

@media(max-width:780px){
  html[data-ui="pro"] .modal{border-radius:16px 16px 0 0;}
  html[data-ui="pro"] .review-folder-tile{margin-top:9px;}
}

@media(max-width:480px){
  html[data-ui="pro"] #view > .dashboard-pro-preview .greeting-text{font-size:25px;}
  html[data-ui="pro"] #view > .dashboard-pro-preview .week-cell.today .wc-day{font-size:20px;}
  html[data-ui="pro"] #view > .dashboard-pro-preview .qs-num{font-size:25px;}
}

@media(prefers-reduced-motion:reduce){
  html[data-ui="pro"] .app *,
  html[data-ui="pro"] .app *::before,
  html[data-ui="pro"] .app *::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
  }
}