:root{
  --brand:#1f5eff;--brand-d:#1747c9;--brand-l:#eaf0ff;--ink:#0f1b3d;--ink2:#47536f;--ink3:#8591ab;
  --line:#e4e8f1;--line2:#cfd6e6;--line3:#eef1f7;--bg:#f5f7fb;--card:#fff;--surface:#fff;--surface2:#f8faff;
  --hover:#f4f6fb;--hover2:#e9eefb;--track:#e8ecf5;--track2:#e9edf6;--ok:#12a150;--warn:#d98a00;--bad:#d92d3a;
  --tipbg:#0f1b3d;--tipfg:#fff;--hint-bd:#cbd9ff;--hint-fg:#1b3a8f;--drop:rgba(234,240,255,.92);--bar-soft:#b9cbff;
  --radius:12px;--shadow:0 1px 2px rgba(15,27,61,.06),0 6px 20px rgba(15,27,61,.06);color-scheme:light;
}
:root[data-theme="dark"]{
  --brand:#4f84ff;--brand-d:#3a6fe6;--brand-l:rgba(79,132,255,.16);--ink:#e8ecf8;--ink2:#a9b3cd;--ink3:#7482a3;
  --line:#243049;--line2:#33415f;--line3:#1d2740;--bg:#0b1020;--card:#131a2c;--surface:#131a2c;--surface2:#18213a;
  --hover:#1b2540;--hover2:#222e4d;--track:#222c45;--track2:#1a2238;--ok:#34c47a;--warn:#f0a929;--bad:#ff6b73;
  --tipbg:#e8ecf8;--tipfg:#0f1b3d;--hint-bd:#2b4580;--hint-fg:#b9ccff;--drop:rgba(19,26,44,.92);--bar-soft:#34508f;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px rgba(0,0,0,.35);color-scheme:dark;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{font:14px/1.45 Inter,"Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
.hide{display:none!important}
svg{display:block}

/* ---------- login ---------- */
.login{display:grid;grid-template-columns:1.15fr 1fr;min-height:100%;background:var(--surface)}
.login-art{position:relative;background:#0b2a7a url(/static/hero.png) center/cover;color:#fff;display:flex;flex-direction:column;justify-content:space-between;padding:40px 48px}
.login-art::before{content:"";position:absolute;inset:0;background:linear-gradient(160deg,rgba(8,32,110,.82),rgba(16,70,200,.35) 60%,rgba(10,30,100,.75))}
.login-art>*{position:relative}
.login-art h2{font-size:34px;line-height:1.15;margin:0 0 14px;font-weight:700;letter-spacing:-.5px;max-width:460px}
.login-art p{margin:0;max-width:430px;font-size:16px;opacity:.92}
.badges{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.badges span{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.28);padding:6px 12px;border-radius:99px;font-size:12.5px;backdrop-filter:blur(6px)}
.login-form-wrap{display:flex;align-items:center;justify-content:center;padding:32px}
.login-card{width:100%;max-width:380px}
.login-card h1{font-size:26px;margin:22px 0 6px;letter-spacing:-.4px}
.login-card .sub{color:var(--ink2);margin:0 0 26px}
.logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:18px;letter-spacing:-.2px}
.logo-mark{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,#3b82ff,#1747c9);display:grid;place-items:center;box-shadow:0 4px 12px rgba(31,94,255,.35)}
.logo-img{height:38px;width:auto;display:block}
.login-art .logo-img{background:var(--surface);padding:5px 7px;border-radius:10px;height:44px}
.field{margin-bottom:16px}
.field label{display:block;font-weight:600;font-size:12.5px;margin-bottom:6px;color:var(--ink2)}
.input{width:100%;height:44px;border:1px solid var(--line2);border-radius:10px;padding:0 14px;background:var(--surface);outline:none;transition:.15s}
.input:focus{border-color:var(--brand);box-shadow:0 0 0 4px rgba(31,94,255,.14)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 16px;border-radius:10px;border:1px solid var(--line);background:var(--surface);font-weight:600;transition:.15s;white-space:nowrap}
.btn:hover{background:var(--hover)}
.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff}
.btn.primary:hover{background:var(--brand-d)}
.btn.danger{color:var(--bad);border-color:#f3c5c9}
.btn.danger:hover{background:#fdf0f1}
.btn.block{width:100%;height:46px}
.btn.sm{height:32px;padding:0 10px;font-size:13px}
.btn:disabled{opacity:.55;cursor:default}
.err{color:var(--bad);font-size:13px;min-height:18px;margin:10px 0}
.foot{margin-top:30px;color:var(--ink3);font-size:12.5px}

/* ---------- app shell ---------- */
.shell{display:grid;grid-template-columns:248px 1fr;height:100%}
.side{background:var(--surface);border-right:1px solid var(--line);padding:18px 14px;display:flex;flex-direction:column;gap:6px}
.side .logo{padding:2px 8px 16px}
.newbtn{position:relative;margin:0 0 12px}
.menu{position:absolute;z-index:30;top:46px;left:0;min-width:210px;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:6px}
.menu button{display:flex;gap:10px;align-items:center;width:100%;padding:9px 10px;border:0;background:none;border-radius:8px;text-align:left}
.menu button:hover{background:var(--bg)}
.nav a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;color:var(--ink2);text-decoration:none;font-weight:600;cursor:pointer}
.nav a:hover{background:var(--bg)}
.nav a.on{background:var(--brand-l);color:var(--brand)}
.grow{flex:1}
.quota{border:1px solid var(--line);border-radius:12px;padding:12px;background:var(--surface)}
.quota .t{display:flex;justify-content:space-between;font-size:12.5px;color:var(--ink2);margin-bottom:8px}
.bar{height:8px;border-radius:99px;background:var(--track);overflow:hidden}
.bar i{display:block;height:100%;background:linear-gradient(90deg,#3b82ff,#1747c9);border-radius:99px}

.main{display:flex;flex-direction:column;min-width:0;height:100%}
.top{height:64px;background:var(--surface);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:16px;padding:0 24px}
.search{flex:1;max-width:520px;position:relative}
.search svg{position:absolute;left:12px;top:12px;color:var(--ink3)}
.search input{padding-left:40px;background:var(--bg);border-color:transparent}
.search input:focus{background:var(--surface)}
.me{position:relative}
.avatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#6a8bff,#1f5eff);color:#fff;font-weight:700;display:grid;place-items:center;border:0;text-transform:uppercase}
.me .menu{left:auto;right:0;top:46px}
.me .who{padding:10px 12px;border-bottom:1px solid var(--line);margin-bottom:6px}
.me .who b{display:block}.me .who span{color:var(--ink3);font-size:12.5px}

.content{flex:1;overflow:auto;padding:22px 28px 60px;position:relative}
.head{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.crumbs{display:flex;align-items:center;gap:6px;font-size:18px;font-weight:700;flex-wrap:wrap}
.crumbs a{color:var(--ink2);cursor:pointer;font-weight:600}
.crumbs a:hover{color:var(--brand)}
.crumbs span.sep{color:var(--ink3);font-weight:400}
.crumbs b{color:var(--ink)}
.spacer{flex:1}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--surface)}
.seg button{border:0;background:var(--surface);width:38px;height:38px;display:grid;place-items:center;color:var(--ink3)}
.seg button.on{background:var(--brand-l);color:var(--brand)}
.panel{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.actionbar{display:flex;gap:8px;align-items:center;margin:0 0 12px;min-height:34px}
.actionbar .cnt{font-weight:600;color:var(--brand);margin-right:6px}

table.t{width:100%;border-collapse:collapse}
.t th{text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.5px;color:var(--ink3);padding:12px 16px;border-bottom:1px solid var(--line);font-weight:700;white-space:nowrap}
.t td{padding:11px 16px;border-bottom:1px solid var(--line3);vertical-align:middle}
.t tr:last-child td{border-bottom:0}
.t tbody tr:hover{background:var(--surface2)}
.t tr.sel{background:var(--brand-l)}
.t .chk{width:44px;padding-right:0}
.fname{display:flex;align-items:center;gap:12px;font-weight:600;min-width:0}
.fname span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fname a{cursor:pointer}
.muted{color:var(--ink3)}
input[type=checkbox]{width:16px;height:16px;accent-color:var(--brand)}
.rowact{opacity:0;display:flex;gap:4px;justify-content:flex-end}
tr:hover .rowact{opacity:1}
.ib{width:32px;height:32px;border-radius:8px;border:0;background:none;display:grid;place-items:center;color:var(--ink2)}
.ib:hover{background:var(--hover2);color:var(--brand)}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(172px,1fr));gap:14px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px;cursor:pointer;position:relative;transition:.15s}
.card:hover{box-shadow:var(--shadow);border-color:var(--line2);transform:translateY(-1px)}
.card.sel{border-color:var(--brand);background:var(--brand-l)}
.card .ico{height:84px;display:grid;place-items:center;border-radius:10px;background:var(--bg);margin-bottom:10px}
.card .nm{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card .mt{color:var(--ink3);font-size:12px}
.card input{position:absolute;top:10px;left:10px;opacity:0}
.card:hover input,.card.sel input{opacity:1}

.empty{text-align:center;padding:70px 20px;color:var(--ink2)}
.empty h3{margin:18px 0 6px;color:var(--ink);font-size:18px}
.drop{position:absolute;inset:10px;border:2px dashed var(--brand);background:var(--drop);border-radius:16px;z-index:20;display:grid;place-items:center;font-size:20px;font-weight:700;color:var(--brand);pointer-events:none}

/* badges */
.pill{display:inline-block;padding:3px 10px;border-radius:99px;font-size:12px;font-weight:700;letter-spacing:.2px}
.pill.UPLOAD,.pill.NEW_FOLDER,.pill.USER_SAVED{background:#e3f6ea;color:#0b7a3b}
.pill.DOWNLOAD,.pill.VIEW{background:#e5eeff;color:#1747c9}
.pill.DELETE,.pill.USER_DELETED,.pill.LOGIN_FAILED{background:#fde9eb;color:#b3202c}
.pill.RENAME_MOVE,.pill.COPY,.pill.PASSWORD_CHANGE{background:#fff3d9;color:#9a6500}
.pill.LOGIN,.pill.LOGOUT{background:#eef0f6;color:#47536f}
.pill.admin{background:#ece6ff;color:#5a37c9}.pill.user{background:#e3f6ea;color:#0b7a3b}.pill.readonly{background:#fff3d9;color:#9a6500}

.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.filters .input{height:38px;width:auto;min-width:150px}
.pager{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-top:1px solid var(--line);color:var(--ink2)}

/* modal, toast, uploads */
.overlay{position:fixed;inset:0;background:rgba(10,20,50,.45);display:grid;place-items:center;z-index:50;padding:20px}
.modal{background:var(--surface);border-radius:16px;width:100%;max-width:440px;padding:24px;box-shadow:0 20px 60px rgba(10,20,50,.3)}
.modal h3{margin:0 0 16px;font-size:18px}
.modal .row{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}
.preview{max-width:min(1000px,94vw);width:94vw;height:88vh;display:flex;flex-direction:column;padding:0;overflow:hidden}
.preview header{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line)}
.preview header b{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.preview .body{flex:1;display:grid;place-items:center;background:#0f1b3d0d;min-height:0}
.preview img{max-width:100%;max-height:100%;object-fit:contain}
.preview iframe{width:100%;height:100%;border:0;background:var(--surface)}
#toasts{position:fixed;top:18px;right:18px;z-index:80;display:flex;flex-direction:column;gap:8px}
.toast{background:var(--tipbg);color:var(--tipfg);padding:11px 16px;border-radius:10px;box-shadow:var(--shadow);animation:in .2s}
.toast.bad{background:var(--bad)}
@keyframes in{from{transform:translateY(-8px);opacity:0}}
#uploads{position:fixed;right:20px;bottom:20px;width:340px;z-index:60}
#uploads .panel{padding:14px}
#uploads .nm{font-weight:600;margin-bottom:8px;display:flex;justify-content:space-between}
.hint{background:var(--brand-l);border:1px solid var(--hint-bd);color:var(--hint-fg);padding:12px 14px;border-radius:10px;margin-bottom:16px}
code{background:var(--track);padding:2px 6px;border-radius:6px}

@media(max-width:900px){
  .login{grid-template-columns:1fr}.login-art{min-height:240px;padding:24px}.login-art h2{font-size:24px}
  .shell{grid-template-columns:1fr;grid-template-rows:auto 1fr}
  .side{flex-direction:row;align-items:center;padding:8px 12px;overflow-x:auto}
  .side .logo span,.quota,.grow{display:none}.nav{display:flex}.newbtn{margin:0}
  .content{padding:16px}.t .hm{display:none}.top{padding:0 12px}
}

/* connect drive + billing */
.hero{display:flex;gap:20px;align-items:center;flex-wrap:wrap;padding:26px 28px;background:linear-gradient(120deg,#0f2a7a,#1f5eff);color:#fff;border:0;margin-bottom:18px}
.hero-ic{width:78px;height:78px;border-radius:20px;background:rgba(255,255,255,.16);display:grid;place-items:center}
.hero-tx{flex:1;min-width:260px}.hero h2{margin:0 0 6px;font-size:23px;letter-spacing:-.3px}.hero p{margin:0;opacity:.92;max-width:560px}
.gtag{background:rgba(255,255,255,.22);padding:1px 10px;border-radius:8px}
.btn.big{height:52px;padding:0 24px;font-size:15px;background:var(--surface);color:var(--brand);border-color:#fff}
.btn.big:hover{background:#f1f5ff}
.tabs{display:inline-flex;gap:4px;background:var(--track2);padding:4px;border-radius:12px;margin-bottom:14px}
.tabs button{border:0;background:none;padding:8px 16px;border-radius:9px;font-weight:600;color:var(--ink2)}
.tabs button.on{background:var(--surface);color:var(--brand);box-shadow:0 1px 3px rgba(15,27,61,.12)}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.step{display:flex;gap:14px;padding:18px;align-items:flex-start}
.num{flex:none;width:34px;height:34px;border-radius:50%;background:var(--brand-l);color:var(--brand);font-weight:700;display:grid;place-items:center}
.panel.alt{padding:16px 20px;margin-top:14px;background:var(--surface2)}
.copy{display:flex;gap:10px;flex-wrap:wrap}.copy .input{flex:1;min-width:260px;font-family:Consolas,monospace;font-size:13px}
.faq{padding:20px 24px;margin-top:18px}.faq h3{margin:0 0 8px}
.faq details{border-top:1px solid var(--line);padding:10px 0}.faq summary{cursor:pointer;font-weight:600}
.faq details p{margin:8px 0 0;color:var(--ink2)}
.badge{padding:5px 12px;border-radius:99px;font-size:12.5px;font-weight:700}
.badge.warn{background:#fff3d9;color:#9a6500}.badge.ok{background:#e3f6ea;color:#0b7a3b}
.formula{display:flex;align-items:stretch;gap:14px;padding:22px;flex-wrap:wrap}
.fcell{flex:1;min-width:190px;padding:6px 8px}.fnum{font-size:32px;font-weight:700;letter-spacing:-1px;margin:4px 0}
.fop{display:grid;place-items:center;font-size:28px;color:var(--ink3);font-weight:300}
.fcell.pay{background:var(--brand-l);border-radius:12px;padding:10px 16px}.fcell.pay .fnum{color:var(--brand)}
@media(max-width:900px){#connectBtn{display:none}.fop{display:none}}

/* dashboard */
.dash-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.dash-head h1{margin:0;font-size:26px;letter-spacing:-.5px}
.seg2{display:inline-flex;background:var(--track2);padding:4px;border-radius:12px}
.seg2 button{border:0;background:none;padding:7px 14px;border-radius:9px;font-weight:600;color:var(--ink2)}
.seg2 button.on{background:var(--surface);color:var(--brand);box-shadow:0 1px 3px rgba(15,27,61,.12)}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-bottom:16px}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px;display:flex;gap:14px;align-items:center;box-shadow:var(--shadow);transition:.15s}
.kpi:hover{transform:translateY(-2px)}
.kic{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;flex:none}
.klabel{color:var(--ink2);font-size:12.5px;font-weight:600}
.kval{font-size:26px;font-weight:700;letter-spacing:-.8px;line-height:1.15}
.ksub{font-size:12px;color:var(--ink3)}
.dl{font-weight:700;font-size:12px}.dl.up{color:var(--ok)}.dl.bad{color:var(--bad)}.dl.flat{color:var(--ink3);font-weight:500}
.dgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.dcard{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px 20px;box-shadow:var(--shadow);min-width:0}
.dcard.span2{grid-column:span 2}
.dcard header{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.dcard h3{margin:0;font-size:15px}
.dcard .t td{padding:9px 6px}
.chart{display:block}
.chart .hv:hover{fill:rgba(31,94,255,.07)}
.legend{display:flex;gap:16px;margin-top:6px;color:var(--ink2);font-size:12.5px}
.legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px}
.donutrow{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.donutleg{display:grid;gap:12px}.donutleg b{font-size:18px}
.typeleg{flex:1;min-width:120px;display:grid;gap:7px;font-size:13px}
.typeleg div{display:flex;align-items:center;gap:8px}.typeleg i{width:10px;height:10px;border-radius:3px}.typeleg b{margin-left:auto}
.hb{margin-bottom:12px}.hl{display:flex;justify-content:space-between;font-size:13px;margin-bottom:5px}
.ht{height:9px;background:var(--track);border-radius:99px;overflow:hidden}.ht i{display:block;height:100%;border-radius:99px;transition:width .5s}
.link{color:var(--brand);font-weight:600;cursor:pointer;font-size:13px}
.tip{position:fixed;z-index:90;background:var(--tipbg);color:var(--tipfg);padding:8px 11px;border-radius:9px;font-size:12.5px;pointer-events:none;box-shadow:var(--shadow);line-height:1.6}
.skeleton{padding:60px;text-align:center;color:var(--ink3)}
@media(max-width:1100px){.dgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.dgrid{grid-template-columns:1fr}.dcard.span2{grid-column:auto}}

/* ---- theme ---- */
.btn.big{background:#fff;color:#1f5eff;border-color:#fff}.btn.big:hover{background:#f1f5ff}
.login-art .logo-img{background:#fff}
.theme-fab{position:absolute;top:16px;right:16px}
.ib.theme{border:1px solid var(--line);background:var(--surface);color:var(--ink2)}
:root[data-theme="dark"] .pill.UPLOAD,:root[data-theme="dark"] .pill.NEW_FOLDER,:root[data-theme="dark"] .pill.USER_SAVED,
:root[data-theme="dark"] .pill.user,:root[data-theme="dark"] .badge.ok{background:rgba(52,196,122,.16);color:#5ee0a0}
:root[data-theme="dark"] .pill.DOWNLOAD,:root[data-theme="dark"] .pill.VIEW{background:rgba(79,132,255,.18);color:#9db9ff}
:root[data-theme="dark"] .pill.DELETE,:root[data-theme="dark"] .pill.USER_DELETED,:root[data-theme="dark"] .pill.LOGIN_FAILED{background:rgba(255,107,115,.16);color:#ff9aa0}
:root[data-theme="dark"] .pill.RENAME_MOVE,:root[data-theme="dark"] .pill.COPY,:root[data-theme="dark"] .pill.PASSWORD_CHANGE,
:root[data-theme="dark"] .pill.readonly,:root[data-theme="dark"] .badge.warn{background:rgba(240,169,41,.16);color:#f6c25c}
:root[data-theme="dark"] .pill.LOGIN,:root[data-theme="dark"] .pill.LOGOUT{background:#222c45;color:#a9b3cd}
:root[data-theme="dark"] .pill.admin{background:rgba(139,92,246,.2);color:#c4a8ff}
:root[data-theme="dark"] .btn.danger{border-color:#5b2a31}
:root[data-theme="dark"] .btn.danger:hover{background:rgba(255,107,115,.1)}
:root[data-theme="dark"] .hero{background:linear-gradient(120deg,#0c1a4d,#1b4fd6)}
:root[data-theme="dark"] .input{background:var(--surface2)}
:root[data-theme="dark"] .search input{background:var(--surface2)}
:root[data-theme="dark"] code{background:#222c45}
:root[data-theme="dark"] .login-form-wrap{background:var(--bg)}
:root[data-theme="dark"] .login{background:var(--bg)}
:root[data-theme="dark"] .overlay{background:rgba(0,0,0,.6)}
body,.side,.top,.panel,.dcard,.kpi,.card,.modal,.menu,.input{transition:background-color .2s,border-color .2s,color .2s}

/* performance tier indicator */
.perfchip{display:flex;align-items:center;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line);font-size:12.5px;color:var(--ink2)}
.perfchip.inline{display:inline-flex;margin:0;padding:2px 10px;border:1px solid var(--line);border-radius:99px;background:var(--surface)}
.perfchip .pdot{width:8px;height:8px;border-radius:50%;background:var(--ink3)}
.perfchip[data-tier="standard"] .pdot{background:#1f5eff}
.perfchip[data-tier="fast"] .pdot{background:#12a150}
.perfchip[data-tier="turbo"] .pdot{background:#8b5cf6;box-shadow:0 0 0 3px rgba(139,92,246,.25)}

/* top-bar performance badge */
.tierwrap{position:relative}
.tierbtn{display:flex;align-items:center;gap:8px;height:38px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);cursor:pointer;font-size:13px;white-space:nowrap}
.tierbtn:hover{background:var(--hover)}
.tierbtn .pdot,.tm-h .pdot{width:8px;height:8px;border-radius:50%;background:var(--ink3);flex:none}
.tierbtn[data-tier="standard"] .pdot,.tm-h .pdot[data-tier="standard"]{background:#1f5eff}
.tierbtn[data-tier="fast"] .pdot,.tm-h .pdot[data-tier="fast"]{background:#12a150}
.tierbtn[data-tier="turbo"] .pdot,.tm-h .pdot[data-tier="turbo"]{background:#8b5cf6;box-shadow:0 0 0 3px rgba(139,92,246,.25)}
.tierbtn .sp{color:var(--ink2);padding-left:8px;border-left:1px solid var(--line);font-variant-numeric:tabular-nums}
.tiermenu{left:auto;right:0;min-width:300px;padding:14px}
.tm-h{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.tm-r{display:grid;grid-template-columns:1fr auto;gap:0 12px;padding:8px 0;border-top:1px solid var(--line)}
.tm-r span{color:var(--ink2)}.tm-r b{text-align:right}.tm-r small{grid-column:2;text-align:right;color:var(--ink3)}
.tm-n{color:var(--ink3);font-size:12px;margin-top:8px;line-height:1.45}
@media(max-width:1000px){.tierbtn .sp{display:none}}

.bigpay{padding:24px 26px}

/* assistant */
.aibtn{background:linear-gradient(135deg,#6a8bff,#1f5eff);color:#fff;border-color:transparent}
.aibtn:hover{background:linear-gradient(135deg,#5a7cf5,#1747c9)}
.ai-panel{position:fixed;top:0;right:0;bottom:0;width:min(440px,100vw);z-index:70;background:var(--surface);border-left:1px solid var(--line);
  box-shadow:-12px 0 40px rgba(10,20,50,.18);display:flex;flex-direction:column;animation:slidein .18s ease-out}
@keyframes slidein{from{transform:translateX(24px);opacity:0}}
.ai-panel header{display:flex;justify-content:space-between;align-items:flex-start;padding:16px 18px 10px}
.ai-pill{display:inline-block;margin-top:5px;padding:2px 10px;border-radius:99px;font-size:12px;font-weight:700}
.ai-pill.smart{background:rgba(31,94,255,.12);color:var(--brand)}
.ai-pill.free{background:#e3f6ea;color:#0b7a3b}
.ai-pill.off{background:var(--track);color:var(--ink2)}
:root[data-theme="dark"] .ai-pill.free{background:rgba(52,196,122,.16);color:#5ee0a0}
.ai-use{padding:0 18px 10px}
.ai-bar{height:6px;background:var(--track);border-radius:99px;overflow:hidden;margin-bottom:6px}
.ai-bar i{display:block;height:100%;background:var(--brand);border-radius:99px}
.ai-bar i.warn{background:var(--warn)}.ai-bar i.off{background:var(--bad)}
.ai-msgs{flex:1;overflow:auto;padding:6px 16px 16px;display:flex;flex-direction:column;gap:12px}
.ai-msg{max-width:100%}
.ai-msg.user{align-self:flex-end;background:var(--brand);color:#fff;padding:9px 14px;border-radius:14px 14px 4px 14px;max-width:85%}
.ai-msg.bot{align-self:stretch}
.ai-text{margin-bottom:8px;line-height:1.5}
.ai-file{display:flex;gap:10px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:12px;margin-bottom:8px;background:var(--surface2)}
.ai-file:hover{border-color:var(--line2)}
.ai-ico{flex:none}.ai-fb{flex:1;min-width:0}
.ai-fn{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ai-fs,.ai-fp{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ai-fa{display:flex;flex:none}
.ai-sec{font-size:12px;text-transform:uppercase;letter-spacing:.5px;color:var(--ink3);margin:10px 0 6px;font-weight:700}
.ai-meta{font-size:12px;color:var(--ink3)}
.ai-tag{padding:1px 8px;border-radius:99px;font-weight:700;font-size:11px;margin-right:4px}
.ai-tag.smart{background:rgba(31,94,255,.12);color:var(--brand)}
.ai-tag.free,.ai-tag.instant{background:var(--track);color:var(--ink2)}
.ai-form{display:flex;gap:8px;padding:12px 16px;border-top:1px solid var(--line)}
.ai-form .input{flex:1}
.ai-empty{text-align:center;padding:40px 14px;color:var(--ink2)}
.ai-empty h3{color:var(--ink);margin:12px 0 6px}
.ai-spark{width:56px;height:56px;border-radius:16px;background:var(--brand-l);color:var(--brand);display:grid;place-items:center;margin:0 auto}
.ai-chips{display:flex;flex-direction:column;gap:8px;margin-top:16px}
.ai-chip{border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:9px 12px;text-align:left;color:var(--ink2)}
.ai-chip:hover{border-color:var(--brand);color:var(--brand)}
.ai-typing{display:flex;gap:5px;padding:8px 2px}
.ai-typing i{width:7px;height:7px;border-radius:50%;background:var(--ink3);animation:blink 1s infinite}
.ai-typing i:nth-child(2){animation-delay:.15s}.ai-typing i:nth-child(3){animation-delay:.3s}
@keyframes blink{0%,80%,100%{opacity:.25}40%{opacity:1}}
@media(max-width:1000px){.aibtn{padding:0 10px}}

/* subscription */
.subbanner{padding:10px 24px;font-size:13.5px;border-bottom:1px solid var(--line)}
.subbanner.warn{background:rgba(240,169,41,.14);color:#9a6500}
.subbanner.bad{background:rgba(217,45,58,.12);color:var(--bad)}
:root[data-theme="dark"] .subbanner.warn{color:#f6c25c}
.subcard .subhead{display:flex;justify-content:space-between;gap:16px;padding:18px 20px;border-bottom:1px solid var(--line);flex-wrap:wrap}

/* company profile */
.cochip{display:flex;align-items:center;gap:10px;margin:0 4px 12px;padding:8px 10px;border:1px solid var(--line);border-radius:12px;background:var(--surface2)}
.cochip img{width:30px;height:30px;object-fit:contain;border-radius:6px;background:#fff}
.coini{width:30px;height:30px;border-radius:8px;background:var(--brand-l);color:var(--brand);display:grid;place-items:center;font-weight:700}
.coname{font-weight:600;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.coform{display:grid;grid-template-columns:minmax(240px,320px) 1fr;gap:16px;align-items:start}
.coform2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.logobox{height:150px;border:2px dashed var(--line2);border-radius:14px;display:grid;place-items:center;background:var(--surface2);overflow:hidden}
.logobox img{max-width:90%;max-height:90%;object-fit:contain}
@media(max-width:900px){.coform{grid-template-columns:1fr}.coform2{grid-template-columns:1fr}}

/* compact sidebar: menu, then storage card straight under it (no big empty gap) */
.shell{grid-template-columns:232px 1fr}
.side{gap:2px;overflow-y:auto;align-content:flex-start}
.side .grow{flex:0 0 14px}
.nav a{padding:9px 12px}
.nav{display:flex;flex-direction:column;gap:2px}
.quota{margin-top:0}
@media(max-width:900px){.shell{grid-template-columns:1fr}}
