/* @yourmail.com Enterprise Server — ZEELIN Webmail. All fonts/images local. */
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("../assets/fonts/inter-400.woff2") format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("../assets/fonts/inter-500.woff2") format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("../assets/fonts/inter-600.woff2") format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:700;font-display:swap;src:url("../assets/fonts/inter-700.woff2") format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:800;font-display:swap;src:url("../assets/fonts/inter-800.woff2") format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:900;font-display:swap;src:url("../assets/fonts/inter-900.woff2") format("woff2")}
:root{
  --nav:#0a326c;
  --nav2:#0f4e9b;
  --blue:#1565d8;
  --blue2:#2f7ee8;
  --blue-soft:#edf4ff;
  --gold:#ecb543;
  --gold-soft:#fff8e5;
  --green:#1f9a69;
  --red:#db4b58;
  --ink:#172338;
  --text:#475469;
  --muted:#8893a5;
  --line:#e4e9f1;
  --bg:#f4f7fb;
  --card:#ffffff;
  --soft:#f8fafc;
  --shadow:0 14px 34px rgba(23,35,56,.08);
  --sidebar:250px;
  --rail:78px;
  --radius:18px;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:"Inter",system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--text)}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
button:disabled{cursor:not-allowed}
svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
a{text-decoration:none;color:inherit}

/* generic */
.hidden{display:none !important}
.screen{display:none;min-height:100vh}
.screen.active{display:block}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.section-title{font-size:20px;font-weight:800;color:var(--ink);margin:0 0 6px}
.section-sub{font-size:11px;color:var(--muted);margin:0}
.pill{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:var(--blue-soft);color:var(--blue);font-weight:800;font-size:10px}

