/* ============================================================================
   KOREVRA DeLaw — App Shell, Splash, Portals, Modules, Responsive
   ============================================================================ */

#app{ min-height:100vh; }

/* ===================== SPLASH ===================== */
.splash{ position:fixed; inset:0; z-index:9500; background:
  radial-gradient(1200px 700px at 80% -10%, rgba(75,80,230,.28), transparent 60%),
  radial-gradient(900px 600px at 5% 110%, rgba(201,162,75,.18), transparent 55%),
  linear-gradient(160deg,#0b1030,#0a0e1c 60%);
  color:#fff; display:flex; flex-direction:column; overflow:hidden; }
.splash::before{ content:""; position:absolute; inset:0; background-image:
  linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
  linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:46px 46px; mask:radial-gradient(circle at 50% 40%,#000,transparent 75%); opacity:.6; }
.splash-nav{ position:relative; display:flex; align-items:center; justify-content:space-between; padding:22px 34px; z-index:2; }
.splash-body{ position:relative; z-index:2; flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:20px 24px 50px; }
.splash-badge{ display:inline-flex; align-items:center; gap:8px; padding:6px 14px; border-radius:30px; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.14); font-size:12.5px; font-weight:560; color:#cdd3f0; margin-bottom:26px; backdrop-filter:blur(8px); }
.splash h1{ font-family:var(--font-display); font-weight:560; font-size:clamp(38px,7vw,82px); line-height:1.02; letter-spacing:-.03em; max-width:14ch; color:#fff; }
.splash h1 .gold{ background:linear-gradient(120deg,var(--gold-300),var(--gold-500)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.splash .lede{ font-size:clamp(15px,2vw,19px); color:#aeb6dd; max-width:62ch; margin-top:22px; line-height:1.6; }
.splash-cta{ display:flex; gap:14px; margin-top:36px; flex-wrap:wrap; justify-content:center; }
.splash-stats{ display:flex; gap:34px; margin-top:54px; flex-wrap:wrap; justify-content:center; }
.splash-stat .v{ font-family:var(--font-display); font-size:30px; font-weight:600; color:#fff; }
.splash-stat .l{ font-size:12px; color:#8e96c4; margin-top:2px; }
.brandmark{ display:inline-flex; align-items:center; gap:11px; font-weight:700; font-size:18px; letter-spacing:-.01em; }
.brandmark .logo{ width:38px; height:38px; border-radius:11px; display:flex; align-items:center; justify-content:center; background:linear-gradient(145deg,var(--brand-500),var(--brand-700)); box-shadow:var(--shadow-gold); position:relative; }
.brandmark .logo svg{ width:22px; height:22px; color:var(--gold-400); }
.brandmark .sub{ font-weight:500; color:var(--ink-4); font-size:11px; letter-spacing:.14em; text-transform:uppercase; }

/* ===================== PORTAL LAUNCHER ===================== */
.launcher{ min-height:100vh; background:
  radial-gradient(900px 500px at 100% 0%, rgba(75,80,230,.1), transparent 55%),
  var(--bg); padding:0 0 60px; }
.launcher-hd{ background:linear-gradient(160deg,#0b1030,#11163a); color:#fff; padding:34px 0 90px; position:relative; overflow:hidden; }
.launcher-hd::after{ content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px); background-size:40px 40px; mask:radial-gradient(circle at 70% 30%,#000,transparent 70%); }
.portal-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); gap:18px; margin-top:-64px; position:relative; z-index:2; }
.portal-card{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-lg); padding:22px; box-shadow:var(--shadow); cursor:pointer; transition:transform var(--speed),box-shadow var(--speed),border-color var(--speed); position:relative; overflow:hidden; }
.portal-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg); border-color:var(--brand-300); }
.portal-card .p-ic{ width:50px;height:50px;border-radius:14px; display:flex; align-items:center; justify-content:center; margin-bottom:16px; color:#fff; }
.portal-card h3{ font-size:18px; font-family:var(--font-display); }
.portal-card .p-arrow{ position:absolute; top:22px; right:22px; color:var(--ink-4); transition:transform var(--speed),color var(--speed); }
.portal-card:hover .p-arrow{ transform:translate(3px,-3px); color:var(--brand-500); }
.portal-card .p-feat{ display:flex; flex-wrap:wrap; gap:6px; margin-top:14px; }

/* ===================== APP LAYOUT ===================== */
.shell{ display:flex; min-height:100vh; }
.sidebar{ width:var(--sidebar-w); flex:none; background:linear-gradient(180deg,var(--brand-ink),var(--brand-ink-2)); color:#cdd3ee; display:flex; flex-direction:column; position:sticky; top:0; height:100vh; transition:width var(--speed) var(--ease); z-index:50; }
.sidebar.collapsed{ width:var(--sidebar-w-collapsed); }
.sb-hd{ height:var(--topbar-h); display:flex; align-items:center; gap:11px; padding:0 16px; border-bottom:1px solid rgba(255,255,255,.07); flex:none; }
.sb-hd .logo{ width:34px;height:34px;border-radius:10px;background:linear-gradient(145deg,var(--brand-500),var(--brand-700)); display:flex; align-items:center; justify-content:center; flex:none; box-shadow:0 4px 14px -4px rgba(0,0,0,.5); }
.sb-hd .logo svg{ width:20px;height:20px;color:var(--gold-400); }
.sb-hd .nm{ font-weight:700; font-size:15.5px; color:#fff; letter-spacing:-.01em; }
.sb-hd .nm small{ display:block; font-size:9.5px; font-weight:500; letter-spacing:.16em; color:#7b84b5; text-transform:uppercase; }
.sidebar.collapsed .sb-hd .nm,.sidebar.collapsed .nav-txt,.sidebar.collapsed .nav-group-lbl,.sidebar.collapsed .sb-ft .u-meta,.sidebar.collapsed .nav-badge{ display:none; }
.sidebar.collapsed .sb-hd{ justify-content:center; padding:0; }

.sb-scroll{ flex:1; overflow-y:auto; padding:12px 12px 18px; scrollbar-width:thin; }
.sb-scroll::-webkit-scrollbar{ width:6px; }
.sb-scroll::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.12); border:0; }
.nav-group-lbl{ font-size:10px; text-transform:uppercase; letter-spacing:.1em; color:#6b74a6; font-weight:700; padding:14px 12px 6px; }
.nav-item{ display:flex; align-items:center; gap:11px; padding:9px 12px; border-radius:9px; color:#aab2d8; font-weight:540; font-size:13.5px; cursor:pointer; transition:all var(--speed); margin-bottom:1px; position:relative; }
.nav-item:hover{ background:rgba(255,255,255,.06); color:#fff; }
.nav-item.active{ background:linear-gradient(90deg,rgba(75,80,230,.32),rgba(75,80,230,.12)); color:#fff; }
.nav-item.active::before{ content:""; position:absolute; left:-12px; top:8px; bottom:8px; width:3px; border-radius:3px; background:var(--gold-400); }
.nav-item .ic{ width:18px; height:18px; flex:none; }
.nav-item .nav-badge{ margin-left:auto; background:var(--gold-500); color:#2a2008; font-size:10px; font-weight:800; height:18px; min-width:18px; padding:0 5px; border-radius:9px; display:flex; align-items:center; justify-content:center; }
.nav-item .nav-badge.brand{ background:var(--brand-500); color:#fff; }
.sidebar.collapsed .nav-item{ justify-content:center; padding:10px; }
.sidebar.collapsed .nav-item.active::before{ left:-12px; }

.sb-ft{ padding:12px; border-top:1px solid rgba(255,255,255,.07); flex:none; }
.u-card{ display:flex; align-items:center; gap:10px; padding:8px; border-radius:10px; cursor:pointer; transition:background var(--speed); }
.u-card:hover{ background:rgba(255,255,255,.06); }
.u-meta .u-nm{ font-size:13px; font-weight:600; color:#fff; }
.u-meta .u-role{ font-size:11px; color:#8089b6; }

/* main */
.main{ flex:1; min-width:0; display:flex; flex-direction:column; }
.topbar{ height:var(--topbar-h); flex:none; background:color-mix(in srgb,var(--surface) 86%,transparent); backdrop-filter:blur(12px); border-bottom:1px solid var(--line); display:flex; align-items:center; gap:14px; padding:0 22px; position:sticky; top:0; z-index:40; }
.topbar .search{ flex:1; max-width:440px; }
.search-box{ display:flex; align-items:center; gap:9px; height:38px; padding:0 13px; background:var(--surface-3); border:1px solid transparent; border-radius:var(--radius-sm); color:var(--ink-3); cursor:text; transition:all var(--speed); }
.search-box:hover{ background:var(--hover); }
.search-box:focus-within{ background:var(--surface); border-color:var(--brand-400); box-shadow:var(--ring); }
.search-box input{ border:0; outline:0; background:transparent; flex:1; color:var(--ink); font-size:13.5px; }
.search-box .kbd{ font-size:10.5px; font-weight:700; padding:2px 6px; background:var(--surface); border:1px solid var(--line); border-radius:5px; color:var(--ink-4); }
.topbar-btn{ width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;color:var(--ink-2); cursor:pointer; transition:all var(--speed); position:relative; border:1px solid transparent; }
.topbar-btn:hover{ background:var(--hover); color:var(--ink); }
.topbar-btn .ndot{ position:absolute; top:7px; right:8px; width:8px;height:8px;border-radius:50%;background:var(--danger-500); border:2px solid var(--surface); }
.topbar-btn .ncount{ position:absolute; top:3px; right:2px; min-width:16px;height:16px;padding:0 4px;border-radius:9px;background:var(--danger-500); color:#fff; font-size:9.5px; font-weight:800; display:flex; align-items:center; justify-content:center; border:2px solid var(--surface); }

.content{ flex:1; padding:24px; max-width:var(--maxw); width:100%; margin:0 auto; }
.page-hd{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:22px; flex-wrap:wrap; }
.page-hd .ttl{ font-size:24px; font-family:var(--font-display); font-weight:560; letter-spacing:-.02em; }
.page-hd .sub{ color:var(--ink-3); font-size:13.5px; margin-top:3px; }
.breadcrumb{ display:flex; align-items:center; gap:7px; font-size:12.5px; color:var(--ink-3); margin-bottom:8px; }
.breadcrumb a:hover{ color:var(--brand-600); }

.grid{ display:grid; gap:16px; }
.g-2{ grid-template-columns:repeat(2,1fr); } .g-3{ grid-template-columns:repeat(3,1fr); }
.g-4{ grid-template-columns:repeat(4,1fr); } .g-5{ grid-template-columns:repeat(5,1fr); }
.g-auto{ grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); }
.span-2{ grid-column:span 2; } .span-3{ grid-column:span 3; }

.toolbar{ display:flex; align-items:center; gap:10px; margin-bottom:16px; flex-wrap:wrap; }
.toolbar .grow{ flex:1; }

/* filter bar */
.filterbar{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }

/* ===================== KANBAN ===================== */
.kanban{ display:flex; gap:14px; overflow-x:auto; padding-bottom:8px; align-items:flex-start; }
.kan-col{ flex:none; width:288px; background:var(--surface-2); border:1px solid var(--line); border-radius:var(--radius); display:flex; flex-direction:column; max-height:calc(100vh - 220px); }
.kan-col-hd{ padding:12px 14px; display:flex; align-items:center; gap:8px; border-bottom:1px solid var(--line); position:sticky; top:0; background:var(--surface-2); border-radius:var(--radius) var(--radius) 0 0; z-index:1; }
.kan-col-hd .cnt{ margin-left:auto; font-size:11.5px; font-weight:700; color:var(--ink-3); background:var(--surface-3); border-radius:20px; padding:1px 8px; }
.kan-body{ padding:10px; overflow-y:auto; display:flex; flex-direction:column; gap:9px; min-height:60px; flex:1; }
.kan-body.drag-over{ background:var(--brand-50); }
.kan-card{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-sm); padding:12px; cursor:grab; box-shadow:var(--shadow-xs); transition:box-shadow var(--speed),transform var(--speed); }
.kan-card:hover{ box-shadow:var(--shadow-sm); }
.kan-card.dragging{ opacity:.5; transform:rotate(1.5deg); }
.kan-card .k-title{ font-weight:600; font-size:13px; margin-bottom:7px; }

/* ===================== COPILOT ===================== */
.copilot-fab{ position:fixed; bottom:24px; right:24px; z-index:6500; width:58px;height:58px;border-radius:50%; background:linear-gradient(145deg,var(--violet-500),var(--brand-600)); color:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 12px 34px -8px rgba(124,77,219,.6); cursor:pointer; transition:transform var(--speed); border:0; }
.copilot-fab:hover{ transform:scale(1.06); }
.copilot-fab svg{ width:26px;height:26px; }
.copilot-fab .ping{ position:absolute; inset:0; border-radius:50%; border:2px solid var(--violet-500); animation:ping 2.4s ease-out infinite; }
@keyframes ping{ 0%{transform:scale(1);opacity:.6} 100%{transform:scale(1.5);opacity:0} }

.copilot-panel{ position:fixed; bottom:0; right:0; top:0; width:min(440px,100vw); background:var(--surface); border-left:1px solid var(--line); box-shadow:var(--shadow-lg); z-index:6600; display:flex; flex-direction:column; animation:drawerIn .3s var(--ease); }
.copilot-hd{ padding:14px 16px; background:linear-gradient(135deg,var(--brand-ink),var(--brand-ink-3)); color:#fff; display:flex; align-items:center; gap:11px; }
.copilot-hd .ai-orb{ width:36px;height:36px;border-radius:11px;background:linear-gradient(145deg,var(--violet-500),var(--brand-500)); display:flex; align-items:center; justify-content:center; box-shadow:0 0 18px rgba(124,77,219,.5); }
.copilot-msgs{ flex:1; overflow-y:auto; padding:18px 16px; display:flex; flex-direction:column; gap:14px; background:var(--surface-2); }
.cmsg{ display:flex; gap:10px; max-width:92%; animation:cardIn .3s var(--ease); }
.cmsg.user{ align-self:flex-end; flex-direction:row-reverse; }
.cmsg .bubble{ padding:11px 13px; border-radius:14px; font-size:13px; line-height:1.55; }
.cmsg.ai .bubble{ background:var(--surface); border:1px solid var(--line); border-top-left-radius:4px; }
.cmsg.user .bubble{ background:var(--brand-500); color:#fff; border-top-right-radius:4px; }
.cmsg .ava{ width:30px;height:30px;border-radius:9px;flex:none;display:flex;align-items:center;justify-content:center; }
.cmsg.ai .ava{ background:linear-gradient(145deg,var(--violet-500),var(--brand-500)); color:#fff; }
.agent-plan{ background:var(--surface-3); border:1px solid var(--line); border-radius:10px; padding:11px; margin-top:8px; }
.agent-step{ display:flex; align-items:center; gap:9px; padding:5px 0; font-size:12px; }
.agent-step .a-ic{ width:22px;height:22px;border-radius:7px;background:var(--surface);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;flex:none; }
.agent-step.run .a-ic{ border-color:var(--violet-500); color:var(--violet-500); }
.agent-step.done .a-ic{ background:var(--success-500); border-color:var(--success-500); color:#fff; }
.citation{ display:inline-flex; align-items:center; gap:5px; padding:2px 8px; background:var(--brand-50); border:1px solid var(--brand-100); border-radius:6px; font-size:11px; font-weight:600; color:var(--brand-700); margin:2px 3px 2px 0; cursor:pointer; }
.stream-caret{ display:inline-block; width:7px; color:var(--violet-500); animation:caret 1s steps(2) infinite; font-weight:400; }
@keyframes caret{ 50%{ opacity:0 } }
.copilot-input{ padding:12px 14px; border-top:1px solid var(--line); }
.typing{ display:inline-flex; gap:3px; padding:4px 0; }
.typing i{ width:7px;height:7px;border-radius:50%;background:var(--ink-4); animation:typing 1.2s infinite; }
.typing i:nth-child(2){ animation-delay:.2s } .typing i:nth-child(3){ animation-delay:.4s }
@keyframes typing{ 0%,60%,100%{ transform:translateY(0); opacity:.4 } 30%{ transform:translateY(-5px); opacity:1 } }

/* ===================== COMMAND PALETTE ===================== */
.cmdk-scrim{ position:fixed; inset:0; background:rgba(12,16,32,.5); backdrop-filter:blur(4px); z-index:8500; display:flex; align-items:flex-start; justify-content:center; padding-top:14vh; opacity:0; animation:fade .15s forwards; }
.cmdk{ width:min(620px,calc(100vw - 32px)); background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-lg); box-shadow:var(--shadow-lg); overflow:hidden; animation:modalIn .2s var(--ease); }
.cmdk-input{ display:flex; align-items:center; gap:12px; padding:16px 18px; border-bottom:1px solid var(--line); }
.cmdk-input input{ border:0; outline:0; background:transparent; flex:1; font-size:16px; color:var(--ink); }
.cmdk-results{ max-height:50vh; overflow-y:auto; padding:8px; }
.cmdk-item{ display:flex; align-items:center; gap:12px; padding:10px 12px; border-radius:9px; cursor:pointer; }
.cmdk-item.sel{ background:var(--brand-50); }
.cmdk-item .ci-ic{ width:32px;height:32px;border-radius:8px;background:var(--surface-3);display:flex;align-items:center;justify-content:center;color:var(--ink-2);flex:none; }
.cmdk-item.sel .ci-ic{ background:var(--brand-500); color:#fff; }

/* ===================== NOTIFICATIONS ===================== */
.notif-item{ display:flex; gap:12px; padding:13px 14px; border-bottom:1px solid var(--line-2); cursor:pointer; transition:background var(--speed); }
.notif-item:hover{ background:var(--hover); }
.notif-item.unread{ background:var(--brand-50); }
.notif-item.unread:hover{ background:var(--brand-100); }
.notif-ic{ width:36px;height:36px;border-radius:10px;flex:none;display:flex;align-items:center;justify-content:center; }
.notif-act{ display:flex; gap:7px; margin-top:9px; }

/* ===================== ORGANOGRAM ===================== */
.org-tree{ display:flex; flex-direction:column; align-items:center; padding:20px; overflow-x:auto; }
.org-node{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:12px 16px; box-shadow:var(--shadow-sm); display:flex; align-items:center; gap:11px; min-width:200px; position:relative; cursor:pointer; transition:all var(--speed); }
.org-node:hover{ border-color:var(--brand-400); box-shadow:var(--shadow); }
.org-node.root{ background:linear-gradient(135deg,var(--brand-ink),var(--brand-ink-3)); color:#fff; border-color:transparent; }
.org-children{ display:flex; gap:20px; position:relative; padding-top:28px; }
.org-children::before{ content:""; position:absolute; top:0; left:50%; height:14px; width:2px; background:var(--line); }
.org-branch{ display:flex; flex-direction:column; align-items:center; position:relative; padding-top:14px; }
.org-branch::before{ content:""; position:absolute; top:0; left:50%; height:14px; width:2px; background:var(--line); }
.org-connector{ position:absolute; top:14px; height:2px; background:var(--line); }

/* ===================== CALENDAR ===================== */
.cal-grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
.cal-dow{ background:var(--surface-2); padding:9px; text-align:center; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-3); }
.cal-day{ background:var(--surface); min-height:104px; padding:7px 8px; cursor:pointer; transition:background var(--speed); position:relative; }
.cal-day:hover{ background:var(--hover); }
.cal-day.other{ background:var(--surface-2); color:var(--ink-4); }
.cal-day.today .cal-dnum{ background:var(--brand-500); color:#fff; }
.cal-dnum{ display:inline-flex; align-items:center; justify-content:center; width:24px;height:24px;border-radius:50%; font-size:12.5px; font-weight:600; margin-bottom:4px; }
.cal-ev{ font-size:10.5px; padding:2px 6px; border-radius:5px; margin-bottom:3px; font-weight:560; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; cursor:pointer; border-left:2.5px solid; }

/* ===================== DOC EDITOR ===================== */
.doc-paper{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); padding:48px 56px; max-width:760px; margin:0 auto; font-family:var(--font-display); font-size:14.5px; line-height:1.85; color:var(--ink); }
.doc-paper h2{ font-family:var(--font-display); text-align:center; font-size:17px; margin-bottom:4px; }
.doc-field{ background:var(--brand-50); border-bottom:1.5px dashed var(--brand-300); padding:0 4px; border-radius:3px; cursor:pointer; font-weight:600; color:var(--brand-700); }

/* ===================== MOBILE DEVICE FRAME ===================== */
.device-stage{ min-height:calc(100vh - var(--topbar-h)); display:flex; align-items:center; justify-content:center; gap:48px; padding:40px 20px; background:
  radial-gradient(700px 400px at 50% 0%, var(--brand-50), transparent 60%); flex-wrap:wrap; }
.phone{ width:376px; height:760px; background:#0a0e1c; border-radius:46px; padding:13px; box-shadow:0 50px 90px -30px rgba(16,25,53,.5), 0 0 0 2px rgba(0,0,0,.06); position:relative; flex:none; }
.phone-screen{ width:100%; height:100%; background:var(--bg); border-radius:34px; overflow:hidden; position:relative; display:flex; flex-direction:column; }
.phone-notch{ position:absolute; top:13px; left:50%; transform:translateX(-50%); width:128px; height:30px; background:#0a0e1c; border-radius:0 0 18px 18px; z-index:30; }
.phone-statusbar{ height:42px; display:flex; align-items:flex-end; justify-content:space-between; padding:0 24px 6px; font-size:12px; font-weight:650; color:var(--ink); flex:none; }
.m-screen{ flex:1; overflow-y:auto; }
.m-tabbar{ height:62px; flex:none; background:var(--surface); border-top:1px solid var(--line); display:flex; align-items:center; justify-content:space-around; padding-bottom:6px; }
.m-tab{ display:flex; flex-direction:column; align-items:center; gap:3px; color:var(--ink-4); font-size:9.5px; font-weight:600; cursor:pointer; flex:1; }
.m-tab.active{ color:var(--brand-500); }
.m-tab .ic{ width:21px;height:21px; }
.m-topbar{ padding:14px 16px 10px; display:flex; align-items:center; justify-content:space-between; }
.m-card{ background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:14px; margin:0 14px 12px; box-shadow:var(--shadow-xs); }
.m-list-item{ display:flex; align-items:center; gap:11px; padding:12px 16px; border-bottom:1px solid var(--line-2); }
.device-controls{ max-width:300px; }

/* ===================== KOREVRASIGN (e-signature ceremony) ===================== */
.sign-stage{ position:fixed; inset:0; z-index:9100; background:rgba(10,14,28,.72); backdrop-filter:blur(6px); display:flex; align-items:center; justify-content:center; padding:18px; animation:fade .2s forwards; }
.sign-shell{ width:min(1060px,100%); height:min(720px,100%); background:var(--bg); border-radius:18px; overflow:hidden; display:grid; grid-template-columns:1fr 380px; box-shadow:var(--shadow-lg); animation:modalIn .3s var(--ease); }
.sign-doc{ overflow-y:auto; padding:26px; background:var(--bg-tint); }
.sign-rail{ background:var(--surface); border-left:1px solid var(--line); display:flex; flex-direction:column; overflow-y:auto; }
.sign-rail-hd{ padding:16px 18px; background:linear-gradient(135deg,var(--brand-ink),var(--brand-ink-3)); color:#fff; display:flex; align-items:center; gap:10px; }
.sign-body{ padding:18px; flex:1; }
.sign-pad-wrap{ border:1.5px dashed var(--line); border-radius:12px; background:var(--surface-2); position:relative; }
.sign-pad-wrap canvas{ width:100%; height:140px; display:block; touch-action:none; cursor:crosshair; }
.sign-pad-line{ position:absolute; left:18px; right:18px; bottom:30px; border-bottom:1.5px solid var(--ink-4); pointer-events:none; }
.sign-pad-x{ position:absolute; left:18px; bottom:34px; color:var(--ink-4); font-size:15px; pointer-events:none; }
.sig-typed{ font-family:'Segoe Script','Brush Script MT',var(--font-display),cursive; font-size:30px; color:#16204a; }
.sig-stamp{ display:inline-block; padding:6px 14px 4px; border:1.5px solid var(--brand-300); border-radius:8px; background:var(--brand-50); }
.sig-stamp .sig-typed{ font-size:22px; }
.sig-stamp .sig-meta{ font-size:9px; color:var(--ink-3); font-family:var(--font-mono); }
.sign-party{ display:flex; gap:10px; align-items:center; padding:10px 12px; border:1px solid var(--line); border-radius:11px; margin-bottom:8px; background:var(--surface); }
.sign-party.current{ border-color:var(--brand-400); box-shadow:var(--ring); }
.sign-cert{ border:1.5px solid var(--gold-500); border-radius:12px; padding:14px; background:linear-gradient(160deg,#fffdf5,#fbf2da); }
html[data-theme="dark"] .sign-cert{ background:#241d0c; }
@media (max-width:860px){ .sign-shell{ grid-template-columns:1fr; height:100%; } .sign-doc{ display:none; } }

/* ===================== DELAW CARE (support) ===================== */
.care-tabs{ display:flex; gap:4px; padding:0 4px; }
.care-tab{ flex:1; border:0; background:transparent; color:var(--ink-3); padding:9px 4px; font-weight:600; font-size:12px; border-radius:9px; display:flex; flex-direction:column; align-items:center; gap:4px; }
.care-tab.active{ background:var(--brand-50); color:var(--brand-700); }
.care-chat{ display:flex; flex-direction:column; gap:9px; padding:14px; background:var(--surface-2); border-radius:12px; min-height:260px; max-height:340px; overflow-y:auto; }
.tk-card{ border:1px solid var(--line); border-radius:11px; padding:12px; margin-bottom:9px; background:var(--surface); }

/* ===================== REPORT STUDIO ===================== */
.rpt-page{ background:#fff; color:#101729; width:100%; max-width:780px; margin:0 auto 18px; padding:42px 48px; border-radius:6px; box-shadow:var(--shadow); min-height:540px; position:relative; }
html[data-theme="dark"] .rpt-page{ box-shadow:0 10px 40px rgba(0,0,0,.5); }
.rpt-page .rpt-band{ height:6px; border-radius:3px; background:linear-gradient(90deg,#119a9a,#c9a24b); margin-bottom:22px; }
.rpt-hd{ display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:18px; }
.rpt-foot{ position:absolute; bottom:16px; left:48px; right:48px; display:flex; justify-content:space-between; font-size:9.5px; color:#8a93ab; border-top:1px solid #e8eaf1; padding-top:8px; }
.rpt-kpis{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:14px 0; }
.rpt-kpi{ border:1px solid #e8eaf1; border-radius:10px; padding:10px 12px; }
.rpt-kpi .v{ font-family:var(--font-display); font-size:20px; font-weight:650; }
.rpt-kpi .l{ font-size:10px; color:#69718c; }
.rpt-tbl{ width:100%; border-collapse:collapse; font-size:11.5px; margin:10px 0; }
.rpt-tbl th{ text-align:left; padding:7px 9px; background:#f2f4f9; font-size:9.5px; text-transform:uppercase; letter-spacing:.05em; color:#5b6480; }
.rpt-tbl td{ padding:7px 9px; border-bottom:1px solid #eef0f5; }
@media print{ .rpt-page{ box-shadow:none; margin:0; page-break-after:always; } #ihView > *:not(#rptOut){ display:none; } .page-hd{ display:none !important; } }

/* ===================== DOCUMENT EDITOR ===================== */
.ed-wrap{ display:grid; grid-template-columns:1fr 320px; gap:16px; align-items:start; }
.ed-toolbar{ display:flex; align-items:center; gap:4px; flex-wrap:wrap; padding:8px 10px; background:var(--surface); border:1px solid var(--line); border-radius:12px 12px 0 0; position:sticky; top:calc(var(--topbar-h) + 8px); z-index:10; }
.ed-btn{ width:32px; height:32px; border:0; background:transparent; border-radius:8px; color:var(--ink-2); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:13px; cursor:pointer; }
.ed-btn:hover{ background:var(--hover); }
.ed-btn.on{ background:var(--brand-50); color:var(--brand-700); }
.ed-sep{ width:1px; height:20px; background:var(--line); margin:0 4px; }
.ed-paper{ background:#fff; color:#14182b; border:1px solid var(--line); border-top:0; border-radius:0 0 12px 12px; padding:0 0 40px; min-height:560px; box-shadow:var(--shadow-sm); }
.ed-body{ padding:30px 52px; font-family:var(--font-display); font-size:14px; line-height:1.85; outline:none; min-height:420px; }
.ed-body h3{ font-family:var(--font-display); font-size:16px; margin:16px 0 6px; }
.ed-body p{ margin:0 0 10px; }
.ed-body .doc-field{ background:#eef0fb; }
html[data-theme="dark"] .ed-paper{ background:#fff; color:#14182b; }
.ed-letterhead{ padding:26px 52px 14px; }
.lh-band{ height:5px; border-radius:3px; margin-top:12px; }
.lh-logo{ width:44px; height:44px; border-radius:11px; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:800; font-size:16px; letter-spacing:.02em; flex:none; overflow:hidden; }
.lh-logo img{ width:100%; height:100%; object-fit:cover; }
ins.dl-ins{ background:#e7f7ef; color:#0b6e48; text-decoration:none; border-bottom:1.5px solid #15a06a; }
del.dl-del{ background:#fdecec; color:#bd2727; text-decoration:line-through; }
.chg-item{ border:1px solid var(--line); border-radius:10px; padding:10px 11px; margin-bottom:8px; background:var(--surface); }
.cmt-quote{ border-left:3px solid var(--gold-500); padding:2px 8px; background:var(--surface-3); border-radius:0 6px 6px 0; font-style:italic; }

/* ===================== BRAND STUDIO ===================== */
.swatch{ width:34px; height:34px; border-radius:10px; cursor:pointer; border:2.5px solid transparent; transition:transform var(--speed); }
.swatch:hover{ transform:scale(1.08); }
.swatch.on{ border-color:var(--ink); box-shadow:var(--ring); }
.lh-preview{ background:#fff; color:#14182b; border-radius:10px; box-shadow:var(--shadow); padding:0 0 18px; overflow:hidden; }
.sig-vault{ border:1.5px dashed var(--line); border-radius:12px; padding:16px; text-align:center; background:var(--surface-2); }
.sig-vault img{ max-height:64px; margin:0 auto; }

/* mobile firm threads */
.m-unread{ min-width:18px; height:18px; border-radius:9px; background:var(--brand-500); color:#fff; font-size:10px; font-weight:800; display:flex; align-items:center; justify-content:center; padding:0 5px; }

/* ===================== ONBOARDING ===================== */
.ob-step{ display:flex; gap:12px; align-items:center; padding:13px 14px; border:1px solid var(--line); border-radius:12px; margin-bottom:9px; background:var(--surface); transition:all var(--speed); }
.ob-step.done{ opacity:.72; background:var(--surface-2); }
.ob-num{ width:30px;height:30px;border-radius:50%;background:var(--brand-50);color:var(--brand-700);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;flex:none; }
.ob-step.done .ob-num{ background:var(--success-500); color:#fff; }

/* mobile polish */
.m-tab{ position:relative; padding-top:5px; }
.m-tab.active::before{ content:""; position:absolute; top:-1px; left:50%; transform:translateX(-50%); width:34px; height:3px; border-radius:0 0 4px 4px; background:var(--brand-500); }
.m-hero{ margin:12px 14px; border-radius:18px; padding:16px; background:linear-gradient(135deg,var(--brand-ink),var(--brand-ink-3)); color:#fff; position:relative; overflow:hidden; }
.m-hero::after{ content:""; position:absolute; right:-30px; top:-30px; width:120px; height:120px; border-radius:50%; background:radial-gradient(circle,rgba(201,162,75,.25),transparent 70%); }

/* In-House Counsel sidebar (teal) */
.ih-side{ background:linear-gradient(180deg,#0b2733,#0e3a4a) !important; }
.ih-side .sb-hd .logo{ background:linear-gradient(145deg,#119a9a,#0b5757) !important; box-shadow:0 4px 14px -4px rgba(0,0,0,.5); }
.ih-side .nav-item.active{ background:linear-gradient(90deg,rgba(17,154,154,.36),rgba(17,154,154,.1)) !important; }
.ih-side .nav-item.active::before{ background:var(--gold-400); }
.ih-side .nav-item:hover{ background:rgba(255,255,255,.06); }

/* mobile app chrome */
.mob-stage{ min-height:100vh; background:radial-gradient(800px 500px at 50% -10%, rgba(75,80,230,.22), transparent 60%), linear-gradient(160deg,#0b1030,#0a0e1c 70%); }
.m-appbar{ position:sticky; top:0; z-index:20; background:color-mix(in srgb,var(--surface) 92%,transparent); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); padding:12px 14px; display:flex; align-items:center; gap:10px; }
.m-appbar .m-back{ width:30px;height:30px;border-radius:9px;border:0;background:var(--surface-3);color:var(--ink-2);display:flex;align-items:center;justify-content:center;flex:none; }
.m-iconbtn{ width:34px;height:34px;border-radius:10px;border:0;background:transparent;color:var(--ink-2);display:flex;align-items:center;justify-content:center;flex:none;position:relative; }
.m-section{ padding:4px 16px 2px; display:flex; align-items:center; justify-content:space-between; }
.m-section .ttl{ font-size:13px; font-weight:700; }
.m-section a{ font-size:11.5px; }
.m-hscroll{ display:flex; gap:10px; overflow-x:auto; padding:6px 16px 12px; scrollbar-width:none; }
.m-hscroll::-webkit-scrollbar{ display:none; }
.m-mcard{ flex:none; width:210px; background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:13px; box-shadow:var(--shadow-xs); }
.m-qa{ display:flex; gap:8px; padding:0 16px 12px; }
.m-qa button{ flex:1; flex-direction:column; gap:5px; height:auto; padding:11px 4px; font-size:10.5px; border-radius:12px; }
.m-fab{ position:absolute; bottom:78px; right:16px; width:50px;height:50px;border-radius:16px;border:0; background:linear-gradient(145deg,var(--brand-500),var(--brand-700)); color:#fff; box-shadow:0 10px 24px -6px rgba(75,80,230,.55); display:flex;align-items:center;justify-content:center; z-index:15; }
.m-chip{ display:inline-flex; align-items:center; gap:5px; height:28px; padding:0 11px; border-radius:18px; background:var(--surface-3); border:1px solid var(--line); font-size:11.5px; font-weight:560; color:var(--ink-2); white-space:nowrap; }
.m-chip.on{ background:var(--brand-500); color:#fff; border-color:var(--brand-600); }
.m-seg{ display:inline-flex; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); border-radius:10px; padding:3px; gap:2px; }
.m-seg button{ border:0; background:transparent; color:#aeb6dd; height:28px; padding:0 12px; border-radius:7px; font-weight:560; font-size:12px; }
.m-seg button.on{ background:var(--gold-500); color:#2a2008; }
.m-bubble{ max-width:82%; padding:9px 12px; border-radius:14px; font-size:12.5px; line-height:1.5; }
.m-bubble.ai{ background:var(--surface); border:1px solid var(--line); border-top-left-radius:4px; align-self:flex-start; }
.m-bubble.me{ background:var(--brand-500); color:#fff; border-top-right-radius:4px; align-self:flex-end; }
.phone-statusbar{ position:relative; z-index:21; }

/* USSD / WhatsApp sim */
.ussd-screen{ background:#0a0e0a; color:#d6ffd6; font-family:var(--font-mono); border-radius:14px; padding:18px; font-size:13px; line-height:1.7; min-height:280px; border:1px solid #1c3a1c; }
.wa-screen{ background:#e5ddd5; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Cg fill='%23d9d0c5' fill-opacity='.4'%3E%3Ccircle cx='8' cy='8' r='1.5'/%3E%3C/g%3E%3C/svg%3E"); border-radius:14px; padding:14px; display:flex; flex-direction:column; gap:8px; min-height:300px; }
html[data-theme="dark"] .wa-screen{ background:#0b141a; }
.wa-msg{ max-width:80%; padding:7px 11px; border-radius:9px; font-size:12.5px; box-shadow:var(--shadow-xs); position:relative; }
.wa-msg.in{ background:var(--surface); align-self:flex-start; }
.wa-msg.out{ background:#d9fdd3; align-self:flex-end; color:#0c1f17; }
html[data-theme="dark"] .wa-msg.out{ background:#005c4b; color:#e9edef; }
html[data-theme="dark"] .wa-msg.in{ background:#202c33; color:#e9edef; }

/* ===================== HEAT / MATRIX ===================== */
.heat-cell{ aspect-ratio:1; border-radius:5px; display:flex; align-items:center; justify-content:center; font-size:10px; font-weight:600; color:#fff; }

/* mini sparkline / bars */
.minibars{ display:flex; align-items:flex-end; gap:3px; height:42px; }
.minibars i{ flex:1; background:var(--brand-300); border-radius:3px 3px 0 0; min-height:3px; transition:height .5s var(--ease); }
.minibars i.hl{ background:var(--brand-500); }

/* ===================== RESPONSIVE ===================== */
.menu-toggle{ display:none; }
@media (max-width:1024px){
  .g-4{ grid-template-columns:repeat(2,1fr); } .g-5{ grid-template-columns:repeat(3,1fr); }
  .g-3{ grid-template-columns:repeat(2,1fr); }
  .span-2{ grid-column:span 1; }
}
@media (max-width:860px){
  .sidebar{ position:fixed; left:0; top:0; transform:translateX(-100%); transition:transform var(--speed); box-shadow:var(--shadow-lg); }
  .sidebar.open{ transform:none; }
  .menu-toggle{ display:flex; }
  .sb-backdrop{ position:fixed; inset:0; background:rgba(12,16,32,.5); z-index:49; }
  .topbar .search{ display:none; }
  .content{ padding:16px; }
  .g-2,.g-3,.g-4,.g-5{ grid-template-columns:1fr; }
  .page-hd .ttl{ font-size:20px; }
  .phone{ transform:scale(.88); }
}
@media (max-width:560px){
  .splash-stats{ gap:20px; } .splash-cta{ width:100%; }
  .modal,.modal.wide,.modal.xwide{ width:calc(100vw - 20px); }
  .drawer{ width:100vw; }
  .copilot-panel{ width:100vw; }
  .grid-form{ grid-template-columns:1fr; }
}

/* ===================== AUTH / LOGIN ===================== */
.auth{ display:flex; min-height:100vh; background:var(--bg); }
.auth-brand{ width:44%; flex:none; color:#fff; position:relative; overflow:hidden; display:flex;
  background:radial-gradient(900px 600px at 20% -10%, rgba(75,80,230,.32), transparent 55%), radial-gradient(700px 500px at 90% 110%, rgba(201,162,75,.16), transparent 55%), linear-gradient(160deg,#0b1030,#0a0e1c 70%); }
.auth-brand::before{ content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px); background-size:44px 44px; mask:radial-gradient(circle at 40% 40%,#000,transparent 75%); }
.auth-brand-inner{ position:relative; z-index:2; display:flex; flex-direction:column; padding:48px; width:100%; }
.auth-quote{ margin-top:28px; padding:18px; border-radius:14px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1); display:flex; gap:12px; color:#cdd3f0; font-size:14px; backdrop-filter:blur(6px); }
.auth-form-wrap{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:36px 24px; }
.auth-form{ width:min(400px,100%); animation:cardIn .4s var(--ease); }
.auth-head{ margin-bottom:22px; }
.auth-head h2{ font-size:27px; } .auth-head p{ color:var(--ink-3); margin-top:4px; }
.auth-mfa-ic{ width:54px;height:54px;border-radius:15px;background:var(--brand-50);color:var(--brand-600);display:flex;align-items:center;justify-content:center;margin-bottom:14px; }
.auth-eye{ position:absolute; right:8px; border:0; background:transparent; color:var(--ink-3); width:30px;height:30px;border-radius:7px; cursor:pointer; display:flex;align-items:center;justify-content:center; }
.auth-eye:hover{ background:var(--hover); color:var(--ink); }
.auth-divider{ display:flex; align-items:center; gap:12px; margin:18px 0; color:var(--ink-4); font-size:11.5px; }
.auth-divider::before,.auth-divider::after{ content:""; flex:1; height:1px; background:var(--line); }
.auth-demo{ margin-top:22px; padding-top:18px; border-top:1px dashed var(--line); }
.auth-foot{ margin-top:26px; text-align:center; }
.otp-row{ display:flex; gap:10px; justify-content:center; }
.otp{ width:46px; height:56px; text-align:center; font-size:22px; font-weight:700; border:1.5px solid var(--line); border-radius:11px; background:var(--surface); color:var(--ink); transition:all var(--speed); }
.otp:focus{ border-color:var(--brand-400); box-shadow:var(--ring); outline:none; }
@media (max-width:860px){ .auth-brand{ display:none; } }

/* dark-mode legibility for AI citations & document merge-fields */
html[data-theme="dark"] .citation{ color:#9aa1e8; background:rgba(75,80,230,.14); border-color:#2c2f55; }
html[data-theme="dark"] .doc-field{ color:#9aa1e8; background:rgba(75,80,230,.14); border-bottom-color:#4b50e6; }

/* high-contrast accessibility theme */
html[data-contrast="high"]{ --ink-3:#3a4255; --ink-4:#4a5468; --line:#9aa3ba; --line-2:#b3bccb; }
html[data-contrast="high"] .btn, html[data-contrast="high"] .badge, html[data-contrast="high"] .card{ border-width:1.5px; }
html[data-contrast="high"] *:focus-visible{ outline:2px solid var(--brand-600); outline-offset:2px; }

/* compact density */
html[data-density="compact"]{ --row-h:38px; }
html[data-density="compact"] .card{ padding:14px; }
html[data-density="compact"] .tbl td, html[data-density="compact"] .tbl th{ padding:8px 12px; }
html[data-density="compact"] .field{ margin-bottom:10px; }
html[data-density="compact"] .nav-item{ padding-top:7px; padding-bottom:7px; }
html[data-density="compact"] .kpi{ padding:12px 14px; }

/* Document Intelligence review grid */
.dr-cell{ display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; border-radius:7px; }
.dr-cell.ok{ background:color-mix(in srgb, var(--success-500) 16%, transparent); color:var(--success-700); }
.dr-cell.flag{ background:color-mix(in srgb, var(--warn-500) 20%, transparent); color:var(--warn-700, #9a6212); }
.dr-cell.missing{ background:color-mix(in srgb, var(--danger-500) 16%, transparent); color:var(--danger-600); }
.dr-cell:hover{ outline:2px solid var(--brand-300); }

/* guided product tour (coachmarks) */
.tour-spot{ position:fixed; z-index:1401; border-radius:12px; box-shadow:0 0 0 3px var(--brand-400), 0 0 0 9999px rgba(8,12,28,.64); transition:all .26s var(--ease); pointer-events:none; }
.tour-pop{ position:fixed; z-index:1402; width:312px; max-width:calc(100vw - 24px); background:var(--surface); border:1px solid var(--line); border-radius:14px; box-shadow:0 24px 70px -16px rgba(8,12,28,.55); padding:16px 16px 14px; animation:viewIn .22s var(--ease); }
.tour-pop .t-step{ font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-4); font-weight:700; }
.tour-pop h4{ margin:4px 0 6px; font-size:15px; }
.tour-pop p{ margin:0; color:var(--ink-2); font-size:13px; line-height:1.55; }
.tour-dots{ display:flex; gap:5px; }
.tour-dots i{ width:6px; height:6px; border-radius:50%; background:var(--line-2); }
.tour-dots i.on{ background:var(--brand-500); width:16px; border-radius:3px; }

/* toast undo/action button */
.t-act{ align-self:center; flex:none; margin-left:8px; background:transparent; border:1px solid var(--line); color:var(--brand-600); font-weight:700; font-size:12px; padding:5px 12px; border-radius:8px; cursor:pointer; white-space:nowrap; }
.t-act:hover{ background:var(--brand-50); border-color:var(--brand-300); }

/* form field validation */
.input.err, .input-group.err { border-color:var(--danger-500) !important; box-shadow:0 0 0 3px color-mix(in srgb, var(--danger-500) 16%, transparent); }
.field-err{ display:flex; align-items:center; gap:5px; color:var(--danger-600,#c0362c); font-size:12px; margin-top:6px; }
.field-err svg{ flex:none; }
.shake{ animation:shake .34s var(--ease,cubic-bezier(.36,.07,.19,.97)); }
@keyframes shake{ 10%,90%{ transform:translateX(-1px) } 20%,80%{ transform:translateX(2px) } 30%,50%,70%{ transform:translateX(-4px) } 40%,60%{ transform:translateX(4px) } }

/* view transition + motion preferences */
.vfade{ animation:viewIn .26s var(--ease); }
@keyframes viewIn{ from{ opacity:.35; transform:translateY(5px) } to{ opacity:1; transform:none } }
@media (prefers-reduced-motion: reduce){ *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; } }

/* print-ish for docs */
@media print{ .sidebar,.topbar,.copilot-fab{ display:none } }