/* ProxySold — design system */
:root{
  --bg:#f6f8fc;--surface:#fff;--text:#0f172a;--muted:#64748b;--line:#e5e9f2;
  --brand:#4f46e5;--brand-d:#4338ca;--brand-l:#eef2ff;--cyan:#06b6d4;
  --green:#15803d;--green-l:#dcfce7;--red:#b91c1c;--red-l:#fee2e2;--amber:#b45309;--amber-l:#fef3c7;
  --dark:#0b1020;--radius:14px;--shadow:0 1px 2px rgba(15,23,42,.05),0 8px 24px rgba(15,23,42,.06);
  --font:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Noto Sans Bengali",Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--brand);text-decoration:none}a:hover{text-decoration:underline}
h1,h2,h3{line-height:1.2;letter-spacing:-.02em;margin:0 0 .5em}
h1{font-size:28px}h2{font-size:20px}h3{font-size:16px}
img,svg{max-width:100%}.ic{vertical-align:-.2em;flex:none}
.container{max-width:1160px;margin:0 auto;padding:0 20px}
.muted{color:var(--muted)}.small{font-size:13px}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px}
.center{text-align:center}.inline{display:inline}.scroll{overflow-x:auto}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff;border:0;border-radius:10px;padding:10px 18px;font:600 14px var(--font);cursor:pointer;transition:.15s;text-decoration:none;white-space:nowrap}
.btn:hover{filter:brightness(1.07);transform:translateY(-1px);text-decoration:none;color:#fff}
.btn.lg{padding:14px 26px;font-size:16px;border-radius:12px}.btn.sm{padding:6px 12px;font-size:12px;border-radius:8px}.btn.block{width:100%}
.btn.gray{background:#64748b}.btn.red{background:var(--red)}.btn.green{background:var(--green)}
.btn.outline{background:transparent;color:var(--brand);box-shadow:inset 0 0 0 1.5px var(--brand)}
.btn.outline:hover{background:var(--brand-l);color:var(--brand)}
.btn.ghost{background:transparent;color:var(--text);box-shadow:none}.btn.ghost:hover{background:#eef1f7;color:var(--text)}
.btn.light{background:#fff;color:#1e1b4b}.btn.light:hover{color:#1e1b4b}
.btn.glass{background:rgba(255,255,255,.1);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.25)}
.btn[disabled]{opacity:.5;cursor:not-allowed;transform:none}

/* forms */
label{display:block;font-size:13px;font-weight:600;margin:14px 0 6px;color:#334155}
input[type=text],input[type=email],input[type=password],input[type=number],input[type=tel],input[type=url],input[type=search],select,textarea{width:100%;padding:11px 13px;border:1px solid #d5dbe8;border-radius:10px;font:15px var(--font);background:#fff;color:var(--text);transition:.15s}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--brand);box-shadow:0 0 0 3px rgba(79,70,229,.15)}
textarea{min-height:90px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px}
.row{display:flex;gap:14px;flex-wrap:wrap}.row>*{flex:1;min-width:170px}

/* cards, badges, tables, flashes */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:22px;margin-bottom:18px;box-shadow:var(--shadow)}
.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.stat .n{font-size:26px;font-weight:700}.stat .l{color:var(--muted);font-size:13px}
.badge{display:inline-block;padding:2px 10px;border-radius:99px;font-size:12px;font-weight:600;text-transform:capitalize}
.badge.green{background:var(--green-l);color:var(--green)}.badge.red{background:var(--red-l);color:var(--red)}
.badge.amber{background:var(--amber-l);color:var(--amber)}.badge.gray{background:#e8ecf4;color:#475569}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{text-align:left;padding:11px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
th{color:var(--muted);font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.04em;background:#fafbfe}
tr:last-child td{border-bottom:0}
.flash{padding:12px 16px;border-radius:10px;margin:0 0 14px;font-size:14px;border:1px solid transparent}
.flash.success{background:var(--green-l);color:#14532d;border-color:#bbf7d0}.flash.error{background:var(--red-l);color:#7f1d1d;border-color:#fecaca}.flash.info{background:#dbeafe;color:#1e3a8a;border-color:#bfdbfe}
.price{font-size:22px;font-weight:700}
pre.log{background:#0f172a;color:#e2e8f0;padding:12px;border-radius:8px;overflow:auto;font-size:12px;max-height:260px}
details summary{cursor:pointer}

/* ===== public header ===== */
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.88);backdrop-filter:saturate(1.6) blur(12px);border-bottom:1px solid var(--line)}
.site-header .bar{display:flex;align-items:center;gap:22px;height:66px}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:20px;letter-spacing:-.03em;color:var(--text)}.logo:hover{text-decoration:none}
.logo span em{font-style:normal;color:var(--brand)}
.main-nav{display:flex;gap:4px;margin-left:10px}
.main-nav a{color:#334155;font-weight:500;font-size:14px;padding:8px 12px;border-radius:8px}.main-nav a:hover,.main-nav a.on{background:#eef1f7;text-decoration:none}
.bar .sp{flex:1}.actions{display:flex;align-items:center;gap:10px}
.chip{display:inline-flex;align-items:center;gap:6px;background:var(--brand-l);color:var(--brand-d);font-weight:700;font-size:13px;padding:7px 12px;border-radius:99px}.chip:hover{text-decoration:none;background:#e0e7ff}
.menu{position:relative}.menu summary{list-style:none;display:flex;align-items:center;gap:8px;cursor:pointer;padding:4px 6px;border-radius:99px}.menu summary::-webkit-details-marker{display:none}
.avatar{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#6366f1,#06b6d4);color:#fff;display:grid;place-items:center;font-weight:700;font-size:14px}
.menu .drop{position:absolute;right:0;top:calc(100% + 8px);min-width:210px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 32px rgba(15,23,42,.14);padding:8px}
.menu .drop a,.menu .drop button{display:flex;align-items:center;gap:10px;width:100%;padding:9px 12px;border-radius:8px;color:var(--text);font:500 14px var(--font);background:none;border:0;cursor:pointer;text-align:left}
.menu .drop a:hover,.menu .drop button:hover{background:#f1f4fa;text-decoration:none}
.menu .drop hr{border:0;border-top:1px solid var(--line);margin:6px 0}
.menu .who{padding:8px 12px;font-size:12px;color:var(--muted);word-break:break-all}
.nav-toggle{display:none;background:none;border:0;padding:8px;cursor:pointer;color:var(--text)}

/* ===== hero ===== */
.hero{position:relative;color:#fff;background:radial-gradient(900px 400px at 85% -10%,rgba(6,182,212,.35),transparent 60%),radial-gradient(700px 400px at 0% 0%,rgba(99,102,241,.55),transparent 60%),linear-gradient(160deg,#0b1020 0%,#1e1b4b 60%,#312e81 100%);padding:84px 0 96px;overflow:hidden}
.hero .wrap2{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center}
.eyebrow{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);padding:6px 14px;border-radius:99px;font-size:13px;color:#c7d2fe;margin-bottom:22px}
.hero h1{font-size:54px;font-weight:800;letter-spacing:-.035em;margin-bottom:18px}
.hero h1 .grad{background:linear-gradient(90deg,#a5b4fc,#67e8f9);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p.lead{font-size:18px;color:#c7d2fe;max-width:560px;margin:0 0 30px}
.hero .cta{display:flex;gap:12px;flex-wrap:wrap}
.hero .ticks{display:flex;gap:22px;flex-wrap:wrap;margin-top:30px;color:#a5b4fc;font-size:14px}
.hero .ticks span{display:inline-flex;align-items:center;gap:7px}
.term{background:rgba(8,12,28,.75);border:1px solid rgba(255,255,255,.12);border-radius:16px;box-shadow:0 30px 60px rgba(0,0,0,.4);overflow:hidden}
.term .top{display:flex;align-items:center;gap:7px;padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.08);font-size:12px;color:#94a3b8}
.term .dot{width:10px;height:10px;border-radius:50%;background:#ef4444}.term .dot:nth-child(2){background:#f59e0b}.term .dot:nth-child(3){background:#22c55e}
.term .body{padding:20px;font:13px/1.9 ui-monospace,Menlo,Consolas,monospace;color:#e2e8f0}
.term .k{color:#818cf8}.term .g{color:#34d399}.term .c{color:#64748b}
.term .status{display:flex;justify-content:space-between;align-items:center;padding:14px 20px;background:rgba(34,197,94,.1);border-top:1px solid rgba(255,255,255,.08);font-size:13px;color:#86efac}

/* ===== sections ===== */
.section{padding:84px 0}.section.alt{background:#fff;border-block:1px solid var(--line)}
.sec-head{text-align:center;max-width:680px;margin:0 auto 48px}
.sec-head .tag{display:inline-block;color:var(--brand);font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.1em;margin-bottom:10px}
.sec-head h2{font-size:34px;font-weight:800;letter-spacing:-.03em}
.sec-head p{color:var(--muted);font-size:17px;margin:0}
.pgrid{display:grid;gap:22px;grid-template-columns:repeat(auto-fill,minmax(310px,1fr))}
.pcard{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px;display:flex;flex-direction:column;box-shadow:var(--shadow);transition:.2s}
.pcard:hover{transform:translateY(-4px);border-color:#c7d2fe;box-shadow:0 18px 40px rgba(79,70,229,.14)}
.pcard .ico{width:50px;height:50px;border-radius:14px;background:linear-gradient(135deg,#eef2ff,#e0f2fe);color:var(--brand);display:grid;place-items:center;margin-bottom:16px}
.pcard h3{font-size:19px;margin-bottom:6px}.pcard p{color:var(--muted);font-size:14px;margin:0 0 18px;flex:1}
.pcard .from{display:flex;align-items:baseline;gap:6px;margin-bottom:16px}.pcard .from b{font-size:28px;letter-spacing:-.03em}.pcard .from span{color:var(--muted);font-size:13px}
.pcard .meta{display:flex;gap:14px;font-size:13px;color:var(--muted);margin-bottom:18px}.pcard .meta span{display:inline-flex;gap:6px;align-items:center}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;counter-reset:s}
.step{background:var(--bg);border:1px solid var(--line);border-radius:18px;padding:28px;position:relative}
.step .num{width:40px;height:40px;border-radius:12px;background:var(--brand);color:#fff;display:grid;place-items:center;font-weight:800;margin-bottom:16px}
.step h3{font-size:18px}.step p{color:var(--muted);margin:0;font-size:15px}
.features{display:grid;gap:20px;grid-template-columns:repeat(3,1fr)}
.feat{padding:26px;border:1px solid var(--line);border-radius:16px;background:#fff}
.feat .ico{width:44px;height:44px;border-radius:12px;background:var(--brand-l);color:var(--brand);display:grid;place-items:center;margin-bottom:14px}
.feat h3{margin-bottom:6px}.feat p{margin:0;color:var(--muted);font-size:14.5px}
.pay-strip{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:34px}
.pay-strip span{background:#fff;border:1px solid var(--line);padding:9px 18px;border-radius:10px;font-weight:600;font-size:14px;color:#334155}
.faq{max-width:780px;margin:0 auto}
.faq details{background:#fff;border:1px solid var(--line);border-radius:14px;padding:4px 22px;margin-bottom:12px}
.faq summary{padding:16px 0;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}.faq summary::after{content:"+";font-size:22px;line-height:1;color:var(--brand)}
.faq details[open] summary::after{content:"−"}.faq details p{margin:0 0 18px;color:var(--muted)}
.cta-band{background:linear-gradient(135deg,#4f46e5,#0891b2);color:#fff;border-radius:24px;padding:56px 32px;text-align:center}
.cta-band h2{font-size:32px;font-weight:800;margin-bottom:10px}.cta-band p{color:#e0e7ff;margin:0 0 26px;font-size:17px}

/* ===== footer ===== */
.site-footer{background:var(--dark);color:#94a3b8;padding:60px 0 28px;margin-top:0}
.site-footer .cols{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:36px;margin-bottom:40px}
.site-footer h4{color:#fff;font-size:14px;margin:0 0 14px}.site-footer a{display:block;color:#94a3b8;font-size:14px;padding:4px 0}.site-footer a:hover{color:#fff;text-decoration:none}
.site-footer .logo{color:#fff;margin-bottom:12px}.site-footer p{font-size:14px;margin:0;max-width:320px}
.site-footer .bottom{border-top:1px solid #1e2740;padding-top:22px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:13px}

/* ===== auth ===== */
.auth{display:grid;grid-template-columns:1fr 1fr;min-height:calc(100vh - 66px)}
.auth .side{background:radial-gradient(600px 400px at 100% 0,rgba(6,182,212,.35),transparent 60%),linear-gradient(160deg,#0b1020,#312e81);color:#fff;padding:64px;display:flex;flex-direction:column;justify-content:center}
.auth .side h2{font-size:34px;font-weight:800;margin-bottom:14px}.auth .side p{color:#c7d2fe;font-size:16px}
.auth .side ul{list-style:none;padding:0;margin:26px 0 0}.auth .side li{display:flex;gap:12px;align-items:center;margin:14px 0;color:#e0e7ff}
.auth .side li .ic{color:#67e8f9}
.auth .form{display:flex;align-items:center;justify-content:center;padding:48px 24px;background:#fff}
.auth .form .inner{width:100%;max-width:400px}.auth .form h1{font-size:28px}

/* ===== order page ===== */
.crumbs{font-size:13px;color:var(--muted);margin:26px 0 8px}
.page{padding-top:28px;padding-bottom:70px}
.order-grid{display:grid;grid-template-columns:1fr 370px;gap:26px;align-items:start}
.panel{background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px;box-shadow:var(--shadow);margin-bottom:18px}
.panel .sh{display:flex;align-items:center;gap:12px;font-weight:700;font-size:16px;margin-bottom:16px}
.panel .sh i{font-style:normal;width:28px;height:28px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;font-size:13px}
.pills{display:flex;flex-wrap:wrap;gap:10px}
.pills label{margin:0;cursor:pointer}.pills input{position:absolute;opacity:0;pointer-events:none}
.pills span{display:block;padding:11px 20px;border:1.5px solid #d5dbe8;border-radius:12px;font-weight:600;font-size:14px;transition:.15s;background:#fff;color:#334155}
.pills input:checked+span{border-color:var(--brand);background:var(--brand-l);color:var(--brand-d);box-shadow:0 0 0 3px rgba(79,70,229,.12)}
.pills label:hover span{border-color:#a5b4fc}
.qty{display:flex;align-items:center;max-width:210px;border:1px solid #d5dbe8;border-radius:12px;overflow:hidden;background:#fff}
.qty button{width:46px;height:46px;border:0;background:#f4f6fb;font-size:20px;cursor:pointer;color:#334155}.qty button:hover{background:#e8ecf6}
.qty input{border:0;border-radius:0;text-align:center;font-weight:700;font-size:17px;box-shadow:none!important;padding:0;height:46px}
.summary{position:sticky;top:88px}
.summary .title{display:flex;align-items:center;gap:12px;margin-bottom:16px}.summary .title .ico{width:42px;height:42px;border-radius:12px;background:var(--brand-l);color:var(--brand);display:grid;place-items:center}
.sum-line{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px dashed var(--line);font-size:14px}.sum-line span:first-child{color:var(--muted)}
.sum-total{display:flex;justify-content:space-between;align-items:baseline;padding:16px 0 6px}.sum-total b{font-size:30px;letter-spacing:-.03em}
.secure{display:flex;gap:8px;align-items:center;justify-content:center;color:var(--muted);font-size:12.5px;margin-top:14px}

/* ===== account ===== */
.page-head{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:22px}.page-head h1{margin:0}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:22px}
.stat-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px;box-shadow:var(--shadow)}
.stat-card .l{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px;margin-bottom:8px}.stat-card .n{font-size:30px;font-weight:800;letter-spacing:-.03em}
.stat-card.hl{background:linear-gradient(135deg,#4f46e5,#0891b2);color:#fff;border:0}.stat-card.hl .l{color:#e0e7ff}
.meta-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:18px}.meta-grid .k{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}.meta-grid .v{font-weight:600;margin-top:2px}
.toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.toolbar select{width:auto;padding:8px 12px;font-size:13px}
.empty{text-align:center;padding:40px 20px;color:var(--muted)}.empty .ic{color:#c7d2fe;margin-bottom:10px}
.gw-list{display:grid;gap:12px}.gw{display:flex;align-items:center;gap:14px;border:1.5px solid #d5dbe8;border-radius:14px;padding:16px;cursor:pointer;margin:0;font-weight:500}
.gw input{width:auto}.gw:has(input:checked){border-color:var(--brand);background:var(--brand-l)}.gw b{display:block}.gw small{color:var(--muted)}
.quick{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.steps-v{list-style:none;padding:0;margin:0}.steps-v li{display:flex;gap:14px;padding:12px 0}.steps-v .n{width:28px;height:28px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;font-size:13px;font-weight:700;flex:none}
.box{background:#f8faff;border:1px dashed #b6c0ff;border-radius:12px;padding:16px}

/* ===== responsive ===== */
@media(max-width:980px){
  .hero .wrap2,.order-grid,.auth{grid-template-columns:1fr}.hero h1{font-size:40px}.hero{padding:56px 0 64px}
  .features,.steps,.stats{grid-template-columns:1fr}.summary{position:static}.auth .side{display:none}
  .site-footer .cols{grid-template-columns:1fr 1fr}.section{padding:56px 0}
}
@media(max-width:860px){
  .nav-toggle{display:block;margin-left:auto}
  .site-header .bar{flex-wrap:wrap;height:auto;min-height:64px;padding-top:8px;padding-bottom:8px}
  .main-nav,.actions{display:none;width:100%;flex-direction:column;align-items:stretch;margin:0}
  .site-header.open .main-nav,.site-header.open .actions{display:flex}.bar .sp{display:none}
  .menu .drop{position:static;box-shadow:none;margin-top:6px}
}
@media(max-width:560px){.hero h1{font-size:32px}.sec-head h2{font-size:26px}.site-footer .cols{grid-template-columns:1fr}.pgrid{grid-template-columns:1fr}}

/* ===== flags & country picker ===== */
.flag{width:22px;height:16px;object-fit:cover;border-radius:3px;box-shadow:0 0 0 1px rgba(15,23,42,.14);vertical-align:-3px;display:inline-block;margin-right:2px}
.vh{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px;margin:0;padding:0;border:0}
.cpick{position:relative}
.cp-btn{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border:1px solid #d5dbe8;border-radius:12px;background:#fff;font:15px var(--font);color:var(--text);cursor:pointer;text-align:left}
.cp-btn:hover{border-color:#a5b4fc}.cp-btn:focus{outline:0;border-color:var(--brand);box-shadow:0 0 0 3px rgba(79,70,229,.15)}
.cp-cur{display:inline-flex;align-items:center;gap:10px}.cp-caret{color:var(--muted)}
.cp-panel{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:30;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 16px 40px rgba(15,23,42,.16);padding:8px}
.cp-panel[hidden]{display:none}
.cp-search{margin-bottom:6px}
.cp-list{list-style:none;margin:0;padding:0;max-height:300px;overflow:auto}
.cp-item{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;cursor:pointer;font-size:14.5px}
.cp-item:hover{background:var(--brand-l)}

/* ===== KPI & dashboard widgets (shared) ===== */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px}
.kpi{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;display:flex;gap:14px;align-items:center;box-shadow:var(--shadow);color:inherit}
a.kpi:hover{text-decoration:none;border-color:#c7d2fe;transform:translateY(-2px);transition:.15s}
.kpi .k-ic{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;flex:none}
.k-ic.i{background:#eef2ff;color:#4f46e5}.k-ic.g{background:#dcfce7;color:#15803d}.k-ic.a{background:#fef3c7;color:#b45309}.k-ic.c{background:#cffafe;color:#0e7490}.k-ic.r{background:#fee2e2;color:#b91c1c}.k-ic.p{background:#f3e8ff;color:#7e22ce}
.kpi .k-v{font-size:24px;font-weight:800;letter-spacing:-.03em;line-height:1.15}.kpi .k-l{color:var(--muted);font-size:13px}.kpi .k-s{font-size:12px;color:var(--muted)}
.wgrid{display:grid;grid-template-columns:2fr 1fr;gap:18px;margin-bottom:18px;align-items:start}
.wgrid.side-sm{grid-template-columns:minmax(0,1fr) 270px}
.wcard{background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);overflow:hidden}
.wcard .wh{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:16px 20px;border-bottom:1px solid var(--line)}
.wcard .wh h2{margin:0;font-size:16px}.wcard .wb{padding:18px 20px}.wcard .wb.flush{padding:0}
.wcard table th:first-child,.wcard table td:first-child{padding-left:20px}.wcard table th:last-child,.wcard table td:last-child{padding-right:20px}
.chart svg{width:100%;height:auto;display:block}.chart .bar{fill:#6366f1}.chart .bar:hover{fill:#4338ca}.chart .lbl{font-size:10px;fill:#94a3b8}.chart .grid{stroke:#eef1f7}
.stack{display:flex;height:12px;border-radius:99px;overflow:hidden;background:#eef1f7;margin:6px 0 16px}.stack span{display:block;height:100%}
.legend{display:grid;gap:9px}.legend div{display:flex;align-items:center;gap:10px;font-size:14px}.legend i{width:10px;height:10px;border-radius:50%;flex:none}.legend b{margin-left:auto}
.mini-row{display:flex;align-items:center;gap:12px;padding:12px 20px;border-bottom:1px solid var(--line)}.mini-row:last-child{border-bottom:0}
.mini-row .m-ic{width:38px;height:38px;border-radius:11px;background:var(--brand-l);color:var(--brand);display:grid;place-items:center;flex:none}
.mini-row .m-t{flex:1;min-width:0}.mini-row .m-t b{display:block;font-size:14px}.mini-row .m-t span{font-size:12.5px;color:var(--muted)}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px}.dot.g{background:#22c55e}.dot.r{background:#ef4444}.dot.a{background:#f59e0b}.dot.x{background:#94a3b8}

.setup{background:linear-gradient(135deg,#eef2ff,#ecfeff);border:1px solid #c7d2fe;border-radius:16px;padding:20px;margin-bottom:20px}
.setup ol{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:8px}.setup li{display:flex;gap:10px;align-items:center}
.setup .ck{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:12px;flex:none}.ck.ok{background:#22c55e;color:#fff}.ck.no{background:#fff;border:2px solid #c7d2fe;color:transparent}

/* ===== customer dashboard shell ===== */
.dash{display:grid;grid-template-columns:240px 1fr;gap:26px;align-items:start}
.d-side{position:sticky;top:88px;background:#fff;border:1px solid var(--line);border-radius:18px;padding:14px;box-shadow:var(--shadow)}
.d-side .d-user{display:flex;align-items:center;gap:12px;padding:8px 8px 14px;border-bottom:1px solid var(--line);margin-bottom:10px}
.d-side .d-user b{display:block;font-size:14px;line-height:1.3}.d-side .d-user span{font-size:12px;color:var(--muted);word-break:break-all}
.d-link{display:flex;align-items:center;gap:11px;padding:6px 8px;border-radius:12px;color:#334155;font-weight:500;font-size:14.5px;margin:2px 0;transition:background .15s,color .15s}
.d-sec{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#94a3b8;margin:16px 10px 4px}.d-side nav>.d-sec:first-child{margin-top:4px}
.d-link .d-ic{width:30px;height:30px;border-radius:9px;background:#f1f4fa;color:#64748b;display:grid;place-items:center;flex:none;transition:background .15s,color .15s}
.d-link:hover .d-ic{background:#e4e9f4;color:#334155}.d-link.on .d-ic{background:var(--brand);color:#fff}
.d-link .badge{margin-left:auto}
.d-link:hover{background:#f1f4fa;text-decoration:none}.d-link.on{background:var(--brand-l);color:var(--brand-d);font-weight:600}
.d-bal{margin-top:12px;background:linear-gradient(135deg,#4f46e5,#0891b2);color:#fff;border-radius:14px;padding:14px}
.d-bal small{opacity:.85;display:block}.d-bal b{font-size:22px;letter-spacing:-.02em}
.d-main{min-width:0}
.welcome{background:radial-gradient(500px 220px at 100% 0,rgba(6,182,212,.4),transparent 60%),linear-gradient(135deg,#312e81,#4f46e5);color:#fff;border-radius:20px;padding:28px 30px;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-bottom:20px}
.welcome h1{color:#fff;margin:0 0 4px;font-size:26px}.welcome p{margin:0;color:#c7d2fe}
.welcome .bal{text-align:right}.welcome .bal small{color:#c7d2fe;display:block}.welcome .bal b{font-size:30px;letter-spacing:-.03em}
.tag-warn{display:flex;gap:12px;align-items:center;background:#fffbeb;border:1px solid #fde68a;color:#92400e;border-radius:14px;padding:14px 18px;margin-bottom:18px}

/* ===== admin shell ===== */
body.admin-body{background:#f3f5fb}
.a-shell{display:grid;grid-template-columns:252px 1fr;min-height:100vh}
.a-side{background:#0b1020;color:#cbd5e1;padding:18px 14px;position:sticky;top:0;height:100vh;overflow:auto;display:flex;flex-direction:column}
.a-brand{display:flex;align-items:center;gap:10px;color:#fff;font-weight:800;font-size:19px;letter-spacing:-.03em;padding:6px 10px 18px}.a-brand:hover{text-decoration:none}
.a-brand small{display:block;font-size:11px;font-weight:600;color:#818cf8;letter-spacing:.08em;text-transform:uppercase}
.a-sec{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:#64748b;margin:18px 12px 6px}
.a-nav{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:10px;color:#cbd5e1;font-size:14px;font-weight:500;margin:2px 0}
.a-nav:hover{background:#151c33;color:#fff;text-decoration:none}.a-nav.on{background:linear-gradient(135deg,#4f46e5,#4338ca);color:#fff;box-shadow:0 6px 16px rgba(79,70,229,.35)}
.a-nav .badge{margin-left:auto}
/* admin menu: groups + submenus */
.a-side>*{flex-shrink:0}
.a-menu{flex:none;padding-bottom:12px}
.a-foot{padding-top:12px}
.a-side{scrollbar-width:thin;scrollbar-color:#1f2a4a transparent}
.a-lbl{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
button.a-nav{width:100%;background:none;border:0;text-align:left;cursor:pointer;font-family:var(--font)}
.a-parent .ic{color:#7c89ad}.a-nav:hover .ic{color:#c7d2fe}
.a-parent.has-on{color:#fff;background:#121a30}.a-parent.has-on>.ic{color:#a5b4fc}
.a-nav.on .ic{color:#fff}
.a-chev{margin-left:auto;display:inline-flex;color:#64748b;transition:transform .2s}
.a-parent .badge{margin-left:auto}.a-parent .badge+.a-chev{margin-left:8px}
.a-grp.open>.a-parent .a-chev{transform:rotate(180deg);color:#a5b4fc}
.a-sub{display:grid;grid-template-rows:0fr;transition:grid-template-rows .22s ease}
.a-grp.open>.a-sub{grid-template-rows:1fr}
.a-sub-in{min-height:0;overflow:hidden;visibility:hidden;transition:visibility .22s;margin:0 0 0 23px;padding:0 0 0 10px;border-left:1px solid #1f2a4a}
.a-grp.open>.a-sub>.a-sub-in{visibility:visible;margin-top:2px;margin-bottom:6px}
.a-link{display:flex;align-items:center;gap:9px;padding:7px 10px;margin:1px 0;border-radius:8px;color:#94a3b8;font-size:13.5px;font-weight:500}
.a-link::before{content:"";flex:none;width:5px;height:5px;border-radius:50%;background:#334155;transition:.15s}
.a-link:hover{background:#151c33;color:#fff;text-decoration:none}.a-link:hover::before{background:#818cf8}
.a-link.on{background:rgba(99,102,241,.16);color:#fff;font-weight:600}.a-link.on::before{background:#818cf8;box-shadow:0 0 0 3px rgba(129,140,248,.25)}
.a-link .badge{margin-left:auto}
.a-nav:focus-visible,.a-link:focus-visible,.a-foot button:focus-visible{outline:2px solid #818cf8;outline-offset:-2px}
@media (prefers-reduced-motion:reduce){.a-sub,.a-chev,.a-link::before{transition:none}}
.a-foot{margin-top:auto;border-top:1px solid #1b2440;padding-top:14px}
.a-foot form{margin:0}.a-foot button{width:100%;background:none;border:0;color:#cbd5e1;font:500 14px var(--font);display:flex;gap:11px;align-items:center;padding:10px 12px;border-radius:10px;cursor:pointer}.a-foot button:hover{background:#151c33;color:#fff}
.a-main{min-width:0}
.a-top{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);height:62px;display:flex;align-items:center;gap:14px;padding:0 26px}
.a-top .crumb{font-weight:700;font-size:15px}.a-top .crumb span{color:var(--muted);font-weight:500}
.a-top .sp{flex:1}.a-menu-btn{display:none;background:none;border:0;cursor:pointer;color:var(--text);padding:6px}
.a-content{padding:24px 26px 70px;max-width:1440px}

@media(max-width:1100px){.kpis{grid-template-columns:repeat(2,1fr)}.wgrid,.wgrid.side-sm{grid-template-columns:1fr}}
@media(max-width:980px){
  .dash{grid-template-columns:1fr}.d-side{position:static}.d-side .d-user,.d-bal{display:none}
  .d-side nav{display:flex;gap:6px;overflow-x:auto}.d-link{white-space:nowrap}
  .a-shell{grid-template-columns:1fr}.a-side{position:fixed;left:-270px;top:0;width:252px;z-index:60;transition:left .2s}.a-side.open{left:0;box-shadow:0 0 0 100vmax rgba(0,0,0,.45)}
  .a-menu-btn{display:block}.a-top{padding:0 16px}.a-content{padding:18px 14px 60px}
}
@media(max-width:560px){.kpis{grid-template-columns:1fr}.welcome .bal{text-align:left}}

/* ===== simplified checkout ===== */
.fgroup{padding:20px 0;border-bottom:1px solid var(--line)}.fgroup:first-child{padding-top:4px}.fgroup:last-child{border-bottom:0;padding-bottom:4px}
.fh{font-weight:700;font-size:15px;margin-bottom:12px}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.chip-q{border:1.5px solid #d5dbe8;background:#fff;border-radius:99px;padding:5px 14px;font:600 13px var(--font);color:#334155;cursor:pointer}
.chip-q:hover{border-color:var(--brand);color:var(--brand)}
.pills span b{display:block;font-weight:600}.pills span em{display:block;font-style:normal;font-size:12px;color:var(--muted);font-weight:500;margin-top:1px;min-height:1em}
.pills input:checked+span em{color:var(--brand-d)}
.mbar{display:none}
@media(max-width:980px){
  .mbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;background:#fff;border-top:1px solid var(--line);padding:10px 16px;align-items:center;justify-content:space-between;gap:12px;box-shadow:0 -6px 20px rgba(15,23,42,.08)}
  .mbar small{display:block;color:var(--muted);font-size:12px;line-height:1.1}.mbar b{font-size:20px;letter-spacing:-.02em}
  #orderForm{padding-bottom:84px}
  .summary #placeBtn,.summary .secure{display:none}
}

/* ===== tabs ===== */
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:16px;border-bottom:1px solid var(--line)}
.tab{padding:10px 14px;color:#475569;font-weight:600;font-size:14px;border-bottom:2px solid transparent;margin-bottom:-1px}
.tab:hover{text-decoration:none;color:var(--text)}.tab.on{color:var(--brand-d);border-bottom-color:var(--brand)}
.tab span{display:inline-block;margin-left:4px;background:#eef1f7;color:#64748b;border-radius:99px;padding:0 8px;font-size:12px;font-weight:700}.tab.on span{background:var(--brand-l);color:var(--brand-d)}

/* invoice */
.inv-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:22px;align-items:start}

.inv-table th{text-align:left;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;padding:12px 0 8px}
.inv-table td{padding:12px 0;vertical-align:top}.inv-table .r{text-align:right;white-space:nowrap;font-weight:600}
.inv-dl{margin:8px 0 0;display:grid;gap:4px}.inv-dl div{display:flex;gap:10px;font-size:13px}.inv-dl dt{color:var(--muted);min-width:100px}.inv-dl dd{margin:0;font-weight:500}
.inv-totals{border-top:1px solid var(--line);margin-top:6px;padding-top:12px;display:grid;gap:8px}
.inv-totals div{display:flex;justify-content:space-between;gap:16px;font-size:14px}
.inv-totals .total{border-top:1px dashed #cbd5e1;padding-top:12px;margin-top:4px;font-size:18px;font-weight:700}
@media(max-width:860px){.inv-grid{grid-template-columns:1fr}}

/* ===== customer panel — mobile ===== */
html{-webkit-text-size-adjust:100%}
.d-main .mono{overflow-wrap:anywhere}
@media(max-width:980px){
  .dash{grid-template-columns:minmax(0,1fr)}
  .d-side{padding:6px;border-radius:14px;min-width:0}
  .d-side nav{scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
  .d-side nav::-webkit-scrollbar{display:none}
  .d-link{margin:0;padding:9px 14px;border-radius:99px;scroll-snap-align:center;flex:none}
  .inv-grid>div:last-child{order:-1}            /* invoice: payment column first on mobile, details after */
}
@media(max-width:640px){
  .container{padding:0 14px}
  .page{padding-top:16px;padding-bottom:56px}
  .crumbs{margin:8px 0 6px}
  .dash{gap:14px}
  h1{font-size:24px}
  .page-head{margin-bottom:16px}
  .page-head>.btn,.page-head>div+.toolbar{width:100%}
  .page-head>.btn{justify-content:center}
  .toolbar{width:100%}
  .toolbar>form{flex:1 1 140px}
  .toolbar>.btn,.toolbar>form>.btn{width:100%}
  .toolbar select{flex:1 1 100%;width:100%}
  .panel{padding:18px 16px;border-radius:16px;margin-bottom:14px}
  .panel-head{padding:16px!important}
  .panel .sh{margin-bottom:12px}

  /* welcome card */
  .welcome{padding:20px 18px;border-radius:18px;gap:14px}
  .welcome h1{font-size:21px}
  .welcome>div:first-child{width:100%}
  .welcome .bal{width:100%;background:rgba(255,255,255,.14);border-radius:14px;padding:12px 16px;display:flex;justify-content:space-between;align-items:center}
  .welcome .bal b{font-size:24px}
  .welcome p>.btn,.welcome p[style]>.btn{flex:1 1 calc(50% - 5px)}

  /* KPI cards: 2 columns */
  .kpis{grid-template-columns:1fr 1fr;gap:10px}
  .kpi{padding:12px;gap:10px;align-items:flex-start}
  .kpi .k-ic{width:36px;height:36px;border-radius:10px}
  .kpi .k-ic svg{width:18px;height:18px}
  .kpi .k-v{font-size:19px}.kpi .k-l{font-size:12px;line-height:1.3}

  /* cards & compact rows */
  .wcard .wh{padding:14px 16px;flex-wrap:wrap}.wcard .wh h2{font-size:15px}
  .wcard .wb{padding:14px 16px}
  .tag-warn{padding:12px 14px;align-items:flex-start}
  .mini-row{padding:12px 16px}
  .mini-row.has-act{flex-wrap:wrap}
  .mini-row.has-act .m-t{flex:1 1 calc(100% - 52px)}
  .m-act{flex:1 1 100%;display:flex;gap:8px;margin-left:50px}
  .m-act>*{flex:1}.m-act form{display:flex}.m-act .btn{width:100%}

  /* tables → cards */
  .rtable,.rtable tbody{display:block;width:100%}
  .rtable tr.hr{display:none}
  .rtable tr{display:flex;flex-direction:column;padding:14px 16px;border-bottom:8px solid var(--bg)}
  .rtable tr:last-child{border-bottom:0}
  .rtable td{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:6px 0!important;border:0;text-align:right;min-width:0}
  .rtable td[data-label]::before{content:attr(data-label);color:var(--muted);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;text-align:left;flex:none}
  .rtable td.rt-main{display:block;order:-1;text-align:left;padding:0 0 8px!important;margin-bottom:4px;border-bottom:1px dashed var(--line)}
  .rtable td.rt-main[data-label]::before{display:none}
  .rtable td.rt-act{padding-top:10px!important;display:flex;gap:8px}
  .rtable td.rt-act>*{flex:1}.rtable td.rt-act .btn{width:100%}.rtable td.rt-act form{display:flex}
  .rtable td.rt-note:empty{display:none}
  .rtable td.rt-note{flex-direction:column;align-items:flex-start;text-align:left;gap:2px}

  /* forms: 16px stops iOS zoom; bigger touch targets */
  input[type=text],input[type=email],input[type=password],input[type=number],input[type=tel],input[type=url],input[type=search],select,textarea{font-size:16px}
  .d-main .btn.sm{padding:9px 14px;font-size:13px;min-height:38px}
  .tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;margin-left:-14px;margin-right:-14px;padding:0 14px}
  .tabs::-webkit-scrollbar{display:none}.tab{white-space:nowrap;flex:none}
  .gw{padding:14px;gap:12px}
  .quick .btn{flex:1}
  .meta-grid{grid-template-columns:1fr 1fr;gap:14px}

  /* invoice */

  .inv-dl div{flex-direction:column;gap:0}.inv-dl dt{min-width:0}
  .inv-totals div{font-size:13.5px}.inv-totals .total{font-size:17px}
  .steps-v li{gap:12px}
  .box{padding:14px}.box .price{font-size:20px}
  .box .mono b{display:block;margin-bottom:8px}
  .box .btn.lg,.panel .btn.lg{width:100%}
  .flash{font-size:13.5px}
}
@media(max-width:380px){.kpis{grid-template-columns:1fr}.welcome p[style]>.btn{flex:1 1 100%}}

/* ===== mobile navigation (drawer + bottom tabs) ===== */
.m-chip,.m-overlay,.m-drawer,.btabs{display:none}
.bars{position:relative;display:block;width:20px;height:14px}
.bars i{position:absolute;left:0;right:0;height:2px;border-radius:2px;background:currentColor}
.bars i:nth-child(1){top:0}.bars i:nth-child(2){top:6px}.bars i:nth-child(3){top:12px}
@media(max-width:860px){
  /* header: logo · wallet chip · menu button */
  .site-header .bar{flex-wrap:nowrap;height:60px;min-height:60px;padding-top:0;padding-bottom:0;gap:10px}
  .main-nav,.actions{display:none!important}
  .m-chip{display:inline-flex;margin-left:auto}
  .nav-toggle{display:grid;place-items:center;width:42px;height:42px;margin-left:auto;padding:0;border-radius:12px;background:#f1f4fa;color:var(--text)}
  .m-chip+.nav-toggle{margin-left:0}
  .nav-toggle:active{background:#e5e9f2}
  .logo{font-size:18px}

  /* drawer */
  .m-overlay{display:block;position:fixed;inset:0;z-index:90;background:rgba(15,23,42,.5);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .25s}
  .m-drawer{display:flex;flex-direction:column;position:fixed;top:0;right:0;bottom:0;z-index:100;width:min(88vw,340px);background:#fff;box-shadow:-14px 0 40px rgba(15,23,42,.2);transform:translateX(100%);visibility:hidden;transition:transform .28s cubic-bezier(.2,.8,.2,1),visibility 0s .28s}
  html.nav-open{overflow:hidden}
  html.nav-open .m-overlay{opacity:1;pointer-events:auto}
  html.nav-open .m-drawer{transform:none;visibility:visible;transition:transform .28s cubic-bezier(.2,.8,.2,1),visibility 0s}
  .m-head{display:flex;align-items:center;justify-content:space-between;height:60px;padding:0 14px 0 18px;border-bottom:1px solid var(--line);flex:none}
  .m-close{display:grid;place-items:center;width:40px;height:40px;border:0;border-radius:12px;background:#f1f4fa;color:var(--text);cursor:pointer}
  .m-close .bars{height:20px;width:18px}
  .m-close .bars i:nth-child(1){top:9px;transform:rotate(45deg)}.m-close .bars i:nth-child(2){opacity:0}.m-close .bars i:nth-child(3){top:9px;transform:rotate(-45deg)}
  .m-body{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:16px 14px}
  .m-user{background:linear-gradient(135deg,#4f46e5,#0891b2);color:#fff;border-radius:16px;padding:14px;margin-bottom:6px}
  .m-user .mu-top{display:flex;align-items:center;gap:12px}
  .m-user .avatar{background:rgba(255,255,255,.2);flex:none}
  .m-user .mu-top div{min-width:0}.m-user .mu-top b{display:block;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .m-user .mu-top span:not(.avatar){display:block;font-size:12px;opacity:.85;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .m-user .mu-bal{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.22)}
  .m-user .mu-bal small{display:block;font-size:12px;opacity:.85;line-height:1.2}.m-user .mu-bal b{font-size:20px;letter-spacing:-.02em}
  .m-sec{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#94a3b8;margin:18px 6px 6px}
  .m-link{display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:12px;color:#1e293b;font-weight:600;font-size:15px;margin:2px 0}
  .m-link:hover{text-decoration:none;background:#f1f4fa}
  .m-link .mi{width:36px;height:36px;border-radius:10px;background:#f1f4fa;color:#475569;display:grid;place-items:center;flex:none}
  .m-link.on{background:var(--brand-l);color:var(--brand-d)}.m-link.on .mi{background:var(--brand);color:#fff}
  .m-foot{flex:none;display:grid;gap:10px;padding:14px 14px calc(14px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#fafbfe}
  .m-foot form{margin:0}.m-foot .btn{padding:12px 18px}

  /* bottom tab bar (customer area) */
  .d-side{display:none}
  .btabs{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:60;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-top:1px solid var(--line);padding:6px 6px calc(6px + env(safe-area-inset-bottom));box-shadow:0 -6px 20px rgba(15,23,42,.06)}
  .btabs a{display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px 0;font-size:11px;font-weight:600;color:#64748b;line-height:1.2;-webkit-tap-highlight-color:transparent}
  .btabs a:hover{text-decoration:none}
  .btabs .bt-ic{width:48px;height:28px;border-radius:99px;display:grid;place-items:center;transition:background .2s}
  .btabs a.on{color:var(--brand-d)}.btabs a.on .bt-ic{background:var(--brand-l)}
  body.has-btabs{padding-bottom:calc(68px + env(safe-area-inset-bottom))}
}
@media(min-width:861px){.m-overlay,.m-drawer,.btabs{display:none!important}}

/* proxies list */
.pager{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 20px;border-top:1px solid var(--line)}
.kpi[href]{cursor:pointer}.kpi[href]:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
@media(max-width:640px){.pager{padding:12px 16px}}
.nw{white-space:nowrap}
.rt-act .btn+.btn,.rt-act .btn+form,.rt-act form+.btn{margin-left:6px}
@media(max-width:640px){.rt-act .btn+.btn,.rt-act .btn+form{margin-left:0}.rtable td.nw{white-space:normal}.rtable .mono.nw{white-space:normal}}

/* proxy details page */
.act-wrap{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}

.det-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:22px;align-items:start}
.dl-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.dl-row:last-child{border-bottom:0;padding-bottom:0}
.dl-row .k{flex:0 0 108px;color:var(--muted);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.dl-row .v{flex:1;min-width:0;font-weight:600;overflow-wrap:anywhere}.dl-row .acts{display:flex;gap:6px;flex:none}
.fmt-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.fmt-row:last-child{border-bottom:0;padding-bottom:0}
.fmt-row .fl{flex:1;min-width:0}.fmt-row .k{display:block;color:var(--muted);font-size:12px;font-weight:600;margin-bottom:4px}
.fmt-row code{display:block;background:#f8faff;border:1px solid var(--line);border-radius:8px;padding:8px 10px;overflow-wrap:anywhere}
.ip-tags{display:flex;flex-wrap:wrap;gap:8px}.ip-tags span{background:var(--brand-l);color:var(--brand-d);border-radius:8px;padding:4px 10px}
@media(max-width:860px){.det-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:640px){

  .dl-row{flex-wrap:wrap;gap:6px 10px}.dl-row .k{flex:1 1 100%}.dl-row .v{flex:1 1 0}
  .fmt-row{flex-direction:column;align-items:stretch;gap:8px}.fmt-row .btn{width:100%}
  .act-wrap{justify-content:stretch;width:100%}.act-wrap>*{flex:1}
}

/* extend period (inside Proxy information) */
.ext{margin-top:18px;padding-top:16px;border-top:1px dashed #cbd5e1}
.ext-note{display:flex;gap:8px;align-items:flex-start;background:#fffbeb;border:1px solid #fde68a;color:#92400e;border-radius:10px;padding:10px 12px;font-size:13px;margin-bottom:12px}
.ext-note .ic{margin-top:2px}.ext-note a{white-space:nowrap}
.ext .btn.block{padding:12px 18px}
.ext-body{margin-top:14px;background:#f8fafc;border:1px solid var(--line);border-radius:12px;padding:14px}
.ext-body .dl-row{padding:9px 0}.ext-body .dl-row .k{flex:0 0 96px}
.ext-body .v.neg{color:var(--red)}
.ext-body form{margin-top:12px}
html{scroll-padding-top:76px}

/* proxies list */

.px-sub{color:var(--muted);font-size:12.5px;margin-top:4px;line-height:1.5}
.px-sub .badge{font-size:11px;padding:1px 8px;text-transform:none}

/* ===== invoice (A4 paper) ===== */
.inv-wrap{max-width:820px;margin:0 auto}
.inv-wrap .crumbs{margin:6px 0 8px}
.inv-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:18px}
.inv-bar-t{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.inv-bar-t h1{margin:0;font-size:24px}
.inv-paper{background:#e9edf5;border:1px solid var(--line);border-radius:18px;padding:26px}
.inv-sheet{background:#fff;max-width:794px;margin:0 auto;padding:44px 48px 34px;border-radius:6px;box-shadow:0 1px 3px rgba(15,23,42,.08),0 12px 32px rgba(15,23,42,.10);position:relative;overflow:hidden;font-size:14px;color:#0f172a}
.inv-sheet::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:linear-gradient(90deg,#4f46e5,#06b6d4)}
.inv-top{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-bottom:22px;border-bottom:2px solid #0f172a}
.inv-brand{display:flex;align-items:center;gap:12px}.inv-brand b{font-size:21px;letter-spacing:-.02em;display:block;line-height:1.2}.inv-brand small{color:var(--muted);font-size:12.5px}
.inv-title{text-align:right}.inv-title h2{margin:0;font-size:30px;letter-spacing:.16em;color:#0f172a;font-weight:800;line-height:1}
.inv-title .inv-no{color:var(--muted);font-weight:600;margin-top:8px;font-size:14px}
.inv-parties{display:grid;grid-template-columns:1.2fr 1.2fr .8fr;gap:24px;padding:24px 0 20px}
.inv-parties .k,.inv-notes .k{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.09em;font-weight:700;margin-bottom:6px}
.inv-parties .v{font-weight:700;font-size:15px;overflow-wrap:anywhere}
.inv-statusbox{text-align:right}
.inv-stamp{display:inline-block;padding:4px 14px;border-radius:6px;font-size:12px;font-weight:800;letter-spacing:.12em;border:1.5px solid currentColor;white-space:nowrap}
.inv-stamp.green{color:#15803d;background:#f0fdf4}.inv-stamp.amber{color:#b45309;background:#fffbeb}.inv-stamp.red{color:#b91c1c;background:#fef2f2}.inv-stamp.gray{color:#475569;background:#f1f5f9}
.inv-band{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));background:#f8fafc;border:1px solid var(--line);border-radius:8px;margin-bottom:22px;overflow:hidden}
.inv-band>div{padding:12px 14px;border-right:1px solid var(--line);min-width:0}.inv-band>div:last-child{border-right:0}
.inv-band span{display:block;font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.07em;font-weight:700;margin-bottom:3px}
.inv-band b{display:block;font-size:13.5px;overflow-wrap:anywhere}
.inv-sheet .inv-table{width:100%;border-collapse:collapse}
.inv-sheet .inv-table th{background:#0f172a;color:#fff;text-align:left;font-size:11.5px;text-transform:uppercase;letter-spacing:.08em;padding:10px 14px;border:0}
.inv-sheet .inv-table th.r{text-align:right}
.inv-sheet .inv-table td{padding:16px 14px;border-bottom:1px solid var(--line);vertical-align:top}
.inv-sheet .inv-table td.r{text-align:right;white-space:nowrap;font-weight:700}
.inv-sum{display:grid;grid-template-columns:1fr minmax(260px,330px);gap:28px;margin-top:18px;align-items:start}
.inv-notes p{margin:0 0 8px;color:#475569;font-size:13px;line-height:1.55}
.inv-sheet .inv-totals{display:grid;gap:8px;border:0;margin:0;padding:0}
.inv-sheet .inv-totals>div{display:flex;justify-content:space-between;gap:16px;font-size:14px}
.inv-sheet .inv-totals .sub{color:var(--muted);font-size:13px}
.inv-sheet .inv-totals .total{background:#0f172a;color:#fff;border-radius:8px;padding:13px 14px;margin-top:6px;font-size:16px;font-weight:700}
.inv-foot{margin-top:34px;padding-top:14px;border-top:1px solid var(--line);text-align:center;color:var(--muted);font-size:12px;display:grid;gap:3px}
.inv-pay{max-width:100%;margin-top:4px}
@media(max-width:860px){.inv-paper{padding:12px;border-radius:14px}.inv-sheet{padding:30px 22px 24px}.inv-parties{grid-template-columns:1fr 1fr}.inv-statusbox{grid-column:1/-1;text-align:left}.inv-sum{grid-template-columns:1fr;gap:18px}}
@media(max-width:480px){.inv-top{flex-direction:column;align-items:flex-start}.inv-title{text-align:left}.inv-parties{grid-template-columns:1fr}.inv-band>div{border-right:0;border-bottom:1px solid var(--line)}.inv-band>div:last-child{border-bottom:0}}

.inv-wrap.inv-grid{display:block;gap:0}.inv-wrap .tag-warn{margin-bottom:16px}.inv-wrap .inv-pay{margin-top:22px}.inv-wrap.inv-pending .inv-pay{margin:0 0 22px}.inv-pay-h{display:flex;align-items:center;gap:10px;font-size:19px;margin:0 0 14px;color:#0f172a}.inv-pay-h svg{color:var(--brand)}

.inv-title .inv-paybtn{margin-top:12px}.inv-paybtn form{margin:0}.inv-paybtn .btn{padding:9px 20px}

.btn.outline.danger-o{color:#b91c1c;box-shadow:inset 0 0 0 1.5px #fca5a5}.btn.outline.danger-o:hover{background:#fef2f2;color:#991b1b}

@media print{
  @page{size:A4 portrait;margin:12mm}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  html,body{background:#fff!important;margin:0!important;padding:0!important}
  .site-header,.site-footer,.crumbs,.page-head,.d-side,.btabs,.m-drawer,.m-overlay,.flash,.tag-warn,.inv-pay,.inv-bar,.no-print,.toolbar,footer{display:none!important}
  .container,.container.page{max-width:none!important;padding:0!important;margin:0!important}
  .dash{display:block!important}.d-main{width:100%!important;padding:0!important;margin:0!important}
  .inv-wrap{max-width:none!important;margin:0!important;display:block!important}
  .inv-paper{background:#fff!important;border:0!important;padding:0!important;border-radius:0!important}
  .inv-sheet{max-width:none!important;width:100%!important;margin:0!important;padding:8mm 6mm 0!important;box-shadow:none!important;border-radius:0!important;font-size:12px;page-break-inside:avoid;break-inside:avoid;page-break-after:avoid}
  .inv-sheet::before{height:5px}
  .inv-parties{grid-template-columns:1.2fr 1.2fr .8fr!important}.inv-statusbox{grid-column:auto!important;text-align:right!important}
  .inv-band>div{border-right:1px solid var(--line)!important;border-bottom:0!important}.inv-band>div:last-child{border-right:0!important}
  .inv-sum{grid-template-columns:1fr 300px!important}
  .inv-table tr,.inv-totals,.inv-parties,.inv-band{page-break-inside:avoid}
  a{color:inherit!important;text-decoration:none!important}
}

/* ===== add funds ===== */

/* Profile page (desktop-first two-column layout) */
.pf-grid{display:grid;grid-template-columns:320px minmax(0,1fr);gap:22px;align-items:start}
.pf-side{position:sticky;top:84px}
.pf-card{text-align:center;padding:30px 24px}
.pf-avatar{width:84px;height:84px;margin:0 auto 14px;border-radius:50%;background:linear-gradient(135deg,#6366f1,#06b6d4);color:#fff;display:grid;place-items:center;font-size:34px;font-weight:800;box-shadow:0 8px 20px rgba(79,70,229,.3)}
.pf-name{margin:0 0 2px;font-size:20px;word-break:break-word}
.pf-mail{font-size:14px;word-break:break-all}
.pf-co{display:inline-flex;align-items:center;gap:6px;margin-top:10px;padding:3px 12px;border-radius:99px;background:var(--brand-l);color:var(--brand);font-size:13px;font-weight:600}
.pf-meter{margin:22px 0 4px;text-align:left}
.pf-meter-h{display:flex;justify-content:space-between;font-size:13px;color:var(--muted);margin-bottom:6px}.pf-meter-h b{color:var(--text)}
.pf-bar{height:8px;border-radius:99px;background:#e8ecf4;overflow:hidden}.pf-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#6366f1,#06b6d4)}
.pf-facts{margin:18px 0 0;text-align:left;border-top:1px solid var(--line)}
.pf-facts>div{display:flex;justify-content:space-between;gap:14px;padding:11px 0;border-bottom:1px solid var(--line);font-size:14px}
.pf-facts dt{color:var(--muted);flex:none}.pf-facts dd{margin:0;font-weight:600;text-align:right;word-break:break-word}
.pf-links{display:flex;flex-direction:column;gap:6px;margin-top:16px;text-align:left}
.pf-links a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;color:var(--text);font-weight:600;font-size:14px}
.pf-links a:hover{background:var(--brand-l);color:var(--brand);text-decoration:none}
.pf-h{display:flex;align-items:center;gap:10px;margin:0 0 2px;font-size:18px}
.pf-sub{margin:0 0 6px}
.pf-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px}
.pf-fields .full{grid-column:1/-1}
.pf-row3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 18px}
.pf-actions{display:flex;align-items:center;justify-content:space-between;gap:16px;position:sticky;bottom:0;z-index:5;background:rgba(246,248,252,.92);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:16px;padding:14px 20px;box-shadow:var(--shadow)}
@media(min-width:1180px){.pf-grid{grid-template-columns:340px minmax(0,1fr);gap:28px}}
@media(max-width:980px){.pf-grid{grid-template-columns:1fr}.pf-side{position:static}.pf-card{padding:24px 18px}}
@media(max-width:760px){.pf-row3{grid-template-columns:1fr}}
@media(max-width:640px){.pf-fields{grid-template-columns:1fr}.pf-actions{position:static;flex-direction:column-reverse;align-items:stretch;text-align:center}.pf-actions .btn{width:100%}}

/* Profile photo */
.avatar{overflow:hidden;flex:none}
.avatar img{width:100%;height:100%;object-fit:cover;display:block}
.pf-avatar{overflow:hidden}.pf-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.pf-photo{display:flex;justify-content:center;gap:8px;margin:0 0 6px}
.pf-photo form{margin:0}.pf-photo label.btn{margin:0;cursor:pointer}
.pf-hint{margin-bottom:6px}

/* Round avatars — polished */
.avatar{border-radius:50%;aspect-ratio:1/1;box-shadow:0 0 0 2px #fff,0 0 0 3px var(--line)}
.avatar img{border-radius:50%}
.m-user .avatar{box-shadow:0 0 0 2px rgba(255,255,255,.55)}
.pf-avatar{position:relative;display:block;cursor:pointer;width:120px;height:120px;aspect-ratio:1/1;margin:0 auto 14px;border-radius:50%;overflow:hidden;
  box-shadow:0 0 0 4px #fff,0 0 0 6px #c7d2fe,0 12px 28px rgba(79,70,229,.28);transition:box-shadow .2s,transform .2s}
.pf-avatar:hover{transform:translateY(-1px);box-shadow:0 0 0 4px #fff,0 0 0 6px var(--brand),0 14px 30px rgba(79,70,229,.35)}
.pf-avatar img{width:100%;height:100%;object-fit:cover;object-position:center;display:block;border-radius:50%}
.pf-avatar>b{display:grid;place-items:center;width:100%;height:100%;font-size:46px;font-weight:800;line-height:1}
.pf-cam{position:absolute;inset:0;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background:rgba(15,23,42,.55);color:#fff;opacity:0;transition:opacity .18s}
.pf-cam small{font-size:12px;font-weight:600}
.pf-avatar:hover .pf-cam,.pf-avatar:focus-within .pf-cam{opacity:1}
@media(hover:none){.pf-cam{opacity:1;inset:auto 0 0 0;height:34%;border-radius:0;flex-direction:row;gap:5px;background:rgba(15,23,42,.5)}.pf-cam svg{width:16px;height:16px}}

/* Referrals */
.rf-hero{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:24px;align-items:center;background:linear-gradient(135deg,#4f46e5,#0891b2);color:#fff;border-radius:18px;padding:30px;margin-bottom:22px;box-shadow:var(--shadow)}
.rf-hero h2{color:#fff;font-size:24px;margin:0 0 8px}.rf-hero p{margin:0 0 18px;color:#e0e7ff}
.rf-linkbox{display:flex;gap:10px;flex-wrap:wrap}.rf-linkbox input{flex:1;min-width:200px;background:rgba(255,255,255,.95);border:0;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:14px}
.rf-linkbox .btn{background:#0f172a}
.rf-share{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:14px}.rf-share .small{color:#e0e7ff}
.rf-share .btn.outline{color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.7)}.rf-share .btn.outline:hover{background:rgba(255,255,255,.15)}
.rf-code{position:relative;text-align:center;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);border-radius:16px;padding:22px 14px}
.rf-code small{display:block;color:#e0e7ff;margin-bottom:6px}.rf-code b{display:block;font-size:26px;letter-spacing:.12em;font-family:ui-monospace,Menlo,Consolas,monospace;margin-bottom:14px;word-break:break-all}
.rf-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.rf-steps p{margin:4px 0 0}
.rf-n{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--brand-l);color:var(--brand);font-weight:800;margin-bottom:10px}
@media(max-width:860px){.rf-hero{grid-template-columns:1fr;padding:22px 18px}.rf-hero h2{font-size:20px}.rf-steps{grid-template-columns:1fr;gap:16px}.rf-code{padding:16px}}

/* ---- admin: payment gateways (control center) ---- */
.pg-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:6px}
.pg-head h1{margin:0 0 4px}.pg-head p{margin:0;font-size:14px}
.pg-ov{display:flex;align-items:center;gap:24px;flex-wrap:wrap;background:linear-gradient(135deg,#0f172a,#312e81 60%,#4338ca);color:#fff;border-radius:18px;padding:22px 26px;margin:14px 0 14px;box-shadow:var(--shadow)}
.pg-ov-main{display:flex;align-items:center;gap:18px;flex:1 1 320px;min-width:0}
.pg-ring{--p:0;width:76px;height:76px;border-radius:50%;flex:none;background:conic-gradient(#4ade80 calc(var(--p)*1%),rgba(255,255,255,.16) 0);display:flex;align-items:center;justify-content:center;position:relative;transition:.4s}
.pg-ring:before{content:"";position:absolute;inset:7px;border-radius:50%;background:#1e1b4b}
.pg-ring span{position:relative;font-size:13px;color:#c7d2fe;font-style:normal}.pg-ring b{font-size:21px;color:#fff}.pg-ring em{font-style:normal}
.pg-ov-title{font-size:19px;font-weight:800;letter-spacing:-.01em;display:flex;align-items:center;gap:8px}
.pg-ov-sub{font-size:13.5px;color:#c7d2fe;margin-top:3px}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;flex:none}.dot.on{background:#4ade80;box-shadow:0 0 0 4px rgba(74,222,128,.25)}.dot.off{background:#f87171;box-shadow:0 0 0 4px rgba(248,113,113,.25)}
.pg-ov-stats{display:flex;gap:12px}
.pg-mini{background:rgba(255,255,255,.1);border-radius:14px;padding:10px 16px;min-width:112px;color:#fff;text-decoration:none;display:block}
.pg-mini:hover{text-decoration:none;color:#fff;background:rgba(255,255,255,.16)}
.pg-mini b{display:block;font-size:22px;line-height:1.2}.pg-mini span{font-size:12px;color:#c7d2fe}
.pg-mini.warn{background:#fbbf24;color:#451a03}.pg-mini.warn span{color:#78350f}
.pg-ov-act{display:flex;flex-direction:column;gap:8px}.pg-ov-act form{margin:0}
.pg-ov-act .btn{width:100%;background:rgba(255,255,255,.1);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)}
.pg-ov-act .btn:hover{background:rgba(255,255,255,.2);color:#fff}
.pg-prev{display:flex;align-items:center;gap:14px;flex-wrap:wrap;background:#fff;border:1px dashed #c7cfe3;border-radius:14px;padding:10px 16px;margin-bottom:16px}
.pg-prev-l{font-size:12.5px;font-weight:700;color:var(--muted);display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.pg-chips{display:flex;gap:8px;flex-wrap:wrap}
.pg-chip{display:inline-flex;align-items:center;gap:8px;border:1.5px solid var(--c);border-radius:99px;padding:3px 12px 3px 4px;font-size:13px;font-weight:700;background:#fff}
.pg-chip[hidden],.pg-chip-none[hidden]{display:none}
.pg-chip i,.pg-logo{font-style:normal;background:var(--c);color:#fff;font-weight:800;display:inline-flex;align-items:center;justify-content:center}
.pg-chip i{width:22px;height:22px;border-radius:50%;font-size:10px}
.pg-chip-none{font-size:13px;color:var(--red);font-weight:600}
.pg-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.pg-tabs{display:flex;gap:4px;background:#e9edf6;padding:4px;border-radius:12px;flex-wrap:wrap}
.pg-tabs button{border:0;background:transparent;font:600 13px var(--font);color:#475569;padding:7px 14px;border-radius:9px;cursor:pointer;transition:.15s}
.pg-tabs button:hover{color:var(--text)}.pg-tabs button.on{background:#fff;color:var(--brand-d);box-shadow:0 1px 3px rgba(15,23,42,.12)}
.pg-tabs button span{margin-left:4px;font-size:11.5px;background:#dbe1ee;border-radius:99px;padding:0 7px}.pg-tabs button.on span{background:var(--brand-l)}
.pg-search{flex:1 1 200px;max-width:300px;margin-left:auto;padding:9px 14px!important;border-radius:12px!important}
.pg-list{display:flex;flex-direction:column;gap:12px}
.pg-row{display:grid;grid-template-columns:auto 50px minmax(0,1fr) auto auto;align-items:center;gap:16px;background:#fff;border:1px solid var(--line);border-left:5px solid #cbd5e1;border-radius:16px;padding:14px 18px;box-shadow:var(--shadow);transition:.2s}
.pg-row[hidden]{display:none}
.pg-row.is-on{border-left-color:#22c55e}.pg-row:not(.is-on) .pg-logo{filter:grayscale(1);opacity:.55}.pg-row:not(.is-on) .pg-name b{color:#64748b}
.pg-row.busy{opacity:.7}.pg-row.flash{animation:pgflash 1.8s ease}@keyframes pgflash{0%,55%{box-shadow:0 0 0 3px rgba(79,70,229,.4)}100%{box-shadow:var(--shadow)}}
.pg-order{display:flex;flex-direction:column;gap:3px}.pg-order form{margin:0}
.pg-order button{width:24px;height:20px;border:0;border-radius:6px;background:#eef1f7;color:#64748b;font-size:9px;cursor:pointer;line-height:1;padding:0}
.pg-order button:hover:not([disabled]){background:var(--brand-l);color:var(--brand)}.pg-order button[disabled]{opacity:.3;cursor:default}
.pg-logo{width:50px;height:50px;border-radius:14px;font-size:16px;letter-spacing:-.02em;transition:.2s;box-shadow:inset 0 -3px 0 rgba(0,0,0,.12)}
.pg-info{min-width:0}.pg-name{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.pg-name b{font-size:16.5px}
.pg-tag{font-size:11px;font-weight:700;background:#eef1f7;color:#475569;border-radius:99px;padding:2px 9px}
.pg-tag.auto{background:#e0f2fe;color:#0369a1}.pg-tag.bad{background:var(--red-l);color:var(--red)}
.pg-sub{font-size:12.5px;color:var(--muted);margin-top:3px;overflow-wrap:anywhere}
.pg-pay{text-align:center;min-width:64px}.pg-pay b{display:block;font-size:19px;line-height:1.1}.pg-pay span{font-size:11px;color:var(--muted)}
.pg-rv{display:block;margin-top:4px;font-size:11px;font-weight:700;background:var(--amber-l);color:var(--amber);border-radius:99px;padding:1px 8px}.pg-rv:hover{text-decoration:none}
.pg-ctl{display:flex;align-items:center;gap:12px}.pg-sw-form{margin:0}
.pg-sw{display:inline-flex;align-items:center;gap:9px;min-width:92px;border:0;border-radius:99px;background:#cbd5e1;color:#475569;padding:4px 14px 4px 4px;font:700 13px var(--font);cursor:pointer;transition:background .2s,color .2s}
.pg-sw i{width:28px;height:28px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.35);transition:transform .2s}
.pg-sw.on{background:#16a34a;color:#fff;padding:4px 4px 4px 14px;flex-direction:row-reverse}
.pg-sw:hover:not([disabled]){filter:brightness(.95)}.pg-sw:focus-visible{outline:3px solid rgba(79,70,229,.4);outline-offset:2px}.pg-sw[disabled]{opacity:.55;cursor:not-allowed}
.pg-empty{text-align:center;color:var(--muted);background:#fff;border:1px dashed #c7cfe3;border-radius:16px;padding:36px 20px;display:flex;flex-direction:column;align-items:center;gap:6px}.pg-empty[hidden]{display:none}.pg-empty b{color:var(--text)}
/* drawer */
dialog.pg-drawer{border:0;padding:0;margin:0 0 0 auto;height:100vh;max-height:100vh;width:min(560px,100%);background:#f6f8fc;box-shadow:-12px 0 40px rgba(15,23,42,.25);color:var(--text)}
dialog.pg-drawer::backdrop{background:rgba(15,23,42,.5);backdrop-filter:blur(2px)}
dialog.pg-drawer[open]{animation:pgslide .22s ease}@keyframes pgslide{from{transform:translateX(40px);opacity:0}to{transform:none;opacity:1}}
dialog.pg-modal{margin:auto;height:auto;max-height:92vh;border-radius:20px;width:min(620px,94vw)}
dialog.pg-modal[open]{animation:pgpop .18s ease}@keyframes pgpop{from{transform:scale(.96);opacity:0}to{transform:none;opacity:1}}
.pg-dform{display:flex;flex-direction:column;height:100%;max-height:inherit}
.pg-dh{display:flex;align-items:center;gap:14px;padding:18px 22px;background:#fff;border-bottom:1px solid var(--line)}
.pg-dh h2{margin:0;font-size:19px}.pg-dh>div:nth-child(2),.pg-dh>div:first-child:not(.pg-logo){flex:1;min-width:0}.pg-dh .pg-logo{width:44px;height:44px;font-size:15px;flex:none}
.pg-dh>div:nth-child(2){flex:1}
.pg-x{margin-left:auto;border:0;background:#eef1f7;width:34px;height:34px;border-radius:50%;cursor:pointer;color:#475569;font-size:14px;flex:none}.pg-x:hover{background:#e2e8f0}
.pg-db{padding:18px 22px;overflow:auto;flex:1}
.pg-sec{background:#fff;border:1px solid var(--line);border-radius:14px;padding:6px 18px 18px;margin-bottom:14px}
.pg-sec h3{margin:14px 0 0;font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--brand-d)}
.pg-copy{display:flex;gap:8px}.pg-copy input{font:12px ui-monospace,Menlo,Consolas,monospace;background:#f8fafc}
.pg-calc{margin-top:14px;background:var(--brand-l);color:#312e81;border-radius:10px;padding:10px 14px;font-size:13.5px}
.pg-danger{border-color:#fecaca;background:#fffafa}.pg-danger h3{color:var(--red)}.pg-danger p{margin:6px 0 10px}
.pg-df{display:flex;align-items:center;gap:10px;padding:14px 22px;background:#fff;border-top:1px solid var(--line)}.pg-df .sp{flex:1}
.pg-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;margin:2px 0 6px}
.pg-tile{margin:0;cursor:pointer;display:block}.pg-tile input{position:absolute;opacity:0;pointer-events:none}
.pg-tile span{display:flex;flex-direction:column;align-items:flex-start;gap:4px;border:2px solid var(--line);border-radius:14px;padding:12px;background:#fff;height:100%;transition:.15s}
.pg-tile i{font-style:normal;width:34px;height:34px;border-radius:10px;background:var(--c);color:#fff;font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center}
.pg-tile b{font-size:13px;line-height:1.3;color:var(--text)}.pg-tile em{font-style:normal;font-size:11.5px;color:var(--muted);font-weight:600}
.pg-tile:hover span{border-color:#c7d2fe}.pg-tile input:checked+span{border-color:var(--brand);background:var(--brand-l);box-shadow:0 0 0 3px rgba(79,70,229,.12)}
.pg-tile input:focus-visible+span{outline:3px solid rgba(79,70,229,.4)}
.pg-toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,30px);background:#0f172a;color:#fff;padding:12px 20px;border-radius:12px;font-size:14px;font-weight:600;box-shadow:0 10px 30px rgba(0,0,0,.3);opacity:0;pointer-events:none;transition:.25s;z-index:200;max-width:92vw;text-align:center;border-left:5px solid #4ade80}
.pg-toast.show{opacity:1;transform:translate(-50%,0)}.pg-toast.bad{border-left-color:#f87171}
@media(max-width:900px){
  .pg-row{grid-template-columns:auto 46px minmax(0,1fr);gap:12px}
  .pg-pay{display:none}.pg-ctl{grid-column:1/-1;justify-content:space-between;border-top:1px solid var(--line);padding-top:12px}
  .pg-ctl .btn{flex:1}.pg-search{max-width:none;margin-left:0;flex-basis:100%}
  .pg-ov{padding:18px}.pg-ov-stats{width:100%}.pg-mini{flex:1}.pg-ov-act{flex-direction:row;width:100%}.pg-ov-act form{flex:1}
}
@media(max-width:600px){
  dialog.pg-drawer{width:100%}dialog.pg-modal{border-radius:0;width:100%;height:100%;max-height:100vh}
  .pg-tabs{width:100%;overflow-x:auto;flex-wrap:nowrap}.pg-tabs button{white-space:nowrap}
  .pg-row{padding:12px 14px}.pg-logo{width:42px;height:42px;font-size:14px}.pg-sw{min-width:84px}
}
.pg-ov-act .btn.danger-o{color:#fecaca;box-shadow:inset 0 0 0 1px rgba(252,165,165,.6)}.pg-ov-act .btn.danger-o:hover{background:rgba(248,113,113,.25);color:#fff}
.pg-sec .row>*{min-width:110px}
.pg-sec .row{gap:12px}
dialog.pg-modal .pg-dform{height:auto}

/* admin: proxy types list */

.pt-table th,.pt-table td{padding:14px 16px;text-align:left;vertical-align:middle}
.pt-table tbody tr{border-top:1px solid var(--line)}.pt-table tbody tr:hover{background:#fafbff}

@media(max-width:700px){
  .pt-table thead{display:none}.pt-table,.pt-table tbody,.pt-table tr,.pt-table td{display:block;width:100%}
  .pt-table tr{padding:12px 16px}.pt-table td{padding:6px 0;border:0}
  .pt-table td[data-label]::before{content:attr(data-label);display:block;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}

}

/* admin: proxy type form */
.ptf-back{font-size:13px;font-weight:600}
.ptf-card{max-width:900px}
.ptf-title{display:flex;gap:14px;align-items:flex-start;margin-bottom:6px}.ptf-title h2{margin:0 0 2px}.ptf-title p{margin:0}
.ptf-n{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:var(--brand-l);color:var(--brand-d);font-weight:800;font-size:14px;flex:none}
.ptf-sum{display:flex;gap:14px;align-items:center;cursor:pointer;list-style:none}.ptf-sum::-webkit-details-marker{display:none}

.ptf-bar{position:sticky;bottom:0;z-index:5;max-width:900px;display:flex;justify-content:flex-end;gap:10px;padding:14px 18px;margin-top:4px;background:rgba(255,255,255,.92);backdrop-filter:blur(6px);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}

/* admin dashboard v2 */
.dh-hero{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:22px;padding:24px 26px;border-radius:18px;color:#fff;background:linear-gradient(135deg,#4f46e5,#0891b2);box-shadow:var(--shadow)}
.dh-hero h1{margin:0 0 4px;font-size:26px;color:#fff}.dh-sub{color:#e0e7ff;font-size:14px}
.dh-actions{display:flex;gap:8px;flex-wrap:wrap}
.dh-sec{margin:6px 0 10px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
@media(max-width:560px){.dh-hero{padding:18px}.dh-hero h1{font-size:21px}}

/* customer search (admin manual order) */
.cs{position:relative}
.cs-selected{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1.5px solid #c7d2fe;background:var(--brand-l);border-radius:12px;flex-wrap:wrap}
.cs-av{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#6366f1,#06b6d4);color:#fff;display:inline-grid;place-items:center;font-weight:700;flex:none}
.cs-info{flex:1;min-width:0}.cs-info b{display:block;font-size:14px}.cs-info b em{font-style:normal;font-size:11px;color:var(--red);background:var(--red-l);padding:1px 7px;border-radius:99px;margin-left:6px}
.cs-info span{font-size:12.5px;color:var(--muted);overflow-wrap:anywhere}
.cs-bal{font-size:12.5px;font-weight:600;color:var(--green)}
.cs-list{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:30;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 32px rgba(15,23,42,.14);max-height:340px;overflow:auto}
.cs-item{display:flex;align-items:center;gap:12px;padding:10px 14px;cursor:pointer;border-bottom:1px solid var(--line)}.cs-item:last-child{border-bottom:0}
.cs-item:hover,.cs-item.on{background:var(--brand-l)}
.cs-empty{padding:16px;text-align:center;color:var(--muted);font-size:14px}

/* ===== admin settings page ===== */
.set-tabs{display:flex;gap:6px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;background:#fff;border:1px solid var(--line);border-radius:14px;padding:6px;margin:0 0 20px;box-shadow:var(--shadow)}
.set-tabs::-webkit-scrollbar{display:none}
.set-tab{flex:none;padding:9px 16px;border-radius:10px;font-size:14px;font-weight:600;color:#475569;white-space:nowrap;transition:.15s}
.set-tab:hover{background:#f1f4fb;color:var(--text);text-decoration:none}
.set-tab.on{background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff;box-shadow:0 4px 12px rgba(79,70,229,.28)}
.set-wrap{max-width:820px}
.set-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.set-head h2{margin:0 0 4px;font-size:19px}.set-head p{margin:0}
.set-wrap form>label:first-child{margin-top:0}
.set-wrap .hint{margin:6px 0 0;font-size:12.5px;color:var(--muted)}
.set-wrap .row>div>label:first-child{margin-top:14px}
.set-wrap form>.row:first-child>div>label:first-child{margin-top:0}
.set-actions{display:flex;gap:10px;align-items:center;justify-content:flex-end;flex-wrap:wrap;margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}
.set-note{background:var(--brand-l);border:1px solid #c7d2fe;color:#312e81;border-radius:12px;padding:12px 14px;font-size:13.5px;margin:0 0 16px}
.set-rules{border:1px solid var(--line);border-radius:12px;margin-top:6px}
.set-rules table{margin:0}
.set-rules td{padding:8px 10px}.set-rules td input{padding:9px 11px;font-size:14px}
.set-kv{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:#fafbfe}
.set-details{margin-top:14px;border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.set-details summary{font-size:13.5px;font-weight:600;color:var(--muted)}
.set-details pre.log{margin:10px 0 0;white-space:pre-wrap;word-break:break-all}
@media(max-width:640px){
  .set-head{flex-direction:column}
  .set-actions .btn{flex:1 1 140px}
}
.set-order{white-space:nowrap}.set-order .btn{padding:4px 7px;font-size:11px;line-height:1}

/* ===== admin logs page ===== */
.lg-stats{grid-template-columns:repeat(4,minmax(0,1fr))}
.lg-stats .stat-card{padding:18px}.lg-stats .n{font-size:26px}.lg-stats .n small{font-size:13px;font-weight:600;color:var(--muted)}
.lg-filter{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}
.lg-f{min-width:150px}.lg-f.grow{flex:1 1 220px}.lg-f label{margin:0 0 5px}
.lg-f select,.lg-f input[type=text]{padding:9px 12px;font-size:14px}
.lg-btns{display:flex;gap:8px;min-width:0}.lg-chk{display:flex!important;align-items:center;gap:8px;font-weight:500!important;padding:9px 0;white-space:nowrap}.lg-chk input{width:auto}
.lg-bar{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.lg-tools{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.lg-tools form{margin:0}
.lg-table td{vertical-align:top}.lg-table tr.lg-err td:first-child{box-shadow:inset 3px 0 0 #dc2626}
.nowrap{white-space:nowrap}.lg-slow{color:#b45309;font-weight:700}
.lg-msg{max-width:520px;overflow-wrap:anywhere}
.lg-det summary{cursor:pointer;color:var(--brand);font-weight:600;font-size:13px}
.lg-box{margin-top:10px;min-width:min(560px,80vw)}
.lg-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:10px 0 4px;font-size:12.5px}
.lg-box pre.log{margin:0;max-height:300px;white-space:pre-wrap;overflow-wrap:anywhere}
.lg-pager{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin-top:16px}
.lg-pager a,.lg-pager span{padding:6px 12px;border-radius:8px;font-size:13px;font-weight:600;border:1px solid var(--line);color:#475569;background:#fff}
.lg-pager a:hover{text-decoration:none;background:var(--brand-l);color:var(--brand-d)}
.lg-pager .on{background:var(--brand);border-color:var(--brand);color:#fff}.lg-pager .off,.lg-pager .gap{opacity:.45;border-color:transparent;background:transparent}
@media(max-width:860px){.lg-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.lg-f{flex:1 1 100%}.lg-btns .btn{flex:1}}

/* ===== Admins & Permissions ===== */
.ad-back{margin:0 0 14px;font-size:14px;font-weight:600}.ad-back a{display:inline-flex;align-items:center;gap:6px;color:var(--muted)}.ad-back a:hover{color:var(--brand);text-decoration:none}.ad-back .ic{transform:rotate(180deg)}

.ad-big{display:flex;justify-content:center;margin-bottom:14px}.ad-big .avatar{width:84px;height:84px;font-size:34px;box-shadow:0 8px 20px rgba(79,70,229,.3)}
.ad-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px}.ad-fields .full{grid-column:1/-1}
.ad-pw{display:flex;gap:6px;align-items:center}.ad-pw input{flex:1;min-width:0}.ad-pw .btn{flex:none;margin:0}
/* role cards */
.ad-roles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:18px}
.ad-role{position:relative;display:block;margin:0;cursor:pointer;font-weight:400}
.ad-role input{position:absolute;opacity:0;pointer-events:none}
.ad-role-b{display:flex;gap:12px;align-items:flex-start;height:100%;border:1.5px solid var(--line);border-radius:14px;padding:14px;background:#fff;transition:.15s}
.ad-role:hover .ad-role-b{border-color:#c7d2fe}
.ad-role input:checked+.ad-role-b{border-color:var(--brand);background:var(--brand-l);box-shadow:0 0 0 3px rgba(79,70,229,.12)}
.ad-role input:focus-visible+.ad-role-b{outline:2px solid var(--brand);outline-offset:2px}
.ad-role-ic{flex:none;width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:#eef1f7;color:#64748b}
.ad-role input:checked+.ad-role-b .ad-role-ic{background:var(--brand);color:#fff}
.ad-role-b b{display:block;font-size:14.5px;color:var(--text)}.ad-role-b small{display:block;color:var(--muted);font-size:12.5px;line-height:1.45;margin-top:2px}
/* permission matrix */
.ad-perm[hidden]{display:none}
.ad-perm{border:1px solid var(--line);border-radius:14px;overflow:hidden}
.ad-perm-top{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:12px 16px;background:#f8faff;border-bottom:1px solid var(--line);font-size:14px}
.ad-presets{display:flex;gap:6px;flex-wrap:wrap}.ad-presets .btn{margin:0}
.ad-pgroup-h{padding:9px 16px;background:#fbfcfe;border-bottom:1px solid var(--line);font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#64748b}
.ad-pgroup+.ad-pgroup .ad-pgroup-h{border-top:1px solid var(--line)}
.ad-perm>p{padding:0 16px 14px}
.ad-prow{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 16px;border-bottom:1px solid #eef1f7}
.ad-pinfo{min-width:0}.ad-pinfo b{display:block;font-size:14px}.ad-pinfo span{display:block;color:var(--muted);font-size:12.5px;line-height:1.4}
.ad-seg{position:relative;display:inline-flex;flex:none;background:#f1f4fb;border-radius:10px;padding:3px;gap:2px}
.ad-seg input{position:absolute;opacity:0;pointer-events:none}
.ad-seg label{margin:0;padding:6px 13px;border-radius:8px;font-size:13px;font-weight:600;color:#64748b;cursor:pointer;transition:.15s;white-space:nowrap}
.ad-seg label:hover{color:var(--text)}
.ad-seg input:checked+label.lv0{background:#fff;color:#475569;box-shadow:0 1px 3px rgba(15,23,42,.12)}
.ad-seg input:checked+label.lv1{background:#dbeafe;color:#1d4ed8}
.ad-seg input:checked+label.lv2{background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff;box-shadow:0 3px 8px rgba(79,70,229,.3)}
.ad-seg input:focus-visible+label{outline:2px solid var(--brand);outline-offset:1px}
/* add-admin dialog */
dialog.ad-dlg{border:0;padding:0;border-radius:20px;width:min(720px,94vw);max-height:92vh;margin:auto;box-shadow:0 30px 80px rgba(15,23,42,.35);color:var(--text);background:#fff;overflow:hidden}
dialog.ad-dlg[open]{display:flex;flex-direction:column}
dialog.ad-dlg::backdrop{background:rgba(15,23,42,.5);backdrop-filter:blur(2px)}
dialog.ad-dlg>form{display:flex;flex-direction:column;min-height:0;max-height:92vh}
.ad-dlg-h{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:20px 24px 14px;border-bottom:1px solid var(--line)}.ad-dlg-h h2{margin:0 0 2px}
.ad-x{flex:none;background:none;border:0;font-size:28px;line-height:1;color:#64748b;cursor:pointer;padding:0 4px;border-radius:8px}.ad-x:hover{color:var(--text);background:#f1f4fb}
.ad-dlg-b{padding:6px 24px 20px;overflow:auto;min-height:0}
.ad-dlg-f{display:flex;justify-content:flex-end;gap:10px;padding:14px 24px;border-top:1px solid var(--line);background:#f8faff}.ad-dlg-f .btn{margin:0}

@media(max-width:640px){
  .ad-roles,.ad-fields{grid-template-columns:1fr}
  .ad-prow{flex-direction:column;align-items:stretch;gap:8px}.ad-seg{display:flex}.ad-seg label{flex:1;text-align:center}
  .ad-dlg-h,.ad-dlg-b,.ad-dlg-f{padding-left:16px;padding-right:16px}
}

/* ───── Support tickets (customer + admin) ───── */

.tk-item{display:flex;align-items:center;gap:14px;padding:14px 16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:10px;color:var(--text)}
.tk-item:hover{text-decoration:none;border-color:#c7d2fe}.tk-item.unread{border-left:4px solid #6366f1}
.tk-item .tk-main{flex:1;min-width:0}.tk-item b{display:block;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tk-item small{color:var(--muted);font-size:12.5px}
.tk-thread{display:flex;flex-direction:column;gap:14px;margin:0 0 18px}
.tk-msg{display:flex;gap:10px;max-width:88%}.tk-msg.me{align-self:flex-end;flex-direction:row-reverse}
.tk-bub{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px 14px;box-shadow:var(--shadow);min-width:0}
.tk-msg.me .tk-bub{background:#eef2ff;border-color:#e0e7ff}
.tk-msg.note .tk-bub{background:#fffbeb;border:1px dashed #f59e0b}
.tk-meta{font-size:12px;color:var(--muted);margin-bottom:4px}.tk-meta b{color:var(--text)}
.tk-body{line-height:1.55;font-size:14.5px;word-break:break-word;overflow-wrap:anywhere}
.tk-form textarea,.tk-new textarea{min-height:130px;font:14.5px/1.5 var(--font)}
.tk-form .row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:12px}
.tk-form .row label{margin:0;display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:13.5px}
.tk-form .row input[type=checkbox]{width:auto}.tk-form .row select{width:auto;min-width:190px}
.tk-closed{background:#f8fafc;border:1px dashed var(--line);border-radius:12px;padding:12px 14px;color:var(--muted);font-size:14px;margin-bottom:12px}
.tk-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px;align-items:start}

@media(max-width:900px){.tk-layout{grid-template-columns:1fr}.tk-msg{max-width:100%}}

/* ===== Customer ticket page (account/tickets/{id}) — scoped to .tkv, admin ticket page is untouched ===== */
.tkv{max-width:1100px;margin:0 auto}
.tkv-back{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:600;color:var(--muted);margin-bottom:12px}
.tkv-back .ic{transform:rotate(180deg)}.tkv-back:hover{color:var(--brand);text-decoration:none}
.tkv-head{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;padding:22px 24px;margin-bottom:18px;border-radius:18px;color:#fff;background:radial-gradient(120% 140% at 0% 0%,#6366f1 0%,#4f46e5 45%,#312e81 100%);box-shadow:0 12px 32px rgba(79,70,229,.28)}
.tkv-head-main{min-width:0;flex:1 1 360px}
.tkv-head h1{margin:8px 0 6px;font-size:26px;color:#fff;overflow-wrap:anywhere}
.tkv-sub{margin:0;font-size:13px;color:rgba(255,255,255,.78)}
.tkv-chips{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.tkv-id{font:700 13px ui-monospace,Menlo,Consolas,monospace;background:rgba(255,255,255,.18);padding:3px 10px;border-radius:99px}
.tkv-chip{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;background:rgba(255,255,255,.14);padding:3px 10px;border-radius:99px}
.tkv-steps{list-style:none;margin:0;padding:0;display:flex;align-items:flex-start;gap:0}
.tkv-steps li{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;width:92px;font-size:11.5px;font-weight:600;color:rgba(255,255,255,.6);text-align:center}
.tkv-steps li+li::before{content:"";position:absolute;top:11px;right:50%;width:100%;height:2px;background:rgba(255,255,255,.25)}
.tkv-steps li.done+li.done::before{background:#a5f3fc}
.tkv-steps i{position:relative;z-index:1;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.18);color:transparent}
.tkv-steps li.done{color:#fff}.tkv-steps li.done i{background:#22d3ee;color:#0b1020}
.tkv-grid{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:18px;align-items:start}
.tkv-card{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow);margin-bottom:16px}
.tkv-card h2{display:flex;align-items:center;gap:8px;font-size:14px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:0 0 12px}
.tkv-convo{display:flex;flex-direction:column;gap:16px;padding:22px;background:linear-gradient(180deg,#fbfcff,#fff)}
.tkv-msg{display:flex;gap:12px;max-width:90%;align-items:flex-start}
.tkv-msg.me{align-self:flex-end;flex-direction:row-reverse}
.tkv-staff-av{background:linear-gradient(135deg,#0f172a,#334155)}
.tkv-bub{min-width:0;padding:12px 15px;border-radius:4px 16px 16px 16px;background:#fff;border:1px solid var(--line);box-shadow:0 1px 2px rgba(15,23,42,.04);border-left:3px solid #22d3ee}
.tkv-msg.me .tkv-bub{border-radius:16px 4px 16px 16px;background:linear-gradient(135deg,#eef2ff,#e0e7ff);border-color:#dbe3ff;border-left-color:#dbe3ff}
.tkv-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin-bottom:5px}
.tkv-meta b{color:var(--text);font-size:13px}.tkv-meta time{margin-left:auto}
.tkv-role{font-size:10.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;padding:1px 7px;border-radius:99px;background:#cffafe;color:#0e7490}
.tkv-role.first{background:#e8ecf4;color:#475569}
.tkv-text{font-size:14.5px;line-height:1.6;word-break:break-word;overflow-wrap:anywhere}
.tkv-wait{display:flex;align-items:center;gap:10px;align-self:center;font-size:13px;color:var(--muted);background:var(--amber-l);border:1px dashed #f59e0b;color:var(--amber);padding:9px 14px;border-radius:12px}
.tkv-pulse{width:9px;height:9px;border-radius:50%;background:#f59e0b;flex:none;animation:tkvp 1.6s infinite}
@keyframes tkvp{0%{box-shadow:0 0 0 0 rgba(245,158,11,.5)}70%{box-shadow:0 0 0 9px rgba(245,158,11,0)}100%{box-shadow:0 0 0 0 rgba(245,158,11,0)}}
.tkv-closed{display:flex;align-items:center;gap:8px;background:var(--green-l);color:var(--green);border-radius:12px;padding:11px 14px;font-size:14px;font-weight:600;margin-bottom:12px}
.tkv-reply label{margin:0 0 8px;font-size:14px;color:var(--text)}
.tkv-reply textarea{min-height:110px;resize:none;font:14.5px/1.55 var(--font);border-radius:12px}
.tkv-reply-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:12px}
.tkv-count{font-size:12px;color:var(--muted)}.tkv-count kbd{font:600 11px ui-monospace,Menlo,monospace;background:#eef1f7;border:1px solid var(--line);border-radius:5px;padding:1px 5px}
.tkv-side{position:sticky;top:16px}
.tkv-service{border-color:#c7d2fe;background:linear-gradient(180deg,#f5f7ff,#fff)}
.tkv-px{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px;margin-bottom:12px}
.tkv-px-top{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:13px;color:var(--muted)}.tkv-px-top b{color:var(--text);font-size:15px}
.tkv-ip{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px;padding:9px 11px;border-radius:10px;background:#0b1020;color:#a5f3fc}
.tkv-ip .mono{font-size:14px;font-weight:600;color:inherit;word-break:break-all}
.tkv-copy{flex:none;display:grid;place-items:center;width:30px;height:30px;border:0;border-radius:8px;background:rgba(255,255,255,.12);color:#fff;cursor:pointer}
.tkv-copy:hover{background:rgba(255,255,255,.22)}.tkv-copy.ok{background:#22c55e}
.tkv-px-meta{margin-top:9px;font-size:12.5px;color:var(--muted)}
.tkv-dl{margin:0 0 14px;display:grid;grid-template-columns:auto 1fr;gap:9px 12px;font-size:13.5px}
.tkv-dl dt{color:var(--muted)}.tkv-dl dd{margin:0;text-align:right;word-break:break-word}
@media(max-width:900px){.tkv-grid{grid-template-columns:1fr}.tkv-side{position:static}.tkv-msg{max-width:100%}.tkv-head{padding:18px}.tkv-head h1{font-size:22px}.tkv-steps li{width:76px}}

/* Generate new credentials — result bar */
.gen-out{margin-top:14px;padding:14px;border:1px solid #bbf7d0;background:var(--green-l);border-radius:10px;animation:genin .25s ease}
.gen-out[hidden],.gen-err[hidden]{display:none}
.gen-head{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:8px;flex-wrap:wrap}
.gen-head .k{font-size:12px;font-weight:700;color:#14532d;text-transform:uppercase;letter-spacing:.04em}
.gen-head .fmtlbl{font-size:11px;color:var(--muted)}
.gen-row{display:flex;gap:10px;align-items:stretch}
.gen-row code{flex:1;min-width:0;background:#fff;border:1px solid var(--line);border-radius:8px;padding:10px 12px;overflow-wrap:anywhere;word-break:break-all;user-select:all}
@keyframes genin{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (max-width:560px){.gen-row{flex-direction:column}.gen-row .btn{width:100%}}

/* Dashboard sidebar: on tablet/mobile the menu becomes a horizontal pill bar, so hide section labels and icon tiles */
@media(max-width:860px){
  .d-sec{display:none}
  .d-link{padding:9px 14px}
  .d-link .d-ic,.d-link:hover .d-ic,.d-link.on .d-ic{width:auto;height:auto;background:none;color:inherit}
}

/* Packages (page + embed) */
.pk-head{text-align:center;max-width:720px;margin:6px auto 34px}
.pk-head .tag{display:inline-block;color:var(--brand);font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.1em;margin-bottom:8px}
.pk-head h1{font-size:34px;font-weight:800;letter-spacing:-.03em;margin:0 0 10px}.pk-head p{color:var(--muted);font-size:16.5px;margin:0}
.pk-grid{display:grid;gap:22px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));align-items:stretch}
.pk-card{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px;box-shadow:var(--shadow);overflow:hidden;transition:transform .2s,box-shadow .2s,border-color .2s}
.pk-card::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,#4f46e5,#0891b2)}
.pk-card:hover{transform:translateY(-4px);border-color:#c7d2fe;box-shadow:0 18px 40px rgba(79,70,229,.14)}
.pk-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.pk-ico{width:48px;height:48px;border-radius:14px;background:linear-gradient(135deg,#eef2ff,#e0f2fe);color:var(--brand);display:grid;place-items:center}
.pk-kind{font-size:11.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--brand-d);background:var(--brand-l);border-radius:99px;padding:4px 10px}
.pk-card h3{font-size:19px;margin:0 0 6px}
.pk-desc{color:var(--muted);font-size:14px;margin:0 0 16px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;min-height:60px}
.pk-price{display:flex;align-items:baseline;gap:6px;padding:14px 0;border-top:1px dashed var(--line);border-bottom:1px dashed var(--line);margin-bottom:16px}
.pk-price span{color:var(--muted);font-size:13px}.pk-price b{font-size:30px;letter-spacing:-.03em}.pk-price em{font-style:normal;color:var(--muted);font-size:13px}
.pk-list{list-style:none;margin:0 0 20px;padding:0;flex:1;display:grid;gap:9px}
.pk-list li{display:flex;align-items:center;gap:8px;font-size:14px;color:#334155}.pk-list li svg{color:#16a34a;flex:none}
.pk-off{background:#f8fafc}.pk-off::before{background:#cbd5e1}.pk-off:hover{transform:none;box-shadow:var(--shadow);border-color:var(--line)}
@media(max-width:560px){.pk-grid{grid-template-columns:1fr}.pk-head h1{font-size:26px}}

/* ===== Order page ===== */
.ord-hero{display:flex;align-items:center;gap:18px;padding:22px 24px;margin:6px 0 22px;border-radius:20px;color:#fff;background:linear-gradient(135deg,#4f46e5 0%,#0891b2 100%);box-shadow:0 14px 34px rgba(79,70,229,.22)}
.ord-hero .oh-ico{flex:none;width:64px;height:64px;border-radius:18px;background:rgba(255,255,255,.18);display:grid;place-items:center;backdrop-filter:blur(2px)}
.ord-hero h1{margin:0 0 4px;font-size:26px;letter-spacing:-.02em;color:#fff}
.ord-hero p{margin:0 0 12px;opacity:.9;font-size:14.5px;max-width:640px}
.oh-meta{display:flex;flex-wrap:wrap;gap:8px}
.oh-meta span{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;background:rgba(255,255,255,.16);border-radius:99px;padding:5px 12px}

.order-grid{counter-reset:step;grid-template-columns:minmax(0,1fr) 380px}
.order-grid>.panel{padding:8px 26px}
.order-grid .fgroup{padding:24px 0}
.order-grid .fh{display:flex;align-items:center;gap:10px;font-size:16px;margin-bottom:14px}
.order-grid .fh::before{counter-increment:step;content:counter(step);flex:none;width:26px;height:26px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;font-size:13px;font-weight:700}
#ispBox label,#regBox label{font-size:13.5px;font-weight:600;color:#475569;margin:14px 0 6px;display:block}
.order-grid .cp-btn{padding:14px 16px;border-radius:14px;border-width:1.5px;font-weight:500}
.order-grid select,.order-grid textarea{border-radius:12px}

.order-grid .pills{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}
.order-grid .pills span{padding:14px 12px;text-align:center;border-radius:14px}
.order-grid .pills span b{font-size:15px}.order-grid .pills span em{font-size:12.5px;margin-top:3px}
.order-grid .pills label{position:relative}

.order-grid .qty{max-width:240px;border-width:1.5px;border-radius:14px}
.order-grid .qty button{width:52px;height:50px;font-size:22px;color:var(--brand)}
.order-grid .qty input{height:50px;font-size:18px}
.order-grid .chip-q{padding:6px 16px;background:#f8fafc}.order-grid .chip-q:hover{background:var(--brand-l)}

.order-grid .summary .panel{padding:0;overflow:hidden;border-radius:20px}
.order-grid .summary .title{margin:0;padding:18px 22px;background:linear-gradient(135deg,#eef2ff,#e0f2fe);border-bottom:1px solid var(--line)}
.order-grid .summary .title .ico{background:#fff;box-shadow:0 2px 8px rgba(79,70,229,.15)}
.order-grid .summary .sum-line{padding:11px 22px;margin:0}
.order-grid .summary .sum-total{margin:6px 22px 0;padding:14px 16px;background:var(--brand-l);border-radius:14px}
.order-grid .summary .sum-total b{color:var(--brand-d)}
.order-grid .summary .panel>.fh,.order-grid .summary .gw-list,.order-grid .summary #payNote,.order-grid .summary .btn,.order-grid .summary .secure,.order-grid .summary>.panel>p{margin-left:22px;margin-right:22px}
.order-grid .summary .panel>.fh{margin-top:18px}
.order-grid .summary .panel>.fh::before{display:none}
.order-grid .summary .btn.lg.block{width:calc(100% - 44px)}
.order-grid .summary .gw-list{gap:10px}
.order-grid .gw{padding:12px 14px;border-radius:12px;transition:border-color .15s,background .15s}
.order-grid .gw input{accent-color:var(--brand);width:18px;height:18px}
.order-grid .gw small{font-size:12.5px}
.order-grid .summary #payNote{margin-top:12px}
.ord-trust{list-style:none;margin:14px 22px 20px;padding:14px 0 0;border-top:1px dashed var(--line);display:grid;gap:8px}
.ord-trust li{display:flex;align-items:center;gap:8px;font-size:13px;color:#475569}.ord-trust li svg{color:#16a34a;flex:none}
.order-grid .summary .panel>a.btn.lg.block{margin-top:14px}
.order-grid .summary .panel>p.center{margin-bottom:20px}

@media(max-width:900px){
  .ord-hero{padding:18px;gap:14px}.ord-hero .oh-ico{width:52px;height:52px;border-radius:15px}.ord-hero h1{font-size:21px}
  .order-grid{grid-template-columns:minmax(0,1fr)}
  .order-grid>.panel{padding:4px 18px}
}
@media(max-width:560px){
  .ord-hero{flex-direction:column;align-items:flex-start}
  .order-grid .pills{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ===== Order page v2: one card per step ===== */
.order-grid>.panel{background:none;border:0;box-shadow:none;padding:0;margin:0}
.order-grid .fgroup,.order-grid .fgroup:first-child,.order-grid .fgroup:last-child{background:#fff;border:1px solid var(--line);border-radius:20px;padding:22px 24px;margin-bottom:16px;box-shadow:var(--shadow)}
.order-grid .fh{margin-bottom:4px;font-size:17px}
.order-grid .fh::before{background:linear-gradient(135deg,#4f46e5,#0891b2);box-shadow:0 4px 10px rgba(79,70,229,.28)}
.order-grid .fh-sub{margin:0 0 16px 36px;color:var(--muted);font-size:13.5px}

.ord-hero{position:relative;overflow:hidden}
.ord-hero>*{position:relative;z-index:1}
.ord-hero::before,.ord-hero::after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.10)}
.ord-hero::before{width:240px;height:240px;right:-70px;top:-90px}
.ord-hero::after{width:140px;height:140px;right:110px;bottom:-80px}

.order-grid .qty{max-width:260px;background:#f8fafc}
.order-grid .qty input{background:#fff}
.order-grid .pills.dur span{padding:16px 12px}
.order-grid .pills.dur span em.pp{font-size:14px;font-weight:700;color:var(--brand-d);margin-top:4px}

.order-grid .summary .panel{box-shadow:0 18px 44px rgba(79,70,229,.14);border-color:#dfe4f5}
.order-grid .summary #placeBtn{background-image:linear-gradient(135deg,#4f46e5,#0891b2);border:0;box-shadow:0 12px 26px rgba(79,70,229,.32);transition:transform .15s,box-shadow .15s}
.order-grid .summary #placeBtn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 16px 32px rgba(79,70,229,.4)}
.order-grid .summary .sum-total b{font-size:32px}

@media(max-width:900px){
  .order-grid>.panel{padding:0}
  .order-grid .fgroup,.order-grid .fgroup:first-child,.order-grid .fgroup:last-child{padding:18px 16px;border-radius:16px}
  .order-grid .fh-sub{margin-left:0}
}

/* ===== Order summary v2 ===== */
.order-grid .summary .panel{border:0;border-radius:22px;box-shadow:0 22px 50px rgba(79,70,229,.18);padding:0;overflow:hidden;margin:0}
.order-grid .summary .title{margin:0;padding:20px 22px;background:linear-gradient(135deg,#4f46e5,#0891b2);border:0;color:#fff;gap:14px}
.order-grid .summary .title b{font-size:16.5px;color:#fff}
.order-grid .summary .title .muted{color:rgba(255,255,255,.82)}
.order-grid .summary .title .ico{width:46px;height:46px;border-radius:14px;background:rgba(255,255,255,.18);color:#fff;box-shadow:none}
.sum-rows{padding:8px 22px 4px}
.order-grid .summary .sum-line{padding:12px 0;margin:0;align-items:center;font-size:14px;border-bottom:1px dashed #e3e8f2}
.order-grid .summary .sum-line:last-child{border-bottom:0}
.order-grid .summary .sum-line span:first-child{display:inline-flex;align-items:center;gap:8px;color:var(--muted)}
.order-grid .summary .sum-line span:first-child svg{color:var(--brand);flex:none}
.order-grid .summary .sum-line b{text-align:right;font-weight:700;display:inline-flex;align-items:center;gap:6px;justify-content:flex-end}
.order-grid .summary .sum-total{margin:6px 22px 0;padding:16px 18px;border-radius:16px;background:linear-gradient(135deg,#eef2ff,#e0f2fe);border:1px solid #dbe3fb;align-items:center}
.order-grid .summary .sum-total span{font-weight:700;color:#334155}
.order-grid .summary .sum-total b{font-size:30px;color:var(--brand-d);letter-spacing:-.03em}
.order-grid .summary .pay-h{margin:20px 22px 10px;font-size:14px;text-transform:uppercase;letter-spacing:.08em;color:#64748b}
.order-grid .summary .pay-h::before{display:none}
.order-grid .summary .gw-list{margin:0 22px;gap:10px}
.order-grid .gw{position:relative;padding:12px 14px;gap:12px;border-radius:14px;background:#fff;transition:border-color .15s,background .15s,box-shadow .15s}
.order-grid .gw:hover{border-color:#a5b4fc}
.order-grid .gw input{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}
.gw-ic{flex:none;width:38px;height:38px;border-radius:11px;background:#f1f4fa;color:var(--brand);display:grid;place-items:center}
.order-grid .gw>div{flex:1;min-width:0}
.order-grid .gw::after{content:"";flex:none;width:18px;height:18px;border-radius:50%;border:2px solid #cbd5e1;transition:.15s}
.order-grid .gw:has(input:checked){border-color:var(--brand);background:var(--brand-l);box-shadow:0 0 0 3px rgba(79,70,229,.10)}
.order-grid .gw:has(input:checked) .gw-ic{background:var(--brand);color:#fff}
.order-grid .gw:has(input:checked)::after{border-color:var(--brand);background:radial-gradient(circle,var(--brand) 42%,transparent 46%)}
.order-grid .gw:has(input:focus-visible){outline:2px solid var(--brand);outline-offset:2px}
.order-grid .gw:has(input:disabled){cursor:not-allowed}
.order-grid .summary #payNote{margin:12px 22px 0}
.order-grid .summary .btn.lg.block{width:calc(100% - 44px);margin-left:22px;margin-right:22px;margin-bottom:0}
.order-grid .summary .panel>a.btn.lg.block{margin-top:18px}
.order-grid .summary .secure{margin:14px 22px 0}
.order-grid .summary .ord-trust{margin:14px 22px 22px;padding-top:14px}
.order-grid .summary .panel>p.center{margin:12px 22px 22px}
@media(max-width:900px){.order-grid .summary .panel{box-shadow:var(--shadow)}}

/* ===== Order summary v3: receipt style ===== */
.order-grid .summary .panel{position:relative;border:1px solid #e0e6f8;border-radius:24px;background:#fff;box-shadow:0 24px 56px rgba(79,70,229,.16),0 2px 6px rgba(15,23,42,.04)}

/* header */
.order-grid .summary .title{position:relative;overflow:hidden;padding:22px 22px 24px;gap:14px;align-items:center;background:linear-gradient(135deg,#4338ca 0%,#4f46e5 45%,#0891b2 100%)}
.order-grid .summary .title::before,.order-grid .summary .title::after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.10);pointer-events:none}
.order-grid .summary .title::before{width:150px;height:150px;right:-44px;top:-70px}
.order-grid .summary .title::after{width:90px;height:90px;right:60px;bottom:-56px}
.order-grid .summary .title>*{position:relative;z-index:1}
.order-grid .summary .title .ico{width:48px;height:48px;border-radius:15px;background:rgba(255,255,255,.2);box-shadow:inset 0 0 0 1px rgba(255,255,255,.28);backdrop-filter:blur(4px)}
.order-grid .summary .sum-head{display:flex;flex-direction:column;gap:3px;min-width:0}
.order-grid .summary .sum-kick{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.78)}
.order-grid .summary .sum-head b{font-size:18px;line-height:1.25;letter-spacing:-.01em;color:#fff;overflow-wrap:anywhere}

/* rows */
.sum-rows{padding:10px 22px 6px}
.order-grid .summary .sum-line{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 0;border-bottom:1px solid #eef1f8;font-size:14px}
.order-grid .summary .sum-line:last-child{border-bottom:0}
.order-grid .summary .sum-line>span:first-child{display:inline-flex;align-items:center;gap:10px;color:var(--muted);font-weight:500;white-space:nowrap}
.sum-line .si{flex:none;width:30px;height:30px;border-radius:9px;background:var(--brand-l);color:var(--brand);display:grid;place-items:center;font-style:normal}
.order-grid .summary .sum-line .si svg{color:var(--brand)}
.order-grid .summary .sum-line>b{flex:1;min-width:0;text-align:right;justify-content:flex-end;color:var(--text);font-weight:700;overflow-wrap:anywhere}
.order-grid .summary .sum-line>b .flag{border-radius:3px;box-shadow:0 0 0 1px rgba(15,23,42,.12)}

/* receipt tear line */
.sum-tear{position:relative;height:0;margin:14px 0 18px;border-top:2px dashed #d7def3}
.sum-tear::before,.sum-tear::after{content:"";position:absolute;top:-13px;width:24px;height:24px;border-radius:50%;background:var(--bg);border:1px solid #e0e6f8}
.sum-tear::before{left:-13px;clip-path:inset(0 0 0 50%)}
.sum-tear::after{right:-13px;clip-path:inset(0 50% 0 0)}

/* total */
.order-grid .summary .sum-total{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 22px;padding:16px 18px;border-radius:18px;background:linear-gradient(135deg,#eef2ff,#e0f2fe);border:1px solid #d6defa}
.order-grid .summary .sum-total span{font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#475569}
.order-grid .summary .sum-total b{font-size:34px;line-height:1;font-weight:800;letter-spacing:-.04em;color:var(--brand-d);font-variant-numeric:tabular-nums}
@supports((-webkit-background-clip:text) or (background-clip:text)){
  .order-grid .summary .sum-total b{background:linear-gradient(135deg,#4338ca,#0891b2);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
}

/* payment */
.order-grid .summary .pay-h{display:flex;align-items:center;gap:10px;margin:22px 22px 12px;font-size:12px;font-weight:800;letter-spacing:.12em}
.order-grid .summary .pay-h::after{content:"";flex:1;height:1px;background:#e5e9f2}
.order-grid .summary .gw-list{gap:10px}
.order-grid .gw{padding:13px 14px;border-width:1.5px;border-color:#e2e8f4}
.order-grid .gw b{font-size:14.5px}
.order-grid .gw small{display:block;margin-top:2px;line-height:1.35;color:var(--muted)}
.order-grid .gw small:empty{display:none}
.order-grid .gw:hover{background:#fafbff}
.order-grid .gw:has(input:checked){background:linear-gradient(135deg,#f5f7ff,#eef9ff);box-shadow:0 0 0 3px rgba(79,70,229,.12),0 6px 16px rgba(79,70,229,.10)}
.order-grid .summary #payNote{padding:10px 12px;border-radius:12px;background:#f8fafc;border:1px solid #eef1f8;line-height:1.5}
.order-grid .summary #payNote:empty{display:none}

/* button */
.order-grid .summary #placeBtn{height:56px;font-size:16px;font-weight:700;border-radius:16px;gap:10px;margin-top:18px!important}
.order-grid .summary #placeBtn:disabled{opacity:.55;box-shadow:none;transform:none;cursor:not-allowed}
.order-grid .summary .secure{color:#64748b;font-size:12.5px}
.order-grid .summary .secure svg{color:#16a34a}

/* trust list */
.order-grid .summary .ord-trust{margin:16px 22px 22px;padding:14px 16px;border:1px solid #d9f2e2;border-radius:16px;background:#f3fcf6;gap:9px}
.order-grid .summary .ord-trust li{font-size:13px;font-weight:500;color:#334155}
.order-grid .summary .ord-trust li svg{width:15px;height:15px;color:#16a34a}

@media(max-width:980px){
  .order-grid .summary .panel{box-shadow:var(--shadow)}
  .order-grid .summary .sum-total b{font-size:30px}
}
@media(max-width:420px){
  .sum-rows{padding-left:18px;padding-right:18px}
  .order-grid .summary .sum-total{margin-left:18px;margin-right:18px}
  .order-grid .summary .sum-line>span:first-child{white-space:normal}
}

/* ===== Promo code box (order summary) ===== */
.order-grid .summary .sum-line.sum-disc>b{color:#15803d}
.order-grid .summary .sum-line.sum-disc .si{background:#dcfce7;color:#15803d}
.order-grid .summary .sum-line.sum-disc .si svg{color:#15803d}
.order-grid .summary #rowSub>b{font-weight:600;color:var(--muted)}
.promo{margin:2px 22px 4px}
.promo-toggle{display:inline-flex;align-items:center;gap:7px;border:0;background:none;padding:6px 0;color:var(--brand);font-weight:700;font-size:13.5px;cursor:pointer}
.promo-toggle:hover{color:var(--brand-d);text-decoration:underline}
.promo-row{display:flex;gap:8px;margin-top:6px}
.promo-row input{flex:1;min-width:0;height:44px;border:1.5px dashed #b6c0e6;border-radius:12px;background:#f8faff;text-transform:uppercase;letter-spacing:.08em;font-weight:700;font-size:14px;padding:0 14px}
.promo-row input:focus{border-style:solid}
.promo-row .btn.sm{height:44px;padding:0 20px;border-radius:12px;font-size:14px}
.promo-ok{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:6px;padding:10px 12px;border-radius:14px;background:#f0fdf4;border:1px solid #bbf7d0}
.promo-ok[hidden],.promo-form[hidden],.promo-toggle[hidden]{display:none}
.promo-chip{display:inline-flex;align-items:center;gap:8px;min-width:0;flex-wrap:wrap;color:#15803d}
.promo-chip svg{flex:none}.promo-chip b{letter-spacing:.06em;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13.5px}
.promo-chip em{font-style:normal;font-size:12.5px;color:#166534;opacity:.85}
.promo-x{flex:none;width:28px;height:28px;border-radius:50%;border:0;background:#dcfce7;color:#166534;font-size:18px;line-height:1;cursor:pointer}
.promo-x:hover{background:#bbf7d0}
.promo-msg{min-height:0;margin-top:6px;font-size:12.5px;font-weight:600}
.promo-msg:empty{display:none}
.promo-msg.err{color:#b91c1c}.promo-msg.ok{color:#15803d}.promo-msg.warn{color:#b45309}
@media(max-width:420px){.promo{margin-left:18px;margin-right:18px}}

/* ===== admin order detail (redesign) ===== */
.ao-hero{--ac:#64748b;display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;position:relative;overflow:hidden;background:linear-gradient(135deg,#fff 0%,#f6f7ff 100%);border:1px solid var(--line);border-radius:18px;padding:22px 24px;margin-bottom:18px;box-shadow:var(--shadow)}
.ao-hero::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--ac)}
.ao-hero.st-ok{--ac:#16a34a}.ao-hero.st-warn{--ac:#f59e0b}.ao-hero.st-bad{--ac:#dc2626}.ao-hero.st-off{--ac:#94a3b8}
.ao-hero-main{display:flex;align-items:center;gap:16px;min-width:0}
.ao-ico{flex:none;width:56px;height:56px;border-radius:16px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#6366f1,#06b6d4);box-shadow:0 8px 20px rgba(79,70,229,.28)}
.ao-hero h1{margin:0 0 4px;font-size:26px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ao-sub{display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:var(--muted);font-size:14px}.ao-sub i{font-style:normal;opacity:.5}
.ao-sub span{display:inline-flex;align-items:center;gap:5px}
.ao-hero-user{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:10px 16px;min-width:0}
.ao-hero-user small{display:block;color:var(--muted);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.05em}
.ao-hero-user b{display:block;overflow-wrap:anywhere;font-size:14px}
.ao-alert{display:flex;gap:12px;align-items:flex-start;background:var(--red-l);border:1px solid #fecaca;color:#7f1d1d;border-radius:14px;padding:14px 16px;margin-bottom:18px}
.ao-alert>svg{flex:none;margin-top:2px}.ao-alert>div{min-width:0;flex:1}.ao-alert pre.log{margin:8px 0 0}
.ao-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}
.ao-stat{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px 18px;box-shadow:var(--shadow)}
.ao-stat span{display:block;color:var(--muted);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.05em}
.ao-stat b{display:block;font-size:26px;letter-spacing:-.02em;margin:4px 0 2px}
.ao-stat em{font-style:normal;color:var(--muted);font-size:13px}
.ao-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:stretch}
.ao-grid .ao-card{margin-bottom:0}.ao-grid{margin-bottom:18px}
.ao-card{padding:22px 24px}
.ao-h{display:flex;align-items:center;gap:10px;font-size:17px;margin:0 0 14px}
.ao-h>svg{color:var(--brand)}
.ao-count{background:var(--brand-l);color:var(--brand-d);border-radius:99px;font-size:12px;font-weight:700;padding:2px 10px}
.ao-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.ao-actions form{margin:0}
.ao-sep{flex:1 1 auto;min-width:8px}
.ao-renew{display:inline-flex;align-items:center;gap:10px;background:#f0fdf4;border:1px solid #bbf7d0;border-radius:12px;padding:5px 6px 5px 12px}
.ao-renew label{margin:0;font-weight:500;font-size:13px;display:inline-flex;align-items:center;gap:6px;color:#166534}
.ao-tbl table{min-width:980px}
.ao-tbl tr:not(.x):hover>td{background:#fafbff}
.ao-proto{display:inline-block;background:#eef2ff;color:var(--brand-d);border-radius:6px;padding:1px 8px;font-size:12px;font-weight:700;text-transform:uppercase}
.ao-extid{display:flex;gap:4px;margin:0}.ao-extid input{width:150px;padding:6px 9px;font-size:12px;border-radius:8px}
.ao-rowacts{white-space:nowrap}.ao-rowacts .btn+.btn{margin-left:4px}
.ao-verify{background:#f8fafc;padding:14px 16px}
.ao-verify table{background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.ao-empty{display:flex;flex-direction:column;align-items:center;gap:6px;padding:26px 0;color:#94a3b8}.ao-empty p{margin:0}
.ao-add{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin-top:18px;padding-top:18px;border-top:1px dashed var(--line)}
.ao-add-f{flex:1;min-width:260px}.ao-add-f label{margin-top:0}
.ao-copy.copied{color:var(--green)}
@media(max-width:900px){.ao-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.ao-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:640px){
  .ao-hero{padding:18px 18px 18px 22px}.ao-hero h1{font-size:21px}.ao-ico{width:46px;height:46px}
  .ao-hero-user{width:100%}.ao-stat b{font-size:22px}.ao-card{padding:18px}
  .ao-actions>form,.ao-actions .btn{width:100%}.ao-actions .btn{justify-content:center}.ao-sep{display:none}
  .ao-renew{width:100%;justify-content:space-between}.ao-renew .btn{width:auto}
  .ao-add .btn{width:100%}
}
.pills input:disabled+span{cursor:not-allowed}