/* login */
.login-shell{min-height:100vh;display:grid;grid-template-columns:46% 54%;background:#fff}
.login-left{padding:36px 48px 40px 70px;display:flex;flex-direction:column}
.login-brand{display:flex;align-items:center;gap:12px;padding-top:8px}
.login-brand-mark{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,var(--nav),var(--blue2));display:grid;place-items:center;color:#fff;font-weight:900;font-size:18px;box-shadow:0 10px 24px rgba(10,50,108,.18)}
.login-brand-copy b{display:block;font-size:19px;color:var(--ink);letter-spacing:-.4px}
.login-brand-copy span{display:block;font-size:11px;color:var(--muted);font-weight:700}
.login-form-wrap{max-width:430px;margin:auto 0;padding-top:20px}
.login-form-wrap .headline{font-size:46px;font-weight:900;letter-spacing:-1.6px;color:var(--ink);margin:0 0 8px;line-height:1.04}
.login-form-wrap .headline span{color:var(--blue)}
.login-form-wrap .intro{font-size:14px;line-height:1.7;color:#6b778d;margin:0 0 26px}
.form-block{margin-bottom:17px}
.form-label{display:block;margin-bottom:9px;font-size:13px;font-weight:700;color:#414d63}
.field{height:48px;border:1.6px solid #cad3df;border-radius:14px;display:flex;align-items:center;padding:0 14px;background:#fff;transition:.18s ease}
.field:focus-within{border-color:var(--blue);box-shadow:0 0 0 3px rgba(21,101,216,.08)}
.field input{border:0;outline:0;background:transparent;width:100%;font-size:13px;color:var(--ink)}
.field.invalid{border-color:#ea5d70}
.inline-row{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:4px 0 18px}
.remember{display:flex;align-items:center;gap:8px;font-size:12px;color:#5a677c;font-weight:600}
.remember input{accent-color:var(--blue)}
.link-btn{border:0;background:transparent;padding:0;color:#384a66;font-size:13px;font-weight:700;text-decoration:underline}
.primary-btn{width:100%;height:50px;border:0;border-radius:14px;background:linear-gradient(135deg,var(--blue),var(--blue2));color:#fff;font-size:14px;font-weight:800;box-shadow:0 14px 28px rgba(21,101,216,.22);transition:.18s ease}
.primary-btn:hover{transform:translateY(-1px)}
.secondary-btn{width:100%;height:48px;border:1px solid var(--line);border-radius:14px;background:#fff;color:#445166;font-size:13px;font-weight:800}
.support-strip{margin-top:24px;display:flex;gap:10px;flex-wrap:wrap}
.support-chip{font-size:11px;font-weight:700;color:#647086;background:#f4f7fb;border:1px solid var(--line);padding:8px 11px;border-radius:999px}
.form-note{margin-top:16px;font-size:12px;color:#7b8798}
.error-text{display:none;margin-top:8px;font-size:12px;color:var(--red);font-weight:700}
.error-text.show{display:block}
.login-right{position:relative;min-height:100vh;overflow:hidden;background:#eef3f8}
.login-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.login-photo-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.22),rgba(255,255,255,.03) 48%,rgba(10,33,67,.12)),linear-gradient(180deg,rgba(255,255,255,.04),rgba(10,33,67,.14))}
.login-caption{position:absolute;left:5%;bottom:6%;max-width:340px;padding:18px;background:rgba(255,255,255,.94);border:1px solid rgba(255,255,255,.95);border-radius:18px;box-shadow:0 20px 45px rgba(18,37,67,.14)}
.login-caption b{display:block;font-size:15px;color:var(--ink);margin-bottom:7px}
.login-caption p{margin:0;font-size:12px;line-height:1.65;color:#687487}

/* forgot password */
.centered-shell{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at top left, rgba(21,101,216,.08), transparent 24%),radial-gradient(circle at bottom right, rgba(236,181,67,.09), transparent 22%),var(--bg)}
.center-panel{width:min(560px,100%);padding:28px}
.center-panel-top{display:flex;align-items:center;gap:12px;margin-bottom:18px}
.panel-icon{width:48px;height:48px;border-radius:16px;background:var(--blue-soft);display:grid;place-items:center;color:var(--blue)}
.center-panel h2{margin:0;font-size:28px;color:var(--ink);letter-spacing:-.8px}
.center-panel p{margin:10px 0 0;font-size:13px;line-height:1.75;color:#6f7b8d}
.message-box{margin-top:14px;padding:14px;border-radius:12px;font-size:12px;font-weight:700}
.message-box.success{background:#eaf8f1;color:#196d4b;border:1px solid #bfe6d2}

/* app */
.app-shell{min-height:100vh;display:grid;grid-template-columns:var(--rail) minmax(0,1fr)}
.rail{background:linear-gradient(180deg,var(--nav),#08295a);padding:14px 10px;display:flex;flex-direction:column;align-items:center;gap:9px;position:sticky;top:0;height:100vh;z-index:10}
.logo{width:50px;height:50px;border-radius:16px;background:#fff;color:var(--nav);display:grid;place-items:center;font-size:20px;font-weight:900;box-shadow:0 10px 25px rgba(0,0,0,.16);margin-bottom:8px}
.logo-img{padding:7px}
.logo-img img{width:100%;height:100%;object-fit:contain}
.rail-btn{width:48px;height:48px;border:0;border-radius:15px;background:transparent;color:#c7d7ef;display:grid;place-items:center;position:relative;transition:.16s}
.rail-btn:hover,.rail-btn.active{background:rgba(255,255,255,.12);color:#fff}
.rail-btn.active:before{content:"";position:absolute;left:-10px;width:4px;height:22px;border-radius:0 5px 5px 0;background:var(--gold)}
.rail-spacer{flex:1}
.status-dot{position:absolute;top:7px;right:7px;width:9px;height:9px;border-radius:50%;background:#49cd8c;border:2px solid var(--nav)}
.sidebar{background:#fff;border-right:1px solid var(--line);padding:0;position:fixed;top:0;bottom:0;width:var(--sidebar);overflow-y:auto;overflow-x:hidden;z-index:30}
.sidebar-inner{padding:18px 14px 22px;height:100%;overflow-y:auto;overflow-x:hidden}
.sidebar-head{padding:4px 10px 16px;position:sticky;top:0;background:#fff;border-bottom:1px solid var(--line);z-index:10}
.compose{width:100%;height:50px;border:0;border-radius:15px;background:linear-gradient(135deg,var(--blue),var(--blue2));color:#fff;display:flex;align-items:center;justify-content:center;gap:9px;font-size:14px;font-weight:800;box-shadow:0 14px 28px rgba(21,101,216,.20);transition:.16s;margin:0 0 16px;position:sticky;top:60px;z-index:10}
.sidebar-head{padding:4px 10px 16px}
.sidebar-head h1{margin:0;font-size:18px;color:var(--ink);letter-spacing:-.5px}
.sidebar-head p{margin:5px 0 0;font-size:10px;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.9px}
.compose{width:100%;height:50px;border:0;border-radius:15px;background:linear-gradient(135deg,var(--blue),var(--blue2));color:#fff;display:flex;align-items:center;justify-content:center;gap:9px;font-size:14px;font-weight:800;box-shadow:0 14px 28px rgba(21,101,216,.20);transition:.16s;margin-bottom:16px}
.compose:hover{transform:translateY(-1px)}
.nav-title{padding:11px 11px 7px;font-size:10px;color:#9ca5b6;text-transform:uppercase;font-weight:800;letter-spacing:1px}
.nav{display:flex;flex-direction:column;gap:3px}
.nav-item{width:100%;min-height:43px;border:0;background:transparent;text-align:left;padding:0 12px;border-radius:12px;display:flex;align-items:center;gap:11px;font-size:12px;font-weight:700;color:#5a677c;transition:.14s}
.nav-item:hover,.nav-item.active{background:var(--blue-soft);color:var(--blue)}
.badge{margin-left:auto;min-width:24px;height:21px;border-radius:8px;background:#eef3f8;color:#627089;font-size:10px;padding:0 7px;display:grid;place-items:center;font-weight:800}
.badge.hot{background:var(--blue);color:#fff}
.nav-item.active .badge{background:#fff}
.nav-item.active .badge.hot{background:var(--blue);color:#fff}
.label-dot{width:8px;height:8px;border-radius:50%;flex:none}
.storage{margin-top:18px;padding:14px;border-radius:16px;border:1px solid var(--line);background:var(--soft)}
.storage-row{display:flex;justify-content:space-between;font-size:10px;font-weight:800}
.storage-bar{height:7px;border-radius:999px;background:#e7edf5;margin:9px 0 6px;overflow:hidden}
.storage-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--blue),#62a2ef)}
.storage small{font-size:9px;color:var(--muted)}
.main{min-width:0;display:flex;flex-direction:column}
.topbar{height:78px;padding:13px 18px;position:sticky;top:0;z-index:8;background:rgba(244,247,251,.95);backdrop-filter:blur(10px)}
.topbar-inner{height:100%;border:1px solid var(--line);border-radius:17px;background:#fff;display:flex;align-items:center;padding:0 11px 0 18px;box-shadow:0 4px 18px rgba(20,40,70,.03)}
.page-title{min-width:190px}
.page-title strong{display:block;font-size:15px;color:var(--ink)}
.page-title span{font-size:9px;color:var(--muted)}
.search{flex:1;max-width:660px;height:42px;border:1px solid #edf0f5;border-radius:13px;background:#f5f7fa;display:flex;align-items:center;gap:9px;padding:0 13px;margin:0 auto}
.search input{border:0;outline:0;background:transparent;width:100%;font-size:11px;color:var(--ink)}
.top-actions{display:flex;align-items:center;gap:5px;margin-left:14px}
.icon-btn{width:40px;height:40px;border:0;border-radius:12px;background:transparent;color:#657388;display:grid;place-items:center;transition:.15s}
.icon-btn:hover{background:#f3f6f9;color:var(--blue)}
.top-actions{position:relative}
.avatar-btn{height:42px;border:0;background:transparent;padding:4px 8px 4px 4px;border-radius:13px;display:flex;align-items:center;gap:8px}
.avatar-btn:hover{background:#f5f7fa}
.avatar{width:34px;height:34px;border-radius:11px;background:linear-gradient(135deg,#173e78,#62a1ef);display:grid;place-items:center;color:#fff;font-size:11px;font-weight:900;position:relative;overflow:hidden}
.avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.avatar-copy{text-align:left}
.avatar-copy b{display:block;font-size:10px;color:var(--ink)}
.avatar-copy span{font-size:8px;color:var(--green);font-weight:800}
.account-menu{position:absolute;right:0;top:50px;width:210px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:6px;z-index:30}
.account-menu button{width:100%;border:0;background:transparent;color:var(--ink);text-align:left;padding:10px 11px;border-radius:9px;font-size:12px;font-weight:750;cursor:pointer}
.account-menu button:hover{background:#f5f7fa}
.account-menu button.danger{color:var(--red)}
.sess-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--green);margin-right:3px}
.content{padding:0 18px 18px;flex:1}
.page{display:none}
.page.active{display:block}

/* dashboard home */
.dashboard-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:14px}
.hero-card{grid-column:span 8;min-height:226px;padding:26px;overflow:hidden;position:relative;border-radius:20px;color:#fff;background:linear-gradient(120deg,#0b3b7f,#1968cb);border:0}
.hero-card:after{content:"";position:absolute;width:320px;height:320px;border-radius:50%;right:-100px;top:-100px;background:rgba(255,255,255,.08)}
.hero-card h2{margin:0 0 10px;font-size:29px;line-height:1.1;letter-spacing:-1px;max-width:640px;color:#fff}
.hero-card p{margin:0;max-width:620px;font-size:12px;line-height:1.8;color:#dbe9fb}
.hero-actions{display:flex;gap:9px;margin-top:22px}
.hero-btn{height:38px;border-radius:11px;border:0;padding:0 15px;font-size:10px;font-weight:900}
.hero-btn.light{background:#fff;color:var(--nav)}
.hero-btn.gold{background:var(--gold);color:#4a3400}
.summary-card{grid-column:span 4;padding:18px}
.stat-card{padding:18px}
.metric{grid-column:span 3}
.grid-panel{padding:18px}
.grid-8{grid-column:span 8}
.grid-4{grid-column:span 4}
.stat-top{display:flex;justify-content:space-between;align-items:center}
.stat-top b{font-size:11px;color:var(--ink)}
.stat-ic{color:var(--blue);display:grid;place-items:center}
.stat-ic svg{width:17px;height:17px}
.big-number{font-size:29px;color:var(--ink);font-weight:900;margin:16px 0 6px}
.meta-text{font-size:8px;color:var(--muted)}
.chart{height:170px;display:flex;align-items:end;gap:10px;padding:16px 6px 2px}
.bar{flex:1;background:linear-gradient(180deg,#4c8ae1,#dceafe);border-radius:8px 8px 3px 3px;min-height:18px}
.table{width:100%;border-collapse:collapse;margin-top:10px}
.table th,.table td{text-align:left;padding:11px 8px;border-bottom:1px solid #edf0f4}
.table th{font-size:8px;color:#8c97a8;text-transform:uppercase}
.table td{font-size:9px;color:#5a677b}
.table td b{color:#2d3b52}
.task{display:flex;gap:10px;padding:11px 0;border-bottom:1px solid #edf0f4;align-items:flex-start}
.task:last-child{border-bottom:0}
.check{width:18px;height:18px;border-radius:6px;border:1.5px solid #cfd7e4;flex:none;background:#fff;padding:0}
.check.done{background:var(--green);border-color:var(--green);color:#fff;display:grid;place-items:center}
.check.done svg{width:11px;height:11px;stroke-width:3}
.task b{display:block;font-size:9px;color:#35435a}
.task span{font-size:8px;color:#8c97aa}
.task .row-del{margin-left:auto}

/* mail page */
.mail-layout{display:grid;grid-template-columns:390px minmax(0,1fr) 280px;gap:14px;min-height:calc(100vh - 96px)}
.mail-layout.pane-bottom{grid-template-columns:minmax(0,1fr) 280px;align-items:start}
.mail-layout.pane-bottom>.panel:first-child{grid-column:1;grid-row:1}
.mail-layout.pane-bottom>.reader{grid-column:1;grid-row:2;min-height:360px}
.mail-layout.pane-bottom>.side-widgets{grid-column:2;grid-row:1 / span 2}
.mail-layout.pane-off{grid-template-columns:minmax(0,1fr) 280px}
.mail-layout.pane-off>.reader{display:none}
.mail-layout.pane-off.has-selection>.panel:first-child{display:none}
.mail-layout.pane-off.has-selection>.reader{display:flex;grid-column:1 / -1}
.mail-layout.pane-off.has-selection>.side-widgets{display:none}
.panel{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow);overflow:hidden}
.list-head{padding:18px 16px 12px;border-bottom:1px solid var(--line)}
.list-head-row{display:flex;justify-content:space-between;align-items:center}
.list-head h2{margin:0;font-size:18px;color:var(--ink)}
.list-head small{font-size:9px;color:var(--muted)}
.list-tools{display:flex;gap:6px;align-items:center;margin-top:10px}
.list-tools select{border:1px solid var(--line);border-radius:9px;height:32px;font-size:10px;background:#fff;color:var(--text)}
.tabs{display:flex;gap:4px;background:#f3f6f9;padding:4px;border-radius:11px;margin-top:14px}
.tab{flex:1;height:32px;border:0;background:transparent;border-radius:8px;font-size:9px;font-weight:800;color:#788396}
.tab.active{background:#fff;color:var(--blue);box-shadow:0 3px 10px rgba(30,50,80,.06)}
.msg-list{overflow:auto;max-height:calc(100vh - 330px);min-height:200px}
.mail-actionbar{height:36px;display:flex;align-items:center;gap:7px;margin-top:10px}
.mail-actionbar #mailSelectedCount{font-size:9px;color:var(--muted);font-weight:850}
.mail-action-tools{display:flex;gap:5px;align-items:center}
.mail-action-tools[hidden]{display:none}
.mail-select-all span,.mail-check-wrap span{width:16px;height:16px;border:1.5px solid #b8c4d4;border-radius:4px;background:#fff;display:block;position:relative}
.mail-select-all.active span,.mail-check-wrap input:checked+span{border-color:var(--blue);background:var(--blue)}
.mail-select-all.active span:after,.mail-check-wrap input:checked+span:after{content:"";position:absolute;left:4px;top:1px;width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.mail-item{width:100%;text-align:left;padding:12px 14px;border:0;border-bottom:1px solid #edf0f4;background:#fff;display:grid;grid-template-columns:26px 38px minmax(0,1fr) auto;gap:10px;position:relative;cursor:pointer;transition:.14s;min-height:72px;align-items:center}
.mail-layout.density-compact .mail-item{min-height:58px;padding:8px 12px;gap:8px}
.mail-layout.density-compact .sender-avatar{width:32px;height:32px;border-radius:10px;font-size:9px}
.mail-layout.density-compact .subject,.mail-layout.density-compact .preview{margin-top:2px}
.mail-item:hover{background:#f8faff}
.mail-item.active,.mail-item.checked{background:#edf4ff}
.mail-item.active:before{content:"";position:absolute;left:0;top:11px;bottom:11px;width:4px;background:var(--blue);border-radius:0 6px 6px 0}
.sender-avatar{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;font-size:10px;font-weight:900;flex:none;position:relative;overflow:hidden}
.mail-check-wrap{width:22px;height:22px;display:grid;place-items:center;opacity:0;pointer-events:none;transition:.12s}
.mail-check-wrap input{position:absolute;opacity:0}
.mail-item:hover .mail-check-wrap,.mail-item.checked .mail-check-wrap,.mail-selecting .mail-check-wrap{opacity:1;pointer-events:auto}
.mail-item:hover .mail-check-wrap+ .sender-avatar,.mail-selecting .mail-check-wrap+ .sender-avatar,.mail-item.checked .mail-check-wrap+ .sender-avatar{opacity:.18}
.sender-avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.a1{background:#e8f2ff;color:#1e64c4}
.a2{background:#eaf8f1;color:#16815a}
.a3{background:#fff3d8;color:#9d6700}
.a4{background:#efebff;color:#6d55c5}
.a5{background:#ffebed;color:#b6404c}
.sender{font-size:10px;font-weight:850;color:var(--ink);display:flex;align-items:center;gap:6px}
.sender .nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.unread{width:6px;height:6px;border-radius:50%;background:var(--blue);flex:none}
.subject{margin-top:4px;font-size:10px;color:#445168;font-weight:720;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mail-item.is-unread .sender,.mail-item.is-unread .subject{font-weight:900}
.preview{margin-top:4px;font-size:9px;color:#8a95a6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mail-layout.snippets-off .preview{display:none}
.meta{font-size:8px;color:#8a95a6;text-align:right}
.star-btn{border:0;background:transparent;padding:0;margin-top:8px;color:#c6ceda;display:grid;place-items:center}
.mail-hover-actions{display:none;gap:4px;justify-content:flex-end;margin-top:8px}
.mail-hover-actions .mini{width:28px;height:28px}
.mail-layout.hover-actions-on .mail-item:hover .mail-hover-actions{display:flex}
.mail-layout.hover-actions-on .mail-item:hover .meta .mail-date{display:none}
.mail-layout.hover-actions-off .mail-hover-actions{display:none}
.star-btn svg{width:15px;height:15px}
.star-btn.on{color:#e8aa24}
.star-btn.on svg{fill:#e8aa24}
.pager{display:flex;align-items:center;gap:8px;padding:10px 14px;border-top:1px solid var(--line);font-size:10px;color:var(--muted)}
.reader{display:flex;flex-direction:column;min-height:400px}
.reader-tools{height:56px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:0 16px}
.tool-row{display:flex;gap:5px}
.mini{width:34px;height:34px;border:0;border-radius:10px;background:#f6f8fb;color:#68758a;display:grid;place-items:center}
.mini:hover{background:var(--blue-soft);color:var(--blue)}
.mini svg{width:16px;height:16px}
.message-head{padding:24px 28px 18px;border-bottom:1px solid var(--line)}
.message-head h2{margin:0;font-size:22px;line-height:1.25;color:var(--ink);letter-spacing:-.6px}
.from-row{display:flex;align-items:center;margin-top:20px}
.from-copy{margin-left:10px;min-width:0}
.from-copy b{display:block;font-size:10px;color:var(--ink)}
.from-copy span{font-size:8px;color:var(--muted)}
.date{margin-left:auto;text-align:right;font-size:8px;color:var(--muted);flex:none}
.body{padding:28px;overflow:auto}
.body-inner{max-width:760px;margin:auto}
.body-inner p{margin:0 0 16px;font-size:12px;line-height:1.75;color:#4a5669}
.body-inner iframe{width:100%;min-height:420px;border:1px solid var(--line);border-radius:12px;background:#fff}
.info-card{margin:20px 0;padding:16px;border-radius:14px;background:#f7faff;border:1px solid #dce8f8}
.info-grid{margin-top:10px;display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.info-box{padding:12px;border-radius:10px;background:#fff;border:1px solid var(--line)}
.info-box small{display:block;font-size:7px;color:#929cad;text-transform:uppercase;font-weight:900}
.info-box b{font-size:10px;color:#26364d}
.attach{display:flex;align-items:center;margin-top:12px;padding:12px;border-radius:13px;border:1px solid var(--line);background:#fbfcfe}
.file-icon{width:38px;height:38px;border-radius:10px;background:#eaf2ff;color:var(--blue);display:grid;place-items:center;flex:none}
.file-copy{margin-left:10px;min-width:0}
.file-copy b{display:block;font-size:9px;color:#26354c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.file-copy span{font-size:8px;color:#98a2b3}
.reader-footer{padding:13px 18px;border-top:1px solid var(--line);display:flex;gap:7px;flex-wrap:wrap}
.action{height:36px;padding:0 14px;border:1px solid var(--line);border-radius:10px;background:#fff;color:#4f5b70;font-size:9px;font-weight:800}
.action.primary{background:var(--blue);border-color:var(--blue);color:#fff}
.side-widgets{display:flex;flex-direction:column;gap:14px}
.widget{padding:16px}
.widget h3{margin:0 0 13px;font-size:12px;color:var(--ink)}
.schedule{display:flex;gap:10px;padding:10px 0;border-top:1px solid #eef1f5}
.schedule:first-of-type{border-top:0}
.time{width:44px;font-size:8px;color:var(--blue);font-weight:900;flex:none}
.event b{display:block;font-size:9px;color:#334158}
.event span{font-size:8px;color:#8b96a8}
.quick-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.quick{padding:11px;border-radius:12px;border:1px solid var(--line);background:#fbfcfe;text-align:left;color:var(--text)}
.quick svg{color:var(--blue)}
.quick strong{display:block;margin-top:7px;font-size:9px;color:#344158}
.quick span{font-size:8px;color:#95a0b0}
.secure{background:linear-gradient(135deg,#0f468e,#185db8);color:#fff;border:0}
.secure h3,.secure p{color:#fff}
.secure p{font-size:9px;line-height:1.55;opacity:.86}
.security-row{display:flex;justify-content:space-between;font-size:8px;margin-top:10px}
.ok{color:#a5f2cf;font-weight:900}

/* generic pages */
.page-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:14px}
.header-card{grid-column:span 12;padding:22px 22px 20px}
.header-flex{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}
.header-actions{display:flex;gap:8px;flex-wrap:wrap}
.small-btn{height:38px;border-radius:11px;border:1px solid var(--line);background:#fff;color:#445166;padding:0 14px;font-size:11px;font-weight:800;display:inline-flex;align-items:center;gap:7px}
.small-btn:hover{background:#f5f7fa}
.small-btn.primary{background:var(--blue);border-color:var(--blue);color:#fff}
.small-btn.primary:hover{background:var(--nav2)}
.small-btn.danger{color:var(--red);border-color:#f0c4c6}
.small-btn svg{width:15px;height:15px}
#teamNotify[hidden]{display:none}
.info-stat{grid-column:span 3;padding:18px}
.large-module{grid-column:span 8;padding:18px}
.side-module{grid-column:span 4;padding:18px}
.contact-row,.message-row,.device-row,.file-row{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid #edf0f4;align-items:center}
.contact-row:last-child,.message-row:last-child,.device-row:last-child,.file-row:last-child{border-bottom:0}
.person{display:flex;gap:10px;align-items:center;min-width:0}
.person-copy{min-width:0}
.person-copy b{display:block;font-size:10px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.person-copy span{display:block;font-size:8px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row-actions{display:flex;gap:6px;flex:none}
.tag{display:inline-flex;align-items:center;padding:6px 9px;border-radius:999px;background:#f2f5f9;color:#667386;font-size:8px;font-weight:800;white-space:nowrap}
.tag.good{background:#eaf8f1;color:#196d4b}
.tag.bad{background:#fdecec;color:#b4232a}
.tag.blue{background:var(--blue-soft);color:var(--blue)}
.muted-note{font-size:10px;color:var(--muted);line-height:1.7}
.placeholder-box{border:1px dashed #cad5e2;border-radius:14px;background:#fbfcfe;padding:24px;text-align:center}
.placeholder-box h3{margin:0 0 8px;font-size:17px;color:var(--ink)}
.placeholder-box p{margin:0 auto;max-width:530px;font-size:12px;line-height:1.8;color:#738095}
.switch{width:44px;height:24px;border-radius:999px;background:#cfd8e3;position:relative;flex:none;border:0;padding:0}
.switch.on{background:#1f9a69}
.switch:after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:.15s}
.switch.on:after{left:23px}
.settings-section-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:16px}.settings-section-head h3{margin:0 0 4px;font-size:15px;color:var(--ink)}.settings-section-head p{margin:0;color:var(--muted);font-size:11px;line-height:1.5}.settings-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 14px}.settings-form-grid .form-block{margin-bottom:10px}.settings-form-grid select{width:100%;border:0;outline:0;background:transparent;font-size:12px;color:var(--ink)}.settings-preview{border-top:1px solid #edf0f4;padding-top:11px;color:var(--muted);font-size:11px}@media(max-width:700px){.settings-form-grid{grid-template-columns:1fr}.settings-section-head{display:block}.settings-section-head .tag{display:inline-block;margin-top:8px}}
.toast{position:fixed;top:92px;right:24px;padding:12px 16px;border-radius:12px;background:#17355f;color:#fff;font-size:10px;font-weight:800;box-shadow:0 12px 30px rgba(0,0,0,.15);opacity:0;pointer-events:none;transform:translateY(-7px);transition:.2s;z-index:90;max-width:min(380px,90vw)}
.toast.show{opacity:1;transform:none}
.toast.good{background:#196d4b}
.toast.bad{background:#a63d48}

/* AI launcher pulse (motion, respects reduced-motion) */
#topAiBtn{position:relative}
#topAiBtn:after{content:"";position:absolute;inset:-3px;border-radius:12px;border:2px solid var(--blue);opacity:.55;animation:aiPulse 2.4s ease-out infinite;pointer-events:none}
@keyframes aiPulse{0%{transform:scale(.85);opacity:.7}70%{transform:scale(1.12);opacity:0}100%{transform:scale(1.12);opacity:0}}
@media (prefers-reduced-motion: reduce){#topAiBtn:after{animation:none;display:none}}

/* GiGo chat: bubbles, typing indicator, suggestion chips, action cards */
.ai-orb{width:26px;height:26px;flex:none;border-radius:50%;background:conic-gradient(from 40deg,#2f7ee8,#8a5cf0,#1f9a69,#ecb543,#2f7ee8)}
.ai-orb.sm{width:20px;height:20px}
.ai-orb.xs{width:22px;height:22px;margin-top:2px}
#aiFloatBtn .ai-orb{width:20px;height:20px;animation:aiSpin 7s linear infinite}
@keyframes aiSpin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion: reduce){#aiFloatBtn .ai-orb{animation:none}}
.ai-panel-head{display:flex;gap:10px;align-items:center;padding:14px 14px 10px}
.ai-thread{display:flex;flex-direction:column;gap:10px;max-height:44vh;overflow:auto;padding:4px 2px;margin-bottom:10px}
.ai-msg{display:flex;gap:8px;align-items:flex-start}
.ai-msg.user{justify-content:flex-end}
.ai-bubble{max-width:88%;padding:10px 13px;border-radius:14px;font-size:13px;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere}
.ai-bubble.user{background:var(--blue);color:#fff;border-bottom-right-radius:5px}
.ai-bubble.gigo{background:var(--soft);color:var(--ink);border:1px solid var(--line);border-bottom-left-radius:5px}
.ai-bubble.ai-error{border-color:var(--red);color:var(--red)}
.ai-typing{display:inline-flex;gap:4px;padding:4px 2px}
.ai-typing i{width:7px;height:7px;border-radius:50%;background:var(--muted);animation:aiBlink 1.2s infinite}
.ai-typing i:nth-child(2){animation-delay:.2s}
.ai-typing i:nth-child(3){animation-delay:.4s}
@keyframes aiBlink{0%,60%,100%{opacity:.25}30%{opacity:1}}
.ai-acts{display:flex;flex-direction:column;gap:5px;margin-top:7px}
.ai-act{font-size:11px;background:var(--blue-soft);color:var(--blue);border-radius:9px;padding:6px 9px}
.ai-act.bad{background:#fdecec;color:#b4232a}
.ai-suggest{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.ai-composer{display:flex;gap:8px;align-items:flex-end;margin-bottom:6px}
.ai-composer-btns{display:flex;flex-direction:column;gap:6px}
.ai-source{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:11px;background:var(--blue-soft);color:var(--blue);border-radius:9px;padding:6px 9px;margin-bottom:8px}
html[data-theme="dark"] .ai-bubble.gigo{background:#1a2539}
html[data-theme="dark"] .ai-bubble.user{background:var(--blue)}

/* Theme + accent tokens (prefs-driven, no mock). */
html[data-accent="green"]{--blue:#1f9a69;--blue2:#27b57e;--blue-soft:#e8f6ef}
html[data-accent="purple"]{--blue:#6d3fd1;--blue2:#8a5cf0;--blue-soft:#efe8ff}
html[data-accent="orange"]{--blue:#c25a1d;--blue2:#e07b39;--blue-soft:#fff1e4}
html[data-theme="dark"]{--ink:#e8edf5;--text:#b9c3d4;--muted:#8b96ab;--line:#26334a;--bg:#0f1624;--card:#162032;--soft:#1a2539;--blue-soft:#1c2c48;--shadow:0 14px 34px rgba(0,0,0,.35)}
html[data-theme="dark"] body,html[data-theme="dark"] .screen{background:var(--bg)}
html[data-theme="dark"] .panel,html[data-theme="dark"] .card,html[data-theme="dark"] .compose-modal{background:var(--card);border-color:var(--line)}
html[data-theme="dark"] .placeholder-box{background:#141e30;border-color:var(--line)}
html[data-theme="dark"] input,html[data-theme="dark"] select,html[data-theme="dark"] textarea{background:#101a2c;color:var(--ink);border-color:var(--line)}
html[data-theme="dark"] .msg-list .mail-item{background:transparent}
html[data-theme="dark"] .compose-head{background:#101a2c}

/* compose modal */
.compose-modal{position:fixed;right:28px;bottom:22px;width:min(620px,calc(100vw - 28px));background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 24px 65px rgba(21,39,73,.23);z-index:60;display:none;overflow:hidden}
.compose-modal.open{display:block}
.compose-head{height:54px;padding:0 16px;border-bottom:1px solid var(--line);background:#f7f9fc;display:flex;justify-content:space-between;align-items:center}
.compose-head b{font-size:11px;color:var(--ink)}
.close{border:0;background:transparent;color:#6f7b8d;font-size:20px;line-height:1;padding:4px 8px}
.compose-field{display:flex;align-items:center;min-height:44px;border-bottom:1px solid var(--line);padding:0 15px;gap:10px}
.compose-field span{width:52px;font-size:9px;color:var(--muted);flex:none}
.compose-field input{flex:1;border:0;outline:0;font-size:11px;color:var(--ink);height:42px}
.compose-contact-picker{width:30px;height:30px;flex:none}
.chip-field{align-items:flex-start;padding-top:8px}
.chip-box{flex:1;display:flex;flex-wrap:wrap;gap:6px;align-items:center;min-height:42px}
.chip-input{flex:1;min-width:140px;border:0 !important;outline:0;height:34px !important;font-size:11px}
.chip{display:inline-flex;align-items:center;gap:6px;background:var(--blue-soft);color:#0f3f8f;border-radius:999px;padding:4px 6px 4px 11px;font-size:11px;font-weight:700}
.chip b{font-weight:700}
.chip button{border:0;background:none;color:inherit;font-size:14px;line-height:1;padding:0 4px;border-radius:50%}
.chip button:hover{background:rgba(21,101,216,.15)}
.chip.bad{background:#fdecec;color:#b4232a}
.compose-body{width:100%;min-height:220px;border:0;outline:0;resize:vertical;padding:15px;font-size:11px;line-height:1.6;color:var(--ink)}
.compose-bottom{padding:11px 14px;border-top:1px solid var(--line);display:flex;align-items:center;gap:5px}
.contact-picker-search{max-width:none;margin:0 0 12px}
.contact-picker-list{max-height:360px;overflow:auto;border:1px solid var(--line);border-radius:8px}
.contact-directory-badge{font-size:10px;color:var(--muted);white-space:nowrap}
.contact-picker-tools{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:12px}
.contact-picker-tools label{display:flex;align-items:center;gap:6px;font-size:12px;min-width:0}
.contact-picker-tools select{max-width:100%;padding:6px;border:1px solid var(--line);border-radius:4px;background:#fff;color:var(--ink)}
.contact-picker-selection{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;font-size:12px;color:var(--muted)}
.contact-picker-selection label{display:flex;align-items:center;gap:6px}
.contact-picker-selection input{width:16px;height:16px}
.contact-row .row-actions{flex-wrap:wrap;justify-content:flex-end}
@media(max-width:600px){.contact-row{flex-wrap:wrap}.contact-row .person{min-width:0;max-width:100%}.contact-row .person-copy{min-width:0}.contact-row .person-copy span{overflow-wrap:anywhere}.contact-row .row-actions{margin-left:auto}}
.contact-pick-row{min-height:58px;padding:9px 12px;display:grid;grid-template-columns:18px 38px minmax(0,1fr);gap:10px;align-items:center;border-bottom:1px solid #edf0f4;cursor:pointer}
.contact-pick-row:last-child{border-bottom:0}
.contact-pick-row:hover{background:#f8faff}
.contact-pick-row input{width:16px;height:16px}
.contact-pick-row b{display:block;color:var(--ink);font-size:10px}
.contact-pick-row small{display:block;color:var(--muted);font-size:9px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.compose-status{font-size:9px;color:var(--muted);margin-left:6px}
.send{height:36px;border:0;border-radius:10px;background:var(--blue);color:#fff;padding:0 20px;font-size:9px;font-weight:900}
.file-list{display:flex;flex-direction:column;gap:6px}
.file-list .attach{margin-top:0}

/* server-response loading states */
button.is-loading{position:relative;pointer-events:none;opacity:.82;color:transparent !important}
button.is-loading svg,button.is-loading span,button.is-loading b{opacity:0 !important}
button.is-loading::after{content:"";position:absolute;left:50%;top:50%;width:17px;height:17px;margin:-10px 0 0 -10px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:serverSpin .7s linear infinite;color:#fff}
.secondary-btn.is-loading::after,.small-btn.is-loading::after,.action.is-loading::after,.icon-btn.is-loading::after{color:var(--blue)}
.small-btn.primary.is-loading::after,.primary-btn.is-loading::after,.send.is-loading::after,.compose.is-loading::after{color:#fff}
@keyframes serverSpin{to{transform:rotate(360deg)}}
.server-status{display:none;margin-top:10px;padding:10px 12px;border-radius:10px;font-size:10px;font-weight:700;background:#eaf8f1;color:#196d4b;border:1px solid #c8e8d6}
.server-status.show{display:block}
.workspace-photo-card{position:relative;min-height:230px;overflow:hidden;padding:0 !important}
.workspace-photo-card img{width:100%;height:100%;min-height:230px;object-fit:cover;display:block}
.workspace-photo-card .photo-copy{position:absolute;left:18px;right:18px;bottom:18px;padding:14px;border-radius:14px;background:rgba(255,255,255,.95);box-shadow:0 12px 30px rgba(12,38,72,.12)}
.workspace-photo-card .photo-copy b{display:block;font-size:12px;color:var(--ink);margin-bottom:5px}
.workspace-photo-card .photo-copy span{display:block;font-size:9px;line-height:1.6;color:#6e7a8e}

/* generic modal (folder-style dialogs) */
.modal-backdrop{position:fixed;inset:0;background:rgba(16,29,51,.30);display:none;align-items:flex-start;justify-content:center;z-index:80;padding:40px 18px;overflow:auto}
.modal-backdrop.open{display:flex}
.modal{width:min(520px,100%);padding:22px}
.modal.wide{width:min(680px,100%)}
.modal h3{margin:0 0 6px;font-size:18px;color:var(--ink)}
.modal .modal-desc{margin:0 0 16px;font-size:11px;color:var(--muted);line-height:1.6}
.modal .field{height:46px;margin-bottom:12px}
.modal textarea.field{height:auto;min-height:96px;padding-top:10px;resize:vertical}
.modal select.field{width:100%;border:0;outline:0;background:transparent;font-size:11px;color:var(--ink)}
.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:4px}
.warn-box{margin:0 0 14px;padding:12px;border-radius:12px;font-size:11px;line-height:1.6;background:var(--gold-soft);border:1px solid #f0dcaa;color:#6b4d0f}
.danger-box{margin:0 0 14px;padding:12px;border-radius:12px;font-size:11px;line-height:1.6;background:#fdecec;border:1px solid #f0c4c6;color:#7c1d22}
.check-line{display:flex;gap:8px;align-items:center;font-size:12px;color:var(--text);margin:10px 0}
.check-line input{width:16px;height:16px;accent-color:var(--blue)}

/* drive page (enterprise drive language) */
.hero{padding:20px;margin-bottom:14px;display:flex;justify-content:space-between;align-items:center;gap:18px;background:linear-gradient(120deg,#0c3a7b,#1766ca);color:#fff;border:0}
.hero h2{margin:0 0 8px;font-size:24px;letter-spacing:-.8px;color:#fff}
.hero p{margin:0;max-width:660px;font-size:11px;line-height:1.75;color:#dbe9fb}
.hero-stat{min-width:180px;padding:14px;border-radius:14px;background:rgba(255,255,255,.11)}
.hero-stat b{display:block;font-size:26px;color:#fff}
.hero-stat span{font-size:9px;color:#d8e6f7}
.folder-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.folder-card{padding:15px;min-height:118px;position:relative;text-align:left;color:var(--text);overflow:hidden}
.folder-card .file-tab{display:block;height:10px;width:46%;border-bottom-right-radius:8px;margin:-15px -15px 12px}
.folder-card:hover{border-color:var(--blue)}
.folder-icon{width:42px;height:34px;border-radius:9px;background:#dceafe;position:relative;margin-bottom:16px}
.folder-icon:before{content:"";position:absolute;left:0;top:-7px;width:19px;height:10px;border-radius:6px 6px 0 0;background:#c8defc}
.folder-card b{display:block;font-size:11px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.folder-card span{display:block;margin-top:5px;font-size:9px;color:var(--muted)}
.more{position:absolute;right:10px;top:10px;border:0;background:transparent;color:#8190a4;font-size:13px;font-weight:900;letter-spacing:1px;padding:2px 6px}
.more:hover{color:var(--blue)}
.main-grid{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:14px;margin-top:14px}
.files-card{padding:16px}
.file-head,.file-row:not(.file-card){display:grid;grid-template-columns:minmax(0,1.8fr) .7fr .7fr .5fr;gap:10px;align-items:center}
.file-head{padding:0 10px 8px;font-size:8px;color:#909bad;text-transform:uppercase;font-weight:800}
/* Card-grid files (folder-tab header, type icon, meta) */
#dFiles.file-cards{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:16px;
  justify-content:center;
  max-width:1200px;
  margin:0 auto;
}
.file-row.file-card{
  display:flex;
  flex-direction:column;
  border:1px solid var(--line);
  border-radius:16px;
  padding:0;
  overflow:hidden;
  background:var(--card);
  transition:border-color .2s,box-shadow .2s;
}
.file-row.file-card:hover{
  border-color:var(--blue);
  box-shadow:0 8px 24px rgba(21,101,216,.12);
}
.file-row.file-card .file-tab{
  display:block;
  height:10px;
  width:42%;
  border-bottom-right-radius:8px;
}
.file-card-top{
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding:16px 16px 0;
}
.file-type-icon{
  width:36px;height:32px;
  flex:none;
  border-radius:8px;
  display:flex;
  align-items:center;justify-content:center;
  font-weight:900;font-size:12px;
  color:#fff;
  border:1px solid;
}
.file-card-top .file-copy{
  flex:1;
  min-width:0;
}
.file-card-top .file-copy b{
  display:block;
  font-size:13px;
  color:var(--ink);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis
}
.file-card-top .file-copy span{
  display:block;
  font-size:10px;
  color:var(--muted);
  margin-top:2px
}
.file-card-meta{
  display:flex;
  justify-content:space-between;
  gap:8px;
  padding:8px 16px 12px;
  font-size:10px;
  color:var(--muted)
}
.file-row{
  padding:11px 10px;
  border-top:1px solid #edf0f4
}
.file-row.clickable{cursor:pointer}
.file-row.clickable:hover{background:#f8faff}
.drive-toolbar [hidden]{display:none!important}
.drive-toolbar svg,.drive-destination svg{width:16px;height:16px;flex:none;stroke-width:1.8}
.drive-tool::after{content:attr(data-tooltip);position:absolute;top:calc(100% + 7px);left:50%;transform:translateX(-50%);z-index:20;white-space:nowrap;padding:5px 8px;border-radius:4px;background:#202124;color:#fff;font-size:11px;font-weight:500;visibility:hidden;pointer-events:none}
.drive-tool:hover::after,.drive-tool:focus-visible::after{visibility:visible}
.drive-bulkbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0;padding-left:12px;border-left:1px solid #d8e5f3}
.drive-bulkbar[hidden]{display:none}
.drive-bulkbar span{font-size:10px;font-weight:900;color:var(--ink)}
.drive-bulkbar>div{display:flex;gap:6px;flex-wrap:wrap}
.drive-cut .file-copy,.drive-cut .file-ic{opacity:.5}
.drive-destination-folder{width:100%;display:flex;align-items:center;gap:10px;padding:12px 4px;border:0;border-bottom:1px solid #edf0f4;background:transparent;text-align:left;color:var(--ink);cursor:pointer}
.drive-destination-folder span{flex:1;min-width:0;overflow-wrap:anywhere}
.drive-destination-folder:hover{background:#f8faff}
#dDestinationError{color:#b3261e;font-size:12px}
@media(max-width:600px){.drive-toolbar-main{flex-basis:100%}.drive-bulkbar{padding-left:0;border-left:0}.drive-modes{width:100%;gap:5px}.drive-modes .small-btn{padding:7px;font-size:10px}.drive-tool::after{left:0;transform:none}}
.file-ic{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font-size:9px;font-weight:900;flex:none}
.file-ic svg{width:17px;height:17px}
.pdf{background:#ffebed;color:#b73d49}
.doc{background:#eaf2ff;color:#1d63c2}
.xls{background:#eaf8f1;color:#16815a}
.imgf{background:#fff3d8;color:#a26900}
.zipf{background:#efebff;color:#6e55c5}
.otherf{background:#eef3f8;color:#627089}
.file-copy{min-width:0}
.file-copy b{display:block;font-size:10px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.file-copy span{font-size:8px;color:var(--muted)}
.cell{font-size:9px;color:#6d788b}
.activity{display:flex;gap:10px;padding:10px 0;border-top:1px solid #eef1f5}
.activity:first-of-type{border-top:0}
.avatar-sm{width:30px;height:30px;border-radius:9px;background:var(--blue-soft);color:var(--blue);display:grid;place-items:center;font-size:8px;font-weight:900;flex:none}
.activity b{display:block;font-size:9px;color:#344158}
.activity span{display:block;font-size:8px;color:#8c97a9;margin-top:2px}
.crumbs{display:flex;gap:6px;align-items:center;font-size:11px;color:var(--muted);margin-bottom:12px}
.crumbs button{border:0;background:none;color:var(--blue);font-weight:700;padding:2px;font-size:11px}

/* calendar month */
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.cal-dow{background:#f4f6f9;font-size:9px;font-weight:800;color:var(--muted);padding:8px;text-align:center}
.cal-day{background:#fff;min-height:92px;padding:6px;font-size:11px;text-align:left;border:0;display:block;color:var(--text)}
.cal-day:hover{background:#f7faff}
.cal-day .dn{font-weight:800;color:var(--muted)}
.cal-day.today .dn{color:var(--blue)}
.cal-day.other{background:#fafbfc;color:#c3ccd8}
.cal-ev{display:block;background:var(--blue-soft);color:#0f3f8f;border-radius:6px;padding:2px 6px;margin-top:3px;font-size:9px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%;border:0;text-align:left}

/* context menu */
.ctx-menu{position:fixed;z-index:95;min-width:200px;max-width:min(320px,90vw);max-height:min(70vh,480px);overflow:auto;background:#fff;border:1px solid var(--line);border-radius:12px;padding:5px;box-shadow:0 16px 38px rgba(24,35,56,.15)}
.ctx-menu button{display:flex;width:100%;gap:9px;align-items:center;border:0;background:none;border-radius:8px;padding:9px 10px;font-size:11px;font-weight:700;color:#536075;text-align:left}
.ctx-menu button:hover{background:var(--blue-soft);color:var(--blue)}
.ctx-menu button.danger{color:var(--red)}
.ctx-menu button svg{width:15px;height:15px}

/* shortcuts */
.kbd-grid{display:grid;grid-template-columns:110px 1fr;gap:8px 14px;font-size:11px;align-items:center}
kbd{background:#eef1f5;border:1px solid var(--line);border-bottom-width:2px;border-radius:5px;padding:1px 7px;font-family:inherit;font-size:10px;white-space:nowrap}

/* responsive */
@media(max-width:1280px){
  :root{--sidebar:215px}
  .mail-layout{grid-template-columns:340px minmax(0,1fr)}
  .side-widgets{display:none}
  .folder-grid{grid-template-columns:repeat(2,1fr)}
  .main-grid{grid-template-columns:1fr}
}
@media(max-width:1080px){
  .login-shell{grid-template-columns:1fr}
  .login-right{display:none}
  .login-left{padding:32px 22px 34px}
  .login-form-wrap{max-width:520px;margin:42px auto}
  .app-shell{grid-template-columns:72px 1fr}
  .sidebar{display:none}
  .dashboard-grid .hero-card,.dashboard-grid .summary-card,.metric,.grid-8,.grid-4,.header-card,.info-stat,.large-module,.side-module{grid-column:span 12}
}
@media(max-width:760px){
  .app-shell{display:block}
  .rail{position:fixed;left:0;right:0;bottom:0;top:auto;height:68px;flex-direction:row;justify-content:space-around;padding:8px 10px;z-index:30}
  .logo,.rail-spacer,.rail .rail-btn:nth-child(n+7){display:none}
  .main{padding-bottom:72px}
  .topbar{height:70px;padding:10px}
  .topbar-inner{padding:0 8px 0 12px}
  .content{padding:0 10px 12px}
  .mail-layout{display:block}
  .mail-layout .reader,.mail-layout .side-widgets{display:none}
  .mail-layout.has-selection .panel:first-child{display:none}
  .mail-layout.has-selection .reader{display:flex}
  .top-actions .icon-btn{display:none}
  .page-title{display:none}
  .search{margin-right:8px}
  .mail-layout .panel:first-child{min-height:calc(100vh - 160px)}
  .header-flex{display:block}
  .header-actions{margin-top:10px}
  .folder-grid{grid-template-columns:1fr}
  .compose-modal{right:10px;bottom:80px}
  .file-head,.file-row:not(.file-card){grid-template-columns:minmax(0,1fr) .7fr}
  .file-head>*:nth-child(n+3),.file-row:not(.file-card)>*:nth-child(n+3){display:none}
  .modal-backdrop{padding:20px 10px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none !important;transition:none !important}}
.nav-collapse{width:100%;border:0;background:transparent;color:var(--muted);font-size:15px;font-weight:900;padding:2px 8px;text-align:right;border-radius:8px}
.nav-collapse:hover{background:#f2f5f9;color:var(--blue)}
@media(min-width:901px){
  .app-shell.nav-mini{grid-template-columns:var(--rail) minmax(0,1fr)}
  .app-shell.nav-mini .sidebar{padding:18px 8px}
  .app-shell.nav-mini .sidebar .sidebar-head h1,.app-shell.nav-mini .sidebar .sidebar-head p,
  .app-shell.nav-mini .sidebar .nav-title,.app-shell.nav-mini .sidebar .nav-item .badge,
  .app-shell.nav-mini .sidebar .storage,.app-shell.nav-mini .sidebar .compose,
  .app-shell.nav-mini .sidebar .label-dot,.app-shell.nav-mini .sidebar #labelsManage,
  .app-shell.nav-mini .sidebar .muted-note,.app-shell.nav-mini .sidebar .nav-item .nm{display:none}
  .app-shell.nav-mini .sidebar .nav-item{justify-content:center;padding:0}
  .app-shell.nav-mini .sidebar:hover .sidebar-head h1,.app-shell.nav-mini .sidebar:hover .sidebar-head p,
  .app-shell.nav-mini .sidebar:hover .nav-title,.app-shell.nav-mini .sidebar:hover .nav-item .badge,
  .app-shell.nav-mini .sidebar:hover .storage,.app-shell.nav-mini .sidebar:hover .compose,
  .app-shell.nav-mini .sidebar:hover .label-dot,.app-shell.nav-mini .sidebar:hover #labelsManage{display:flex}
  .app-shell.nav-mini .sidebar:hover .muted-note{display:block}
  .app-shell.nav-mini .sidebar:hover .nav-item .nm{display:inline}
  .app-shell.nav-mini .sidebar:hover .nav-item{justify-content:flex-start;padding:0 12px}
}


/* =========================================================
   Workspace search + Drive management audit
========================================================= */
.storage.storage-link{
  width:100%;
  text-align:left;
  cursor:pointer;
  font:inherit;
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;
}
.storage.storage-link:hover{
  transform:translateY(-2px);
  border-color:#b7c9dd;
  box-shadow:0 12px 26px rgba(18,40,70,.08);
}
.workspace-search{position:relative}
.global-search-results{
  position:absolute;
  left:0;
  right:0;
  top:calc(100% + 8px);
  z-index:60;
  max-height:min(560px,70vh);
  overflow:auto;
  padding:10px;
  border:1px solid #cfd9e5;
  border-radius:18px;
  background:#fff;
  box-shadow:0 26px 60px rgba(11,35,68,.18);
}
.gs-loading,.gs-empty{
  padding:16px;
  color:var(--muted);
  font-size:10px;
}
.gs-empty b,.gs-empty span{display:block}
.gs-empty b{font-size:12px;color:var(--ink);margin-bottom:4px}
.gs-group+ .gs-group{margin-top:8px;padding-top:8px;border-top:1px solid #edf1f5}
.gs-group h4{
  margin:4px 7px 7px;
  color:#7b8798;
  font-size:8px;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.gs-result{
  width:100%;
  display:block;
  padding:10px 11px;
  border:0;
  border-radius:12px;
  background:transparent;
  text-align:left;
  transition:background .14s ease,transform .14s ease;
}
.gs-result:hover{background:#f2f7fd;transform:translateX(2px)}
.gs-result b{
  display:block;
  color:var(--ink);
  font-size:10px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.gs-result span{
  display:block;
  margin-top:3px;
  color:#7b8797;
  font-size:8px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.drive-manager{display:grid;gap:14px}
.drive-manager-hero{
  min-height:190px;
  padding:26px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  border-radius:24px;
  background:
    radial-gradient(circle at 86% 15%,rgba(255,255,255,.13),transparent 28%),
    linear-gradient(120deg,#0b3a7b,#1767cb);
  color:#fff;
  border:0;
  overflow:hidden;
}
.drive-manager-hero h2{
  max-width:720px;
  margin:6px 0 8px;
  color:#fff;
  font-size:30px;
  line-height:1.05;
  letter-spacing:-1px;
}
.drive-manager-hero p{
  max-width:760px;
  margin:0;
  color:#dbe9fb;
  font-size:11px;
  line-height:1.75;
}
.dm-kicker{
  display:inline-block;
  color:inherit;
  font-size:8px;
  font-weight:900;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.dm-actions{display:flex;gap:8px;flex-wrap:wrap;flex:none}
.drive-summary-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.drive-stat{padding:18px;border-radius:18px}
.drive-stat span,.drive-stat small{display:block;color:var(--muted);font-size:8px}
.drive-stat b{display:block;margin:6px 0;color:var(--ink);font-size:24px}
.drive-system-card{
  padding:22px;
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(240px,.8fr) auto;
  gap:24px;
  align-items:center;
  border-radius:22px;
  background:linear-gradient(135deg,#f9fbfe,#eef4fb);
}
.dm-system-copy h3{
  margin:5px 0 7px;
  color:var(--ink);
  font-size:20px;
}
.dm-system-copy p{margin:0;color:var(--muted);font-size:10px;line-height:1.65}
.dm-meter-head{display:flex;justify-content:space-between;gap:10px;font-size:9px}
.dm-meter-head b{color:var(--ink)}
.dm-meter-head span{color:var(--muted)}
.dm-meter-bar{
  height:9px;
  margin:9px 0 6px;
  overflow:hidden;
  border-radius:999px;
  background:#e2eaf3;
}
.dm-meter-bar.slim{height:7px;margin:11px 0 7px}
.dm-meter-bar i{
  display:block;
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg,#1768d7,#66a8f4);
}
.dm-meter small{color:var(--muted);font-size:8px}
.dm-section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin-top:2px;
}
.dm-section-head h3{margin:4px 0 0;color:var(--ink);font-size:15px}
.dm-section-head>span{color:var(--muted);font-size:9px}
.drive-volume-list{border-top:1px solid var(--line)}
.drive-volume{
  display:grid;grid-template-columns:48px minmax(0,1fr) minmax(160px,240px) 20px;
  align-items:center;gap:16px;width:100%;min-height:92px;padding:18px 12px;
  background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;
  color:var(--ink);text-align:left;cursor:pointer;
}
.drive-volume:hover{background:var(--hover,#f0f5f8)}
.drive-volume:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
.drive-volume-icon{display:grid;place-items:center;width:48px;height:48px;color:var(--blue)}
.drive-volume-icon svg{width:38px;height:38px;stroke-width:1.5}
.drive-volume-copy{min-width:0}
.drive-volume-copy b{display:block;font-size:13px;overflow-wrap:anywhere}
.drive-volume-copy>span{display:block;margin-top:4px;font-size:11px;color:var(--muted);overflow-wrap:anywhere}
.drive-volume-storage{min-width:0}
.drive-volume-storage>span:first-child{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;margin-bottom:8px}
.drive-volume-storage strong{font-size:11px;font-weight:600}
.drive-volume-storage small{font-size:10px;color:var(--muted)}
.drive-volume-storage .dm-meter-bar{display:block;width:100%}
.drive-volume-open svg{width:18px;height:18px;color:var(--muted)}
.drive-volume-empty{padding:20px 12px;color:var(--muted);font-size:12px}
@media(max-width:600px){
  .drive-volume{grid-template-columns:48px minmax(0,1fr) 20px;gap:10px 12px}
  .drive-volume-storage{grid-column:2;grid-row:2}
  .drive-volume-open{grid-column:3;grid-row:1 / span 2}
}

@media(max-width:1280px){
  .drive-summary-grid{grid-template-columns:repeat(2,1fr)}
  .drive-system-card{grid-template-columns:1fr 1fr}
  .drive-system-card>.small-btn{grid-column:span 2;width:max-content}
}
@media(max-width:760px){
  .global-search-results{
    position:fixed;
    left:10px;
    right:10px;
    top:72px;
    max-height:calc(100vh - 155px);
  }
  .drive-manager-hero{display:block;padding:20px}
  .drive-manager-hero h2{font-size:24px}
  .dm-actions{margin-top:16px}
  .drive-summary-grid{grid-template-columns:1fr}
  .drive-system-card{grid-template-columns:1fr;gap:16px}
  .drive-system-card>.small-btn{grid-column:auto}
  .rail{
    overflow-x:auto;
    justify-content:flex-start;
  }
  .rail .rail-btn{display:grid!important;flex:0 0 44px}
  .rail .logo,.rail .rail-spacer{display:none!important}
}


/* =========================================================
   Templates + Organization pages
========================================================= */
.template-page,.organization-page{display:grid;gap:14px}
.template-hero,.org-hero{
  min-height:190px;
  padding:26px;
  border-radius:26px;
  overflow:hidden;
  background:
    radial-gradient(circle at 85% 18%,rgba(255,255,255,.14),transparent 26%),
    linear-gradient(120deg,#0b3a7b,#1767cb);
  color:#fff;
  border:0;
}
.template-hero{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
}
.template-hero h2,.org-hero h2{
  max-width:760px;
  margin:6px 0 8px;
  color:#fff;
  font-size:30px;
  line-height:1.05;
  letter-spacing:-1px;
}
.template-hero p,.org-hero p{
  max-width:760px;
  margin:0;
  color:#dbe9fb;
  font-size:11px;
  line-height:1.75;
}
.template-actions,.org-hero-actions{display:flex;gap:8px;flex-wrap:wrap;flex:none}
.template-stats{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.template-library{
  padding:18px;
  border-radius:22px;
}
.template-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}
.template-search{max-width:440px;margin:0}
.template-toolbar select{
  height:38px;
  min-width:145px;
  padding:0 12px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#fff;
  color:var(--ink);
  font-size:10px;
}
.template-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.template-card{
  min-height:220px;
  padding:18px;
  border-radius:20px;
  display:flex;
  flex-direction:column;
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;
}
.template-card:hover{
  transform:translateY(-4px);
  border-color:#b9cce2;
  box-shadow:0 16px 32px rgba(10,36,70,.10);
}
.template-card-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.template-icon{
  width:42px;height:42px;
  display:grid;place-items:center;
  border-radius:13px;
  background:#e8f2fd;
  color:var(--blue);
}
.template-icon svg{width:19px;height:19px}
.template-card h3{
  margin:14px 0 5px;
  color:var(--ink);
  font-size:14px;
}
.template-card p{
  margin:0;
  color:var(--muted);
  font-size:9px;
  line-height:1.55;
}
.template-meta{
  margin-top:10px;
  color:#6f7d90;
  font-size:8px;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.template-card-actions{
  margin-top:auto;
  padding-top:16px;
  display:flex;
  gap:7px;
  flex-wrap:wrap;
}

.org-hero{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.org-brand-block{
  min-width:0;
  display:flex;
  align-items:center;
  gap:18px;
}
.org-logo-frame{
  width:82px;height:82px;
  flex:none;
  display:grid;place-items:center;
  overflow:hidden;
  border-radius:22px;
  background:#fff;
  color:var(--blue);
  border:1px solid rgba(255,255,255,.35);
  box-shadow:0 12px 30px rgba(0,0,0,.16);
}
.org-logo-frame img{width:100%;height:100%;object-fit:contain;padding:10px}
.org-logo-frame svg{width:32px;height:32px}
.org-grid{
  display:grid;
  grid-template-columns:minmax(0,1.6fr) minmax(280px,.7fr);
  gap:14px;
}
.org-details,.org-guidance{
  min-height:330px;
  padding:22px;
  border-radius:22px;
}
.org-details h3,.org-guidance h3{
  margin:0 0 10px;
  color:var(--ink);
  font-size:15px;
}
.org-guidance p{
  color:var(--muted);
  font-size:10px;
  line-height:1.65;
}
.org-guide-list{
  display:grid;
  gap:8px;
  margin-top:16px;
}
.org-guide-list span,.org-inline-note,.org-read-row{
  padding:12px 14px;
  border:1px solid #e2e8ef;
  border-radius:14px;
  background:#f8fafc;
}
.org-guide-list span{
  color:#536277;
  font-size:9px;
  font-weight:800;
}
.org-inline-note,.org-read-row{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
}
.org-inline-note{margin-top:14px}
.org-inline-note b,.org-read-row b{color:var(--ink);font-size:10px}
.org-inline-note span,.org-read-row span{color:var(--muted);font-size:9px}
.org-read-row + .org-read-row{margin-top:8px}

@media(max-width:1180px){
  .template-stats{grid-template-columns:repeat(2,1fr)}
  .template-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:820px){
  .template-hero,.org-hero{display:block;padding:20px}
  .template-actions,.org-hero-actions{margin-top:16px}
  .org-brand-block{align-items:flex-start}
  .org-grid{grid-template-columns:1fr}
}
@media(max-width:640px){
  .template-stats,.template-grid{grid-template-columns:1fr}
  .template-toolbar{align-items:stretch;flex-direction:column}
  .template-search{max-width:none;width:100%}
  .template-toolbar select{width:100%}
  .org-brand-block{display:block}
  .org-logo-frame{margin-bottom:14px}
}


/* =========================================================
   Responsive workspace navigation drawer
========================================================= */
.workspace-nav-btn{display:none}
.sidebar-scrim{
  display:none;
  position:fixed;
  inset:0;
  z-index:27;
  border:0;
  background:rgba(5,24,51,.38);
}
@media(max-width:1080px){
  .workspace-nav-btn{
    display:grid;
    flex:none;
    margin-right:7px;
    border:1px solid #dce4ec;
    background:#f7f9fc;
  }
  .sidebar{
    display:block;
    position:fixed;
    left:72px;
    top:0;
    bottom:0;
    width:min(310px,calc(100vw - 88px));
    height:100vh;
    z-index:29;
    transform:translateX(calc(-100% - 82px));
    visibility:hidden;
    opacity:0;
    box-shadow:18px 0 45px rgba(8,31,61,.18);
    transition:transform .2s ease,opacity .2s ease,visibility .2s ease;
  }
  .app-shell.sidebar-open .sidebar{
    transform:translateX(0);
    visibility:visible;
    opacity:1;
  }
  .app-shell.sidebar-open + .sidebar-scrim,
  #appScreen .app-shell.sidebar-open ~ .sidebar-scrim{
    display:block;
  }
}
@media(max-width:760px){
  .sidebar{
    left:0;
    top:0;
    bottom:68px;
    width:min(330px,88vw);
    height:calc(100vh - 68px);
    z-index:40;
    transform:translateX(-104%);
  }
  .sidebar-scrim{bottom:68px;z-index:39}
  .workspace-nav-btn{
    width:40px;
    height:40px;
    margin-right:4px;
  }
}


/* =========================================================
   Live reports
========================================================= */
.reports-page{display:grid;gap:14px}
.reports-hero{
  min-height:185px;
  padding:26px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  border-radius:26px;
  border:0;
  color:#fff;
  background:
    radial-gradient(circle at 88% 18%,rgba(255,255,255,.13),transparent 26%),
    linear-gradient(120deg,#0a3978,#155fb9);
}
.reports-hero h2{
  max-width:760px;
  margin:6px 0 8px;
  color:#fff;
  font-size:30px;
  line-height:1.05;
  letter-spacing:-1px;
}
.reports-hero p{
  max-width:760px;
  margin:0;
  color:#dbe9fb;
  font-size:11px;
  line-height:1.7;
}
.reports-grid{
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(280px,.65fr);
  gap:14px;
}
.reports-chart-card,.reports-security,.reports-table-card{
  padding:20px;
  border-radius:22px;
}
.report-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:16px;
}
.report-head h3,.reports-security h3{
  margin:4px 0 0;
  color:var(--ink);
  font-size:15px;
}
.reports-chart{
  min-height:250px;
  display:flex;
  align-items:stretch;
  gap:12px;
  padding:12px 4px 0;
}
.report-bar-col{
  flex:1;
  min-width:0;
  display:grid;
  grid-template-rows:20px 1fr 18px;
  align-items:end;
  text-align:center;
}
.report-value{font-size:8px;color:var(--muted);font-weight:800}
.report-bar-track{
  width:100%;
  max-width:42px;
  height:190px;
  margin:0 auto;
  position:relative;
  overflow:hidden;
  border-radius:12px 12px 6px 6px;
  background:#edf2f7;
}
.report-bar-track i{
  position:absolute;
  left:0;right:0;bottom:0;
  display:block;
  border-radius:10px 10px 5px 5px;
  background:linear-gradient(180deg,#72acf2,#1768d7);
}
.report-bar-col>span{font-size:8px;color:var(--muted)}
.report-security{background:linear-gradient(145deg,#f8fbfe,#eef4fa)}
.report-security-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 0;
  border-bottom:1px solid #e2e8ef;
  font-size:9px;
}
.report-security-row span{color:var(--muted)}
.report-security-row b{color:var(--ink)}
.report-security .small-btn{margin-top:16px}
.report-search{width:260px;max-width:100%;margin:0;height:38px}
.report-user-table{display:grid}
.report-user-row{
  display:grid;
  grid-template-columns:minmax(250px,1.15fr) minmax(220px,.85fr) auto;
  gap:18px;
  align-items:center;
  padding:12px 2px;
  border-bottom:1px solid #edf1f5;
}
.report-user-row:last-child{border-bottom:0}
.report-user-meter span{display:block;color:var(--muted);font-size:8px}
.analytics-page{gap:16px}
.analytics-metric-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.analytics-metric{padding:16px;min-height:150px}
.analytics-metric span{display:block;color:#69778b;font-size:8px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
.analytics-metric b{display:block;margin:12px 0 5px;color:var(--ink);font-size:24px}
.analytics-metric small{display:block;color:var(--blue);font-size:8px;font-weight:900}
.analytics-metric p{margin:12px 0 0;color:var(--muted);font-size:9px;line-height:1.55}
.analytics-map-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(320px,.75fr);gap:14px}
.analytics-map-card,.analytics-tracker-card{padding:18px;border-radius:22px}
.map-canvas{height:250px;border:1px solid #dfe7f1;border-radius:16px;background:linear-gradient(135deg,#f7fbff,#edf4fb);position:relative;overflow:hidden}
.map-canvas:before{content:"";position:absolute;inset:30px 48px;border:1px dashed #b8c8db;border-radius:45% 55% 48% 52%;transform:rotate(-8deg)}
.map-canvas:after{content:"";position:absolute;right:70px;top:42px;width:150px;height:115px;border:1px dashed #c5d2e0;border-radius:55% 45% 55% 45%;transform:rotate(12deg)}
.map-canvas span{position:absolute;width:11px;height:11px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 7px rgba(21,101,216,.12)}
.country-row,.sent-mail-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid #edf0f4}
.country-row:last-child,.sent-mail-row:last-child{border-bottom:0}
.country-row b,.sent-mail-row b{color:var(--ink);font-size:10px}
.country-row span,.sent-mail-row span{color:var(--muted);font-size:9px}
.tracker-empty{padding:18px;border:1px solid #e3ebf4;border-radius:14px;background:#f8fafc}
.tracker-empty b{display:block;color:var(--ink);font-size:11px;margin-bottom:6px}
.tracker-empty span{color:var(--muted);font-size:9px;line-height:1.6}
.sent-mail-table{display:grid}
.sent-mail-row{grid-template-columns:minmax(0,1fr) 115px 78px 115px}
.sent-mail-row div{min-width:0}
.sent-mail-row b,.sent-mail-row div span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:1000px){
  .reports-grid{grid-template-columns:1fr}
  .analytics-metric-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .analytics-map-grid{grid-template-columns:1fr}
}
@media(max-width:760px){
  .reports-hero{display:block;padding:20px}
  .reports-hero .small-btn{margin-top:16px}
  .report-head{align-items:stretch;flex-direction:column}
  .report-search{width:100%}
  .report-user-row{grid-template-columns:1fr}
  .analytics-metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sent-mail-row{grid-template-columns:minmax(0,1fr)}
  .reports-chart{gap:5px}
  .report-bar-track{height:150px}
}


/* Search destination highlight */
.search-target{
  outline:3px solid rgba(23,104,215,.24)!important;
  border-color:#74a9e8!important;
  box-shadow:0 0 0 6px rgba(23,104,215,.08),0 18px 34px rgba(10,38,74,.12)!important;
  animation:driveTargetPulse 1.1s ease 2;
}
@keyframes driveTargetPulse{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-3px)}
}


/* =========================================================
   User provisioning + onboarding
========================================================= */
.mail-address-builder{
  min-height:46px;
  display:flex;
  align-items:flex-end;
  gap:8px;
  padding:4px 2px 6px;
  border-bottom:2px solid #9fb7d0;
  background:transparent;
}
.mail-address-builder:focus-within{
  border-bottom-color:var(--blue);
  box-shadow:0 3px 0 rgba(23,104,215,.08);
}
.mail-address-builder input{
  min-width:0;
  flex:1;
  padding:8px 2px 5px;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:var(--ink);
  font-size:13px;
  font-weight:800;
}
.mail-address-builder span{
  flex:none;
  padding:0 2px 6px;
  color:#5c6f86;
  font-size:12px;
  font-weight:850;
}
.field-hint{
  margin-top:6px;
  color:var(--muted);
  font-size:8px;
  line-height:1.5;
}
.success-box{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:12px;
  padding:15px 16px;
  border:1px solid #b9dfcb;
  border-radius:16px;
  background:#effaf4;
}
.success-box b{
  color:#15704b;
  font-size:11px;
}
.success-box span{
  color:var(--ink);
  font-size:10px;
  font-weight:850;
}
.onboarding-result{
  display:grid;
  gap:8px;
}
.onboarding-result>div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:12px 14px;
  border:1px solid #e1e7ee;
  border-radius:14px;
  background:#f8fafc;
}
.onboarding-result b{
  color:var(--ink);
  font-size:9px;
}
.onboarding-result span{
  color:#68788e;
  font-size:9px;
  text-align:right;
}
@media(max-width:560px){
  .mail-address-builder{
    align-items:stretch;
    flex-direction:column;
    gap:0;
  }
  .mail-address-builder span{
    padding:0 2px 4px;
  }
  .success-box,.onboarding-result>div{
    align-items:flex-start;
    flex-direction:column;
  }
  .onboarding-result span{text-align:left}
}


/* =========================================================
   Actionable dashboard + activity surfaces
========================================================= */
.metric-link{
  position:relative;
  width:100%;
  min-width:0;
  text-align:left;
  font:inherit;
  cursor:pointer;
  appearance:none;
  -webkit-appearance:none;
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease,background .16s ease;
}
.metric-link:hover,
.metric-link:focus-visible{
  transform:translateY(-3px);
  border-color:#a9c6e7;
  box-shadow:0 18px 34px rgba(15,55,98,.12);
  outline:none;
}
.metric-link:hover .stat-ic,
.metric-link:focus-visible .stat-ic{transform:scale(1.08)}
.metric-link .stat-ic{transition:transform .16s ease}
.metric-open{
  position:absolute;
  right:18px;
  bottom:16px;
  color:var(--blue);
  font-size:8px;
  font-weight:900;
  opacity:0;
  transform:translateX(-4px);
  transition:opacity .16s ease,transform .16s ease;
}
.metric-link:hover .metric-open,
.metric-link:focus-visible .metric-open{
  opacity:1;
  transform:translateX(0);
}
.home-conversation{
  cursor:pointer;
  transition:background .14s ease,transform .14s ease;
}
.home-conversation:hover,
.home-conversation:focus-visible{
  background:#f2f7fd;
  outline:none;
}
.home-conversation:hover td:first-child,
.home-conversation:focus-visible td:first-child{
  padding-left:12px;
}
.home-conversation td{transition:padding .14s ease}
.activity-link{
  width:100%;
  border-left:0;
  border-right:0;
  border-bottom:0;
  background:transparent;
  text-align:left;
  font:inherit;
  cursor:pointer;
  position:relative;
  align-items:center;
  transition:background .14s ease,padding .14s ease;
}
.activity-link:hover,
.activity-link:focus-visible{
  background:#f4f8fd;
  outline:none;
  padding-left:8px;
  padding-right:8px;
  border-radius:12px;
}
.activity-link>div:nth-child(2){
  min-width:0;
  flex:1;
}
.activity-open{
  flex:none;
  color:var(--blue);
  font-size:8px!important;
  font-weight:900;
  opacity:0;
  margin:0!important;
  transition:opacity .14s ease;
}
.activity-link:hover .activity-open,
.activity-link:focus-visible .activity-open{opacity:1}

@media(max-width:700px){
  .metric-open,.activity-open{opacity:1}
}


/* =========================================================
   Compose formatting + secure Drive sharing
========================================================= */
.compose-formatbar{
  display:flex;
  align-items:center;
  gap:6px;
  padding:8px 14px;
  border-top:1px solid #e3e9f0;
  border-bottom:1px solid #e3e9f0;
  background:#f8fafc;
}
.compose-formatbar[hidden]{display:none!important}
.compose-formatbar button{
  min-width:30px;
  height:30px;
  padding:0 8px;
  border:1px solid #d7e0ea;
  border-radius:9px;
  background:#fff;
  color:var(--ink);
  font-size:10px;
  cursor:pointer;
}
.compose-formatbar button:hover,
.compose-formatbar button:focus-visible{
  border-color:#a9c6e7;
  background:#eef5fd;
  outline:none;
}
.compose-format-hint{
  margin-left:auto;
  color:var(--muted);
  font-size:8px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.share-link-row{
  display:flex;
  gap:8px;
  align-items:center;
}
.share-link-row input{
  min-width:0;
  flex:1;
  height:38px;
  padding:0 11px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#f7f9fc;
  color:#526177;
  font-size:10px;
}
.share-current{
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid #e4eaf1;
}
.share-current-head{
  display:flex;
  justify-content:space-between;
  gap:10px;
  align-items:center;
  margin-bottom:8px;
}
.share-current-head b{font-size:10px;color:var(--ink)}
.share-current-head span{font-size:8px;color:var(--muted)}
#dCrumbs button{
  border:0;
  padding:0;
  background:transparent;
  color:var(--blue);
  font:inherit;
  cursor:pointer;
}
#dCrumbs button:hover{text-decoration:underline}

@media(max-width:620px){
  .share-link-row{align-items:stretch;flex-direction:column}
  .share-link-row .small-btn{width:100%}
  .compose-formatbar{overflow-x:auto}
  .compose-format-hint{display:none}
}


/* =========================================================
   Synced search lightbox + server loading system
========================================================= */
.server-load-bar{
  position:fixed;
  top:0;
  left:0;
  z-index:200;
  width:0;
  height:3px;
  opacity:0;
  pointer-events:none;
  border-radius:0 999px 999px 0;
  background:linear-gradient(90deg,var(--blue),#65a7f2);
  box-shadow:0 1px 8px rgba(21,101,216,.28);
  transition:width .24s ease,opacity .15s ease;
}
.server-load-bar.active{
  width:72%;
  opacity:1;
  animation:serverProgress 1.4s ease-in-out infinite;
}
.server-load-bar.finishing{
  width:100%;
  animation:none;
}
@keyframes serverProgress{
  0%{width:14%}
  52%{width:64%}
  100%{width:88%}
}
.server-loader{
  min-height:120px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:18px;
  border-radius:16px;
  background:linear-gradient(100deg,#f8fafc,#eef3f8,#f8fafc);
  background-size:220% 100%;
  color:#68778b;
  font-size:10px;
  font-weight:800;
  animation:serverShimmer 1.4s linear infinite;
}
.server-loader.compact{
  min-height:72px;
  border-radius:14px;
}
.server-loader-spin{
  width:18px;
  height:18px;
  flex:none;
  border:2px solid #bed0e4;
  border-top-color:var(--blue);
  border-radius:50%;
  animation:serverSpin .72s linear infinite;
}
@keyframes serverShimmer{
  to{background-position:-220% 0}
}
.content{
  position:relative;
}
.content.content-loading::before{
  content:"";
  position:absolute;
  left:18px;
  right:18px;
  top:0;
  height:2px;
  z-index:20;
  border-radius:999px;
  background:linear-gradient(90deg,transparent,var(--blue),transparent);
  background-size:220% 100%;
  animation:contentLoadSweep .9s linear infinite;
}
@keyframes contentLoadSweep{
  to{background-position:-220% 0}
}
html.server-busy .topbar-inner{
  border-color:#d6e3f1;
}

.workspace-search-backdrop{
  position:fixed;
  inset:78px 0 0;
  z-index:7;
  border:0;
  padding:0;
  background:rgba(8,30,61,.28);
  backdrop-filter:blur(3px);
}
.workspace-search-backdrop[hidden]{display:none!important}
.workspace-search.search-lightbox-active{
  border-color:#a9c6e7;
  background:#fff;
  box-shadow:0 0 0 4px rgba(21,101,216,.08),0 12px 30px rgba(15,44,82,.10);
}
.workspace-search.search-lightbox-active input{
  font-weight:700;
}
.global-search-results{
  left:50%;
  right:auto;
  top:calc(100% + 12px);
  width:min(760px,calc(100vw - 32px));
  max-height:min(670px,calc(100vh - 112px));
  transform:translateX(-50%);
  padding:0;
  overflow:auto;
  border:1px solid #c9d7e6;
  border-radius:24px;
  background:#fff;
  box-shadow:0 34px 80px rgba(7,27,55,.24);
}
.gs-head{
  position:sticky;
  top:0;
  z-index:2;
  min-height:92px;
  padding:18px 20px 16px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  border-bottom:1px solid #e8edf3;
  background:rgba(255,255,255,.97);
  backdrop-filter:blur(10px);
}
.gs-kicker{
  display:block;
  margin-bottom:4px;
  color:var(--blue);
  font-size:8px;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.gs-head h3{
  margin:0;
  color:var(--ink);
  font-size:18px;
  letter-spacing:-.35px;
}
.gs-head p{
  margin:5px 0 0;
  color:var(--muted);
  font-size:9px;
  line-height:1.55;
}
.gs-sync-badge{
  flex:none;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 9px;
  border-radius:999px;
  background:#eef6ff;
  color:var(--blue);
  font-size:8px;
  font-weight:900;
}
.gs-sync-badge svg{width:12px;height:12px}
.gs-results-body,.gs-recent-body{padding:12px}
.gs-recent-list{display:grid;gap:5px}
.gs-recent-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) 38px;
  align-items:center;
  gap:6px;
  border-radius:14px;
  transition:background .14s ease;
}
.gs-recent-row:hover{background:#f4f8fd}
.gs-recent-query{
  min-width:0;
  min-height:52px;
  display:flex;
  align-items:center;
  gap:11px;
  padding:8px 10px;
  border:0;
  background:transparent;
  text-align:left;
}
.gs-recent-query>span:last-child{min-width:0}
.gs-recent-query b{
  display:block;
  overflow:hidden;
  color:var(--ink);
  font-size:10px;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.gs-recent-query small{
  display:block;
  margin-top:3px;
  color:var(--muted);
  font-size:8px;
}
.gs-recent-icon{
  width:34px;
  height:34px;
  flex:none;
  display:grid;
  place-items:center;
  border-radius:11px;
  background:#edf4fd;
  color:var(--blue);
}
.gs-recent-icon svg{width:15px;height:15px}
.gs-recent-delete{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:10px;
  background:transparent;
  color:#99a5b5;
}
.gs-recent-delete:hover{
  background:#fdeff0;
  color:var(--red);
}
.gs-recent-delete svg{width:15px;height:15px}
.gs-recent-delete.is-loading{background:#f3f6fa}
.gs-empty-recent{margin:3px}
.gs-group{padding:4px 0}
.gs-group + .gs-group{
  margin-top:6px;
  padding-top:10px;
}
.gs-group h4{
  margin:4px 9px 6px;
}
.gs-result{
  min-height:50px;
  padding:10px 12px;
}
.gs-result:hover{
  background:#edf5fe;
}
@media(max-width:760px){
  .workspace-search-backdrop{inset:68px 0 68px}
  .global-search-results{
    position:fixed;
    left:10px;
    right:10px;
    top:76px;
    width:auto;
    max-height:calc(100vh - 154px);
    transform:none;
    border-radius:20px;
  }
  .gs-head{min-height:84px;padding:15px}
  .gs-head h3{font-size:16px}
  .gs-sync-badge{display:none}
}

.gs-recent-delete.is-loading::after{color:var(--blue)}

/* Desktop hover navigation */
.sidebar-note{margin:16px 4px 0;padding:13px 14px;border:1px solid #dce6f1;border-radius:15px;background:linear-gradient(135deg,#f8fbff,#eef5fd)}
.sidebar-note b{display:block;margin-bottom:5px;color:var(--ink);font-size:10px}
.sidebar-note span{display:block;color:var(--muted);font-size:8px;line-height:1.55}
@media(min-width:1081px){
.app-shell{grid-template-columns:var(--rail) minmax(0,1fr)}
.rail{grid-column:1;z-index:34}
.main{grid-column:2;min-width:0}
.sidebar{position:fixed;left:var(--rail);top:0;width:var(--sidebar);height:100vh;z-index:33;opacity:0;visibility:hidden;pointer-events:none;transform:translateX(-18px);box-shadow:18px 0 42px rgba(7,31,63,.14);transition:opacity .16s ease,transform .18s ease,visibility .18s ease}
.rail:hover + .sidebar,.rail:focus-within + .sidebar,.sidebar:hover,.sidebar:focus-within{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(0)}
.workspace-nav-btn,.nav-collapse{display:none!important}
}


/* =========================================================
   Client-side Drive editor
========================================================= */
.client-editor{
  position:fixed;
  inset:0;
  z-index:76;
  display:none;
  grid-template-rows:auto minmax(0,1fr);
  background:#eef3f8;
}
.client-editor.open{display:grid}
.client-editor-head{
  min-height:76px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:12px 18px;
  border-bottom:1px solid #d8e1eb;
  background:#fff;
  box-shadow:0 6px 18px rgba(12,37,71,.06);
}
.ce-kicker{
  display:block;
  margin-bottom:3px;
  color:var(--blue);
  font-size:8px;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.client-editor-head h2{
  margin:0;
  max-width:620px;
  overflow:hidden;
  color:var(--ink);
  font-size:17px;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.client-editor-head p{
  margin:4px 0 0;
  color:var(--muted);
  font-size:8px;
}
.ce-actions{
  display:flex;
  align-items:center;
  gap:7px;
  flex:none;
}
.ce-status{
  max-width:190px;
  overflow:hidden;
  color:#68778a;
  font-size:8px;
  font-weight:800;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.ce-close{
  font-size:20px;
  line-height:1;
}
.client-editor-body{
  min-height:0;
  overflow:auto;
  padding:16px;
}
.ce-text-editor{
  width:100%;
  min-height:calc(100vh - 112px);
  padding:20px;
  resize:none;
  border:1px solid #d7e0ea;
  border-radius:16px;
  outline:0;
  background:#fff;
  color:#233148;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:12px;
  line-height:1.65;
  box-shadow:0 12px 28px rgba(16,38,69,.06);
}
.ce-text-editor:focus{border-color:#9ebee5;box-shadow:0 0 0 3px rgba(21,101,216,.08)}
.ce-sheet-tabs{
  position:sticky;
  top:0;
  z-index:3;
  display:flex;
  gap:5px;
  padding:8px;
  border:1px solid #d7e0ea;
  border-bottom:0;
  border-radius:14px 14px 0 0;
  background:#f7f9fc;
}
.ce-sheet-tabs button{
  height:31px;
  padding:0 11px;
  border:1px solid transparent;
  border-radius:9px;
  background:transparent;
  color:#66758a;
  font-size:9px;
  font-weight:800;
}
.ce-sheet-tabs button.active{
  border-color:#c9d8e9;
  background:#fff;
  color:var(--blue);
}
.ce-sheet-wrap{
  overflow:auto;
  max-height:calc(100vh - 154px);
  border:1px solid #d7e0ea;
  border-radius:0 0 14px 14px;
  background:#fff;
}
.ce-sheet{
  border-collapse:separate;
  border-spacing:0;
  min-width:100%;
}
.ce-sheet td{
  min-width:110px;
  max-width:260px;
  height:34px;
  padding:7px 9px;
  border-right:1px solid #edf1f5;
  border-bottom:1px solid #edf1f5;
  outline:0;
  color:#344158;
  font-size:9px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.ce-sheet td[contenteditable="true"]:focus{
  background:#edf5ff;
  box-shadow:inset 0 0 0 2px var(--blue);
}
.ce-limit-note{
  margin-top:8px;
  color:var(--muted);
  font-size:8px;
}
.ce-doc{
  width:min(900px,100%);
  min-height:calc(100vh - 116px);
  margin:0 auto;
  padding:58px 64px;
  border:1px solid #d9e1ea;
  border-radius:14px;
  outline:0;
  background:#fff;
  color:#28374d;
  font-family:Georgia,"Times New Roman",serif;
  font-size:14px;
  line-height:1.75;
  box-shadow:0 16px 40px rgba(16,38,69,.08);
}
.ce-doc[contenteditable="true"]:focus{border-color:#a9c4e5}
.ce-doc h1,.ce-doc h2,.ce-doc h3{color:#172338}
.ce-native{
  min-height:calc(100vh - 112px);
  display:grid;
  place-items:center;
  overflow:auto;
}
.ce-native img{
  max-width:min(1200px,100%);
  max-height:calc(100vh - 120px);
  object-fit:contain;
  border-radius:14px;
  box-shadow:0 18px 45px rgba(12,37,71,.12);
}
.ce-native video{
  width:min(1100px,100%);
  max-height:calc(100vh - 130px);
  border-radius:14px;
  background:#07182e;
}
.ce-native audio{width:min(680px,90%)}
.ce-frame{
  width:100%;
  height:calc(100vh - 110px);
  border:1px solid #d5dfe9;
  border-radius:14px;
  background:#fff;
}
.ce-empty{
  min-height:360px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:7px;
  padding:28px;
  border:1px dashed #c7d4e2;
  border-radius:18px;
  background:#fff;
  text-align:center;
}
.ce-empty b{color:var(--ink);font-size:16px}
.ce-empty span{max-width:560px;color:var(--muted);font-size:10px;line-height:1.65}
.ce-history-list{display:grid;gap:4px}
@media(max-width:780px){
  .client-editor-head{align-items:flex-start;flex-direction:column}
  .ce-actions{width:100%;overflow-x:auto}
  .ce-status{margin-right:auto}
  .client-editor-body{padding:8px}
  .ce-doc{padding:28px 20px;border-radius:10px}
}


/* =========================================================
   Teams messaging + lightweight audio rooms
========================================================= */
.teams-page{display:grid;gap:14px}
.teams-hero{
  min-height:176px;
  padding:24px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:22px;
  border:0;
  border-radius:24px;
  background:
    radial-gradient(circle at 88% 14%,rgba(255,255,255,.13),transparent 27%),
    linear-gradient(120deg,#0a3a78,#1768cf);
  color:#fff;
}
.teams-hero h2{margin:6px 0 8px;color:#fff;font-size:28px;letter-spacing:-.9px}
.teams-hero p{max-width:760px;margin:0;color:#dceafb;font-size:10px;line-height:1.7}
.teams-shell{display:grid;grid-template-columns:280px minmax(0,1fr);gap:14px;min-height:calc(100vh - 290px)}
.teams-channels,.teams-chat{min-height:0;border-radius:20px}
.teams-channels{padding:14px;overflow:auto}
.teams-panel-head{display:flex;align-items:center;justify-content:space-between;margin:4px 4px 10px}
.teams-panel-head h3{margin:3px 0 0;color:var(--ink);font-size:14px}
.team-channel{
  width:100%;
  min-height:52px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 10px;
  border:0;
  border-radius:13px;
  background:transparent;
  text-align:left;
  color:#5d6a7d;
}
.team-channel:hover,.team-channel.active{background:#edf5ff;color:var(--blue)}
.team-hash{
  width:34px;height:34px;display:grid;place-items:center;flex:none;
  border-radius:10px;background:#f1f5fa;color:#6d7c91;font-size:16px;font-weight:900
}
.team-channel.active .team-hash{background:#dcecff;color:var(--blue)}
.team-channel b{display:block;color:inherit;font-size:10px}
.team-channel small{display:block;margin-top:2px;color:#98a3b2;font-size:7px}
.teams-people{margin-top:18px;padding-top:12px;border-top:1px solid #edf1f5}
.team-person{display:flex;align-items:center;gap:9px;padding:7px 6px}
.team-person>div:last-child{min-width:0}
.team-person b{display:block;color:var(--ink);font-size:9px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.team-person span{display:block;color:var(--muted);font-size:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.profile-dot{width:28px;height:28px;border:1px solid #d9e5f2;background:#f7fbff;color:var(--blue);border-radius:9px;display:grid;place-items:center;flex:none}
.profile-dot svg{width:14px;height:14px}
.profile-dot:hover{background:#eaf3ff;border-color:#bfd5ef}
.teams-chat{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;overflow:hidden;background:#fff;min-height:420px;max-height:calc(100vh - 300px)}
.teams-chat-head{
  min-height:76px;
  padding:14px 16px;
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  border-bottom:1px solid #e8edf3
}
.teams-chat-head h3{margin:3px 0;color:var(--ink);font-size:16px}
.teams-chat-head p{margin:0;color:var(--muted);font-size:8px}
.team-call-strip{
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  padding:10px 14px;border-bottom:1px solid #d6e7dc;background:#f0faf4
}
.call-live{display:flex;align-items:center;gap:7px;color:#1a6c4b;font-size:8px}
.call-live b{font-size:9px}
.call-pulse{width:8px;height:8px;border-radius:50%;background:#24a66e;box-shadow:0 0 0 0 rgba(36,166,110,.35);animation:callPulse 1.5s infinite}
@keyframes callPulse{70%{box-shadow:0 0 0 7px rgba(36,166,110,0)}100%{box-shadow:0 0 0 0 rgba(36,166,110,0)}}
.call-participants{display:flex;gap:5px;flex-wrap:wrap;flex:1}
.call-chip{padding:5px 8px;border:1px solid #cfe6d8;border-radius:999px;background:#fff;color:#426356;font-size:7px;font-weight:800}
.teams-messages{min-height:0;overflow:auto;padding:16px 18px;background:linear-gradient(180deg,#fbfcfe,#f7f9fc)}
.team-message{display:flex;gap:10px;align-items:flex-start;margin:0 0 14px}
.team-message.mine{flex-direction:row-reverse}
.team-message-copy{max-width:min(680px,78%);min-width:0}
.team-message-copy>div{display:flex;gap:8px;align-items:center;margin-bottom:4px}
.team-message.mine .team-message-copy>div{justify-content:flex-end}
.team-message-copy b{color:var(--ink);font-size:12px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:46%}
.team-message-copy small{color:#657487;font-size:10px;font-weight:800;white-space:nowrap}
.team-message-copy span{color:#9aa4b1;font-size:10px;white-space:nowrap}
.team-message-copy p{
  margin:0;padding:10px 13px;border:1px solid #e0e6ed;border-radius:5px 14px 14px 14px;
  background:#fff;color:#3e4c61;font-size:13.5px;line-height:1.6;box-shadow:0 4px 12px rgba(14,38,70,.04);overflow-wrap:anywhere
}
.team-message.mine .team-message-copy p{border-color:#c8dcf5;border-radius:14px 5px 14px 14px;background:#eaf3ff}
.profile-panel{display:flex;gap:12px;align-items:center;margin-bottom:14px}
.profile-icon{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;background:#eaf3ff;color:var(--blue)}
.profile-icon svg{width:22px;height:22px}
.profile-panel b{display:block;color:var(--ink);font-size:13px}
.profile-panel span{display:block;color:var(--muted);font-size:10px;margin-top:3px}
.profile-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.profile-facts div{border:1px solid var(--line);border-radius:10px;padding:10px;background:#fbfdff}
.profile-facts small{display:block;color:var(--muted);font-size:8px;text-transform:uppercase;font-weight:900;margin-bottom:4px}
.profile-facts b{display:block;color:var(--ink);font-size:10px;overflow-wrap:anywhere}
.teams-empty{min-height:260px;display:grid;place-items:center;align-content:center;gap:5px;text-align:center}
.teams-empty b{color:var(--ink);font-size:15px}
.teams-empty span{color:var(--muted);font-size:9px}
.teams-composer{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px;padding:12px;border-top:1px solid #e4e9f0;background:#fff}
.teams-composer textarea{min-height:52px;max-height:130px;resize:vertical;padding:10px 12px;border:1px solid #d6dee8;border-radius:13px;outline:0;color:var(--ink);font-size:13px}
.teams-composer textarea:focus{border-color:#aac4e3;box-shadow:0 0 0 3px rgba(21,101,216,.07)}
.teams-composer .send{height:48px}
@media(max-width:920px){
  .teams-hero{display:block}
  .teams-hero .header-actions{margin-top:14px}
  .teams-shell{grid-template-columns:1fr}
  .teams-channels{max-height:280px}
}
@media(max-width:620px){
  .teams-hero{padding:20px}
  .teams-hero h2{font-size:23px}
  .teams-chat-head{align-items:flex-start;flex-direction:column}
  .team-message-copy{max-width:88%}
}

/* Teams chat upgrades: readability, DMs, quotes, files, pins. */
.team-message-copy b{font-size:13px;font-weight:800}
.team-message-copy p{font-size:13.5px;line-height:1.6}
.teams-composer{grid-template-columns:auto minmax(0,1fr) auto;align-items:end}
.teams-composer textarea{min-height:64px;font-size:14px;line-height:1.55}
.team-attach{height:48px;white-space:nowrap}
.teams-dm-head{margin-top:18px;padding-top:12px;border-top:1px solid #edf1f5}
.team-channel.team-dm .team-dm-hash{font-size:13px}
.team-dm-start{margin-left:auto;flex:none}
.team-person .team-dm-start{font-size:11px;padding:4px 8px}
.team-menu-btn{margin-left:auto;border:0;background:transparent;color:#9aa4b1;font-size:15px;font-weight:900;letter-spacing:1px;padding:0 6px;border-radius:8px;line-height:1;flex:none}
.team-new-pill{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);z-index:5;border:1px solid var(--blue);background:var(--blue);color:#fff;border-radius:999px;padding:7px 14px;font-size:11px;font-weight:800;box-shadow:0 8px 20px rgba(21,101,216,.3)}
/* In-chat event cards (own design, local icons only) */
.team-event-card{margin-top:8px;border:1px solid var(--line);border-radius:14px;padding:12px 14px;background:var(--soft,#f8fafc);max-width:min(420px,100%)}
.team-event-head{display:flex;gap:10px;align-items:center;margin-bottom:6px}
.team-event-cal{display:inline-flex;width:34px;height:34px;flex:none;border-radius:10px;background:var(--blue-soft);color:var(--blue);align-items:center;justify-content:center}
.team-event-cal svg{width:18px;height:18px}
.team-event-head b{display:block;font-size:12px;color:var(--ink)}
.team-event-head span{display:block;font-size:13px;font-weight:800;color:var(--ink)}
.team-event-org{font-size:11px;color:var(--muted);margin-bottom:10px}
.team-event-actions{display:flex;gap:6px;flex-wrap:wrap}
html[data-theme="dark"] .team-event-card{background:#141e30}
.team-menu-btn:hover{background:#eaf3ff;color:var(--blue)}
.team-quote{display:block;width:100%;text-align:left;margin:0 0 6px;padding:8px 10px;border:0;border-left:3px solid #aac4e3;border-radius:0 10px 10px 0;background:#f2f7fd;color:#3e4c61;cursor:pointer}
.team-quote b{display:block;font-size:12px;color:var(--blue)}
.team-quote span{display:block;font-size:12px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.team-quote-static{cursor:default;margin-bottom:12px}
.team-file-chip{display:flex;align-items:center;gap:10px;margin-top:8px;padding:9px 11px;border:1px solid #d6dee8;border-radius:12px;background:#f8fbff;color:var(--ink);text-decoration:none}
.team-file-chip:hover{border-color:#aac4e3;background:#eef5ff}
.team-file-icon svg{width:18px;height:18px;color:var(--blue)}
.team-file-meta{min-width:0;flex:1}
.team-file-meta b{display:block;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.team-file-meta small{display:block;font-size:11px;color:var(--muted)}
.team-file-dl svg{width:16px;height:16px;color:var(--blue)}
.team-pin-flag{display:inline-grid;place-items:center;color:#b98a12}
.team-pin-flag svg{width:13px;height:13px}
.team-pinned-strip{display:flex;align-items:center;gap:10px;padding:9px 14px;border-bottom:1px solid var(--line);background:#fff}
.team-pinned-strip[hidden]{display:none}
.team-pinned-pin{border:0;background:transparent;color:#b98a12}
.team-pinned-pin svg{width:16px;height:16px}
.team-pinned-copy{flex:1;min-width:0}
.team-pinned-copy b{display:block;font-size:11px;color:#7a5c0a;text-transform:uppercase;letter-spacing:.4px}
.team-pinned-copy span{display:block;font-size:13px;color:#5d4d15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.team-reply-bar,.team-file-bar{display:flex;align-items:center;gap:10px;padding:9px 14px;border-top:1px solid #e4e9f0;background:#f6f9fd}
.team-reply-bar>div,.team-file-bar>div{flex:1;min-width:0}
.team-reply-bar b,.team-file-bar b{display:block;font-size:12px;color:var(--ink)}
.team-reply-bar span,.team-file-bar span{display:block;font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.team-reply-icon svg{width:16px;height:16px;color:var(--blue)}
.team-message.team-flash .team-message-copy p{box-shadow:0 0 0 3px rgba(21,101,216,.35)}

/* Scrollbar styling - blue and white theme */
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}
::-webkit-scrollbar-track {
    background: #f0f4f8;
    border-radius: 5px;
}
::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #1765d1, #2b7de9);
    border-radius: 5px;
    border: 2px solid #f0f4f8;
}
::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #1458b8, #1a6ccf);
}
::-webkit-scrollbar-corner {
    background: #f0f4f8;
}

/* Firefox */
* {
    scrollbar-width: thin;
    scrollbar-color: #1765d1 #f0f4f8;
}

/* Conversation threads */
.thread-pill{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:18px;padding:0 6px;border-radius:999px;background:var(--blue-soft);color:var(--blue);font-size:9px;font-weight:900;vertical-align:1px;white-space:nowrap}
.thread-unseen{display:inline-flex;align-items:center;height:18px;padding:0 7px;border-radius:999px;background:var(--blue);color:#fff;font-size:8px;font-weight:900;vertical-align:1px;white-space:nowrap}
.thread-member{display:flex;align-items:center;gap:10px;width:100%;padding:12px;margin-bottom:8px;border:1px solid var(--line);border-radius:14px;background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer}
.thread-member:hover{background:var(--blue-soft)}
.thread-member .person-copy{flex:1;min-width:0}
.thread-member .person-copy b{display:block;font-size:10px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.thread-member .person-copy span{display:block;margin-top:2px;font-size:8px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.thread-member.is-unread .person-copy b{font-weight:900}
.thread-member .mini{flex:none}

/* Drag & drop targets */
.mail-item[draggable="true"]{cursor:grab}
.mail-item[draggable="true"]:active{cursor:grabbing}
.offline-banner{margin:12px 16px 0;padding:10px 14px;border:1px solid var(--gold,#ecb543);border-radius:12px;background:var(--gold-soft,#fff8e5);color:var(--ink);font-size:10px;font-weight:700}
.drag-over{outline:2px dashed var(--blue) !important;outline-offset:-2px;border-radius:12px;background:var(--blue-soft) !important}
#dFiles.drag-over{min-height:120px}

/* Forms: cards, builder and live preview */
.fm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.fm-card{border:1px solid var(--line);border-radius:14px;padding:14px;background:var(--card)}
.fm-card-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px}
.fm-card-top b{font-size:12px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fm-card-count{font-size:11px;color:var(--muted);margin-bottom:10px}
.fm-card-actions{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.fm-builder{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:14px;align-items:start}
@media(max-width:900px){.fm-builder{grid-template-columns:1fr}}
.fm-field-card{border:1px solid var(--line);border-radius:14px;padding:12px;margin-bottom:10px;background:var(--card)}
.fm-field-head{display:flex;gap:8px;align-items:center;margin-bottom:10px}
.fm-field-head b{font-size:11px;color:var(--ink);flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fm-field-num{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;flex:none;border-radius:50%;background:var(--blue-soft);color:var(--blue);font-size:10px;font-weight:900}
.fm-preview{position:sticky;top:12px;border:1px solid var(--line);border-radius:14px;padding:22px;background:#fbfcfe}
.fm-preview-head{font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.fm-preview h2{margin:0 0 8px;font-size:18px;color:var(--ink)}
.fm-pv-desc{margin:0 0 14px;color:var(--muted);font-size:12px;line-height:1.6}
.fm-pv-field{display:grid;gap:5px;margin-bottom:12px}
.fm-pv-field label{font-size:11px;font-weight:700;color:#5e6e82}
.fm-pv-field input,.fm-pv-field textarea,.fm-pv-field select{width:100%;border:1px solid #d4deea;border-radius:8px;padding:10px 12px;background:#fff;color:var(--ink);font-size:12px}
.fm-pv-field textarea{min-height:70px;resize:vertical}
.fm-pv-actions{display:flex;justify-content:flex-end;margin-top:6px}
html[data-theme="dark"] .fm-preview{background:#141e30}
html[data-theme="dark"] .fm-pv-field input,html[data-theme="dark"] .fm-pv-field textarea,html[data-theme="dark"] .fm-pv-field select{background:#101a2c;border-color:var(--line)}

/* New-document picker cards */
.doc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin-top:4px}
.doc-card{display:flex;flex-direction:column;overflow:hidden;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:0;cursor:pointer;text-align:left}
.doc-card:hover{border-color:var(--blue)}
.doc-tab{height:10px;width:42%;border-bottom-right-radius:8px}
.doc-meta{display:flex;gap:10px;padding:14px;align-items:flex-start}
.doc-icon{width:34px;height:34px;flex:none;border-radius:7px;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:12px;border:1px solid;background:#f3f4f6}
.doc-meta b{display:block;font-size:12px;color:var(--ink)}
.doc-meta b small{font-weight:400;color:var(--muted)}
.doc-meta span span{display:block;font-size:10px;color:var(--muted);margin-top:3px;line-height:1.5}

/* Uploads tray: pinned top-center, persistent while work remains */
.upload-tray{position:fixed;top:70px;left:50%;transform:translateX(-50%);width:min(480px,92vw);max-height:min(60vh,520px);overflow:auto;background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);z-index:80;padding:12px 14px}
.upload-tray-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px}
.upload-tray-title{display:flex;align-items:baseline;gap:8px;min-width:0}
.upload-tray-title b{font-size:12px;color:var(--ink)}
#uploadTraySummary{font-size:10px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.upload-tray-tools{display:flex;gap:6px;flex:none}
.upload-tray-bar{height:7px;border-radius:999px;background:#e7edf5;margin:0 0 10px;overflow:hidden}
.upload-tray-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--blue),#62a2ef);transition:width .2s}
.upload-row{border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:8px}
.upload-row-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px}
.upload-row-top b{font-size:11px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.upload-row-bar{height:7px;border-radius:999px;background:#e7edf5;overflow:hidden;margin-bottom:4px}
.upload-row-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--blue),#62a2ef);transition:width .15s}

/* Automation canvas (ac-): node cards, wires, inspector, badges. Dark-theme safe via vars. */
.ac-tabs{display:flex;gap:6px;margin:12px 0;flex-wrap:wrap}
.ac-tab{border:1px solid var(--line);border-radius:9px;padding:7px 13px;background:var(--card);color:var(--ink);font-size:12px;font-weight:700;cursor:pointer}
.ac-tab.on{background:var(--blue);border-color:var(--blue);color:#fff}
.ac-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.ac-title input{border:1px solid var(--line);border-radius:9px;padding:8px 11px;font-size:15px;font-weight:800;color:var(--ink);background:var(--card);width:min(340px,60vw)}
.ac-actions{display:flex;gap:6px;flex-wrap:wrap}
.ac-toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.ac-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:12px}
@media(max-width:900px){.ac-grid{grid-template-columns:1fr}}
.ac-viewport{border:1px solid var(--line);border-radius:14px;background:var(--card);min-height:480px;max-height:70vh;overflow:auto;position:relative;background-image:radial-gradient(circle,#c7d3e4 1px,transparent 1px);background-size:22px 22px}
.ac-canvas{position:relative;min-width:650px;min-height:570px}
.ac-wires{position:absolute;inset:0;pointer-events:none}
.ac-wire{fill:none;stroke:#a1b5d4;stroke-width:2}
.ac-node{position:absolute;width:210px;border:1px solid var(--line);border-radius:12px;background:var(--card);box-shadow:var(--shadow);cursor:pointer}
.ac-node.sel{outline:2px solid var(--blue);outline-offset:1px}
.ac-node-main{display:flex;gap:9px;align-items:center;padding:10px 11px}
.ac-ico{width:32px;height:32px;flex:none;border-radius:9px;display:grid;place-items:center;background:var(--blue-soft);color:var(--blue);font-size:16px;font-weight:800}
.ac-ico.trig{background:#e7f4ec;color:#16825d}
.ac-ico.logic{background:#fff4dd;color:#8a6410}
.ac-node-tx{min-width:0}
.ac-node-tx b{display:block;font-size:12px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ac-node-tx span{display:block;font-size:10px;color:var(--muted)}
.ac-node-foot{display:flex;justify-content:space-between;padding:6px 11px;border-top:1px solid var(--line);font-size:10px;color:var(--muted)}
.ac-portbtns{display:flex;gap:4px;flex-wrap:wrap;padding:7px 9px;border-top:1px solid var(--line)}
.ac-portbtns .small-btn{padding:3px 8px;font-size:10px}
.ac-start{text-align:center;padding:90px 20px}
.ac-start-btn{width:52px;height:52px;border-radius:50%;font-size:24px;background:var(--blue);border:0;color:#fff;cursor:pointer}
.ac-inspector{padding:14px;align-self:start;max-height:70vh;overflow:auto}
.ac-inspector h4{margin:0 0 8px;color:var(--ink);font-size:13px}
.ac-field{margin-bottom:10px}
.ac-field label{display:block;font-size:11px;font-weight:700;color:var(--muted);margin-bottom:4px}
.ac-field input,.ac-field select,.ac-field textarea{width:100%;border:1px solid var(--line);border-radius:8px;padding:7px 9px;font-size:12px;color:var(--ink);background:var(--card)}
.ac-hint{font-size:10px;color:var(--muted);margin-top:4px;line-height:1.5}
.ac-note{border:1px solid var(--line);border-radius:9px;padding:9px 11px;font-size:11px;color:var(--muted);margin:10px 0;background:var(--card)}
.ac-conn{display:flex;justify-content:space-between;align-items:center;gap:6px;font-size:11px;padding:6px 0;border-top:1px solid var(--line)}
.ac-pills{display:flex;gap:5px;flex-wrap:wrap;margin:10px 0}
.ac-choice{display:flex;gap:10px;align-items:center;width:100%;text-align:left;border:1px solid var(--line);border-radius:10px;padding:9px 11px;background:var(--card);margin-bottom:7px;cursor:pointer;color:var(--ink)}
.ac-choice-tx{flex:1;min-width:0}
.ac-choice-tx b{display:block;font-size:12px}
.ac-choice-tx span{display:block;font-size:11px;color:var(--muted)}
.ac-plus{font-size:18px;color:var(--blue);font-weight:800}
.ac-code{background:#0f172a;color:#dbe7f5;border-radius:9px;padding:10px 12px;font-size:11px;max-height:260px;overflow:auto;white-space:pre-wrap}
.ac-step{padding:10px 12px;margin:8px 0}
.ac-step summary{cursor:pointer;font-size:12px;color:var(--ink)}

/* Automation canvas (ac-) — appended, no existing rules touched */
.ac-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
.ac-head{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.ac-name{flex:1;min-width:200px;font-size:15px;font-weight:800;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:10px;padding:9px 12px}
.ac-actions{display:flex;gap:8px;flex-wrap:wrap}
.ac-toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.ac-grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:12px;align-items:start}
@media(max-width:900px){.ac-grid{grid-template-columns:1fr}}
.ac-canvas-card{padding:0;overflow:hidden}
.ac-viewport{overflow:auto;max-height:560px;min-height:380px;background:var(--bg,transparent);background-image:radial-gradient(circle,#c4d2e5 1px,transparent 1px);background-size:22px 22px;border-radius:12px}
.ac-canvas{position:relative;min-width:680px;min-height:560px}
.ac-wires{position:absolute;inset:0;pointer-events:none;overflow:visible}
.ac-wire{fill:none;stroke:#a1b5d4;stroke-width:2}
.ac-start{position:absolute;left:50%;top:120px;transform:translateX(-50%);text-align:center;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:26px 34px;box-shadow:var(--shadow)}
.ac-start h3{margin:12px 0 6px;color:var(--ink)}
.ac-node{position:absolute;width:200px;background:var(--card);border:1.5px solid var(--line);border-radius:12px;padding:10px;cursor:grab;box-shadow:var(--shadow)}
.ac-node.selected{border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-soft)}
.ac-node:focus-visible{outline:3px solid #a8c4ff;outline-offset:2px}
.ac-node-main{display:flex;gap:9px;align-items:center}
.ac-node-icon{display:grid;place-items:center;width:34px;height:34px;flex:none;border-radius:10px;background:#eef3fb;color:var(--blue);font-size:17px;font-weight:800}
.ac-node-icon.trigger{background:#e7f4ec;color:#16825d}
.ac-node-icon.logic{background:#fff4dd;color:#8a6410}
.ac-node-title{font-size:12px;font-weight:800;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:128px}
.ac-node-meta{font-size:10px;color:var(--muted)}
.ac-node-foot{display:flex;justify-content:space-between;margin-top:8px;font-size:9px;color:var(--muted)}
.ac-ports{display:flex;flex-wrap:wrap;gap:4px;margin-top:8px}
.ac-port{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:3px 9px;font-size:10px;font-weight:700;cursor:pointer}
.ac-port:hover{border-color:var(--blue);background:var(--blue-soft)}
.ac-inspector{padding:14px}
.ac-inspector h3{margin:0 0 8px;color:var(--ink)}
.ac-inspector h4{margin:14px 0 6px;color:var(--ink);font-size:12px}
.ac-badge{display:inline-block;padding:2px 10px;border-radius:999px;background:var(--blue-soft);color:var(--blue);font-size:10px;font-weight:800}
.ac-conn{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:11px;color:var(--ink);padding:6px 0;border-top:1px solid var(--line)}
.ac-hint{padding:10px 14px}
.ac-latest{margin-top:12px;padding:14px}
.ac-modal-back{position:fixed;inset:0;background:rgba(20,35,60,.45);display:grid;place-items:center;z-index:90;padding:16px}
.ac-modal{background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);width:min(560px,94vw);max-height:84vh;overflow:auto;padding:18px}
.ac-modal h3{margin:0 0 10px;color:var(--ink)}
.ac-pills{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px}
.ac-choice{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);padding:10px 12px;margin-bottom:8px;cursor:pointer}
.ac-choice:hover{border-color:var(--blue);background:var(--blue-soft)}
.ac-choice b{display:block;font-size:12px}
.ac-choice i{display:block;font-style:normal;font-size:10px;color:var(--muted)}
.ac-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.ac-card{padding:14px}
.ac-card h3{margin:8px 0 6px;color:var(--ink);font-size:13px}
.ac-run{margin-bottom:12px;padding:12px}
.ac-step{display:flex;gap:8px;align-items:baseline;font-size:11px;color:var(--ink);padding:5px 0;border-top:1px solid var(--line)}
.ac-step i{color:var(--muted);font-style:normal}
.ac-code{background:#0f1f38;color:#d7e5fa;border-radius:10px;padding:10px;font-size:11px;max-height:220px;overflow:auto;white-space:pre-wrap}

/* Automation canvas extras (ac-): badges, cards, modal, node details. */
.ac-node.selected{outline:2px solid var(--blue);outline-offset:1px}
.ac-name{border:1px solid var(--line);border-radius:9px;padding:8px 11px;font-size:15px;font-weight:800;color:var(--ink);background:var(--card);width:min(340px,60vw)}
.ac-canvas-card{padding:10px}
.ac-node-icon{width:32px;height:32px;flex:none;border-radius:9px;display:grid;place-items:center;background:var(--blue-soft);color:var(--blue);font-size:16px;font-weight:800}
.ac-node-icon.trigger{background:#e7f4ec;color:#16825d}
.ac-node-icon.logic{background:#fff4dd;color:#8a6410}
.ac-node-title{font-size:12px;font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ac-node-meta{font-size:10px;color:var(--muted)}
.ac-node-foot{display:flex;justify-content:space-between;padding:6px 11px;border-top:1px solid var(--line);font-size:10px;color:var(--muted)}
.ac-ports{display:flex;gap:4px;flex-wrap:wrap;padding:7px 9px;border-top:1px solid var(--line)}
.ac-port{border:1px solid var(--line);border-radius:7px;padding:3px 8px;font-size:10px;background:var(--card);color:var(--ink);cursor:pointer;font-weight:700}
.ac-port:hover{border-color:var(--blue);background:var(--blue-soft)}
.ac-latest{margin-top:12px;padding:14px}
.ac-latest h3{margin:0 0 10px;font-size:13px;color:var(--ink)}
.ac-run{padding:12px;margin-bottom:10px}
.ac-run h4{margin:10px 0 5px;font-size:12px;color:var(--ink)}
.ac-badge{display:inline-block;padding:3px 9px;border-radius:999px;background:var(--blue-soft);color:var(--blue);font-size:10px;font-weight:800}
.ac-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.ac-card{padding:14px}
.ac-card h3{margin:8px 0 6px;font-size:13px;color:var(--ink)}
.ac-modal-back{position:fixed;inset:0;background:rgba(10,25,50,.45);z-index:200;display:grid;place-items:center;padding:16px}
.ac-modal{background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);width:min(560px,94vw);max-height:86vh;overflow:auto;padding:18px}
.ac-modal h3{margin:0 0 10px;font-size:15px;color:var(--ink)}
.ac-modal .field{margin-bottom:10px}
.ac-modal .field input,.ac-modal .field select,.ac-modal .field textarea{width:100%;border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-size:12px;color:var(--ink);background:var(--card)}

/* Enterprise settings + automation workspace polish */
#setBody.large-module{padding:24px}
#setNav.nav{gap:6px}
#setNav .nav-item{font-size:13px;line-height:1.25;padding:11px 12px;border-radius:12px}
.settings-section-head{align-items:center;margin-bottom:22px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.settings-section-head h3{font-size:20px;letter-spacing:0;font-weight:850}
.settings-section-head p{font-size:13px;max-width:760px}
.settings-form-grid{gap:18px 18px}
.settings-form-grid .form-block{padding:14px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(180deg,#fff,rgba(247,250,255,.72));margin:0}
.form-label{font-size:13px;font-weight:850;color:var(--ink);display:block;margin-bottom:7px}
.field-hint{font-size:12px;color:var(--muted);line-height:1.45;margin-top:7px}
.settings-form-grid .field input,.settings-form-grid .field select,#setBody .field input,#setBody .field select,#setBody .field textarea{font-size:13px;min-height:38px}
.settings-preview{margin-top:18px;border:1px solid var(--line);border-radius:13px;padding:13px 14px;background:#f8fbff;font-size:13px;color:var(--ink)}
#setBody .device-row{padding:14px 0}
#setBody .device-row b{font-size:13px!important}
#setBody .meta-text{font-size:12px;line-height:1.45}
#setBody select{font-size:13px!important;min-height:38px}
.automation-enterprise-hero{display:flex;justify-content:space-between;gap:18px;align-items:flex-end;border:1px solid var(--line);border-radius:18px;padding:20px;background:linear-gradient(135deg,#f7fbff,#fff)}
.automation-enterprise-hero h3{margin:4px 0 6px;font-size:22px;color:var(--ink)}
.automation-enterprise-hero p{margin:0;color:var(--muted);font-size:13px;line-height:1.5;max-width:680px}
.automation-hero-stats{display:grid;grid-template-columns:auto auto;gap:4px 10px;align-items:baseline;min-width:170px}
.automation-hero-stats b{font-size:24px;color:var(--ink)}
.automation-hero-stats span{font-size:11px;color:var(--muted);font-weight:800;text-transform:uppercase}
.ac-project-actions{margin:14px 0}
.ac-project-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.ac-project-card{border:1px solid var(--line);border-radius:16px;background:var(--card);box-shadow:var(--shadow);padding:15px;display:flex;gap:12px;align-items:center;text-align:left;cursor:pointer;color:var(--ink)}
.ac-project-card:hover{border-color:var(--blue);transform:translateY(-1px)}
.ac-project-card b{display:block;font-size:15px;color:var(--ink);margin-bottom:3px}
.ac-project-card span{display:block;font-size:12px;color:var(--muted);line-height:1.35}
.ac-project-card strong{margin-left:auto;font-size:11px;color:var(--blue)}
.ac-folder-icon{background:linear-gradient(135deg,#eaf3ff,#f7fbff);color:var(--blue)}
.ac-folder-head{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;margin-bottom:14px;border:1px solid var(--line);border-radius:16px;padding:14px;background:#fbfdff}
.ac-folder-head h3{margin:2px 0 3px;font-size:20px;color:var(--ink)}
.ac-folder-head p{margin:0;color:var(--muted);font-size:12px}
.ac-workflow-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.ac-workflow-card{border:1px solid var(--line);border-radius:16px;background:var(--card);box-shadow:var(--shadow);padding:15px}
.ac-workflow-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.ac-workflow-card h3{margin:0 0 6px;font-size:16px;color:var(--ink)}
.ac-workflow-card p{min-height:44px;margin:0 0 14px;color:var(--muted);font-size:12px;line-height:1.45}
.ac-context{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.ac-context span{font-size:12px;color:var(--muted);font-weight:800}
@media(max-width:700px){
  #setBody.large-module{padding:16px}
  .automation-enterprise-hero,.ac-folder-head{display:block}
  .automation-hero-stats{margin-top:14px}
}

/* ms- MediaStudio (browser-native image/video editing overlay) */
.ms-overlay{position:fixed;inset:0;z-index:2000;background:rgba(10,20,40,.72);display:flex;align-items:center;justify-content:center;padding:18px;overflow:auto}
.ms-panel{background:var(--card,#fff);color:var(--ink,#172338);border-radius:18px;max-width:1060px;width:100%;max-height:94vh;overflow:auto;padding:20px;box-shadow:0 24px 60px rgba(0,0,0,.35)}
.ms-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:6px}
.ms-head h2{margin:2px 0 0;font-size:16px;color:var(--ink,#172338)}
.ms-kicker{font-size:10px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:var(--blue,#1565d8)}
.ms-status{font-size:12px;color:var(--text,#475469);background:var(--soft,#f8fafc);border:1px solid var(--line,#e4e9f1);border-radius:10px;padding:8px 10px;margin:8px 0;min-height:34px}
.ms-body{display:flex;flex-direction:column;gap:12px}
.ms-video{width:100%;max-height:46vh;background:#000;border-radius:12px}
.ms-vout h3{margin:10px 0 6px;font-size:13px;color:var(--ink,#172338)}
.ms-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.ms-grid label{display:flex;flex-direction:column;gap:5px;font-size:11px;font-weight:700;color:var(--text,#475469)}
.ms-grid input[type=text],.ms-grid input[type=number],.ms-grid select{background:var(--soft,#f8fafc);border:1px solid var(--line,#e4e9f1);border-radius:9px;padding:7px 9px;font-size:12px;color:var(--ink,#172338)}
.ms-grid input[type=range]{accent-color:var(--blue,#1565d8)}
.ms-wide{grid-column:1/-1}
.ms-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.ms-btn{border:1px solid var(--line,#e4e9f1);background:#fff;color:var(--ink,#172338);border-radius:10px;padding:8px 12px;font-size:12px;font-weight:700}
.ms-btn.primary{background:linear-gradient(135deg,var(--blue,#1565d8),var(--blue2,#2f7ee8));border:0;color:#fff}
.ms-btn:disabled{opacity:.45;cursor:not-allowed}
.ms-close{white-space:nowrap}
.ms-progress{display:flex;align-items:center;gap:10px;background:var(--soft,#f8fafc);border:1px solid var(--line,#e4e9f1);border-radius:10px;padding:8px 10px;font-size:12px}
.ms-progress i{display:block;height:8px;border-radius:99px;background:linear-gradient(90deg,var(--blue,#1565d8),var(--blue2,#2f7ee8));width:0;flex:1}
.ms-muted{font-size:11px;color:var(--muted,#8893a5);margin:0}
.ms-note{background:var(--gold-soft,#fff8e5);border:1px solid var(--line,#e4e9f1);border-radius:12px;padding:14px}
.ms-note h3{margin:0 0 6px;font-size:14px;color:var(--ink,#172338)}
.ms-note p{margin:0 0 10px;font-size:12px;color:var(--text,#475469)}
.ms-canvas-wrap{position:relative;background:#0b1526;border-radius:12px;overflow:hidden;display:flex;justify-content:center}
.ms-canvas{max-width:100%;max-height:52vh;cursor:crosshair}
.ms-sel{position:absolute;border:2px dashed #fff;outline:1px solid var(--blue,#1565d8);background:rgba(21,101,216,.15);pointer-events:none}
.ms-draft{display:flex;flex-wrap:wrap;gap:8px;align-items:center;background:var(--blue-soft,#edf4ff);border:1px solid var(--line,#e4e9f1);border-radius:10px;padding:8px 10px;font-size:12px}
.ms-entry{margin-top:10px;display:flex;justify-content:center}
@media(max-width:640px){.ms-overlay{padding:8px}.ms-panel{padding:14px}}


/* GiGo AI — premium compact workspace assistant, 2026-10-06 */
.ai-panel{border:1px solid var(--line)!important;border-radius:20px!important;background:var(--card)!important;box-shadow:0 24px 70px rgba(28,54,92,.20)!important}
.ai-panel-head{padding:16px 18px 14px;border-bottom:1px solid var(--line);background:var(--card);position:sticky;top:0;z-index:4}
.ai-panel-head>div{min-width:0;flex:1}.ai-panel-head .meta-text{margin-top:2px}
#aiBody{padding:14px 16px 16px;overflow:auto;max-height:calc(84vh - 64px)}
.ai-modebar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.ai-sources-tab{display:flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:12px;padding:8px 10px;font:inherit;font-size:12px;font-weight:800;cursor:pointer}
.ai-sources-tab:hover,.ai-sources-tab[aria-expanded="true"]{border-color:var(--blue);background:var(--blue-soft)}
.ai-sources-tab-icon{display:grid;place-items:center;width:20px;height:20px;border-radius:7px;background:var(--blue);color:#fff;font-size:15px;line-height:1}
.ai-sources-tab b{min-width:20px;height:20px;padding:0 6px;border-radius:999px;display:grid;place-items:center;background:#eef3fa;color:var(--text);font-size:10px}
.ai-chevron{font-size:14px;color:var(--muted)}
.ai-efficient-badge{font-size:10px;font-weight:850;color:#15704a;background:#e8f6ef;border:1px solid #cfeada;padding:6px 9px;border-radius:999px;white-space:nowrap}
.ai-source-drawer{border:1px solid var(--line);border-radius:15px;background:#f8fbff;margin:0 0 12px;padding:12px;animation:aiDrawerIn .16s ease-out}
@keyframes aiDrawerIn{from{opacity:.2;transform:translateY(-6px)}to{opacity:1;transform:none}}
.ai-source-drawer-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:10px}
.ai-source-drawer-head b{display:block;font-size:13px;color:var(--ink)}
.ai-source-drawer-head span{display:block;font-size:10px;color:var(--muted);margin-top:2px}
.ai-source-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.ai-source-action{display:flex;align-items:center;gap:8px;text-align:left;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:12px;padding:9px;cursor:pointer}
.ai-source-action:hover{border-color:var(--blue);background:var(--blue-soft)}
.ai-source-action-icon{display:grid;place-items:center;width:30px;height:30px;flex:none;border-radius:9px;background:#eef4ff;color:var(--blue);font-weight:900}
.ai-source-action b,.ai-source-action small{display:block}.ai-source-action b{font-size:11px}.ai-source-action small{font-size:9px;color:var(--muted);margin-top:2px;line-height:1.25}
.ai-source-list{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.ai-source-item{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:11px;padding:8px 9px}
.ai-source-item b,.ai-source-item small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ai-source-item b{font-size:11px;color:var(--ink)}.ai-source-item small{font-size:9px;color:var(--muted);margin-top:1px}
.ai-source-dot{width:8px;height:8px;border-radius:50%;background:var(--blue)}
.ai-source-empty{border:1px dashed #cad7e7;border-radius:11px;padding:12px;text-align:center}.ai-source-empty b,.ai-source-empty span{display:block}.ai-source-empty b{font-size:11px;color:var(--ink)}.ai-source-empty span{font-size:10px;color:var(--muted);margin-top:3px}
.ai-suggest{display:flex;gap:7px;overflow-x:auto;flex-wrap:nowrap;margin:0 0 10px;padding-bottom:2px;scrollbar-width:thin}
.ai-prompt-chip{white-space:nowrap;border:1px solid var(--line);background:#fff;color:var(--text);border-radius:999px;padding:7px 10px;font-size:10px;font-weight:750;cursor:pointer}
.ai-prompt-chip:hover{border-color:var(--blue);color:var(--blue);background:var(--blue-soft)}
.ai-thread{max-height:38vh;min-height:130px;padding:6px 3px 12px;margin:0;scrollbar-width:thin}
.ai-bubble{font-size:12.5px;line-height:1.55}.ai-bubble.gigo{background:#f7f9fc}
.ai-thinking-label{font-size:9px;color:var(--muted);margin-left:7px;font-weight:800}
.ai-response-meta{font-size:9px;color:var(--muted);margin-top:5px}
.ai-composer-shell{border:1px solid #ccd8e8;border-radius:15px;background:#fff;box-shadow:0 6px 18px rgba(27,61,105,.07);padding:9px 10px;margin-top:8px}
.ai-composer-shell textarea{width:100%;min-height:72px;max-height:170px;resize:vertical;border:0!important;outline:0!important;background:transparent!important;color:var(--ink);font:inherit;font-size:13px;line-height:1.5;padding:3px 2px}
.ai-composer-foot{display:flex;align-items:center;gap:8px;padding-top:8px;border-top:1px solid #edf1f6}
.ai-plus-btn{width:35px;height:35px;flex:none;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--blue);font-size:19px;font-weight:700;cursor:pointer}
.ai-plus-btn:hover{background:var(--blue-soft);border-color:var(--blue)}
.ai-deep-toggle{display:flex;align-items:center;gap:7px;min-width:0;cursor:pointer;flex:1}
.ai-deep-toggle>input{position:absolute;opacity:0;pointer-events:none}
.ai-toggle-track{width:35px;height:20px;border-radius:999px;background:#cbd5e1;position:relative;flex:none;transition:.15s}
.ai-toggle-track i{position:absolute;width:14px;height:14px;border-radius:50%;background:#fff;left:3px;top:3px;transition:.15s;box-shadow:0 1px 3px rgba(0,0,0,.18)}
.ai-deep-toggle input:checked+.ai-toggle-track{background:var(--blue)}.ai-deep-toggle input:checked+.ai-toggle-track i{transform:translateX(15px)}
.ai-deep-toggle b,.ai-deep-toggle small{display:block}.ai-deep-toggle b{font-size:10px;color:var(--ink)}.ai-deep-toggle small{font-size:8px;color:var(--muted);margin-top:1px;white-space:nowrap}
.ai-send-btn{display:flex;align-items:center;gap:8px;flex:none;border:0;background:var(--blue);color:#fff;border-radius:10px;padding:9px 12px;font-size:11px;font-weight:850;cursor:pointer}
.ai-send-btn:hover{filter:brightness(.97)}.ai-send-btn:disabled{opacity:.55;cursor:wait}
.ai-admin-fold{margin-top:12px;border-top:1px solid var(--line);padding-top:9px}.ai-admin-fold summary{font-size:10px;color:var(--muted);font-weight:800;cursor:pointer}
.ai-drive-crumbs{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-bottom:10px}.ai-drive-crumbs button{border:0;background:transparent;color:var(--blue);font-size:10px;font-weight:800;cursor:pointer;padding:2px}
.ai-drive-source-list{display:flex;flex-direction:column;gap:6px;max-height:44vh;overflow:auto}
.ai-drive-source-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:8px;align-items:center;padding:9px;border:1px solid var(--line);border-radius:11px;background:var(--card)}
.ai-drive-source-row b,.ai-drive-source-row small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ai-drive-source-row b{font-size:11px}.ai-drive-source-row small{font-size:9px;color:var(--muted);margin-top:2px}
.ai-drive-source-glyph{width:28px;height:28px;border-radius:8px;background:#eef4ff;color:var(--blue);display:grid;place-items:center;font-size:10px;font-weight:900}
html[data-theme="dark"] .ai-source-drawer,html[data-theme="dark"] .ai-source-action,html[data-theme="dark"] .ai-source-item,html[data-theme="dark"] .ai-prompt-chip,html[data-theme="dark"] .ai-composer-shell,html[data-theme="dark"] .ai-plus-btn{background:#141f31;color:var(--ink)}
html[data-theme="dark"] .ai-bubble.gigo{background:#172337}
@media(max-width:620px){.ai-panel{right:8px!important;bottom:62px!important;width:calc(100vw - 16px)!important}.ai-source-actions{grid-template-columns:1fr}.ai-deep-toggle small{display:none}.ai-send-btn span:first-child{display:none}}


/* Workflow approval action popup */
.approval-alert-popup{
  position:fixed;
  top:92px;
  right:22px;
  z-index:190;
  width:min(390px,calc(100vw - 32px));
}
.approval-alert-card{
  border:1px solid #cfdcf0;
  border-radius:18px;
  background:#fff;
  box-shadow:0 22px 60px rgba(23,51,88,.22);
  padding:16px;
}
.approval-alert-head{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:start;
  gap:10px;
}
.approval-alert-icon{
  width:42px;
  height:42px;
  border-radius:13px;
  display:grid;
  place-items:center;
  background:#eaf3ff;
  color:#2168d7;
  font-size:17px;
  font-weight:950;
}
.approval-alert-kicker{
  display:block;
  color:#2168d7;
  font-size:8px;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.08em;
  margin:2px 0 3px;
}
.approval-alert-head h3{
  margin:0;
  color:var(--ink);
  font-size:15px;
  line-height:1.3;
}
.approval-alert-count{
  white-space:nowrap;
  border-radius:999px;
  background:#fff3d8;
  color:#8a5c0e;
  padding:5px 8px;
  font-size:8px;
  font-weight:900;
}
.approval-alert-body{
  margin:12px 0 0;
  color:var(--muted);
  font-size:10px;
  line-height:1.5;
}
.approval-alert-actions{
  display:grid;
  grid-template-columns:1fr 1.25fr;
  gap:8px;
  margin-top:14px;
}
.approval-alert-actions .small-btn{
  min-height:40px;
  justify-content:center;
}
.approval-alert-link{
  display:block;
  margin:10px auto 0;
  border:0;
  background:transparent;
  color:#516782;
  font-size:8.5px;
  font-weight:850;
  cursor:pointer;
}
.approval-alert-link:hover{
  color:#2168d7;
}
html[data-theme="dark"] .approval-alert-card{
  background:#141f31;
  border-color:#31445f;
}
@media(max-width:700px){
  .approval-alert-popup{
    top:auto;
    right:12px;
    left:12px;
    bottom:18px;
    width:auto;
  }
  .approval-alert-head{
    grid-template-columns:auto minmax(0,1fr);
  }
  .approval-alert-count{
    grid-column:2;
    justify-self:start;
  }
}


/* ===== Pure Mail 2026 full UI audit upgrade: core shell + mail ===== */
:root{
  --ux-radius-sm:10px;--ux-radius-md:14px;--ux-radius-lg:18px;--ux-shadow-sm:0 4px 14px rgba(23,35,56,.055);
  --ux-shadow-md:0 12px 32px rgba(23,35,56,.08);--ux-shadow-lg:0 22px 55px rgba(23,35,56,.12);
  --ux-focus:0 0 0 3px rgba(21,101,216,.14)
}
html{scrollbar-gutter:stable}
body{font-size:13px;line-height:1.5}
button{touch-action:manipulation}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--blue)!important;outline-offset:2px!important}
::selection{background:rgba(21,101,216,.18)}
#appScreen .card,#appScreen .panel{border-color:#dfe6ef;box-shadow:var(--ux-shadow-sm)}
#appScreen .small-btn{min-height:36px;border-radius:10px;padding:0 12px;font-size:10px;font-weight:800}
#appScreen .small-btn.primary{box-shadow:0 7px 18px rgba(21,101,216,.14)}
#appScreen .small-btn:hover:not(:disabled){transform:translateY(-1px)}
#appScreen .small-btn:active:not(:disabled){transform:none}
.app-shell{grid-template-columns:72px minmax(0,1fr);background:#f3f6fa}
.rail{width:72px;padding:12px 8px;gap:7px;box-shadow:8px 0 30px rgba(8,41,90,.08)}
.logo{width:46px;height:46px;border-radius:14px;margin-bottom:10px}
.rail-btn{width:46px;height:44px;border-radius:13px}
.rail-btn:after{content:attr(data-ux-tip);position:absolute;left:56px;top:50%;transform:translate(4px,-50%);z-index:250;padding:7px 9px;border-radius:8px;background:#172338;color:#fff;font-size:9px;font-weight:800;line-height:1;white-space:nowrap;opacity:0;pointer-events:none;transition:.14s ease;box-shadow:var(--ux-shadow-md)}
.rail-btn:hover:after,.rail-btn:focus-visible:after{opacity:1;transform:translate(0,-50%)}
.rail-btn.active{background:rgba(255,255,255,.15);box-shadow:inset 0 0 0 1px rgba(255,255,255,.05)}
.rail-btn.active:before{left:-8px;height:24px}
.sidebar{left:72px;width:var(--sidebar);border-right:1px solid #dfe6ef;box-shadow:10px 0 28px rgba(23,35,56,.035)}
.sidebar-inner{padding:16px 14px 22px}
.sidebar-head{padding:7px 10px 14px;border-bottom:0}
.sidebar-head h1{font-size:19px}.sidebar-head p{font-size:9px;letter-spacing:.08em}
.compose{min-height:48px;border-radius:14px;margin:0 0 14px;box-shadow:0 9px 22px rgba(21,101,216,.18)}
.nav-title{display:flex;align-items:center;justify-content:space-between;min-height:32px;padding:9px 10px 6px;letter-spacing:.08em}
.nav{gap:2px}.nav-item{min-height:40px;padding:0 11px;border-radius:10px;font-size:11px}.nav-item svg{width:17px;height:17px}
.nav-item:hover{background:#f2f6fb}.nav-item.active{background:#eaf2ff;color:#135fc8;box-shadow:inset 3px 0 0 #3478e5}
.sidebar-note{margin:14px 8px 0!important;border-radius:12px!important;background:#f7faff!important;border:1px solid #e0e9f5!important}
.storage{margin:16px 6px 0;padding:12px;border-radius:13px;background:#f8fafc}.storage:hover{border-color:#c3d5ee;background:#f4f8fe}
.topbar{height:74px;padding:11px 16px;background:rgba(243,246,250,.92);backdrop-filter:blur(18px);z-index:40}
.topbar-inner{border-radius:16px;padding:0 10px 0 15px;box-shadow:var(--ux-shadow-sm)}
.page-title{min-width:180px}.page-title strong{font-size:14px;line-height:1.25}.page-title span{display:block;max-width:250px;margin-top:2px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.search{max-width:720px;height:42px;border-color:#e0e6ef;background:#f4f7fb;border-radius:12px;transition:.15s ease}
.search:focus-within{background:#fff;border-color:#95b7e8;box-shadow:var(--ux-focus)}
.search input{font-size:11px}.ux-search-key{flex:none;border:1px solid #d7dfe9;background:#fff;color:#78869a;border-radius:7px;padding:3px 6px;font-size:8px;font-weight:800}
.icon-btn{width:39px;height:39px;border-radius:11px}.icon-btn:hover{background:#edf3fb}
.avatar-btn{height:42px;border-radius:12px}.account-menu{top:48px;width:230px;padding:7px;border-radius:14px;box-shadow:var(--ux-shadow-lg)}
.content{padding:0 16px 18px;min-width:0}
#content>.page-grid,#content>.dashboard-grid,#content>.mail-layout,#content>.calendar-section-page,#content>.teams-page,#content>.template-page,#content>.organization-page,#content>.reports-page,#content>.analytics-page,#content>.automation-page-full{animation:uxPageIn .16s ease-out}
@keyframes uxPageIn{from{opacity:.35;transform:translateY(3px)}to{opacity:1;transform:none}}
.header-card{padding:18px 20px!important;border-radius:16px!important}.header-flex{gap:18px}
.section-title{font-size:22px;letter-spacing:-.025em;line-height:1.2}.section-sub{max-width:760px;font-size:10px;line-height:1.55}
.large-module,.side-module,.grid-panel,.summary-card,.stat-card{border-radius:16px!important}
.placeholder-box{border:1px dashed #cbd7e6!important;border-radius:14px!important;background:#fafcff!important;padding:28px!important}
.placeholder-box h3{font-size:15px!important}.placeholder-box p{font-size:10px!important;line-height:1.6!important}
.dashboard-grid{gap:12px}.hero-card{min-height:210px;border-radius:18px;padding:24px;box-shadow:0 18px 40px rgba(11,59,127,.16)}
.hero-card h2{font-size:30px;max-width:720px}.hero-card p{font-size:11px;line-height:1.7}
.metric,.grid-panel,.summary-card{transition:.15s ease}.metric:hover,.grid-panel:hover,.summary-card:hover{transform:translateY(-1px);box-shadow:var(--ux-shadow-md)}
.mail-layout{grid-template-columns:minmax(330px,380px) minmax(460px,1fr) minmax(230px,270px);gap:12px;min-height:calc(100vh - 92px)}
.mail-layout>.panel,.mail-layout>.reader,.mail-layout>.side-widgets{min-width:0}
.list-head{position:sticky;top:0;z-index:6;padding:15px 14px 10px;background:#fff}.list-head h2{font-size:17px}
.tabs{margin-top:11px}.msg-list{max-height:calc(100vh - 292px);overscroll-behavior:contain}
.mail-item{min-height:64px!important;padding:10px 11px!important;border-bottom-color:#edf1f5!important;transition:.12s ease}
.mail-item:hover{background:#f7faff!important}.mail-item.is-unread{background:#fff!important;box-shadow:inset 3px 0 0 #3478e5}
.mail-item.is-unread .sender,.mail-item.is-unread .subject{font-weight:850!important;color:#172338!important}.mail-item .preview{color:#7c8899!important;line-height:1.4!important}
.mail-hover-actions{border-radius:9px!important;box-shadow:0 4px 12px rgba(23,35,56,.07)}
.reader{border-radius:16px!important}.reader-tools{position:sticky;top:0;z-index:7;background:#fff;border-bottom:1px solid #edf1f5}
.message-head{padding:19px 20px 14px!important}.message-head h2{font-size:20px!important;line-height:1.35}.body-inner{max-width:860px;font-size:13px!important;line-height:1.65!important}
.attach{min-height:54px!important;border-radius:11px!important}.side-widgets .card,.side-widgets .widget{border-radius:15px!important}
.quick-grid{gap:7px!important}.quick{min-height:66px!important;border-radius:11px!important}
.compose-modal{right:18px!important;bottom:16px!important;width:min(680px,calc(100vw - 36px))!important;max-height:calc(100vh - 94px)!important;border-radius:18px 18px 14px 14px!important;box-shadow:0 26px 70px rgba(23,35,56,.22)!important}
.compose-head{min-height:48px!important;padding:0 14px!important}.compose-body{min-height:230px!important;font-size:13px!important;line-height:1.6!important}
.compose-bottom{min-height:54px!important;padding:8px 12px!important;background:#fbfcfe!important;border-top:1px solid #e8edf3!important}
.compose-bottom .send{min-width:86px!important;min-height:38px!important;border-radius:10px!important}


/* ===== Pure Mail 2026 full UI audit upgrade: modules + responsive ===== */
.drive-toolbar-shell{position:sticky;top:76px;z-index:12;border-radius:15px!important;box-shadow:0 6px 20px rgba(23,35,56,.06)!important}
.drive-action,.drive-google-import{min-height:42px!important;border-radius:10px!important}
.drive-files-hero{border-radius:17px!important}.drive-folder-grid,.file-cards,.doc-grid{gap:11px!important}
.folder-card,.file-card,.doc-card{border-radius:14px!important;transition:.14s ease!important}
.folder-card:hover,.file-card:hover,.doc-card:hover{transform:translateY(-2px);border-color:#a9c1e3!important;box-shadow:var(--ux-shadow-md)!important}
.drive-snap{border-radius:10px!important;background:#f6f8fb!important}.drive-side-panel{position:sticky;top:88px;align-self:start}
.drive-empty{min-height:300px!important;border-radius:16px!important}
.ai-panel-head{padding:14px 15px!important;border-bottom:1px solid #e8edf3!important}
.ai-orb{box-shadow:0 8px 20px rgba(21,101,216,.14)!important}.ai-modebar{padding:5px!important;border-radius:11px!important}
.ai-thread{padding:14px!important;gap:12px!important;background:linear-gradient(180deg,#fbfcff,#f7f9fc)!important}
.ai-msg{max-width:88%!important}.ai-bubble{border-radius:14px!important;padding:11px 12px!important;font-size:11px!important;line-height:1.6!important}
.ai-msg.user .ai-bubble{background:#1667d8!important;color:#fff!important;border-color:#1667d8!important}
.ai-composer-shell{position:sticky!important;bottom:0!important;background:#fff!important;border-top:1px solid #e4e9f1!important;padding:10px!important}
.ai-plus-btn,.ai-send-btn{width:40px!important;height:40px!important;border-radius:11px!important}
.ai-source-drawer{border-radius:14px!important}.ai-source-item,.ai-drive-source-row{border-radius:10px!important}
.ai-suggest{display:flex!important;gap:6px!important;overflow-x:auto!important;scrollbar-width:none}.ai-suggest::-webkit-scrollbar{display:none}.ai-prompt-chip{white-space:nowrap!important}
.calendar-section-hero,.meeting-hero,.scheduling-hero{border-radius:17px!important;padding:18px 20px!important}
.calendar-list-card,.meeting-card,.booking-link-card{border-radius:14px!important}
.calendar-row{min-height:62px!important;border-radius:11px!important;padding:10px 12px!important}.calendar-row:hover{background:#f7faff!important}
.meeting-grid,.booking-links-grid{gap:11px!important}
.contact-row,.device-row,.person,.task{min-height:52px}.contact-row,.device-row{border-radius:11px!important}
.table th{font-size:8px!important;letter-spacing:.06em}.table td{font-size:10px!important;vertical-align:middle}.table tbody tr:hover{background:#fafcff}
.search input,.users-search input,.report-search input,.template-search input{font-size:11px!important}
.teams-shell{gap:12px!important}.teams-channels,.teams-chat{border-radius:16px!important}
.teams-panel-head,.teams-chat-head{position:sticky;top:0;z-index:5;background:#fff}
.team-channel,.team-dm{min-height:42px!important;border-radius:10px!important}.team-message{border-radius:12px!important;padding:10px!important}
.teams-messages{overscroll-behavior:contain}.teams-composer{position:sticky!important;bottom:0!important;background:#fff!important;border-top:1px solid #e7ecf2!important}
.fm-grid{gap:11px!important}.fm-card,.fm-field-card,.fm-preview{border-radius:14px!important}.fm-card{transition:.14s ease!important}
.fm-card:hover{transform:translateY(-1px);box-shadow:var(--ux-shadow-md)!important}.fm-builder{border-radius:16px!important}
.settings-section-head{padding-bottom:11px!important;border-bottom:1px solid #e8edf3!important;margin-bottom:13px!important}
.settings-section-head h3{font-size:15px!important}.settings-section-head p{font-size:9px!important;line-height:1.5!important}
.settings-form-grid{gap:11px!important}.settings-preview{border-radius:13px!important}
#content .side-module .nav{gap:3px}#content .side-module .nav-item{min-height:40px}
.analytics-metric-grid,.drive-summary-grid,.reports-grid,.org-grid{gap:11px!important}
.analytics-metric,.analytics-map-card,.analytics-tracker-card,.reports-chart-card,.reports-security,.reports-table-card,.org-details,.org-guidance{border-radius:14px!important}
.report-user-row,.sent-mail-row,.report-security-row{min-height:48px!important}
.modal-backdrop{backdrop-filter:blur(6px);background:rgba(15,26,42,.28)!important}.modal{border-radius:18px!important;box-shadow:var(--ux-shadow-lg)!important}
.modal h3{font-size:18px!important}.toast{border-radius:11px!important;box-shadow:var(--ux-shadow-lg)!important;font-size:10px!important}.server-loader{min-height:90px}.content-loading{opacity:.78}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}
@media(max-width:1440px){
  :root{--sidebar:232px}.mail-layout{grid-template-columns:minmax(310px,350px) minmax(430px,1fr) 240px}.page-title{min-width:160px}.avatar-copy{display:none}
}
@media(max-width:1180px){
  :root{--sidebar:250px}.app-shell{grid-template-columns:68px minmax(0,1fr)}.rail{width:68px}.sidebar{left:68px;transform:translateX(-110%);transition:.18s ease;box-shadow:18px 0 50px rgba(23,35,56,.17)}
  .app-shell.sidebar-open .sidebar{transform:translateX(0)}.mail-layout{grid-template-columns:minmax(300px,340px) minmax(0,1fr)}.mail-layout>.side-widgets{display:none}.drive-side-panel{position:static}
}
@media(max-width:860px){
  .app-shell{grid-template-columns:60px minmax(0,1fr)}.rail{width:60px;padding:10px 6px}.rail-btn{width:42px;height:42px}.logo{width:42px;height:42px}.sidebar{left:60px}
  .topbar{padding:9px 10px;height:68px}.topbar-inner{padding:0 8px}.page-title{display:none}.search{max-width:none}.ux-search-key{display:none}.top-actions{margin-left:7px}.top-actions .icon-btn:nth-child(3){display:none}
  .content{padding:0 10px 14px}.dashboard-grid,.page-grid{display:flex!important;flex-direction:column!important}.hero-card,.grid-8,.grid-4,.metric,.summary-card,.large-module,.side-module{grid-column:auto!important;width:100%!important}
  .mail-layout,.mail-layout.pane-bottom,.mail-layout.pane-off{display:block!important;min-height:0}.mail-layout>.panel:first-child{margin-bottom:10px}.mail-layout.has-selection>.panel:first-child{display:none}
  .mail-layout.has-selection>.reader{display:flex!important}.msg-list{max-height:none}.reader{min-height:65vh}.compose-modal{left:10px!important;right:10px!important;width:auto!important;bottom:10px!important}
  .teams-shell{display:block!important}.teams-channels{margin-bottom:10px}
}
@media(max-width:620px){
  .app-shell{display:block}.rail{position:fixed;left:0;right:0;bottom:0;top:auto;width:auto;height:62px;padding:7px 10px;flex-direction:row;justify-content:space-around;gap:4px;z-index:70;overflow-x:auto;overflow-y:hidden}
  .rail .logo,.rail .rail-spacer,.rail-btn[data-page="forms"],.rail-btn[data-page="contacts"],.rail-btn[data-page="tasks"],.rail-btn[data-page="reports"],.rail-btn[data-page="security"]{display:none}
  .rail-btn{flex:0 0 44px;width:44px;height:44px}.rail-btn.active:before{left:50%;top:-7px;width:22px;height:3px;transform:translateX(-50%);border-radius:0 0 5px 5px}.rail-btn:after{display:none}
  .sidebar{left:0;bottom:62px;width:min(290px,86vw)}.main{padding-bottom:62px}.topbar{height:62px;padding:7px 8px}.search{height:40px}.top-actions #shortcutsBtn{display:none}
  .avatar-btn{padding:3px}.avatar{width:34px;height:34px}.header-card{padding:15px!important}.section-title{font-size:19px}.hero-card{padding:19px;min-height:190px}.hero-card h2{font-size:24px}
  .hero-actions{flex-wrap:wrap}.compose-modal{top:70px!important;bottom:72px!important;max-height:none!important}
}


/* Pure Mail 2026 audit dark-mode compatibility */
html[data-theme="dark"] .topbar{background:rgba(15,22,36,.92)}
html[data-theme="dark"] .topbar-inner,
html[data-theme="dark"] .sidebar,
html[data-theme="dark"] .sidebar-head,
html[data-theme="dark"] .list-head,
html[data-theme="dark"] .reader-tools,
html[data-theme="dark"] .teams-panel-head,
html[data-theme="dark"] .teams-chat-head,
html[data-theme="dark"] .teams-composer,
html[data-theme="dark"] .ai-composer-shell{background:var(--card)!important}
html[data-theme="dark"] .search{background:var(--soft);border-color:var(--line)}
html[data-theme="dark"] .ux-search-key{background:var(--soft);border-color:var(--line);color:var(--muted)}
html[data-theme="dark"] .nav-item:hover{background:var(--soft)}
html[data-theme="dark"] .nav-item.active{background:var(--blue-soft);color:var(--blue)}
html[data-theme="dark"] .storage,
html[data-theme="dark"] .sidebar-note,
html[data-theme="dark"] .compose-bottom,
html[data-theme="dark"] .drive-snap,
html[data-theme="dark"] .ai-thread{background:var(--soft)!important}
html[data-theme="dark"] .mail-item:hover{background:var(--soft)!important}
html[data-theme="dark"] .mail-item.is-unread{background:var(--card)!important}

/* Squeeze fix (fix/ui-squeeze): final cascade. A late 3-col .mail-layout overrode
   the <=1280px 2-col fallback while .side-widgets stayed display:none, leaving an
   empty grid track that squeezed list+reader. Re-assert responsive grids last. */
.main,.content,#content{min-width:0;overflow-x:clip}
.topbar-inner{min-width:0}
.page-title{min-width:0;flex:0 1 auto;overflow:hidden}
.search{flex:1 1 auto;min-width:0}
@media(min-width:1281px){
  .mail-layout{grid-template-columns:minmax(300px,360px) minmax(0,1fr) minmax(0,260px)}
  .mail-layout>.side-widgets{display:flex}
}
@media(max-width:1280px){
  .mail-layout,.mail-layout.pane-bottom,.mail-layout.pane-off{grid-template-columns:minmax(300px,340px) minmax(0,1fr)}
  .mail-layout>.side-widgets{display:none}
  .main-grid{grid-template-columns:minmax(0,1fr)}
  .reports-grid{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:1080px){
  .app-shell{grid-template-columns:72px minmax(0,1fr)}
  .main-grid{grid-template-columns:minmax(0,1fr)}
}

/* =========================================================
   2026-10-07 critical shell + Settings layout correction
   Sidebar is a fixed hover drawer on desktop, so the main workspace must
   occupy every column after the rail. This prevents the whole app from
   collapsing into the old sidebar-width grid track.
========================================================= */
@media(min-width:1181px){
  .app-shell{
    grid-template-columns:72px minmax(0,1fr)!important;
    width:100%;
    min-width:0;
  }
  .app-shell>.rail{grid-column:1!important}
  .app-shell>.main{
    grid-column:2!important;
    width:100%;
    min-width:0;
    max-width:none;
  }
  .app-shell>.sidebar{
    left:72px;
  }
}

.settings-page-grid{
  width:100%;
  min-width:0;
  grid-template-columns:minmax(260px,320px) minmax(0,1fr)!important;
  align-items:start;
}
.settings-page-grid>.header-card{
  grid-column:1 / -1!important;
  width:100%;
  min-width:0;
}
.settings-page-grid>.side-module{
  grid-column:1!important;
  width:100%;
  min-width:0;
  padding:16px!important;
  position:sticky;
  top:86px;
  align-self:start;
}
.settings-page-grid>#setBody{
  grid-column:2!important;
  width:100%;
  min-width:0;
  max-width:none;
  overflow:hidden;
}
.settings-page-grid #setNav{
  width:100%;
  min-width:0;
}
.settings-page-grid #setNav .nav-item{
  white-space:normal;
  overflow-wrap:anywhere;
}
.settings-page-grid #setBody>*{
  max-width:100%;
}
@media(max-width:1080px){
  .settings-page-grid{
    grid-template-columns:1fr!important;
  }
  .settings-page-grid>.header-card,
  .settings-page-grid>.side-module,
  .settings-page-grid>#setBody{
    grid-column:1!important;
    width:100%!important;
  }
  .settings-page-grid>.side-module{
    position:static;
  }
  .settings-page-grid #setNav{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
    gap:6px;
  }
}
@media(max-width:620px){
  .settings-page-grid #setNav{
    display:flex;
    overflow-x:auto;
    gap:6px;
    padding-bottom:3px;
  }
  .settings-page-grid #setNav .nav-item{
    min-width:180px;
    flex:0 0 180px;
  }
}


/* Stable application shell: rail + flexible workspace.
   The sidebar is fixed/overlay and must never consume a grid track. */
#appScreen .app-shell{
  width:100%;
  max-width:none;
  min-width:0;
}
#appScreen .app-shell>.main{
  min-width:0;
  width:auto;
  max-width:none;
}
@media(min-width:761px){
  #appScreen .app-shell{
    display:grid;
    grid-template-columns:72px minmax(0,1fr)!important;
  }
  #appScreen .app-shell>.rail{grid-column:1!important}
  #appScreen .app-shell>.main{grid-column:2!important}
  #appScreen .app-shell>.sidebar{position:fixed!important}
}
@media(min-width:761px) and (max-width:1180px){
  #appScreen .app-shell{grid-template-columns:68px minmax(0,1fr)!important}
  #appScreen .app-shell>.sidebar{left:68px!important}
}
@media(min-width:761px) and (max-width:860px){
  #appScreen .app-shell{grid-template-columns:60px minmax(0,1fr)!important}
  #appScreen .app-shell>.sidebar{left:60px!important}
}

/* Teams blank-chat hardening: empty strips must stay hidden, chat column must never collapse. */
.team-call-strip[hidden],.team-reply-bar[hidden],.team-file-bar[hidden]{display:none!important}
.teams-page,.teams-shell,.teams-channels,.teams-chat{min-width:0}