:root {
  --blue-950:#071526; --blue-900:#08213a; --blue-800:#0b3154; --blue-700:#0c73bd;
  --blue-600:#119ee9; --blue-500:#27aef3; --blue-100:#eaf7ff;
  --ink:#26384a; --muted:#73889b; --line:#d9e5ed; --page:#eef4f7;
  --white:#fff; --green:#3fc58d; --yellow:#f4c853; --orange:#ff8b5c; --red:#ed6d76;
  --shadow:0 12px 40px rgba(31,65,92,.18);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;color:var(--ink);background:var(--page)}
body{overflow:hidden}
button,input,select{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none}
.app{height:100vh;display:grid;grid-template-columns:66px minmax(0,1fr);grid-template-rows:54px minmax(0,1fr)}
.global-bar{grid-column:1/-1;background:linear-gradient(90deg,#0b7fc6,#11a4e7);display:flex;align-items:center;color:#fff;z-index:20}
.brand{width:252px;padding-left:18px;display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.02em}
.brand-mark{width:29px;height:29px;border-radius:9px;background:#fff;color:#0d91d3;display:grid;place-items:center;font-size:11px;font-weight:900}
.global-search{height:34px;width:min(430px,40vw);border-radius:18px;border:1px solid rgba(255,255,255,.22);background:rgba(0,56,96,.19);display:flex;align-items:center;padding:0 14px;color:#dff4ff}
.global-search input{border:0;outline:0;background:transparent;color:#fff;width:100%;margin-left:8px}
.global-search input::placeholder{color:#cceeff}
.global-tools{margin-left:auto;display:flex;align-items:center;height:100%;gap:3px;padding-right:12px}
.install-btn{border:1px solid rgba(255,255,255,.45);background:rgba(255,255,255,.14);color:#fff;height:34px;border-radius:17px;padding:0 13px;cursor:pointer;font-size:11px;font-weight:700}
.install-btn:hover{background:rgba(255,255,255,.24)}
.tool{border:0;background:transparent;color:#fff;min-width:40px;height:40px;border-radius:20px;display:grid;place-items:center;cursor:pointer;position:relative}
.tool:hover{background:rgba(255,255,255,.12)}
.tool .badge{position:absolute;right:3px;top:3px;min-width:16px;height:16px;padding:0 4px;border-radius:9px;background:#ff5969;font-size:10px;display:grid;place-items:center}
.user-chip{display:flex;align-items:center;gap:8px;padding:4px 8px 4px 4px;border-radius:22px;background:rgba(0,62,104,.18);margin-left:4px}
.avatar{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:11px;font-weight:800;background:linear-gradient(135deg,#ff9f63,#ef5f72)}
.side-nav{grid-column:1;grid-row:2;background:#087fbd;display:flex;flex-direction:column;align-items:center;padding:7px 0;gap:3px;z-index:15;box-shadow:2px 0 8px rgba(4,67,107,.12)}
.nav-item{width:48px;height:45px;border-radius:8px;color:#bce8ff;display:grid;place-items:center;position:relative;cursor:pointer}
.nav-item:hover,.nav-item.active{background:rgba(0,47,78,.24);color:#fff}
.nav-item.active::after{content:"";position:absolute;left:-9px;width:3px;height:27px;border-radius:3px;background:#fff}
.nav-icon{font-size:12px;font-weight:800;border:1.5px solid currentColor;border-radius:5px;min-width:23px;height:23px;display:grid;place-items:center}
.nav-item[data-tip]::before{content:attr(data-tip);position:absolute;left:58px;top:8px;white-space:nowrap;background:#18374e;color:#fff;padding:7px 10px;border-radius:6px;font-size:11px;opacity:0;transform:translateX(-5px);pointer-events:none;transition:.15s;z-index:50}
.nav-item:hover::before{opacity:1;transform:none}
.side-spacer{flex:1}
.workspace{grid-column:2;grid-row:2;min-width:0;overflow:hidden;display:flex;flex-direction:column}
.section-head{height:64px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 22px;gap:14px}
.section-title{font-size:24px;font-weight:400;color:#294459}
.head-tabs{align-self:stretch;display:flex;align-items:stretch;margin-left:10px}
.head-tab{padding:0 14px;display:flex;align-items:center;color:#647d90;font-size:13px;border-bottom:3px solid transparent}
.head-tab.active{color:#1494d0;border-bottom-color:#27a8e4}
.primary-btn{border:0;border-radius:4px;background:#43bc78;color:#fff;height:35px;padding:0 17px;font-weight:600;cursor:pointer}
.primary-btn:hover{background:#37aa6c}
.head-actions{margin-left:auto;display:flex;gap:7px}
.light-btn{border:1px solid #cbdbe5;background:#fff;color:#567084;height:35px;border-radius:4px;padding:0 12px;cursor:pointer}
.light-btn:hover{background:#f5fafc}
.view-body{flex:1;min-height:0;display:flex;flex-direction:column;padding:13px 15px 0}
.filter-row{display:flex;align-items:center;gap:9px;margin-bottom:11px;min-height:38px}
.pipeline-select,.filter-input{height:36px;border:1px solid #cbdce6;background:#fff;border-radius:4px;color:#40596d;padding:0 11px;outline:none}
.pipeline-select{min-width:255px;font-weight:600}
.filter-input{flex:1;min-width:120px}
.segmented{height:36px;display:flex;border:1px solid #cbdce6;background:#fff;border-radius:4px;overflow:hidden}
.segmented button{border:0;border-right:1px solid #dce7ed;background:#fff;color:#72889b;padding:0 12px;cursor:pointer;font-size:12px}
.segmented button:last-child{border-right:0}
.segmented button.active{background:#e5f5fd;color:#078dce}
.summary-strip{display:flex;align-items:center;gap:18px;font-size:11px;color:#7890a3;margin-left:auto}
.summary-strip strong{color:#2c4355;font-size:13px}
.kanban-wrap{flex:1;min-height:0;overflow:auto;padding-bottom:14px}
.kanban{display:flex;align-items:stretch;gap:8px;min-width:max-content;height:100%}
.column{width:274px;display:flex;flex-direction:column;min-height:100%;border-radius:4px 4px 0 0;background:rgba(255,255,255,.45)}
.column-head{height:68px;padding:11px 12px;color:#fff;position:sticky;top:0;z-index:3;border-radius:4px 4px 0 0}
.column-head::after{content:"";position:absolute;right:-8px;top:0;border-top:34px solid transparent;border-bottom:34px solid transparent;border-left:8px solid var(--stage);z-index:4}
.column:last-child .column-head::after{display:none}
.column-title{font-size:12px;font-weight:700;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:14px}
.column-meta{display:flex;justify-content:space-between;margin-top:9px;font-size:11px;opacity:.92}
.column-add{height:27px;margin:7px;border:1px dashed #b5cad7;background:rgba(255,255,255,.62);color:#7b93a5;border-radius:3px;cursor:pointer}
.cards{padding:0 7px 15px;display:flex;flex-direction:column;gap:7px}
.deal-card{background:#fff;border-radius:4px;padding:11px 11px 9px;box-shadow:0 1px 3px rgba(44,75,95,.14);border:1px solid transparent;cursor:pointer;position:relative;transition:transform .12s,border-color .12s,box-shadow .12s;user-select:none;touch-action:manipulation}
.deal-card:hover{transform:translateY(-1px);box-shadow:0 6px 15px rgba(43,75,96,.13)}
.deal-card.selected{border-color:#26a7e5;box-shadow:0 0 0 2px rgba(38,167,229,.14)}
.deal-card.overdue{border-left:3px solid var(--red)}
.deal-card.attention{border-left:3px solid var(--yellow)}
.card-title{font-size:12px;font-weight:700;line-height:1.35;color:#30495b;margin-right:20px}
.card-client{font-size:11px;color:#71889a;margin-top:5px}
.card-money{font-size:13px;font-weight:700;margin-top:8px}
.card-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:7px}
.tag{padding:3px 6px;border-radius:8px;background:#eef5f8;color:#658094;font-size:9px}
.tag.country{background:#e7f4ff;color:#248bc5}
.tag.warning{background:#fff2d2;color:#9a7111}
.card-bottom{display:flex;align-items:center;margin-top:9px;border-top:1px solid #eef3f6;padding-top:7px}
.next-action{font-size:10px;color:#748a9c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:178px}
.mini-avatar{margin-left:auto;width:22px;height:22px;border-radius:50%;background:#e8f0f5;color:#53758c;display:grid;place-items:center;font-size:8px;font-weight:800}
.empty-card{border:1px dashed #c7d8e1;color:#8da1b0;border-radius:4px;padding:18px;text-align:center;font-size:11px}
.list-page{flex:1;min-height:0;background:#fff;border:1px solid #d8e4eb;border-radius:4px;overflow:auto}
.data-table{width:100%;border-collapse:collapse;font-size:12px}
.data-table th{height:42px;text-align:left;background:#f6f9fb;color:#72899a;font-weight:600;border-bottom:1px solid #dfe8ed;padding:0 13px;position:sticky;top:0;z-index:2}
.data-table td{padding:11px 13px;border-bottom:1px solid #edf2f5}
.data-table tr:hover td{background:#f5fbff}
.person-cell{display:flex;align-items:center;gap:9px;font-weight:600;color:#315269}
.person-avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:10px;font-weight:800;background:linear-gradient(135deg,#4faae1,#766ee8)}
.status-pill{display:inline-flex;padding:4px 8px;border-radius:11px;background:#e9f8f2;color:#26996a;font-size:10px}
.hint{position:fixed;bottom:18px;left:83px;background:#234963;color:#fff;padding:9px 12px;border-radius:5px;font-size:10px;z-index:8;box-shadow:0 6px 18px rgba(23,59,83,.2);opacity:.94}
.overlay-root{position:fixed;inset:54px 0 0 66px;z-index:70;pointer-events:none}
.overlay-root.open{pointer-events:auto}
.overlay-shade{position:absolute;inset:0;background:rgba(18,43,61,.34);opacity:0;transition:.18s}
.overlay-root.open .overlay-shade{opacity:1}
.drawer{position:absolute;top:0;bottom:0;right:0;width:min(900px,calc(100vw - 98px));background:#f2f6f8;box-shadow:-12px 0 34px rgba(18,45,64,.22);transform:translateX(102%);transition:transform .22s ease;display:flex;flex-direction:column}
.drawer.visible{transform:none}
.drawer.layer-1{right:18px;width:min(640px,calc(100vw - 125px));top:18px;bottom:18px;box-shadow:-15px 0 42px rgba(8,35,55,.32);border-radius:7px;overflow:hidden}
.drawer-top{height:58px;background:#fff;border-bottom:1px solid #dbe5eb;display:flex;align-items:center;padding:0 17px;gap:12px;flex:none}
.drawer-close,.drawer-back{width:32px;height:32px;border:0;border-radius:50%;background:#edf4f7;color:#527084;cursor:pointer;font-size:18px}
.drawer-heading{min-width:0}
.drawer-kicker{font-size:9px;color:#8296a5;text-transform:uppercase;letter-spacing:.08em}
.drawer-title{font-size:17px;font-weight:600;color:#28475b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.drawer-tools{margin-left:auto;display:flex;gap:6px}
.drawer-body{flex:1;min-height:0;overflow:auto}
.path{height:62px;background:#fff;border-bottom:1px solid #dce6ec;display:flex;padding:10px 16px;overflow-x:auto}
.path-step{min-width:104px;flex:1;position:relative;background:#e4edf2;color:#60798b;padding:8px 14px 8px 18px;font-size:10px;white-space:nowrap}
.path-step:first-child{border-radius:4px 0 0 4px}
.path-step:last-child{border-radius:0 4px 4px 0}
.path-step::after{content:"";position:absolute;top:0;right:-11px;border-top:21px solid transparent;border-bottom:21px solid transparent;border-left:11px solid #e4edf2;z-index:2}
.path-step::before{content:"";position:absolute;top:0;right:-13px;border-top:21px solid transparent;border-bottom:21px solid transparent;border-left:11px solid #fff;z-index:1}
.path-step.current{background:#39b67e;color:#fff}
.path-step.current::after{border-left-color:#39b67e}
.path-step.done{background:#bfe9d5;color:#2a7d5b}
.path-step.done::after{border-left-color:#bfe9d5}
.entity-summary{background:#fff;padding:16px;border-bottom:1px solid #dce6ec;display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:18px}
.entity-main h2{margin:0 0 8px;font-size:21px;font-weight:500}
.entity-line{display:flex;gap:18px;flex-wrap:wrap;color:#708799;font-size:11px}
.entity-value{font-size:22px;font-weight:600;color:#28485c;margin-top:14px}
.contact-link{border:1px solid #cfe3ee;background:#f6fbfe;border-radius:5px;padding:9px 10px;cursor:pointer;display:flex;align-items:center;gap:9px;color:#168fc8}
.contact-link:hover{background:#ecf8fe}
.next-card{border-left:3px solid #27a9e5;background:#f4fbff;padding:10px 12px;border-radius:4px}
.next-card small{display:block;color:#7890a1;margin-bottom:4px}
.next-card strong{font-size:12px;color:#31556b}
.drawer-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:12px;padding:12px}
.panel{background:#fff;border:1px solid #dce6ec;border-radius:5px;margin-bottom:10px}
.panel-head{height:43px;padding:0 13px;display:flex;align-items:center;border-bottom:1px solid #e7eef2;font-size:12px;font-weight:700;color:#3c596c}
.panel-head button{margin-left:auto;border:0;background:transparent;color:#1595d0;cursor:pointer;font-size:11px}
.fields{display:grid;grid-template-columns:1fr 1fr}
.field{padding:10px 13px;border-bottom:1px solid #edf2f5;min-height:59px}
.field:nth-child(odd){border-right:1px solid #edf2f5}
.field label{display:block;color:#8195a4;font-size:9px;margin-bottom:6px;text-transform:uppercase}
.field div{font-size:11px;color:#344f61}
.timeline{padding:3px 13px 12px}
.event{position:relative;padding:12px 0 12px 30px;border-bottom:1px solid #edf2f5}
.event:last-child{border-bottom:0}
.event::before{content:"";position:absolute;left:7px;top:17px;width:9px;height:9px;border-radius:50%;background:#25a7e3;box-shadow:0 0 0 4px #e7f5fc}
.event::after{content:"";position:absolute;left:11px;top:30px;bottom:-9px;width:1px;background:#d8e6ed}
.event:last-child::after{display:none}
.event-time{font-size:9px;color:#94a5b1}
.event-title{font-size:11px;font-weight:600;margin-top:3px}
.event-text{font-size:10px;color:#6e8495;line-height:1.45;margin-top:4px}
.person-hero{background:linear-gradient(135deg,#0e85c8,#25abe5);color:#fff;padding:22px;display:flex;align-items:center;gap:15px}
.person-hero .person-avatar{width:56px;height:56px;background:rgba(255,255,255,.2);font-size:16px}
.person-hero h2{margin:0 0 5px;font-size:20px}
.person-hero p{margin:0;font-size:11px;color:#d8f3ff}
.person-content{padding:13px}
.release-toast{position:fixed;right:18px;bottom:18px;z-index:200;background:#183b52;color:#fff;padding:12px 15px;border-radius:7px;box-shadow:var(--shadow);font-size:11px;display:flex;align-items:center;gap:9px}
.release-toast::before{content:"";width:9px;height:9px;border-radius:50%;background:#44d09c;box-shadow:0 0 0 4px rgba(68,208,156,.18)}
.install-guide{position:fixed;inset:0;z-index:220;background:rgba(11,31,46,.58);display:grid;place-items:center;padding:20px}
.install-guide-card{width:min(430px,100%);background:#fff;border-radius:16px;padding:22px;box-shadow:0 24px 80px rgba(5,30,47,.32)}
.install-guide-card h2{margin:0 0 9px;font-size:20px;color:#29495d}
.install-guide-card p,.install-guide-card li{font-size:12px;line-height:1.55;color:#657e90}
.install-guide-card ol{padding-left:20px}
.install-guide-card button{width:100%;height:44px;border:0;border-radius:7px;background:#149bd7;color:#fff;font-weight:700;margin-top:8px;cursor:pointer}
.mobile-nav{display:none}
@media(max-width:900px){
  .brand{width:auto}.brand span{display:none}.global-search{width:min(380px,52vw)}
  .section-head{padding:0 12px}.head-tabs{display:none}.summary-strip{display:none}
  .column{width:254px}.drawer-grid{grid-template-columns:1fr}.entity-summary{grid-template-columns:1fr}
  .drawer{width:calc(100vw - 66px)}.drawer.layer-1{right:8px;width:calc(100vw - 82px)}
}
@media(max-width:820px){
  .list-page{border:0;background:transparent}
  .data-table,.data-table tbody,.data-table tr,.data-table td{display:block;width:100%}
  .data-table thead{display:none}
  .data-table tr{background:#fff;border:1px solid #dce7ed;border-radius:8px;margin-bottom:8px;padding:10px 12px;box-shadow:0 1px 3px rgba(44,75,95,.08)}
  .data-table td{border:0;padding:5px 0 5px 38%;position:relative;min-height:29px}
  .data-table td:first-child{padding-left:0;margin-bottom:5px}
  .data-table td:not(:first-child)::before{position:absolute;left:0;color:#879aa8;font-size:9px;text-transform:uppercase}
  .data-table td:nth-child(2)::before{content:"Телефон"}.data-table td:nth-child(3)::before{content:"E-mail"}.data-table td:nth-child(4)::before{content:"Город"}.data-table td:nth-child(5)::before{content:"Сделки"}.data-table td:nth-child(6)::before{content:"Ответственный"}
}
@media(max-width:640px){
  body{overflow:hidden;padding-top:env(safe-area-inset-top);background:#08090c}.app{width:100%;max-width:100%;overflow:hidden;height:calc(100vh - env(safe-area-inset-top));height:calc(100dvh - env(safe-area-inset-top));grid-template-columns:minmax(0,1fr);grid-template-rows:50px minmax(0,1fr) calc(56px + env(safe-area-inset-bottom))}
  .global-bar{grid-column:1;grid-row:1;min-width:0;overflow:hidden}.brand{padding-left:10px;flex:0 0 38px}.brand-mark{width:28px;height:28px}
  .global-search{flex:1;width:auto;min-width:0;margin-left:5px}.global-search input{min-width:0}.global-tools{flex:0 0 auto;min-width:0;padding-right:4px}.global-tools .tool,.user-chip{display:none}
  .install-btn{width:36px;padding:0;font-size:0}.install-btn::after{content:"↓";font-size:17px}
  .side-nav{display:none}.workspace{grid-column:1;grid-row:2}.section-head{height:56px}.section-title{font-size:20px}
  .head-actions .light-btn{display:none}.view-body{padding:9px 8px 0}.filter-row{flex-wrap:wrap}
  .pipeline-select{min-width:0;flex:1}.filter-input{order:3;flex-basis:100%}.segmented{display:none}
  .kanban-wrap{margin-right:-8px}.column{width:84vw;max-width:290px}.hint{left:10px;bottom:68px}
  .overlay-root{inset:calc(50px + env(safe-area-inset-top)) 0 calc(56px + env(safe-area-inset-bottom)) 0}.drawer,.drawer.layer-1{top:0;bottom:0;right:0;width:100%;border-radius:0}
  .path{height:57px}.path-step{min-width:92px}.drawer-grid{padding:8px}.fields{grid-template-columns:1fr}
  .field:nth-child(odd){border-right:0}.drawer-tools .light-btn{display:none}
  .mobile-nav{display:grid;position:fixed;left:0;right:0;bottom:0;width:100%;height:calc(56px + env(safe-area-inset-bottom));grid-template-columns:repeat(4,minmax(0,1fr));grid-column:1;grid-row:3;background:#fff;border-top:1px solid #d8e5ec;z-index:30;padding-bottom:env(safe-area-inset-bottom)}
  .mobile-nav a{display:grid;place-items:center;font-size:10px;color:#70889a;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 2px}.mobile-nav a.active{color:#078fd0;font-weight:700}
  .light-btn,.primary-btn,.tool,.nav-item,.contact-link,.column-add{min-height:44px}
  .data-table td{padding-left:42%}
  .release-toast{left:10px;right:10px;bottom:calc(66px + env(safe-area-inset-bottom))}
}

/* SUNRISE AUTO glass design system — v0.3 */
@font-face{
  font-family:"Jost";
  font-style:normal;
  font-weight:400 800;
  font-display:swap;
  src:url("/assets/fonts/jost-cyrillic-v20.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:"Jost";
  font-style:normal;
  font-weight:400 800;
  font-display:swap;
  src:url("/assets/fonts/jost-latin-v20.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
:root{
  --brand:#e31e24;
  --brand-bright:#ff4a50;
  --brand-deep:#8f1216;
  --ink:#f5f5f5;
  --muted:#9a9a9a;
  --line:rgba(255,255,255,.12);
  --page:#0d0d0d;
  --white:#fff;
  --green:#3ddc84;
  --yellow:#ffc23d;
  --orange:#ff7a45;
  --red:#ff4a50;
  --glass:rgba(15,15,18,.54);
  --glass-soft:rgba(255,255,255,.065);
  --glass-strong:rgba(15,15,18,.82);
  --glass-border:rgba(255,255,255,.14);
  --glass-highlight:rgba(255,255,255,.12);
  --shadow:0 22px 70px rgba(0,0,0,.48);
  color-scheme:dark;
  font-family:"Jost",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
html,body{
  color:var(--ink);
  background:#08090c;
  font-family:"Jost",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
body{
  position:relative;
  isolation:isolate;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:#000;
  transform:none;
}
body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 78% 12%,rgba(227,30,36,.18),transparent 29%),
    radial-gradient(circle at 20% 88%,rgba(227,30,36,.1),transparent 33%),
    linear-gradient(rgba(255,255,255,.012) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.012) 1px,transparent 1px);
  background-size:auto,auto,44px 44px,44px 44px;
}
button,input,select{font-family:inherit}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{
  outline:2px solid var(--brand-bright);
  outline-offset:2px;
}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:rgba(255,255,255,.025)}
::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:8px}
::-webkit-scrollbar-thumb:hover{background:rgba(227,30,36,.72)}
.app{
  position:relative;
  z-index:1;
  grid-template-columns:72px minmax(0,1fr);
  grid-template-rows:64px minmax(0,1fr);
}
.global-bar{
  background:rgba(8,8,10,.73);
  border-bottom:1px solid rgba(255,255,255,.09);
  box-shadow:0 12px 38px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.045);
  backdrop-filter:blur(26px) saturate(150%);
  -webkit-backdrop-filter:blur(26px) saturate(150%);
}
.brand{
  width:270px;
  min-width:220px;
  height:100%;
  padding:0 20px;
  gap:13px;
}
.brand-logo{
  display:block;
  width:142px;
  height:36px;
  object-fit:contain;
  object-position:left center;
  filter:drop-shadow(0 4px 12px rgba(0,0,0,.4));
}
.brand-mobile-icon{display:none}
.brand-product{
  border-left:1px solid rgba(255,255,255,.22);
  padding-left:13px;
  color:#aaa;
  font-size:12px;
  font-weight:700;
  letter-spacing:.18em;
}
.brand-mark{display:none}
.global-search{
  height:40px;
  width:min(510px,42vw);
  border:1px solid rgba(255,255,255,.16);
  border-radius:13px;
  background:rgba(255,255,255,.065);
  color:#bcbcbc;
  box-shadow:inset 1px 1px 0 rgba(255,255,255,.08),0 8px 24px rgba(0,0,0,.14);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  transition:border-color .2s,background .2s,box-shadow .2s;
}
.global-search:focus-within{
  border-color:rgba(227,30,36,.72);
  background:rgba(255,255,255,.09);
  box-shadow:0 0 0 3px rgba(227,30,36,.12),inset 1px 1px 0 rgba(255,255,255,.1);
}
.global-search input{color:#fff;font-size:14px}
.global-search input::placeholder{color:#858585}
.global-tools{gap:7px;padding-right:18px}
.install-btn,.tool,.user-chip{
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.055);
  box-shadow:inset 1px 1px 0 rgba(255,255,255,.07);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.install-btn{
  height:38px;
  border-radius:12px;
  color:#f5f5f5;
  padding:0 15px;
  text-transform:uppercase;
  letter-spacing:.07em;
}
.install-btn:hover,.tool:hover{background:rgba(255,255,255,.11);border-color:rgba(255,255,255,.25)}
.tool{height:40px;min-width:40px;border-radius:12px;color:#ddd}
.tool .badge{
  right:-4px;
  top:-5px;
  background:var(--brand);
  box-shadow:0 5px 14px rgba(227,30,36,.5);
}
.user-chip{border-radius:14px;padding:4px 10px 4px 4px;color:#eee}
.user-chip{border:1px solid rgba(255,255,255,.1);cursor:pointer;font:inherit}
.avatar{
  background:linear-gradient(145deg,#ff4a50,#8f1216);
  box-shadow:0 6px 16px rgba(227,30,36,.35),inset 1px 1px 0 rgba(255,255,255,.25);
}
.side-nav{
  grid-row:2;
  width:72px;
  background:rgba(9,9,12,.67);
  border-right:1px solid rgba(255,255,255,.09);
  box-shadow:12px 0 34px rgba(0,0,0,.18),inset 1px 0 0 rgba(255,255,255,.025);
  backdrop-filter:blur(28px) saturate(145%);
  -webkit-backdrop-filter:blur(28px) saturate(145%);
  padding:12px 0;
  gap:7px;
}
.nav-item{
  width:50px;
  height:48px;
  border:1px solid transparent;
  border-radius:14px;
  color:#858585;
  transition:color .2s,background .2s,border-color .2s,transform .2s,box-shadow .2s;
}
.nav-item:hover{
  color:#fff;
  background:rgba(255,255,255,.075);
  border-color:rgba(255,255,255,.1);
  transform:translateY(-1px);
}
.nav-item.active{
  color:#fff;
  background:linear-gradient(145deg,rgba(227,30,36,.88),rgba(143,18,22,.84));
  border-color:rgba(255,120,124,.54);
  box-shadow:0 10px 24px rgba(227,30,36,.28),inset 1px 1px 0 rgba(255,255,255,.24);
}
.nav-item.active::after{
  left:-12px;
  width:3px;
  height:25px;
  background:#ff4a50;
  box-shadow:0 0 13px rgba(255,74,80,.8);
}
.nav-icon{
  border:1px solid currentColor;
  border-radius:7px;
  min-width:25px;
  height:25px;
  font-size:10px;
}
.nav-item[data-tip]::before{
  left:62px;
  top:7px;
  background:rgba(18,18,22,.94);
  border:1px solid rgba(255,255,255,.12);
  border-radius:10px;
  box-shadow:0 16px 36px rgba(0,0,0,.4);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.workspace{grid-column:2;grid-row:2;background:transparent}
.section-head{
  height:70px;
  flex:none;
  padding:0 24px;
  gap:16px;
  background:rgba(10,10,13,.48);
  border-bottom:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
  backdrop-filter:blur(22px) saturate(135%);
  -webkit-backdrop-filter:blur(22px) saturate(135%);
}
.section-title{
  color:#f5f5f5;
  font-size:26px;
  font-weight:700;
  letter-spacing:-.025em;
}
.head-tab{
  color:#888;
  font-size:13px;
  font-weight:600;
  border-bottom-width:2px;
}
.head-tab:hover{color:#ddd}
.head-tab.active{color:#fff;border-bottom-color:var(--brand);text-shadow:0 0 16px rgba(227,30,36,.28)}
.primary-btn{
  height:40px;
  padding:0 18px;
  border:1px solid rgba(255,126,130,.42);
  border-radius:12px;
  background-image:linear-gradient(115deg,#e31e24 0%,#8f1216 28%,#ff5a60 52%,#e31e24 75%,#ff7a45 100%);
  background-size:260% 260%;
  color:#fff;
  font-weight:700;
  box-shadow:0 9px 24px rgba(227,30,36,.28),inset 1px 1px 0 rgba(255,255,255,.2);
  transition:transform .18s,box-shadow .25s,background-position .4s;
}
.primary-btn:hover{
  background-position:72% 50%;
  box-shadow:0 13px 32px rgba(227,30,36,.43),inset 1px 1px 0 rgba(255,255,255,.26);
  transform:translateY(-1px);
}
.head-actions{gap:8px}
.light-btn{
  height:40px;
  padding:0 14px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:11px;
  background:rgba(255,255,255,.055);
  color:#c8c8c8;
  box-shadow:inset 1px 1px 0 rgba(255,255,255,.055);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.light-btn:hover{color:#fff;background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.23)}
.view-body{padding:15px 17px 0}
.filter-row{
  min-height:42px;
  gap:10px;
  margin-bottom:13px;
}
.pipeline-select,.filter-input{
  height:42px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:12px;
  background:rgba(18,18,22,.64);
  color:#ededed;
  padding:0 14px;
  box-shadow:inset 1px 1px 0 rgba(255,255,255,.06),0 8px 24px rgba(0,0,0,.12);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  transition:border-color .2s,background .2s,box-shadow .2s;
}
.pipeline-select{min-width:285px;font-weight:650}
.pipeline-select option{background:#17171a;color:#f5f5f5}
.filter-input::placeholder{color:#858585}
.pipeline-select:focus,.filter-input:focus{
  border-color:rgba(227,30,36,.68);
  background:rgba(24,24,28,.78);
  box-shadow:0 0 0 3px rgba(227,30,36,.11),inset 1px 1px 0 rgba(255,255,255,.08);
}
.segmented{
  height:42px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  background:rgba(18,18,22,.56);
  box-shadow:inset 1px 1px 0 rgba(255,255,255,.05);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
.segmented button{
  border-right-color:rgba(255,255,255,.08);
  background:transparent;
  color:#888;
  padding:0 14px;
}
.segmented button:hover{color:#ddd;background:rgba(255,255,255,.04)}
.segmented button.active{
  color:#fff;
  background:linear-gradient(145deg,rgba(227,30,36,.9),rgba(143,18,22,.82));
  box-shadow:inset 1px 1px 0 rgba(255,255,255,.18),0 6px 17px rgba(227,30,36,.18);
}
.summary-strip{color:#8f8f8f;font-size:11px}
.summary-strip strong{color:#f1f1f1;font-size:13px}
.kanban-wrap{padding-bottom:17px}
.kanban{gap:12px}
.column{
  width:284px;
  border:1px solid rgba(255,255,255,.105);
  border-radius:18px;
  overflow:hidden;
  background:rgba(15,15,18,.48);
  box-shadow:0 16px 42px rgba(0,0,0,.22),inset 1px 1px 0 rgba(255,255,255,.055);
  backdrop-filter:blur(24px) saturate(135%);
  -webkit-backdrop-filter:blur(24px) saturate(135%);
}
.column-head{
  height:74px;
  padding:14px 14px 11px;
  overflow:hidden;
  border-radius:0;
  border-top:3px solid var(--stage);
  border-bottom:1px solid rgba(255,255,255,.085);
  background:linear-gradient(135deg,rgba(255,255,255,.095),rgba(255,255,255,.025))!important;
  box-shadow:inset 1px 1px 0 rgba(255,255,255,.07);
}
.column-head::before{
  content:"";
  position:absolute;
  inset:-90% -20% auto 38%;
  height:170%;
  background:radial-gradient(circle,var(--stage),transparent 62%);
  opacity:.18;
  filter:blur(15px);
  pointer-events:none;
}
.column-head::after{display:none!important}
.column-title{
  position:relative;
  color:#f5f5f5;
  font-size:12px;
  font-weight:750;
  letter-spacing:.025em;
  text-transform:uppercase;
}
.column-meta{position:relative;color:#bdbdbd;font-size:10px}
.column-add{
  min-height:38px;
  margin:9px 9px 8px;
  border:1px dashed rgba(255,255,255,.18);
  border-radius:11px;
  background:rgba(255,255,255,.045);
  color:#8f8f8f;
  transition:color .2s,border-color .2s,background .2s;
}
.column-add:hover{color:#fff;border-color:rgba(227,30,36,.65);background:rgba(227,30,36,.08)}
.cards{padding:0 9px 17px;gap:9px}
.deal-card{
  overflow:hidden;
  padding:13px 13px 11px;
  border:1px solid rgba(255,255,255,.105);
  border-radius:14px;
  background:rgba(24,24,28,.72);
  box-shadow:0 10px 25px rgba(0,0,0,.22),inset 1px 1px 0 rgba(255,255,255,.065);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  transition:transform .2s,border-color .22s,box-shadow .25s,background .2s;
}
.deal-card::after{
  content:"";
  position:absolute;
  top:-15%;
  bottom:-15%;
  left:-70%;
  width:48%;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.08),transparent);
  transform:skewX(-18deg);
  transition:left .55s ease;
  pointer-events:none;
}
.deal-card:hover{
  transform:translateY(-3px);
  border-color:rgba(227,30,36,.48);
  background:rgba(28,28,33,.82);
  box-shadow:0 17px 34px rgba(0,0,0,.35),0 0 0 1px rgba(227,30,36,.08),inset 1px 1px 0 rgba(255,255,255,.1);
}
.deal-card:hover::after{left:135%}
.deal-card.selected{
  border-color:rgba(227,30,36,.86);
  box-shadow:0 0 0 2px rgba(227,30,36,.2),0 18px 38px rgba(0,0,0,.38),inset 1px 1px 0 rgba(255,255,255,.1);
}
.deal-card.overdue{border-left:3px solid var(--brand-bright)}
.deal-card.attention{border-left:3px solid var(--yellow)}
.card-title{color:#f2f2f2;font-size:12px;font-weight:700}
.card-client{color:#9f9f9f;font-size:11px}
.card-money{color:#fff;font-size:14px}
.tag{
  color:#aaa;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.07);
  border-radius:8px;
}
.tag.country{color:#ffd0d2;background:rgba(227,30,36,.12);border-color:rgba(227,30,36,.22)}
.tag.warning{color:#ffd879;background:rgba(255,194,61,.1);border-color:rgba(255,194,61,.2)}
.card-bottom{border-top-color:rgba(255,255,255,.075)}
.next-action{color:#909090}
.mini-avatar{
  background:linear-gradient(145deg,rgba(227,30,36,.92),rgba(143,18,22,.85));
  color:#fff;
  box-shadow:0 5px 13px rgba(227,30,36,.25),inset 1px 1px 0 rgba(255,255,255,.2);
}
.empty-card{
  border-color:rgba(255,255,255,.13);
  border-radius:12px;
  color:#777;
  background:rgba(255,255,255,.025);
}
.list-page{
  border:1px solid rgba(255,255,255,.11);
  border-radius:18px;
  background:rgba(15,15,18,.52);
  box-shadow:0 18px 48px rgba(0,0,0,.23),inset 1px 1px 0 rgba(255,255,255,.055);
  backdrop-filter:blur(25px) saturate(135%);
  -webkit-backdrop-filter:blur(25px) saturate(135%);
}
.data-table{color:#dcdcdc}
.data-table th{
  height:48px;
  padding:0 15px;
  background:rgba(12,12,15,.78);
  color:#8e8e8e;
  border-bottom-color:rgba(255,255,255,.09);
  text-transform:uppercase;
  letter-spacing:.075em;
  font-size:9px;
}
.data-table td{padding:13px 15px;border-bottom-color:rgba(255,255,255,.07)}
.data-table tr{cursor:pointer}
.data-table tr:hover td{background:rgba(227,30,36,.065)}
.person-cell{color:#f0f0f0}
.person-avatar{
  background:linear-gradient(145deg,#ff4a50,#8f1216);
  box-shadow:0 7px 18px rgba(227,30,36,.25),inset 1px 1px 0 rgba(255,255,255,.23);
}
.status-pill{color:#9ff0bd;background:rgba(61,220,132,.12);border:1px solid rgba(61,220,132,.2)}
.hint{
  bottom:20px;
  left:92px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:11px;
  background:rgba(17,17,21,.76);
  color:#aaa;
  box-shadow:0 14px 34px rgba(0,0,0,.35),inset 1px 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.overlay-root{inset:64px 0 0 72px}
.overlay-shade{
  background:rgba(0,0,0,.6);
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
}
.drawer{
  width:min(940px,calc(100vw - 108px));
  border-left:1px solid rgba(255,255,255,.13);
  background:rgba(12,12,15,.84);
  box-shadow:-28px 0 80px rgba(0,0,0,.56),inset 1px 0 0 rgba(255,255,255,.04);
  backdrop-filter:blur(34px) saturate(145%);
  -webkit-backdrop-filter:blur(34px) saturate(145%);
  transition:transform .28s cubic-bezier(.2,.78,.22,1);
}
.drawer.layer-1{
  right:20px;
  width:min(660px,calc(100vw - 142px));
  top:20px;
  bottom:20px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:22px;
  box-shadow:-28px 0 80px rgba(0,0,0,.68),inset 1px 1px 0 rgba(255,255,255,.08);
}
.drawer-top{
  height:66px;
  padding:0 19px;
  border-bottom-color:rgba(255,255,255,.09);
  background:rgba(18,18,22,.72);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055);
  backdrop-filter:blur(22px);
  -webkit-backdrop-filter:blur(22px);
}
.drawer-close,.drawer-back{
  width:36px;
  height:36px;
  border:1px solid rgba(255,255,255,.11);
  background:rgba(255,255,255,.065);
  color:#ccc;
  transition:background .2s,color .2s,border-color .2s;
}
.drawer-close:hover,.drawer-back:hover{background:rgba(227,30,36,.18);color:#fff;border-color:rgba(227,30,36,.45)}
.drawer-kicker{color:#7f7f7f;letter-spacing:.13em}
.drawer-title{color:#f5f5f5;font-size:17px}
.drawer-body{background:linear-gradient(160deg,rgba(255,255,255,.025),transparent 35%)}
.path{
  height:70px;
  gap:7px;
  padding:13px 17px;
  border-bottom-color:rgba(255,255,255,.08);
  background:rgba(8,8,11,.5);
}
.path-step{
  min-width:112px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:11px!important;
  background:rgba(255,255,255,.045);
  color:#797979;
  text-align:center;
  overflow:hidden;
  text-overflow:ellipsis;
}
.path-step::before,.path-step::after{display:none}
.path-step.done{
  color:#b7e9c9;
  background:rgba(61,220,132,.09);
  border-color:rgba(61,220,132,.24);
}
.path-step.current{
  color:#fff;
  background:linear-gradient(145deg,rgba(227,30,36,.9),rgba(143,18,22,.84));
  border-color:rgba(255,115,120,.42);
  box-shadow:0 8px 22px rgba(227,30,36,.25),inset 1px 1px 0 rgba(255,255,255,.2);
}
.entity-summary{
  padding:20px;
  border-bottom-color:rgba(255,255,255,.08);
  background:rgba(18,18,22,.5);
}
.entity-main h2{color:#f5f5f5;font-size:23px;font-weight:700}
.entity-line{color:#898989}
.entity-value{color:#fff;font-size:24px}
.contact-link{
  width:100%;
  border:1px solid rgba(227,30,36,.28);
  border-radius:14px;
  background:rgba(227,30,36,.075);
  color:#ffd0d2;
  box-shadow:inset 1px 1px 0 rgba(255,255,255,.055);
}
.contact-link:hover{background:rgba(227,30,36,.14);border-color:rgba(227,30,36,.5)}
.next-card{
  border:1px solid rgba(255,194,61,.2);
  border-left:3px solid var(--yellow);
  border-radius:12px;
  background:rgba(255,194,61,.07);
}
.next-card small{color:#8d8d8d}
.next-card strong{color:#f1f1f1}
.drawer-grid{gap:13px;padding:14px}
.panel{
  overflow:hidden;
  border:1px solid rgba(255,255,255,.1);
  border-radius:15px;
  background:rgba(22,22,26,.62);
  box-shadow:0 12px 30px rgba(0,0,0,.17),inset 1px 1px 0 rgba(255,255,255,.045);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
.panel-head{
  height:48px;
  padding:0 15px;
  border-bottom-color:rgba(255,255,255,.075);
  color:#d7d7d7;
  letter-spacing:.06em;
}
.panel-head button{color:#ff7a7f}
.panel.collapsed>:not(.panel-head){display:none}
.field{min-height:62px;padding:11px 15px;border-bottom-color:rgba(255,255,255,.065)}
.field:nth-child(odd){border-right-color:rgba(255,255,255,.065)}
.field label{color:#777}
.field div{color:#d8d8d8;font-size:12px}
.event{border-bottom-color:rgba(255,255,255,.065)}
.event::before{background:var(--brand);box-shadow:0 0 0 4px rgba(227,30,36,.15),0 0 14px rgba(227,30,36,.45)}
.event::after{background:rgba(255,255,255,.11)}
.event-time{color:#6f6f6f}
.event-title{color:#e8e8e8}
.event-text{color:#909090}
.person-hero{
  position:relative;
  overflow:hidden;
  padding:28px;
  background:linear-gradient(135deg,rgba(227,30,36,.42),rgba(27,13,17,.72) 55%,rgba(15,15,18,.78));
  border-bottom:1px solid rgba(255,255,255,.1);
}
.person-hero::after{
  content:"";
  position:absolute;
  width:250px;
  height:250px;
  right:-90px;
  top:-120px;
  border-radius:50%;
  background:rgba(227,30,36,.28);
  filter:blur(45px);
}
.person-hero>*{position:relative;z-index:1}
.person-hero .person-avatar{background:rgba(227,30,36,.88);border:1px solid rgba(255,255,255,.2)}
.person-hero p{color:#c7c7c7}
.release-toast{
  border:1px solid rgba(255,255,255,.12);
  border-radius:13px;
  background:rgba(22,22,26,.86);
  color:#f5f5f5;
  box-shadow:0 18px 48px rgba(0,0,0,.5),inset 1px 1px 0 rgba(255,255,255,.07);
  backdrop-filter:blur(22px);
  -webkit-backdrop-filter:blur(22px);
}
.release-toast::before{background:var(--brand);box-shadow:0 0 0 4px rgba(227,30,36,.16),0 0 14px rgba(227,30,36,.55)}
.install-guide{background:rgba(0,0,0,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.install-guide-card{
  overflow:hidden;
  border:1px solid rgba(255,255,255,.14);
  border-radius:22px;
  background:rgba(20,20,24,.86);
  box-shadow:0 28px 80px rgba(0,0,0,.65),inset 1px 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(28px);
  -webkit-backdrop-filter:blur(28px);
}
.install-guide-card::before{content:"";display:block;height:4px;margin:-22px -22px 20px;background:var(--brand)}
.install-guide-card h2{color:#f5f5f5}
.install-guide-card p,.install-guide-card li{color:#aaa}
.install-guide-card button{
  border-radius:12px;
  background:linear-gradient(115deg,#e31e24,#8f1216 48%,#ff4a50);
  box-shadow:0 9px 24px rgba(227,30,36,.3);
}
.mobile-nav{background:rgba(10,10,13,.84);border-top-color:rgba(255,255,255,.1)}

@media(max-width:900px){
  .brand{min-width:156px;width:190px;padding:0 14px}
  .brand-logo{width:124px}
  .brand-product{display:none}
  .global-search{width:min(390px,49vw)}
  .column{width:260px}
  .drawer{width:calc(100vw - 72px)}
  .drawer.layer-1{width:calc(100vw - 94px)}
}
@media(max-width:820px){
  .list-page{border:0;background:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
  .data-table tr{
    border:1px solid rgba(255,255,255,.11);
    border-radius:15px;
    background:rgba(20,20,24,.68);
    box-shadow:0 13px 30px rgba(0,0,0,.2),inset 1px 1px 0 rgba(255,255,255,.05);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
  }
  .data-table td{border:0;color:#d7d7d7;padding:5px 0 5px 38%;position:relative;min-height:29px}
  .data-table td:first-child{padding-left:0;margin-bottom:5px}
  .data-table td:not(:first-child)::before{color:#707070}
}
@media(max-width:640px){
  body{background:#08090c}
  body::before{background:#000}
  .app{
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:58px minmax(0,1fr) calc(62px + env(safe-area-inset-bottom));
  }
  .workspace{grid-column:1;grid-row:2}
  .global-bar{min-height:58px}
  .brand{flex:0 0 46px;width:46px;min-width:46px;padding:0 5px 0 9px}
  .brand-logo{
    display:none;
  }
  .brand-mobile-icon{display:block;width:34px;height:34px;border-radius:10px}
  .global-search{height:40px;margin-left:4px;padding:0 11px;border-radius:13px}
  .global-search input{font-size:13px}
  .global-tools{padding-right:4px}
  .install-btn{width:40px;height:40px;border-radius:13px}
  .section-head{height:62px;padding:0 11px;gap:10px}
  .section-title{font-size:20px}
  .primary-btn{height:42px;padding:0 14px;border-radius:11px}
  .view-body{padding:10px 8px 0}
  .filter-row{gap:8px;margin-bottom:10px}
  .pipeline-select,.filter-input{height:44px;border-radius:12px}
  .kanban-wrap{margin-right:-8px}
  .column{width:86vw;max-width:306px;border-radius:16px}
  .column-head{height:72px}
  .hint{left:8px;right:8px;bottom:calc(72px + env(safe-area-inset-bottom));text-align:center}
  .overlay-root{inset:calc(58px + env(safe-area-inset-top)) 0 calc(62px + env(safe-area-inset-bottom)) 0}
  .drawer,.drawer.layer-1{width:100%;border:0;border-radius:0}
  .drawer-top{height:62px;padding:0 11px}
  .drawer-title{font-size:15px}
  .path{height:66px;padding:11px 10px}
  .path-step{min-width:104px;padding:9px 10px}
  .entity-summary{padding:15px}
  .entity-main h2{font-size:20px}
  .drawer-grid{padding:8px}
  .panel{border-radius:14px}
  .mobile-nav{
    height:calc(62px + env(safe-area-inset-bottom));
    background:rgba(10,10,13,.88);
    border-top:1px solid rgba(255,255,255,.11);
    box-shadow:0 -14px 38px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.045);
    backdrop-filter:blur(26px) saturate(150%);
    -webkit-backdrop-filter:blur(26px) saturate(150%);
  }
  .mobile-nav a{
    position:relative;
    color:#777;
    font-size:10px;
    font-weight:600;
    letter-spacing:.015em;
  }
  .mobile-nav a::before{
    content:"";
    position:absolute;
    top:7px;
    width:20px;
    height:3px;
    border-radius:3px;
    background:transparent;
    transition:background .2s,box-shadow .2s;
  }
  .mobile-nav a.active{color:#fff}
  .mobile-nav a.active::before{background:var(--brand);box-shadow:0 0 13px rgba(227,30,36,.8)}
  .data-table tr{margin-bottom:9px;padding:11px 13px}
  .data-table td{padding-left:42%}
  .release-toast{bottom:calc(72px + env(safe-area-inset-bottom))}
}
@supports not ((backdrop-filter:blur(2px)) or (-webkit-backdrop-filter:blur(2px))){
  .global-bar,.side-nav,.section-head,.column,.deal-card,.list-page,.drawer,.drawer-top,.panel,.mobile-nav{
    background-color:rgba(15,15,18,.96);
  }
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .deal-card:hover,.primary-btn:hover,.nav-item:hover{transform:none}
}
@media(prefers-contrast:more){
  :root{--glass-border:rgba(255,255,255,.28)}
  .deal-card,.column,.panel,.list-page,.pipeline-select,.filter-input{border-color:rgba(255,255,255,.28)}
  .muted,.card-client,.next-action{color:#c4c4c4}
}

/* Theme tokens and product templates — v0.4 */
:root,
:root[data-theme="dark"]{
  --app-bg:#000;
  --surface:rgba(17,17,20,.68);
  --surface-soft:rgba(255,255,255,.055);
  --surface-hover:rgba(255,255,255,.09);
  --surface-strong:rgba(17,17,20,.91);
  --surface-solid:#151518;
  --header-bg:rgba(5,5,7,.84);
  --nav-bg:rgba(7,7,9,.78);
  --input-bg:rgba(22,22,26,.74);
  --card-bg:rgba(21,21,25,.78);
  --panel-bg:rgba(19,19,23,.72);
  --overlay-bg:rgba(0,0,0,.68);
  --text-1:#f5f5f5;
  --text-2:#c2c2c2;
  --text-3:#8d8d8d;
  --text-4:#6f6f6f;
  --border-1:rgba(255,255,255,.12);
  --border-2:rgba(255,255,255,.2);
  --highlight:rgba(255,255,255,.08);
  --shadow-color:rgba(0,0,0,.5);
  --table-hover:rgba(227,30,36,.065);
  --inactive-bg:rgba(255,255,255,.05);
  --scroll-thumb:rgba(255,255,255,.18);
}
:root[data-theme="light"]{
  --app-bg:#eef1f5;
  --surface:rgba(255,255,255,.7);
  --surface-soft:rgba(20,24,32,.045);
  --surface-hover:rgba(20,24,32,.08);
  --surface-strong:rgba(255,255,255,.94);
  --surface-solid:#fff;
  --header-bg:rgba(248,249,251,.88);
  --nav-bg:rgba(247,248,250,.82);
  --input-bg:rgba(255,255,255,.82);
  --card-bg:rgba(255,255,255,.78);
  --panel-bg:rgba(255,255,255,.8);
  --overlay-bg:rgba(24,28,36,.32);
  --text-1:#17191e;
  --text-2:#363b44;
  --text-3:#5f6672;
  --text-4:#858c97;
  --border-1:rgba(18,22,29,.13);
  --border-2:rgba(18,22,29,.22);
  --highlight:rgba(255,255,255,.8);
  --shadow-color:rgba(48,56,68,.17);
  --table-hover:rgba(227,30,36,.055);
  --inactive-bg:rgba(20,24,32,.045);
  --scroll-thumb:rgba(32,38,48,.24);
  color-scheme:light;
}
html{background:var(--app-bg)}
html,body{color:var(--text-1);background:var(--app-bg)}
body::before{background:var(--app-bg);transform:none}
body::after{display:none}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--scroll-thumb)}
.global-bar{background:var(--header-bg);border-color:var(--border-1)}
.side-nav{background:var(--nav-bg);border-color:var(--border-1)}
.section-head{background:color-mix(in srgb,var(--surface-strong) 72%,transparent);border-color:var(--border-1)}
.workspace{color:var(--text-1)}
.section-title,.card-title,.card-money,.person-cell,.drawer-title,.entity-main h2,.entity-value,.event-title,.field div,.install-guide-card h2{color:var(--text-1)}
.head-tab,.summary-strip,.card-client,.next-action,.drawer-kicker,.entity-line,.event-text,.event-time,.field label,.install-guide-card p,.install-guide-card li{color:var(--text-3)}
.head-tab.active{color:var(--text-1)}
.global-search,.pipeline-select,.filter-input,.segmented,.light-btn,.install-btn,.tool,.user-chip{
  color:var(--text-1);
  background:var(--input-bg);
  border-color:var(--border-1);
  box-shadow:inset 1px 1px 0 var(--highlight),0 8px 24px color-mix(in srgb,var(--shadow-color) 34%,transparent);
}
.global-search input{color:var(--text-1)}
.global-search input::placeholder,.filter-input::placeholder{color:var(--text-4)}
.light-btn:hover,.tool:hover{background:var(--surface-hover);border-color:var(--border-2)}
.pipeline-select option{background:var(--surface-solid);color:var(--text-1)}
.segmented button{color:var(--text-3);background:transparent;border-color:var(--border-1)}
.column{
  background:var(--surface);
  border-color:var(--border-1);
  box-shadow:0 16px 42px color-mix(in srgb,var(--shadow-color) 55%,transparent),inset 1px 1px 0 var(--highlight);
}
.column-head{border-bottom-color:var(--border-1);background:linear-gradient(135deg,var(--surface-hover),var(--surface-soft))!important}
.column-title{color:var(--text-1)}
.column-meta{color:var(--text-3)}
.column-add,.empty-card{color:var(--text-3);background:var(--surface-soft);border-color:var(--border-1)}
.deal-card{
  color:var(--text-1);
  background:var(--card-bg);
  border-color:var(--border-1);
  box-shadow:0 10px 25px color-mix(in srgb,var(--shadow-color) 55%,transparent),inset 1px 1px 0 var(--highlight);
}
.deal-card:hover{background:var(--surface-strong)}
.card-bottom{border-color:var(--border-1)}
.tag{color:var(--text-3);background:var(--surface-soft);border-color:var(--border-1)}
.list-page,.panel{
  background:var(--panel-bg);
  border-color:var(--border-1);
  box-shadow:0 18px 48px color-mix(in srgb,var(--shadow-color) 48%,transparent),inset 1px 1px 0 var(--highlight);
}
.data-table{color:var(--text-2)}
.data-table th{color:var(--text-3);background:var(--surface-strong);border-color:var(--border-1)}
.data-table td{border-color:var(--border-1)}
.data-table tr:hover td{background:var(--table-hover)}
.hint,.release-toast{
  color:var(--text-2);
  background:var(--surface-strong);
  border-color:var(--border-1);
}
.overlay-shade,.feature-overlay{background:var(--overlay-bg)}
.drawer{
  color:var(--text-1);
  background:var(--surface-strong);
  border-color:var(--border-1);
  box-shadow:-28px 0 80px var(--shadow-color),inset 1px 0 0 var(--highlight);
}
.drawer-top,.path,.entity-summary{background:var(--surface);border-color:var(--border-1)}
.drawer-close,.drawer-back{color:var(--text-2);background:var(--surface-soft);border-color:var(--border-1)}
.path-step{color:var(--text-3);background:var(--surface-soft);border-color:var(--border-1)}
.panel-head,.field,.event{border-color:var(--border-1)}
.install-guide-card,.feature-modal{
  color:var(--text-1);
  background:var(--surface-strong);
  border:1px solid var(--border-1);
  box-shadow:0 28px 80px var(--shadow-color),inset 1px 1px 0 var(--highlight);
}
.mobile-nav{background:var(--header-bg);border-color:var(--border-1)}
:root[data-theme="light"] .brand-logo{filter:brightness(0)}
:root[data-theme="light"] .brand-product{color:var(--text-3);border-color:var(--border-1)}
:root[data-theme="light"] .nav-item{color:var(--text-3)}
:root[data-theme="light"] .nav-item:hover{color:var(--text-1)}
:root[data-theme="light"] .person-hero{background:linear-gradient(135deg,rgba(227,30,36,.2),rgba(255,255,255,.84) 62%)}
:root[data-theme="light"] .person-hero p{color:var(--text-2)}
:root[data-theme="light"] .person-hero h2{color:var(--text-1)}

.theme-switcher{
  display:flex;
  height:38px;
  padding:3px;
  border:1px solid var(--border-1);
  border-radius:12px;
  background:var(--input-bg);
  box-shadow:inset 1px 1px 0 var(--highlight);
}
.theme-switcher button{
  width:32px;
  border:0;
  border-radius:9px;
  background:transparent;
  color:var(--text-3);
  cursor:pointer;
}
.theme-switcher button:hover{color:var(--text-1);background:var(--surface-hover)}
.theme-switcher button.active{
  color:#fff;
  background:linear-gradient(145deg,#e31e24,#8f1216);
  box-shadow:0 5px 14px rgba(227,30,36,.28),inset 1px 1px 0 rgba(255,255,255,.2);
}
.card-drag-handle{
  position:absolute;
  top:8px;
  right:8px;
  z-index:2;
  width:28px;
  height:28px;
  border:0;
  border-radius:8px;
  color:var(--text-4);
  background:transparent;
  cursor:grab;
  opacity:0;
  transition:opacity .18s,background .18s,color .18s;
  touch-action:none;
}
.deal-card:hover .card-drag-handle,.deal-card.selected .card-drag-handle,.card-drag-handle:focus{opacity:1}
.card-drag-handle:hover{color:var(--text-1);background:var(--surface-hover)}
.card-drag-handle:active{cursor:grabbing}
.deal-card.dragging,.org-person.dragging,.menu-editor-row.dragging{opacity:.35}
.column-drop-target{border-color:rgba(227,30,36,.72);box-shadow:0 0 0 2px rgba(227,30,36,.18),0 20px 50px var(--shadow-color)}
.card-drop-target{border-top-color:#ff4a50;box-shadow:0 -3px 0 #e31e24,0 14px 30px var(--shadow-color)}
.card-drag-ghost{
  position:fixed;
  inset:auto;
  left:0;
  top:0;
  z-index:500;
  pointer-events:none;
  margin:0;
  opacity:.92;
  transform-origin:top left;
  box-shadow:0 24px 65px rgba(0,0,0,.58),0 0 0 2px rgba(227,30,36,.3);
}
.nav-group{position:relative}
.nav-group-popover{
  display:none;
  position:absolute;
  left:62px;
  top:0;
  z-index:90;
  width:230px;
  padding:10px;
  border:1px solid var(--border-1);
  border-radius:14px;
  background:var(--surface-strong);
  box-shadow:0 22px 60px var(--shadow-color),inset 1px 1px 0 var(--highlight);
  backdrop-filter:blur(24px);
  -webkit-backdrop-filter:blur(24px);
}
.nav-group.open .nav-group-popover,.nav-group:focus-within .nav-group-popover{display:block}
.nav-group-title{padding:5px 8px 9px;color:var(--text-3);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.1em}
.mobile-menu-link{
  min-height:46px;
  display:flex;
  align-items:center;
  gap:11px;
  padding:7px 9px;
  border-radius:10px;
  color:var(--text-2);
}
.mobile-menu-link:hover,.mobile-menu-link.active{color:var(--text-1);background:rgba(227,30,36,.12)}
.mobile-menu-link .nav-icon{flex:none}
.feature-overlay{
  position:fixed;
  inset:0;
  z-index:300;
  display:grid;
  place-items:center;
  padding:20px;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.feature-modal{
  width:min(720px,100%);
  max-height:min(88vh,900px);
  overflow:auto;
  border-radius:22px;
  padding:22px;
}
.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:16px}
.modal-head small{color:var(--text-3);text-transform:uppercase;letter-spacing:.12em}
.modal-head h2{margin:3px 0 0;font-size:23px}
.modal-head>button{
  width:38px;
  height:38px;
  border:1px solid var(--border-1);
  border-radius:11px;
  background:var(--surface-soft);
  color:var(--text-2);
  font-size:20px;
  cursor:pointer;
}
.modal-note{color:var(--text-3);font-size:13px;line-height:1.55}
.modal-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:18px}
.primary-action,.secondary-action{
  min-height:40px;
  border-radius:11px;
  padding:0 16px;
  font-weight:700;
  cursor:pointer;
}
.primary-action{
  border:1px solid rgba(255,120,124,.45);
  color:#fff;
  background:linear-gradient(115deg,#e31e24,#8f1216 55%,#ff4a50);
  box-shadow:0 8px 22px rgba(227,30,36,.26),inset 1px 1px 0 rgba(255,255,255,.2);
}
.secondary-action{
  border:1px solid var(--border-1);
  color:var(--text-2);
  background:var(--surface-soft);
}
.secondary-action:hover{color:var(--text-1);background:var(--surface-hover)}
.secondary-action.full{width:100%;margin-top:14px}
.mobile-menu-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.menu-editor-list{display:flex;flex-direction:column;gap:8px;margin-top:15px}
.menu-editor-row{
  position:relative;
  min-height:54px;
  display:grid;
  grid-template-columns:24px 28px minmax(0,1fr) auto auto;
  align-items:center;
  gap:10px;
  padding:9px 11px;
  border:1px solid var(--border-1);
  border-radius:13px;
  background:var(--surface-soft);
  cursor:grab;
}
.menu-editor-row.is-hidden{opacity:.48}
.menu-editor-row.drop-target{border-color:#e31e24;box-shadow:0 0 0 2px rgba(227,30,36,.16)}
.menu-editor-row>button{
  min-height:32px;
  border:1px solid var(--border-1);
  border-radius:9px;
  background:var(--surface-soft);
  color:var(--text-3);
  cursor:pointer;
}
.menu-editor-row>small{color:var(--text-3)}
.drag-grip{color:var(--text-4);font-size:18px}
.menu-group-children{grid-column:3/-1;display:flex;gap:5px;flex-wrap:wrap}
.menu-group-children span{padding:4px 7px;border-radius:7px;background:var(--surface-soft);color:var(--text-3);font-size:10px}
.group-builder{margin-top:16px;padding:15px;border:1px solid var(--border-1);border-radius:15px;background:var(--surface-soft)}
.group-builder>label,.form-grid label,.scope-settings label{display:flex;flex-direction:column;gap:7px;color:var(--text-2);font-size:12px;font-weight:650}
.group-builder input,.form-grid input,.form-grid select,.scope-settings select{
  width:100%;
  min-height:42px;
  padding:0 12px;
  border:1px solid var(--border-1);
  border-radius:11px;
  background:var(--input-bg);
  color:var(--text-1);
}
.group-builder-items{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.group-builder-items label{display:flex;align-items:center;gap:8px;color:var(--text-2);font-size:12px}
.group-builder-items input{width:16px;min-height:16px;accent-color:#e31e24}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-grid .wide{grid-column:1/-1}
.page-scroll{overflow:auto;padding-bottom:22px}
.feature-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:15px;
  padding:15px 17px;
  border:1px solid var(--border-1);
  border-radius:16px;
  background:var(--surface);
  box-shadow:inset 1px 1px 0 var(--highlight);
}
.feature-toolbar>div{display:flex;flex-direction:column}
.feature-toolbar strong{font-size:17px}
.feature-toolbar span{color:var(--text-3);font-size:12px}
.org-chart{
  display:grid;
  grid-template-columns:repeat(3,minmax(270px,1fr));
  gap:14px;
  align-items:start;
}
.department-card{
  position:relative;
  overflow:hidden;
  border:1px solid var(--border-1);
  border-radius:18px;
  background:var(--panel-bg);
  box-shadow:0 16px 38px color-mix(in srgb,var(--shadow-color) 40%,transparent),inset 1px 1px 0 var(--highlight);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
}
.department-card.root-department{grid-column:1/-1}
.department-line{height:3px;background:linear-gradient(90deg,#e31e24,#ff4a50,#ff7a45)}
.department-head{display:flex;align-items:center;justify-content:space-between;padding:15px 16px;border-bottom:1px solid var(--border-1)}
.department-head small{color:var(--text-4);text-transform:uppercase;letter-spacing:.1em}
.department-head h3{margin:3px 0 0;font-size:17px}
.department-head button,.roles-panel-head button,.topics-head button,.messenger-title button{
  width:34px;
  height:34px;
  border:1px solid var(--border-1);
  border-radius:10px;
  background:var(--surface-soft);
  color:var(--text-2);
  cursor:pointer;
}
.department-leaders{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--border-1)}
.department-leaders>div{position:relative;display:flex;flex-direction:column;padding:12px 14px 12px 25px}
.department-leaders>div+div{border-left:1px solid var(--border-1)}
.department-leaders small{color:var(--text-4);text-transform:uppercase;font-size:8px;letter-spacing:.08em}
.department-leaders strong{font-size:11px;margin-top:3px}
.role-dot{position:absolute;left:11px;top:17px;width:7px;height:7px;border-radius:50%;background:#e31e24;box-shadow:0 0 10px rgba(227,30,36,.65)}
.role-dot.deputy{background:#ff7a45;box-shadow:0 0 10px rgba(255,122,69,.55)}
.department-people{min-height:82px;padding:9px}
.org-person{
  display:flex;
  align-items:center;
  gap:9px;
  padding:8px 9px;
  border:1px solid transparent;
  border-radius:11px;
  cursor:grab;
}
.org-person:hover{border-color:var(--border-1);background:var(--surface-soft)}
.org-person>span:nth-child(2){display:flex;flex:1;min-width:0;flex-direction:column}
.org-person strong{font-size:11px}
.org-person small{color:var(--text-3);font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.org-person .person-avatar{width:31px;height:31px;flex:none}
.department-drop-hint{display:none;padding:15px;text-align:center;color:var(--text-3);font-size:11px}
.department-drop-active{outline:2px dashed #e31e24;outline-offset:-5px;background:rgba(227,30,36,.06)}
.department-drop-active .department-drop-hint{display:block}
.users-grid{display:grid;grid-template-columns:repeat(3,minmax(280px,1fr));gap:13px}
.portal-user-card{
  border:1px solid var(--border-1);
  border-radius:17px;
  background:var(--panel-bg);
  box-shadow:0 14px 34px color-mix(in srgb,var(--shadow-color) 38%,transparent),inset 1px 1px 0 var(--highlight);
  overflow:hidden;
}
.portal-user-main{position:relative;display:flex;align-items:center;gap:11px;padding:15px;border-bottom:1px solid var(--border-1)}
.portal-user-main>span:nth-child(2){display:flex;flex:1;min-width:0;flex-direction:column}
.portal-user-main strong{font-size:13px}
.portal-user-main small{color:var(--text-3);font-size:10px}
.presence{width:9px;height:9px;border-radius:50%;background:#777}
.presence.online{background:#3ddc84;box-shadow:0 0 9px rgba(61,220,132,.65)}
.presence.away{background:#ffc23d}
.portal-user-card dl{margin:0;padding:8px 15px}
.portal-user-card dl>div{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--border-1)}
.portal-user-card dl>div:last-child{border-bottom:0}
.portal-user-card dt{color:var(--text-4);font-size:9px;text-transform:uppercase}
.portal-user-card dd{margin:0;color:var(--text-2);font-size:10px;text-align:right}
.role-pill{padding:4px 7px;border-radius:8px;color:#ffd0d2;background:rgba(227,30,36,.12)}
.card-actions{display:grid;grid-template-columns:1fr 1fr 44px;border-top:1px solid var(--border-1)}
.card-actions button{height:38px;border:0;border-right:1px solid var(--border-1);background:transparent;color:var(--text-3);cursor:pointer}
.card-actions button:hover{color:var(--text-1);background:var(--surface-hover)}
.permissions-layout{flex:1;min-height:0;display:grid;grid-template-columns:260px minmax(0,1fr);gap:13px;padding:14px 16px}
.roles-panel,.permission-editor{
  min-height:0;
  overflow:auto;
  border:1px solid var(--border-1);
  border-radius:17px;
  background:var(--panel-bg);
  box-shadow:inset 1px 1px 0 var(--highlight);
}
.roles-panel-head{height:54px;display:flex;align-items:center;justify-content:space-between;padding:0 13px;border-bottom:1px solid var(--border-1)}
.role-row{
  width:100%;
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 13px;
  border:0;
  border-bottom:1px solid var(--border-1);
  background:transparent;
  color:var(--text-2);
  text-align:left;
  cursor:pointer;
}
.role-row>span:first-child{width:9px;height:9px;border-radius:50%;background:var(--role-color);box-shadow:0 0 8px var(--role-color)}
.role-row>span:nth-child(2){display:flex;flex-direction:column}
.role-row small{color:var(--text-4)}
.role-row:hover,.role-row.active{background:var(--surface-hover);color:var(--text-1)}
.permission-editor{padding:17px}
.permission-title{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.permission-title small{color:var(--text-4);text-transform:uppercase;letter-spacing:.1em}
.permission-title h2{margin:2px 0;font-size:22px}
.permission-title p{margin:0;color:var(--text-3)}
.scope-settings{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:17px 0}
.permission-matrix{overflow:auto;border:1px solid var(--border-1);border-radius:14px}
.permission-row{min-width:760px;display:grid;grid-template-columns:minmax(280px,1fr) repeat(5,88px);align-items:center;border-bottom:1px solid var(--border-1)}
.permission-row:last-child{border-bottom:0}
.permission-row>span:first-child{display:flex;flex-direction:column;padding:12px 14px}
.permission-row strong{font-size:12px}
.permission-row small{color:var(--text-4);font-size:9px}
.permission-header{background:var(--surface-strong);color:var(--text-3);font-size:9px;text-transform:uppercase;letter-spacing:.07em}
.permission-header>span:not(:first-child){text-align:center}
.permission-check{display:grid;place-items:center;height:100%}
.permission-check input{position:absolute;opacity:0}
.permission-check span{width:20px;height:20px;border:1px solid var(--border-2);border-radius:6px;background:var(--surface-soft);cursor:pointer}
.permission-check input:checked+span{border-color:#e31e24;background:#e31e24;box-shadow:inset 0 0 0 4px var(--surface-solid),0 4px 10px rgba(227,30,36,.24)}
.messenger-shell{height:100%;min-height:0;display:grid;grid-template-columns:330px minmax(0,1fr)}
.conversation-panel{min-height:0;display:flex;flex-direction:column;border-right:1px solid var(--border-1);background:var(--nav-bg);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.messenger-title{height:70px;display:flex;align-items:center;justify-content:space-between;padding:0 15px;border-bottom:1px solid var(--border-1)}
.messenger-title small{color:#e31e24;font-weight:800;letter-spacing:.12em}
.messenger-title h1{margin:0;font-size:21px}
.chat-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:10px}
.chat-tabs button{height:37px;border:1px solid var(--border-1);border-radius:10px;background:var(--surface-soft);color:var(--text-3);cursor:pointer}
.chat-tabs button.active{color:#fff;border-color:#e31e24;background:linear-gradient(145deg,#e31e24,#8f1216)}
.chat-search{height:40px;margin:0 10px 9px;display:flex;align-items:center;gap:8px;padding:0 11px;border:1px solid var(--border-1);border-radius:11px;background:var(--input-bg);color:var(--text-4)}
.chat-search input{width:100%;border:0;outline:0;background:transparent;color:var(--text-1)}
.conversation-list{flex:1;min-height:0;overflow:auto;padding:0 8px 10px}
.conversation-row{
  width:100%;
  min-height:68px;
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  padding:9px;
  border:1px solid transparent;
  border-radius:13px;
  background:transparent;
  color:var(--text-2);
  text-align:left;
  cursor:pointer;
}
.conversation-row:hover,.conversation-row.active{border-color:var(--border-1);background:var(--surface-hover)}
.conversation-row.active{box-shadow:inset 3px 0 0 #e31e24}
.chat-avatar{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;color:#fff;font-size:11px;font-weight:800;background:linear-gradient(145deg,#e31e24,#8f1216);box-shadow:0 7px 17px rgba(227,30,36,.25)}
.conversation-row>span:nth-child(2){display:flex;min-width:0;flex-direction:column}
.conversation-row strong{font-size:12px}
.conversation-row small{color:var(--text-4);font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.conversation-meta{display:flex;align-items:flex-end;flex-direction:column;gap:5px}
.conversation-meta b{min-width:18px;height:18px;padding:0 5px;border-radius:9px;display:grid;place-items:center;color:#fff;background:#e31e24;font-size:9px}
.chat-workspace{min-width:0;min-height:0;display:flex;flex-direction:column;background:color-mix(in srgb,var(--app-bg) 84%,transparent)}
.chat-head{height:70px;display:flex;align-items:center;gap:12px;padding:0 17px;border-bottom:1px solid var(--border-1);background:var(--surface)}
.chat-avatar.large{width:44px;height:44px}
.chat-head>div{flex:1;min-width:0}
.chat-head small{color:var(--text-4);text-transform:uppercase;letter-spacing:.08em}
.chat-head h2{margin:0;font-size:16px}
.chat-head p{margin:1px 0 0;color:var(--text-3);font-size:10px}
.chat-head>button{min-height:38px;border:1px solid var(--border-1);border-radius:10px;background:var(--surface-soft);color:var(--text-2);padding:0 13px;cursor:pointer}
.chat-back{display:none}
.community-layout{flex:1;min-height:0;display:grid;grid-template-columns:250px minmax(0,1fr)}
.topics-panel{min-height:0;overflow:auto;border-right:1px solid var(--border-1);background:var(--surface)}
.topics-head{height:50px;display:flex;align-items:center;justify-content:space-between;padding:0 11px;border-bottom:1px solid var(--border-1)}
.topic-row{width:100%;display:grid;grid-template-columns:25px minmax(0,1fr) auto;align-items:center;gap:7px;padding:10px 11px;border:0;border-bottom:1px solid var(--border-1);background:transparent;color:var(--text-2);text-align:left;cursor:pointer}
.topic-row>span:nth-child(2){display:flex;min-width:0;flex-direction:column}
.topic-row strong{font-size:11px}
.topic-row small{color:var(--text-4);font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topic-row b{min-width:18px;height:18px;border-radius:9px;display:grid;place-items:center;background:#e31e24;color:#fff;font-size:8px}
.topic-row:hover,.topic-row.active{background:var(--surface-hover)}
.topic-row.active{color:var(--text-1);box-shadow:inset 3px 0 0 #e31e24}
.topic-chat,.message-area{min-width:0;min-height:0;display:flex;flex:1;flex-direction:column}
.topic-banner{min-height:52px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:8px 16px;border-bottom:1px solid var(--border-1);background:var(--surface-soft)}
.topic-banner>div{display:flex;flex-direction:column}
.topic-banner small{color:var(--text-4);text-transform:uppercase;font-size:8px}
.topic-banner span{color:var(--text-3);font-size:9px}
.message-list{flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:9px;padding:18px;background:var(--app-bg)}
.message-bubble{max-width:min(620px,78%);align-self:flex-start;padding:10px 12px;border:1px solid var(--border-1);border-radius:5px 15px 15px 15px;background:var(--panel-bg);box-shadow:0 8px 22px color-mix(in srgb,var(--shadow-color) 32%,transparent)}
.message-bubble.mine{align-self:flex-end;border-color:rgba(227,30,36,.3);border-radius:15px 5px 15px 15px;background:rgba(227,30,36,.13)}
.message-bubble small{color:var(--text-4);font-size:8px}
.message-bubble p{margin:4px 0 0;color:var(--text-2);font-size:12px;line-height:1.45}
.message-composer{min-height:64px;display:grid;grid-template-columns:40px minmax(0,1fr) 42px;align-items:center;gap:8px;padding:10px 13px;border-top:1px solid var(--border-1);background:var(--surface)}
.message-composer button{height:40px;border:1px solid var(--border-1);border-radius:11px;background:var(--surface-soft);color:var(--text-2);cursor:pointer}
.message-composer .send-message{color:#fff;border-color:#e31e24;background:#e31e24}
.message-composer textarea{width:100%;min-height:40px;max-height:110px;resize:none;padding:9px 12px;border:1px solid var(--border-1);border-radius:12px;background:var(--input-bg);color:var(--text-1)}
.channel-readonly{padding:16px;border-top:1px solid var(--border-1);background:var(--surface);color:var(--text-3);text-align:center;font-size:11px}
.community-settings{display:flex;flex-direction:column;gap:12px}
.community-settings section{padding:14px;border:1px solid var(--border-1);border-radius:14px;background:var(--surface-soft)}
.community-settings h3{margin:0 0 9px;font-size:14px}
.community-settings p{margin:0;color:var(--text-3);font-size:12px;line-height:1.5}
.setting-row,.topic-setting{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:9px 0;border-bottom:1px solid var(--border-1)}
.setting-row:last-child,.topic-setting:last-child{border-bottom:0}
.setting-row>span,.topic-setting>span{display:flex;flex-direction:column}
.setting-row small,.topic-setting small{color:var(--text-4)}
.setting-row input{accent-color:#e31e24}
.topic-setting button{min-height:32px;border:1px solid var(--border-1);border-radius:9px;background:var(--surface-soft);color:var(--text-2);cursor:pointer}
.mobile-nav button{
  border:0;
  background:transparent;
  color:var(--text-3);
  font:inherit;
  cursor:pointer;
}
.mobile-nav button.active{color:var(--text-1)}
.account-summary{display:flex;align-items:center;gap:13px;padding:14px;border:1px solid var(--border-1);border-radius:15px;background:var(--surface-soft)}
.account-summary .person-avatar{width:48px;height:48px}
.account-summary>div{display:flex;flex-direction:column}
.account-summary small{color:var(--text-4)}
.danger-action{color:#ff656a!important;border-color:rgba(227,30,36,.34)!important}

@media(max-width:1100px){
  .org-chart,.users-grid{grid-template-columns:repeat(2,minmax(260px,1fr))}
  .permissions-layout{grid-template-columns:220px minmax(0,1fr)}
  .scope-settings{grid-template-columns:1fr}
  .messenger-shell{grid-template-columns:290px minmax(0,1fr)}
  .community-layout{grid-template-columns:220px minmax(0,1fr)}
}
@media(max-width:820px){
  .org-chart,.users-grid{grid-template-columns:1fr}
  .department-card.root-department{grid-column:auto}
  .permissions-layout{grid-template-columns:1fr;padding:10px}
  .roles-panel{max-height:190px}
  .permission-editor{overflow:visible}
  .messenger-shell{grid-template-columns:245px minmax(0,1fr)}
  .community-layout{grid-template-columns:190px minmax(0,1fr)}
  .theme-switcher{display:none}
}
@media(max-width:640px){
  .global-tools .theme-switcher{display:none}
  .card-drag-handle{opacity:1}
  .mobile-nav{grid-template-columns:repeat(5,minmax(0,1fr))}
  .mobile-nav button,.mobile-nav a{min-width:0}
  .feature-overlay{padding:0;align-items:end}
  .feature-modal{width:100%;max-height:91dvh;border-radius:22px 22px 0 0;padding:18px}
  .mobile-menu-grid{grid-template-columns:1fr 1fr}
  .menu-editor-row{grid-template-columns:22px 27px minmax(0,1fr) auto;padding:8px}
  .menu-editor-row>button:first-of-type{grid-column:4}
  .menu-editor-group>button{font-size:9px;padding:0 6px}
  .menu-group-children{grid-column:3/-1}
  .group-builder-items,.form-grid{grid-template-columns:1fr}
  .form-grid .wide{grid-column:auto}
  .feature-toolbar{align-items:flex-start;flex-direction:column}
  .feature-toolbar .secondary-action{width:100%}
  .department-leaders{grid-template-columns:1fr}
  .department-leaders>div+div{border-left:0;border-top:1px solid var(--border-1)}
  .permissions-layout{display:block;overflow:auto}
  .roles-panel{display:flex;max-height:none;overflow-x:auto;margin-bottom:10px}
  .roles-panel-head{display:none}
  .role-row{min-width:190px;border-right:1px solid var(--border-1)}
  .permission-editor{padding:12px}
  .permission-title{flex-direction:column}
  .permission-title>div:last-child{display:flex;width:100%;gap:8px}
  .permission-title button{flex:1}
  .messenger-shell{display:block;overflow:auto}
  .conversation-panel{min-height:calc(100dvh - 120px);border-right:0}
  .chat-workspace{display:none}
  body[data-view="messenger"].chat-open .conversation-panel{display:none}
  body[data-view="messenger"].chat-open .chat-workspace{display:flex;min-height:calc(100dvh - 120px)}
  .community-layout{grid-template-columns:145px minmax(0,1fr)}
  .chat-head{padding:0 10px}
  .chat-back{display:grid;place-items:center;width:36px;padding:0;font-size:24px;line-height:1}
  .chat-head-action{font-size:0;width:40px;padding:0}
  .chat-head-action::after{content:"⚙";font-size:15px}
  .message-bubble{max-width:88%}
}
