:root{--bg:#f6f8fb;--panel:#fff;--ink:#19283b;--muted:#6a788c;--line:#e7ecf2;--blue:#2563eb;--green:#15835a;--red:#c43e4f;--amber:#9d6710;--soft:#eff4ff;--shadow:0 12px 38px rgba(32,52,78,.045)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
a{color:inherit;text-decoration:none}a:hover{color:var(--blue)}button,input,select{font:inherit}button{cursor:pointer}
.shell{max-width:1300px;padding:0 25px;margin:auto}.topbar{display:flex;align-items:center;justify-content:space-between;gap:15px;height:80px;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:11px;font-size:18px;font-weight:760;letter-spacing:-.6px}.brand-icon{display:grid;place-items:center;color:#fff;background:#27496f;width:36px;height:36px;border-radius:11px;font-size:24px}.brand-light{font-weight:450;color:#728094}
.nav{display:flex;align-items:center;gap:15px}.subtle{color:var(--muted)}.nav a{font-weight:600}
.main{padding:35px 0 50px}.eyebrow{text-transform:uppercase;font-size:11px;letter-spacing:1.6px;font-weight:750;color:#6980a5;margin:0 0 7px}.hero{display:flex;justify-content:space-between;gap:20px;align-items:center;margin:0 0 24px}h1{font-size:clamp(27px,3.2vw,38px);font-weight:750;line-height:1.15;letter-spacing:-1.15px;margin:0 0 9px}h2{font-size:18px;letter-spacing:-.4px;margin:0}.muted{color:var(--muted)}p{margin:0}.lead{font-size:14px;color:var(--muted)}
.button{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:9px 14px;color:var(--ink);font-weight:630}.button:hover{border-color:#b8caea;color:var(--blue)}.button.primary{background:var(--blue);color:#fff;border-color:var(--blue)}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:25px}.stat,.card,.table-wrap,.notice{border:1px solid var(--line);border-radius:17px;background:var(--panel);box-shadow:var(--shadow)}.stat{padding:20px 23px}.stat .value{display:block;font-weight:770;font-size:31px;line-height:1.5;letter-spacing:-1px}.stat .label{color:var(--muted);font-size:12px;font-weight:550}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:28px 0 13px}.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.card{display:block;padding:21px;transition:transform .18s,border-color .18s}.card:hover{transform:translateY(-2px);border-color:#c3d3e9}.card-top{display:flex;justify-content:space-between;align-items:center;gap:15px}.avatar{display:grid;place-items:center;flex:none;width:42px;height:42px;border-radius:13px;background:#eff5fd;color:#3b619b;font-weight:800;font-size:16px}.owner-name{font-size:18px;font-weight:735;margin-top:13px}.owner-id{font-family:ui-monospace,"SFMono-Regular",Consolas,monospace;font-size:11px;color:#8b97a7;overflow-wrap:anywhere}.card-meta{display:flex;justify-content:space-between;gap:10px;margin-top:17px;padding-top:13px;border-top:1px solid var(--line);color:var(--muted);font-size:12px}.card-meta strong{display:block;color:var(--ink);font-size:17px}
.pill{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;padding:3px 9px;border-radius:999px;font-size:11px;font-weight:700;background:#eef2f7;color:#657487}.pill.ok{background:#e8f8ef;color:var(--green)}.pill.failed{background:#fff0f1;color:var(--red)}.pill.pending{background:#fff6dd;color:var(--amber)}
.table-wrap{overflow-x:auto}.table{border-collapse:collapse;width:100%;min-width:650px}.table th{font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.75px;color:#7e8da0;background:#fbfcfe;text-align:left}.table th,.table td{padding:13px 18px;border-bottom:1px solid #edf1f6;vertical-align:middle}.table tr:last-child td{border-bottom:none}.table tbody tr:hover{background:#fcfdff}.table .code{font-family:ui-monospace,Consolas,monospace;font-size:12px;font-weight:650}.table .amount{font-weight:700;white-space:nowrap}.table .time{white-space:nowrap;color:#54657a;font-size:12px}
.filters{display:flex;gap:9px;flex-wrap:wrap;align-items:end;margin-bottom:13px}.filters label{font-size:12px;font-weight:650;color:#647488;display:block;margin-bottom:6px}.filters select,.filters input{outline:none;border:1px solid #dbe3ed;border-radius:10px;background:#fff;color:var(--ink);padding:9px 12px;min-height:40px}.filters input{min-width:200px}.filters input:focus,.filters select:focus:focus{border-color:#87a9e3;box-shadow:0 0 0 3px #eaf1fd}.pager{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:13px}.empty{padding:35px 18px;text-align:center;color:var(--muted)}.notice{padding:13px 17px;color:#5a6580;margin:12px 0}.notice.error{background:#fff7f7;color:#aa3644}.notice.info{background:#f0f6ff}.footer{padding:21px 0 29px;border-top:1px solid var(--line);font-size:11px;color:#8593a7}
.small{font-size:12px}.right{text-align:right}.mobile-label{display:none}
@media(max-width:900px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.stats{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.shell{padding:0 16px}.topbar{height:68px}.main{padding:25px 0}.cards{grid-template-columns:1fr}.stats{gap:9px}.stat{padding:15px}.stat .value{font-size:25px}.hero{align-items:flex-start;flex-direction:column}.brand{font-size:16px}.nav{gap:8px}.nav .subtle{display:none}.table th,.table td{padding:11px 12px}}
/* Navigasi panel dan tabel finansial — sistem desktop dan mobile ringan */
:root{--bg:#f4f7fb;--panel:#ffffff;--ink:#17253b;--muted:#687a90;--line:#e5ebf3;--blue:#2457d7;--shadow:0 6px 26px rgba(25,44,80,.035)}
body{background:linear-gradient(180deg,#f0f5fc 0,#f6f8fc 230px,#f6f8fc 100%)}
.topbar{border-bottom-color:#e1e9f4}.brand-icon{background:linear-gradient(135deg,#254a87,#3778e6)}
.owner-hero{margin-bottom:23px}.finance-stats{margin-bottom:24px}
.tabbar{display:flex;flex-wrap:wrap;gap:6px;border:1px solid var(--line);background:#fff;padding:7px;border-radius:15px;margin-bottom:24px;box-shadow:var(--shadow)}
.tab{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:11px 16px;border-radius:10px;font-size:13px;font-weight:680;color:#69798d;transition:background .15s,color .15s;min-width:100px}
.tab:hover{background:#f1f5fc;color:#2253b4}.tab.active{color:#1c4db5;background:#ecf3ff;box-shadow:inset 0 0 0 1px #d9e7ff}
.tab-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#b4c1d1}.tab.active .tab-dot{background:#356bd2}
.stat{min-width:0}.stat .value{font-size:clamp(19px,2vw,26px);overflow-wrap:anywhere;line-height:1.35;margin-top:7px;letter-spacing:-.6px}
.stat-note{color:#8b9aab;font-size:11px;display:block;margin-top:7px}.section-head{margin-top:27px;margin-bottom:14px}.section-head h2{font-size:19px}.section-head .lead{margin-top:4px;font-size:12px}
.tab-content{min-height:280px}.footnote{margin-top:13px}.notice.warn{background:#fffaf0;border-color:#f5e4bd;color:#805b20}
.table{min-width:700px}.table tbody tr:nth-child(even){background:#fdfefe}.table th{background:#f8fafd}.table td{max-width:400px;overflow-wrap:anywhere}.table td .muted{margin-top:4px}
.pager span{display:inline-flex;gap:8px}.pager .button[aria-disabled=true]{opacity:.4;pointer-events:none}
.filters{padding:13px;border:1px solid var(--line);border-radius:14px;background:#fff;margin-bottom:16px}.filters input,.filters select{background:#fbfdff}.footer{line-height:1.8}
@media(max-width:720px){.tabbar{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:3px;padding:5px}.tab{min-width:0;padding:11px 4px;flex-direction:column;gap:5px;font-size:11px}.tab-dot{width:6px;height:6px}.finance-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.stat .value{font-size:21px}.table{min-width:620px}}
@media(max-width:390px){.tab{font-size:10px}.tabbar{gap:0}.finance-stats{grid-template-columns:1fr 1fr}}
/* Login ringkas, tanpa library JS eksternal */
.login-wrap{min-height:65vh;display:flex;align-items:center;justify-content:center;padding:28px 0}
.login-panel{background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:0 20px 65px rgba(25,44,80,.07);padding:40px;width:100%;max-width:440px}
.login-panel .lead{line-height:1.6;margin-bottom:25px}
.login-icon{display:grid;place-items:center;width:44px;height:44px;background:#2854a7;color:#fff;border-radius:14px;font-size:26px;margin-bottom:24px}
.login-form{display:flex;flex-direction:column;gap:12px;margin:23px 0}
.login-form label{font-size:13px;font-weight:680}
.login-form input{border:1px solid #ced9ea;border-radius:11px;padding:14px;font-size:15px;background:#fbfdff;color:var(--ink);outline:none}
.login-form input:focus{border-color:#356bca;box-shadow:0 0 0 3px #ecf3ff}
.login-form .button{padding:13px;margin-top:4px}
.login-panel .small{line-height:1.6}
.login-error{padding:11px 13px;border:1px solid #fac8d0;color:#a93043;background:#fff5f5;border-radius:10px;font-size:13px;margin-top:19px}
.logout-form{margin:0}.logout-form .button{font-size:12px;padding:7px 12px}
@media(max-width:600px){.login-wrap{min-height:65vh}.login-panel{padding:27px 23px;border-radius:18px}}
/* CEK-PESANAN AURORA-V1 — tema warna CSS saja; tanpa JS atau aset eksternal. */
:root{
  --bg:#f5f6ff;--panel:#ffffff;--ink:#1d2442;--muted:#66718e;
  --line:#e7e9f6;--blue:#5a54dc;--green:#14886d;--red:#c44269;
  --amber:#a46612;--soft:#f2f1ff;
  --shadow:0 12px 36px rgba(61,65,135,.07);
  --accent:#6457ef;--accent2:#06b6d4;--radius:20px;
}
html{scroll-behavior:smooth}
body{
  color:var(--ink);
  background:
    radial-gradient(ellipse 700px 450px at -10% -10%,rgba(180,168,255,.25),transparent 70%),
    radial-gradient(ellipse 680px 500px at 107% 4%,rgba(115,229,221,.18),transparent 70%),
    linear-gradient(180deg,#f7f7ff 0%,#f5f7fd 58%,#f8faff 100%);
  min-height:100vh;
}
a,button{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{
  outline:3px solid rgba(110,87,247,.55);outline-offset:3px;
}
.shell{max-width:1360px;padding-inline:clamp(16px,3vw,36px)}
.topbar{
  height:86px;padding:0 18px;background:rgba(255,255,255,.79);
  border:1px solid rgba(224,227,248,.8);border-top:0;
  border-radius:0 0 23px 23px;
  box-shadow:0 8px 32px rgba(77,70,160,.045);
}
.brand{gap:12px;font-size:19px;color:#24234d;letter-spacing:-.7px}
.brand:hover{color:#5145cb}
.brand-icon{
  width:42px;height:42px;border-radius:14px;
  background:linear-gradient(145deg,#7461f2 4%,#405de7 60%,#20bed5 105%);
  box-shadow:0 6px 18px rgba(86,80,228,.22);font-size:25px;
}
.brand-light{color:#6b70a7;font-weight:490}
.nav{gap:12px}.nav>a{font-weight:700;color:#4f5484;padding:9px 13px;border-radius:11px}
.nav>a:hover{background:#f1efff;color:#5849d8}
.main{padding:28px 0 55px}
.hero{
  position:relative;isolation:isolate;overflow:hidden;min-height:168px;
  padding:30px clamp(22px,3.4vw,43px);border:1px solid rgba(255,255,255,.22);
  border-radius:26px;margin-bottom:22px;
  background:linear-gradient(115deg,#423da7 0%,#6260de 46%,#7c53dd 80%,#ac65de 110%);
  box-shadow:0 17px 40px rgba(85,73,197,.18);
}
.hero::before{
  content:"";position:absolute;z-index:-1;pointer-events:none;
  width:300px;height:300px;border-radius:50%;right:8%;top:-165px;
  border:42px solid rgba(255,255,255,.09);
}
.hero::after{
  content:"";position:absolute;z-index:-1;pointer-events:none;
  width:340px;height:340px;border-radius:50%;right:-100px;bottom:-230px;
  background:radial-gradient(circle,rgba(64,229,222,.44),rgba(64,229,222,.02) 68%);
}
.hero>div,.hero>.button{position:relative;z-index:1}
.hero h1{color:#fff;font-size:clamp(27px,3.3vw,41px);font-weight:790;letter-spacing:-1.3px}
.hero .eyebrow{color:#bdefff;font-size:11px;letter-spacing:2px}
.hero .lead{color:rgba(255,255,255,.87);max-width:800px;font-size:13px}
.hero .button{
  color:#fff;background:rgba(255,255,255,.15);
  border:1px solid rgba(255,255,255,.35);white-space:nowrap;
  box-shadow:0 4px 12px rgba(40,26,117,.08)
}
.hero .button:hover{background:#fff;color:#5149ca;border-color:#fff}
.owner-hero{background:linear-gradient(115deg,#2d4da2 0%,#5158d3 45%,#8a61de 100%)}
.eyebrow{color:#7061d0;letter-spacing:1.8px}
.section-head{margin:30px 0 15px}
.section-head h2{font-size:20px;color:#2a2a55;font-weight:760}
.section-head .lead{color:#75809a}
.stats{gap:15px;margin-bottom:26px}
.stat{
  position:relative;isolation:isolate;overflow:hidden;min-height:120px;
  border-radius:20px;border:1px solid #dcefe9;
  background:linear-gradient(125deg,#ffffff 25%,#e5faf3 115%);
  box-shadow:0 10px 28px rgba(49,90,92,.05);
  padding:20px 23px 17px;
}
.stat::before{content:"";position:absolute;z-index:-1;right:-27px;top:-46px;width:125px;height:125px;border:24px solid rgba(56,177,137,.09);border-radius:50%}
.stat:nth-child(4n+2){border-color:#dce9fb;background:linear-gradient(125deg,#fff 25%,#e6f3ff 115%)}
.stat:nth-child(4n+2)::before{border-color:rgba(60,124,237,.10)}
.stat:nth-child(4n+3){border-color:#e6e0fe;background:linear-gradient(125deg,#fff 25%,#f0e9ff 115%)}
.stat:nth-child(4n+3)::before{border-color:rgba(144,89,229,.10)}
.stat:nth-child(4n+4){border-color:#f7e2e6;background:linear-gradient(125deg,#fff 25%,#fff0ee 115%)}
.stat:nth-child(4n+4)::before{border-color:rgba(239,121,115,.10)}
.stat .label{font-size:12px;font-weight:720;color:#60796f}
.stat:nth-child(4n+2) .label{color:#63799b}
.stat:nth-child(4n+3) .label{color:#7a67a5}
.stat:nth-child(4n+4) .label{color:#a3777c}
.stat .value{color:#127761;line-height:1.25;font-weight:790;margin-top:10px;font-size:clamp(24px,2.6vw,33px);letter-spacing:-.9px}
.stat:nth-child(4n+2) .value{color:#3768ba}
.stat:nth-child(4n+3) .value{color:#7653bd}
.stat:nth-child(4n+4) .value{color:#bb606e}
.stat-note{color:#8991a8;font-size:11px;font-weight:530;margin-top:7px}
.finance-stats{grid-template-columns:repeat(auto-fit,minmax(min(100%,245px),1fr))}
.cards{gap:17px}
.card{
  --owner-accent:#7061e8;--owner-soft:#f0eefe;
  position:relative;isolation:isolate;overflow:hidden;
  border:1px solid #e6e1fa;border-top:3px solid var(--owner-accent);
  border-radius:21px;padding:22px;
  background:linear-gradient(152deg,#ffffff 37%,var(--owner-soft) 155%);
  box-shadow:0 10px 28px rgba(65,58,128,.055);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.card::after{
  content:"";position:absolute;z-index:-1;right:-40px;top:-53px;
  width:155px;height:155px;border-radius:50%;background:var(--owner-soft);opacity:.85;
}
.card:hover{transform:translateY(-4px);border-color:var(--owner-accent);box-shadow:0 20px 36px rgba(75,64,151,.13);color:var(--ink)}
.card:nth-child(6n+2){--owner-accent:#0c9b9e;--owner-soft:#dff9f5;border-color:#d8f0ea;border-top-color:var(--owner-accent)}
.card:nth-child(6n+3){--owner-accent:#e16b7a;--owner-soft:#fff0f0;border-color:#f5e0e4;border-top-color:var(--owner-accent)}
.card:nth-child(6n+4){--owner-accent:#3f88d4;--owner-soft:#e7f4ff;border-color:#dcebf8;border-top-color:var(--owner-accent)}
.card:nth-child(6n+5){--owner-accent:#b77a16;--owner-soft:#fff5df;border-color:#f3e7d1;border-top-color:var(--owner-accent)}
.card:nth-child(6n+6){--owner-accent:#985dcc;--owner-soft:#f4e9ff;border-color:#eadff6;border-top-color:var(--owner-accent)}
.avatar{
  width:45px;height:45px;border-radius:14px;color:#fff;
  background:var(--owner-accent);box-shadow:0 5px 14px rgba(58,51,114,.13);
  font-size:19px
}
.card-top .pill{background:#ffffffc7;color:var(--owner-accent);border:1px solid #ffffffcc}
.owner-name{font-weight:780;font-size:19px;color:#282f4c}
.owner-id{color:#9298af}
.card-meta{border-top:1px solid #e9e8f2;color:#818ba3;margin-top:18px;gap:8px}
.card-meta strong{font-size:19px;color:#3c3a75}
.button{
  border:1px solid #e0e3f3;border-radius:12px;background:#fff;color:#444a72;
  font-weight:700;min-height:39px;box-shadow:0 2px 5px rgba(52,55,103,.015);
  transition:background .16s,border-color .16s,color .16s,transform .16s,box-shadow .16s
}
.button:hover{border-color:#a49af2;color:#5545ce;background:#f7f5ff;transform:translateY(-1px)}
.button:active{transform:translateY(0)}
.button.primary{
  color:#fff;background:linear-gradient(115deg,#5a5fe5,#8855df);
  border-color:#6860e4;box-shadow:0 7px 17px rgba(104,85,226,.19)
}
.button.primary:hover{color:#fff;border-color:#695ce5;background:linear-gradient(115deg,#4d55d4,#7650c9);box-shadow:0 9px 19px rgba(104,85,226,.24)}
.tabbar{
  display:flex;flex-wrap:wrap;gap:8px;padding:8px;margin-bottom:22px;
  border:1px solid #e4e5f5;border-radius:18px;background:rgba(255,255,255,.93);
  box-shadow:0 8px 22px rgba(71,72,133,.05)
}
.tab{flex:1;min-width:104px;padding:11px 12px;gap:8px;border-radius:12px;color:#6c7291;font-size:13px;font-weight:750}
.tab:hover{color:#6252d7;background:#f3f1ff}
.tab.active{color:#fff;background:linear-gradient(110deg,#5b63e7,#895ee0);box-shadow:0 7px 14px rgba(99,85,228,.22)}
.tab.active:hover{color:#fff}
.tab-dot,.tab.active .tab-dot{
  display:grid;place-items:center;flex:none;width:26px;height:26px;border-radius:8px;
  background:#eeeefe;color:#7975bc;font-size:14px;font-weight:800;
}
.tab.active .tab-dot{color:#fff;background:rgba(255,255,255,.20)}
.tab-dot::after{content:"◈"}.tab-dot.package::after{content:"▤"}
.tab-dot.users::after{content:"♟"}.tab-dot.wallet::after{content:"◉"}
.tab-dot.alert::after{content:"!"}.tab-dot.chart::after{content:"▥"}
.table-wrap{border-radius:18px;border-color:#e6e8f6;box-shadow:0 9px 29px rgba(61,73,137,.05)}
.table{min-width:700px}.table th{
  background:linear-gradient(180deg,#f6f5ff,#f9faff);color:#6c6a94;
  font-size:10.5px;font-weight:800;letter-spacing:.85px
}
.table th,.table td{border-bottom:1px solid #edf0f9;padding:14px 18px}
.table tbody tr:nth-child(even){background:#fdfdff}
.table tbody tr:hover{background:#f3f6ff}
.table .amount{color:#3b5589;font-weight:780}
.table .code{color:#5b50ad}
.table .time{color:#68768c}
.table td:first-child{font-weight:550}
.pill{font-weight:770;background:#f0efff;color:#6257b8;padding:4px 10px}
.pill.ok{background:#e0f9eb;color:#117857}
.pill.pending{background:#fff3d8;color:#996006}
.pill.failed{background:#ffe9ee;color:#ad3454}
.filters{
  border:1px solid #e7e8f5;border-radius:17px;background:#fff;
  padding:15px;box-shadow:0 5px 18px rgba(61,73,137,.025)
}
.filters label{color:#65688a;font-weight:720}
.filters input,.filters select,.login-form input{background:#fdfdff;border-color:#dde0f0}
.filters input:focus,.filters select:focus,.login-form input:focus{
  outline:none;border-color:#9489ed;box-shadow:0 0 0 3px #eae8ff
}
.notice{border-radius:14px;padding:14px 17px;background:#f7f5ff;border-color:#e4e0fb;color:#5f5c92;box-shadow:none}
.notice.info{background:#eef7ff;border-color:#d7ebff;color:#426b96;border-left:4px solid #5ea5e5}
.notice.warn{background:#fff9e9;border-color:#f9e5b9;color:#8b661f;border-left:4px solid #e6aa45}
.notice.error{background:#fff0f2;border-color:#f4d4dd;color:#ad3d5a;border-left:4px solid #da738e}
.tab-content>.stats{margin-bottom:20px}
.tab-content>form.balance-refresh-form{
  padding:15px 17px!important;border:1px solid #dcd6fd;border-radius:16px;
  background:linear-gradient(95deg,#f3f0ff,#eefbff);
  box-shadow:0 7px 18px rgba(98,87,172,.045);
}
.tab-content>form.balance-refresh-form .button.primary{padding:11px 18px}
.tab-content>form.balance-refresh-form .small{color:#6b7199}
.table .balance-refresh-form{margin:0}
.table .balance-refresh-form .button{
  color:#5c4bca;border-color:#dcd7fb;background:#f6f3ff;
  white-space:nowrap;font-size:12px
}
.table .balance-refresh-form .button:hover{color:#fff;background:#6559db;border-color:#6559db}
.login-wrap{min-height:70vh;padding:42px 12px}
.login-panel{
  position:relative;overflow:hidden;border-radius:26px;padding:40px;
  border:1px solid #e3e3f4;
  background:linear-gradient(145deg,#fff 0%,#fff 73%,#faf8ff 100%);
  box-shadow:0 22px 65px rgba(89,78,169,.13)
}
.login-panel::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:linear-gradient(90deg,#5a60ed,#a45ede 55%,#34c7b6)}
.login-icon{width:48px;height:48px;border-radius:15px;background:linear-gradient(145deg,#565ae4,#a058df);box-shadow:0 8px 21px rgba(101,83,219,.22)}
.login-panel h1{color:#2a285b}
.login-panel .eyebrow{color:#7760cd}
.login-form input{min-height:47px}
.login-form .button.primary{min-height:46px}
.login-error{border-color:#f6cdd8;background:#fff0f4;color:#b0355a}
.footer{border-top-color:#e4e6f5;color:#888ca7;text-align:center}
@media(max-width:1000px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.tab{min-width:0}}
@media(max-width:720px){
  .shell{padding-inline:15px}.topbar{height:70px;padding-inline:11px;border-radius:0 0 17px 17px}
  .main{padding-top:17px}
  .hero{padding:24px 21px;border-radius:20px;gap:14px;min-height:unset}
  .hero::before{right:-80px}.hero h1{font-size:30px}
  .cards{grid-template-columns:1fr;gap:13px}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .stat{padding:17px;min-height:110px;border-radius:16px}
  .stat .value{font-size:clamp(20px,5vw,27px)}
  .tabbar{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px;padding:5px;border-radius:14px}
  .tab{padding:8px 3px;flex-direction:column;font-size:10.5px;gap:5px;line-height:1.25}
  .tab-dot,.tab.active .tab-dot{height:24px;width:24px;border-radius:7px;font-size:13px}
  .table th,.table td{padding:12px 13px}
  .login-panel{padding:28px 22px;border-radius:20px}
  .tab-content>form.balance-refresh-form{padding:13px!important}
}
@media(max-width:380px){.stats{grid-template-columns:1fr 1fr}.brand{font-size:16px}.nav>a{font-size:11px;padding:7px 8px}.tab{font-size:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button,.card,.tab{transition:none!important}.button:hover,.card:hover{transform:none}}


/* SANES SEOMASTER PANEL V1 - appended, non-destructive UI layer */
:root{--site-blue:#242cb7;--site-purple:#554ad9;--site-cyan:#35b5c9;--site-ink:#192441;--site-subtle:#7382a0}
body{background:linear-gradient(180deg,#f2f5ff 0%,#f7f9ff 420px,#f7f9fd 100%);color:var(--site-ink)}
.topbar{background:rgba(255,255,255,.94);border:1px solid #e4e8f8;border-top:0;border-radius:0 0 19px 19px;box-shadow:0 9px 26px rgba(25,33,114,.05);padding:0 22px}
.brand-icon{background:linear-gradient(135deg,#2528ab,#5755e6);border-radius:12px;box-shadow:0 7px 15px #363abc36}
.nav{gap:5px;flex-wrap:wrap}.nav>a{font-size:12px;color:#5d6687;border-radius:10px;padding:8px 12px}.nav>a:hover{color:#302fbd;background:#ebeaff}
.hero{background:radial-gradient(circle at 96% 30%,#616cf0,transparent 43%),linear-gradient(115deg,#1d238f,#3331c5 58%,#5044d6);border-radius:25px;padding:33px 36px;box-shadow:0 15px 37px rgba(40,45,163,.14);min-height:145px;overflow:hidden}
.hero::before{border:1px solid rgba(255,255,255,.12);box-shadow:0 0 0 50px rgba(255,255,255,.045),0 0 0 100px rgba(255,255,255,.025)}
.hero h1{font-size:clamp(29px,3vw,42px)}.hero .eyebrow{color:#a7f7e6}.hero .lead{color:#e1e6ff}.hero .button{background:#fff;border-color:#fff;color:#3336b7;font-weight:800}
.stat{border:1px solid #e7eafa;border-radius:19px;background:#fff;box-shadow:0 8px 25px #232d7009;position:relative;overflow:hidden;min-height:116px}
.stat::before{content:"";position:absolute;inset:0 0 auto;height:4px;background:linear-gradient(90deg,#5853de,#9e93f8)}
.stats>.stat:nth-child(4n+2){background:#f1fbff;border-color:#dcf1f8}.stats>.stat:nth-child(4n+2)::before{background:linear-gradient(90deg,#1c94c1,#5ed9df)}
.stats>.stat:nth-child(4n+3){background:#fff7f0;border-color:#fff0e2}.stats>.stat:nth-child(4n+3)::before{background:linear-gradient(90deg,#e39d3a,#ffcd72)}
.stats>.stat:nth-child(4n+4){background:#f4fbf3;border-color:#e2f3e1}.stats>.stat:nth-child(4n+4)::before{background:linear-gradient(90deg,#2eab88,#8bdbb4)}
.stat .label{font-size:11px;font-weight:750;color:#77819b}.stat .value{color:#282877;font-weight:850;letter-spacing:-1px}
.card{border-radius:20px;box-shadow:0 10px 24px #2932720a;border-top-width:4px;transition:transform .16s,box-shadow .16s}.card:hover{transform:translateY(-4px);box-shadow:0 16px 38px #31328720}
.card .avatar{border-radius:13px}.card-meta{font-size:11px}.section-head h2{font-size:21px;letter-spacing:-.5px;color:#272f59}
.tabbar{display:flex!important;grid-template-columns:none!important;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:thin;scrollbar-color:#c5caf1 transparent;gap:4px;padding:8px;border-radius:17px;box-shadow:0 9px 23px #393d8d08;position:sticky;top:5px;z-index:6}
.tab{min-width:max-content!important;flex:0 0 auto;display:inline-flex!important;flex-direction:row!important;padding:12px 14px!important;gap:9px!important;white-space:nowrap;font-size:12px!important;font-weight:760;border-radius:11px;transition:color .15s,background .15s}
.tab.active{background:linear-gradient(115deg,#252cb5,#574bd6)!important;color:#fff!important;box-shadow:0 7px 17px #4240c13a}
.tab-dot,.tab.active .tab-dot{width:23px!important;height:23px!important;border-radius:8px;display:grid;place-items:center;color:#6757d3;background:#eeebfc;font-size:12px!important}
.tab.active .tab-dot{background:#ffffff30!important;color:#fff!important}.tab-dot.summary::after{content:"⌂"}.tab-dot.clock::after{content:"◷"}.tab-dot.book::after{content:"?"}
.table-wrap{border:1px solid #e8ebf6;border-radius:18px;box-shadow:0 9px 24px #262c6b08}.table th{background:#f3f5ff;color:#737ca3;font-size:10px}.table tbody tr:hover{background:#f8f8ff}.table .amount{color:#2e3194}
.button.primary{background:linear-gradient(110deg,#2e37b9,#6052e1);color:#fff;border-color:#4038c8;box-shadow:0 6px 17px #3d3bb929}.button.primary:hover{filter:brightness(1.08)}.button{border-color:#e0e5f5}.button:hover{border-color:#7777ea;color:#3838c1}
.pill.ok{background:#e4f9ef;color:#16865d}.pill.pending{background:#fff3d9;color:#94610d}.pill.failed{background:#fff0f2;color:#c4465d}.footer{color:#8d97ad}
.quick-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:18px 0 26px}.quick-link{display:grid;position:relative;gap:5px;min-height:148px;border-radius:17px;border:1px solid #e7eaf8;background:#fff;padding:21px;transition:transform .15s,border-color .15s,box-shadow .15s;box-shadow:0 8px 22px #20247a09}.quick-link:hover{transform:translateY(-3px);border-color:#ada9f3;box-shadow:0 16px 30px #2b26971a}.quick-link strong{font-size:15px;color:#283160}.quick-link small{font-size:11px;color:#7785a0}.quick-icon{font-size:23px;color:#4f51ce;background:#eeedff;width:39px;height:39px;display:grid;place-items:center;border-radius:11px}.quick-arrow{position:absolute;right:19px;top:22px;color:#8a8ad8}
.quick-link:nth-child(3n+2) .quick-icon{background:#e5f9fc;color:#0793b4}.quick-link:nth-child(3n+3) .quick-icon{background:#fff1e5;color:#d68b2e}
.welcome-owner{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:26px 31px;margin-bottom:25px;background:linear-gradient(110deg,#ececff,#e9f9ff);border:1px solid #dce0ff;border-radius:21px}.welcome-owner h2{font-size:clamp(20px,2.5vw,29px);letter-spacing:-.6px;color:#2c2c83;margin:5px 0 8px}.welcome-owner p{font-size:12px;color:#6b78a1}.welcome-badge{font-size:10px;color:#6c5fcd;font-weight:830;letter-spacing:1.3px}
.guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:19px 0 35px}.guide-item{border:1px solid #e7e9f7;background:#fff;box-shadow:0 8px 25px #313a9707;padding:27px;border-radius:18px}.guide-item span{font-size:30px;font-weight:900;color:#5b55d1;letter-spacing:-1px}.guide-item h3{font-size:17px;color:#2a2e6d;margin:11px 0 7px}.guide-item p{font-size:13px;color:#6c7895;line-height:1.85}
.login-wrap{min-height:72vh}.login-panel{border-radius:24px;box-shadow:0 22px 65px #3438a126}.login-panel::before{height:7px;background:linear-gradient(90deg,#232da5,#6666f2,#38c7d2)}.login-icon{background:linear-gradient(120deg,#2229a4,#6261e6)}.login-panel h1{color:#282c73}.login-form .button.primary{box-shadow:0 7px 20px #343bb52b}
@media(max-width:900px){.quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.nav>a{padding:7px 9px}.topbar{gap:7px}}
@media(max-width:660px){.shell{padding:0 13px}.topbar{height:auto;min-height:68px;padding:10px 13px;gap:12px}.brand{font-size:16px}.nav{gap:2px;justify-content:flex-end}.nav>a{font-size:10px;padding:6px 7px}.nav .logout-form button{font-size:10px;padding:6px 9px}.hero{padding:24px 21px}.hero h1{font-size:31px}.tabbar{top:0;gap:5px;padding:7px}.tab{font-size:11px!important;padding:9px 11px!important}.quick-grid{grid-template-columns:1fr 1fr;gap:10px}.quick-link{min-height:134px;padding:15px}.quick-icon{width:34px;height:34px}.quick-link strong{font-size:13px}.quick-link small{font-size:10px}.guide-grid{grid-template-columns:1fr}.welcome-owner{align-items:flex-start;flex-direction:column;padding:20px}.welcome-owner .button{align-self:flex-start}.section-head h2{font-size:19px}}
@media(max-width:380px){.quick-grid{grid-template-columns:1fr}.nav>a{font-size:10px;padding:5px}}
@media(prefers-reduced-motion:reduce){.quick-link,.tab,.card,.button{transition:none!important}}


/* SANES CONSOLE NEO V1 — CSS-only premium dashboard, isolated from public landing */
:root{
  --neo-navy:#0f1930; --neo-side:#101b31; --neo-side-2:#1a2944;
  --neo-ink:#17213a;--neo-secondary:#718098;--neo-accent:#625bf3;
  --neo-cyan:#1ac4cd;--neo-orange:#ffab5e;--neo-lilac:#a898ff;
  --neo-bg:#f3f6fc;--neo-line:#e7ebf5;--neo-shadow:0 8px 30px rgba(23,40,80,.052);
  --neo-sidebar:256px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--neo-bg)!important;color:var(--neo-ink);font-family:Inter,"Segoe UI",system-ui,-apple-system,sans-serif;font-size:13px;line-height:1.65}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at 88% -10%,rgba(183,199,255,.19),transparent 42%)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #7c77ff!important;outline-offset:3px}
.shell.console-layout{max-width:none!important;width:100%;margin:0;padding:0!important;min-height:100vh;display:block}
.console-sidebar.topbar{position:fixed;z-index:25;left:0;top:0;bottom:0;width:var(--neo-sidebar);height:auto!important;min-height:100vh;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#40516f transparent;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;padding:27px 17px 19px!important;margin:0;border:0!important;border-radius:0!important;background:radial-gradient(circle at 100% 0,rgba(101,90,247,.18),transparent 38%),linear-gradient(170deg,#141f38 0%,#111a30 60%,#0c172a 100%)!important;box-shadow:12px 0 40px rgba(19,29,54,.09)!important}
.console-brand.brand{display:flex;align-items:center;gap:11px;padding:0 7px;min-height:54px;color:#fff!important;font-size:16px;letter-spacing:-.6px}
.console-brand .brand-icon{width:42px!important;height:42px!important;flex:none;display:grid;place-items:center;border-radius:14px!important;background:linear-gradient(135deg,#7768ff 0%,#5555e4 60%,#27bec9 100%)!important;box-shadow:0 9px 18px #4f56eb36;color:#fff;font-size:25px!important}
.brand-stack{display:flex;flex-direction:column;gap:1px}.brand-stack strong{font-weight:850;letter-spacing:.1px;font-size:15px;line-height:1.1}.brand-stack strong span{color:#9c9fff}.brand-stack small{color:#8794af;font-size:8px;letter-spacing:1.8px;font-weight:800}
.sidebar-divider{height:1px;background:rgba(255,255,255,.095);margin:26px 7px 21px}.sidebar-caption{margin:0 11px 11px;color:#677995;font-weight:800;letter-spacing:1.8px;font-size:10px}
.console-sidebar .nav{width:100%;display:flex;flex-direction:column;align-items:stretch;flex-wrap:nowrap;gap:5px;margin:0;padding:0;background:none}
.console-sidebar .nav>a{display:flex;align-items:center;gap:13px;min-height:44px;padding:9px 13px!important;border-radius:12px!important;background:transparent!important;color:#a4b2ce!important;font-weight:690!important;font-size:12px!important;border:1px solid transparent;transition:background .18s,color .18s,transform .18s}
.console-sidebar .nav>a::before{content:"◫";width:28px;height:28px;border-radius:9px;background:rgba(255,255,255,.055);display:grid;place-items:center;font-size:18px;font-weight:500;color:#93a3c3}
.console-sidebar .nav>a[href$="/app"]::before{content:"▦";font-size:17px}.console-sidebar .nav>a[href$="/app/panduan"]::before{content:"ⓘ";font-size:17px}
.console-sidebar .nav>a:hover{color:#fff!important;background:#ffffff14!important;transform:translateX(2px)}
.console-sidebar .nav>a[href$="/app"]{background:linear-gradient(90deg,rgba(105,94,255,.27),rgba(105,94,255,.09))!important;color:#fff!important;border-color:rgba(137,137,253,.15)}
.console-sidebar .nav>a[href$="/app"]::before{color:#fff;background:linear-gradient(145deg,#7465fa,#514ede)}
.console-sidebar .logout-form{margin:13px 0 0;width:100%;padding:12px 0 0;border-top:1px solid rgba(255,255,255,.08)}
.console-sidebar .logout-form .button{width:100%;justify-content:flex-start;padding:11px 14px!important;border:1px solid rgba(255,255,255,.09)!important;background:rgba(255,255,255,.035)!important;color:#a8b6cf!important;border-radius:12px;font-size:12px!important;box-shadow:none!important}
.console-sidebar .logout-form .button::before{content:"⇥";font-size:18px;margin-right:8px}.console-sidebar .logout-form .button:hover{background:#ffffff1a!important;color:#fff!important}
.sidebar-spacer{flex:1 1 20px;min-height:20px}
.sidebar-feature{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(140deg,#33346f 0%,#322e73 52%,#354d86 100%);border:1px solid #6962b455;border-radius:18px;padding:17px 16px 16px;min-height:155px;color:white;box-shadow:0 12px 24px #030a1e1e}
.sidebar-feature::before{content:"";position:absolute;width:125px;height:125px;border-radius:50%;background:#7f7aff38;top:-54px;right:-43px;z-index:-1}.feature-sparkle{position:absolute;right:18px;top:12px;font-size:35px;color:#d6baff}.feature-tag{display:block;font-size:9px;letter-spacing:2px;color:#b2b8ff;font-weight:800;margin-bottom:10px}.sidebar-feature strong{display:block;font-size:15px;line-height:1.25;max-width:160px;font-weight:800}.sidebar-feature p{color:#b9c3e3;line-height:1.6;font-size:10px;margin-top:10px;max-width:170px}
.sidebar-copyright{font-size:9px;font-weight:800;letter-spacing:.8px;color:#61718c;padding:20px 5px 0}.sidebar-copyright span{float:right;color:#72819c}
.console-right{margin-left:var(--neo-sidebar);min-width:0;min-height:100vh;display:flex;flex-direction:column}
.workspace-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:79px;padding:0 clamp(23px,3.4vw,55px);background:#ffffffd9;border-bottom:1px solid #e8ebf5;backdrop-filter:blur(12px);position:relative}
.toolbar-location{display:flex;align-items:center;gap:13px;color:#96a1b5;font-size:12px}.toolbar-location strong{font-weight:800;color:#253051}.toolbar-dot{width:10px;height:10px;border-radius:50%;box-shadow:0 0 0 5px #ebeaff;background:#645bf6;flex:none}.toolbar-separator{margin:0 11px;color:#c0c9d9}.toolbar-end{display:flex;align-items:center;gap:20px}.toolbar-label{font-weight:800;letter-spacing:1.8px;color:#95a0b5;font-size:9px}.toolbar-monogram{width:37px;height:37px;display:grid;place-items:center;background:#eeedff;color:#6359dd;border:1px solid #dedcfc;border-radius:12px;font-weight:900;font-size:15px}
.console-main.main{flex:1 0 auto;width:100%;max-width:1530px;margin:0 auto;min-width:0;padding:33px clamp(23px,3.4vw,55px) 58px!important}
.console-footer.footer{display:flex;justify-content:space-between;gap:15px;margin:0 clamp(23px,3.4vw,55px);padding:17px 0 22px!important;border-top:1px solid #e4eaf4;font-size:10px;color:#9ba7ba;text-align:left}.footer-dot{margin:0 6px;color:#cbd3df}
/* Premium hero — actual text and metrics are server-generated */
.console-main .hero{position:relative;display:flex;align-items:center;justify-content:space-between;gap:35px;isolation:isolate;overflow:hidden;min-height:196px;padding:34px 39px!important;margin:0 0 23px!important;background:linear-gradient(112deg,#252a66 0%,#37318c 47%,#514bc5 100%)!important;border:1px solid #5959ad;border-radius:23px!important;box-shadow:0 20px 45px #3332a220!important}
.console-main .hero::before{content:"";position:absolute;z-index:-1;width:340px;height:340px;right:-95px;top:-135px;border-radius:50%;border:1px solid #ffffff22;box-shadow:0 0 0 48px #ffffff09,0 0 0 96px #ffffff08,0 0 0 150px #ffffff06;background:radial-gradient(circle at 20% 60%,#ffffff17,transparent 63%);pointer-events:none}
.console-main .hero::after{content:"✦";position:absolute;z-index:-1;right:21%;bottom:-80px;color:#ffffff0d;font-size:260px;transform:rotate(-16deg);pointer-events:none}
.console-main .hero .eyebrow{color:#a7ecf1!important;font-size:10px;font-weight:840;letter-spacing:2.8px;margin-bottom:9px}.console-main .hero h1{font-weight:870;font-size:clamp(27px,3.3vw,45px)!important;letter-spacing:-1.7px;line-height:1.11;margin:0 0 12px;color:#fff!important}.console-main .hero .lead{color:#cbd5ff!important;max-width:650px;font-size:13px;line-height:1.75}
.console-main .hero .button{border:1px solid #ffffff38!important;background:#ffffffec!important;color:#36329b!important;box-shadow:0 8px 18px #16165a19!important;padding:12px 17px;border-radius:12px;font-size:12px;white-space:nowrap;position:relative}.console-main .hero .button:hover{background:#fff!important;transform:translateY(-2px)}
/* KPI tiles */
.console-main .stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:0 0 29px}
.console-main .stats .stat{position:relative;isolation:isolate;overflow:hidden;min-height:139px;padding:21px 22px 18px!important;background:#fff!important;border:1px solid #e5eaf4!important;border-radius:19px!important;box-shadow:var(--neo-shadow)!important;transition:transform .18s,box-shadow .18s}
.console-main .stats .stat::before{content:""!important;position:absolute!important;right:19px!important;top:17px!important;left:auto!important;width:43px!important;height:43px!important;border-radius:14px!important;background:linear-gradient(135deg,#ecebff,#ddd9ff)!important}
.console-main .stats .stat::after{content:"▦";position:absolute;right:31px;top:22px;font-weight:700;font-size:22px;color:#7268df}
.console-main .stats .stat:nth-child(4n+2)::before{background:linear-gradient(135deg,#e1faff,#c7f3f4)!important}.console-main .stats .stat:nth-child(4n+2)::after{content:"◈";color:#159daa}
.console-main .stats .stat:nth-child(4n+3)::before{background:linear-gradient(135deg,#fff3e3,#ffe1be)!important}.console-main .stats .stat:nth-child(4n+3)::after{content:"▣";color:#dd8b3b}
.console-main .stats .stat:nth-child(4n+4)::before{background:linear-gradient(135deg,#e5faec,#c4f3df)!important}.console-main .stats .stat:nth-child(4n+4)::after{content:"↗";color:#19a17a}
.console-main .stats .stat:hover{transform:translateY(-3px);box-shadow:0 14px 32px #1c285f15!important}
.console-main .stat .label{display:block;padding-right:49px;font-size:11px;letter-spacing:.25px;font-weight:720;color:#78849a!important}
.console-main .stat .value{font-variant-numeric:tabular-nums;display:block;font-size:clamp(24px,2.35vw,35px)!important;font-weight:880;letter-spacing:-1.2px;color:#182341!important;margin:11px 0 4px;line-height:1.2!important}
.console-main .stat-note{font-size:10px;color:#97a2b4}
/* Owner cards */
.console-main .section-head{display:flex;justify-content:space-between;align-items:center;margin:33px 0 17px;gap:13px}
.console-main .section-head h2{color:#17233d!important;font-size:22px!important;letter-spacing:-.7px;font-weight:830}.console-main .section-head .lead{font-size:12px;margin-top:7px;color:#8792a8}
.console-main .cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}
.console-main .cards .card{position:relative;overflow:hidden;padding:23px!important;background:#fff!important;border:1px solid #e7ebf5!important;border-radius:20px!important;box-shadow:var(--neo-shadow)!important;border-top:1px solid #e7ebf5!important;transition:transform .2s,box-shadow .2s,border-color .2s}
.console-main .cards .card::before{content:"";position:absolute;top:0;left:0;bottom:0;width:4px;background:linear-gradient(180deg,#655df4,#aca1ff)}
.console-main .cards .card:nth-child(6n+2)::before{background:linear-gradient(#19b6c5,#93ebdb)}.console-main .cards .card:nth-child(6n+3)::before{background:linear-gradient(#f6a663,#f6d091)}.console-main .cards .card:nth-child(6n+4)::before{background:linear-gradient(#69b582,#b8e8c4)}.console-main .cards .card:nth-child(6n+5)::before{background:linear-gradient(#ed84a7,#f0c5d0)}.console-main .cards .card:nth-child(6n+6)::before{background:linear-gradient(#568dec,#92bafa)}
.console-main .cards .card:hover{transform:translateY(-5px);border-color:#cecafd!important;box-shadow:0 19px 40px #2b37741a!important}
.console-main .cards .avatar{width:49px;height:49px;border-radius:15px!important;background:linear-gradient(145deg,#eceaff,#f4efff);color:#6a57d8;font-size:21px;font-weight:850}
.console-main .cards .card:nth-child(6n+2) .avatar{background:#e4f8fa;color:#169aa6}.console-main .cards .card:nth-child(6n+3) .avatar{background:#fff1e0;color:#c67d2f}.console-main .cards .card:nth-child(6n+4) .avatar{background:#e7f9ed;color:#36a36a}.console-main .cards .card:nth-child(6n+5) .avatar{background:#fff0f3;color:#cf6593}.console-main .cards .card:nth-child(6n+6) .avatar{background:#eaf2ff;color:#4e87df}
.console-main .cards .pill{background:#f3f5fb!important;color:#7685a3!important;border:1px solid #edf0f6;padding:5px 10px;font-size:10px;font-weight:800}
.console-main .cards .owner-name{margin-top:20px;font-size:19px;font-weight:850;letter-spacing:-.5px;color:#1b2540}
.console-main .cards .owner-id{font-size:10px;letter-spacing:.3px;color:#9da5b5}
.console-main .cards .card-meta{border-top:1px solid #edf1f7;margin-top:20px;padding-top:15px;color:#8994a6;font-size:11px}
.console-main .cards .card-meta strong{font-size:19px;font-weight:850;color:#273252}
/* Owner-only sidebar nav, fixed without JS */
.console-main .tabbar{position:fixed!important;z-index:30;left:17px;top:270px;width:calc(var(--neo-sidebar) - 34px);max-height:calc(100vh - 289px);overflow-x:hidden!important;overflow-y:auto!important;scrollbar-width:thin;scrollbar-color:#475774 transparent;display:flex!important;flex-direction:column!important;align-items:stretch;flex-wrap:nowrap!important;gap:3px!important;padding:17px 0 6px!important;margin:0!important;border:0!important;border-top:1px solid rgba(255,255,255,.09)!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.console-main .tabbar::before{content:"MENU PEMILIK";font-size:10px;font-weight:850;letter-spacing:1.8px;color:#6d819e;margin:0 12px 10px}
.console-main .tab{display:flex!important;flex-direction:row!important;align-items:center;justify-content:flex-start;gap:12px!important;min-width:0!important;min-height:43px;width:100%;padding:8px 12px!important;background:transparent!important;border:1px solid transparent;border-radius:11px!important;box-shadow:none!important;color:#9eafcd!important;font-size:12px!important;font-weight:660!important;white-space:nowrap;transition:background .17s,color .17s,transform .17s}
.console-main .tab:hover{background:#ffffff12!important;color:#fff!important;transform:translateX(2px)}
.console-main .tab.active{background:linear-gradient(90deg,#6e60f6,#5149c5)!important;border-color:#9987ff30;color:#fff!important;box-shadow:0 7px 17px #28216f35!important}
.console-main .tab-dot,.console-main .tab.active .tab-dot{display:grid!important;place-items:center!important;flex:none;width:29px!important;height:29px!important;border-radius:10px!important;font-size:0!important;color:#b4bcdf!important;background:#ffffff0c!important}
.console-main .tab.active .tab-dot{background:#ffffff20!important;color:#fff!important}
.console-main .tab-dot::after{font-size:16px!important;font-weight:600;line-height:1;color:inherit}
.console-main .tab-dot.summary::after{content:"⌂"}.console-main .tab-dot.package::after{content:"▣"}.console-main .tab-dot.users::after{content:"♧"}.console-main .tab-dot.wallet::after{content:"◉"}.console-main .tab-dot.alert::after{content:"⚑"}.console-main .tab-dot.chart::after{content:"▥"}.console-main .tab-dot.clock::after{content:"◷"}.console-main .tab-dot.book::after{content:"?"}
/* Table, forms, finance sections */
.console-main .tab-content{min-height:250px;margin-top:22px}.console-main .table-wrap{border-radius:19px!important;border:1px solid #e5eaf4!important;background:#fff!important;box-shadow:var(--neo-shadow)!important;overflow-x:auto}.console-main .table{min-width:690px;border-collapse:separate;border-spacing:0;font-size:12px}
.console-main .table thead th{position:sticky;top:0;z-index:1;background:#f8f9fe!important;font-size:10px;letter-spacing:1.1px;font-weight:800;color:#7787a4!important;padding:15px 18px;border-bottom:1px solid #ecf0f6;white-space:nowrap}
.console-main .table tbody td{background:transparent;line-height:1.6;color:#2b3755;padding:15px 18px;border-bottom:1px solid #eff2f8;vertical-align:middle;max-width:360px;overflow-wrap:anywhere}
.console-main .table tbody tr:nth-child(even){background:#fcfdff}.console-main .table tbody tr:hover{background:#f4f5ff!important}
.console-main .table .code{color:#655cdc;font-family:ui-monospace,"SFMono-Regular",Consolas,monospace;font-size:12px;font-weight:780}.console-main .table .amount{color:#1c365f;font-weight:850;font-variant-numeric:tabular-nums;white-space:nowrap}
.console-main .table .time{color:#8b98ae;font-size:11px}
.console-main .pill{padding:5px 10px;border-radius:8px;font-weight:770;font-size:10px;letter-spacing:.15px}.console-main .pill.ok{background:#e7f9f1!important;color:#158f6c!important}.console-main .pill.pending{background:#fff4dd!important;color:#9d6e1b!important}.console-main .pill.failed{background:#fff0f3!important;color:#bc4e66!important}
.console-main .filters{border:1px solid #e6ebf6;border-radius:17px;padding:18px!important;background:#fff;box-shadow:var(--neo-shadow);gap:12px}.console-main .filters label{color:#566681;font-weight:760;margin-bottom:8px}.console-main .filters input,.console-main .filters select{border:1px solid #dce4f1;border-radius:10px;background:#fbfcff;min-height:43px;padding:10px 13px}.console-main .filters :is(input,select):focus{border-color:#8e84fa;box-shadow:0 0 0 3px #eeedff}
.console-main .button{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:#fff;color:#485a7d;border:1px solid #e3e9f4;border-radius:11px;font-size:12px;font-weight:780;min-height:39px;padding:10px 14px;box-shadow:none;transition:transform .15s,background .15s,border-color .15s}
.console-main .button:hover{transform:translateY(-1px);background:#f5f4ff;color:#5c51db;border-color:#d4d0fb}.console-main .button.primary{color:#fff!important;background:linear-gradient(110deg,#6a5af1,#4c48d6)!important;border-color:#5c53e5!important;box-shadow:0 7px 16px #6456e82c}.console-main .button.primary:hover{filter:brightness(1.06)}
.console-main .balance-refresh-form .button{white-space:nowrap}.console-main .tab-content>form.balance-refresh-form{background:linear-gradient(107deg,#eeeefe,#ecfbff)!important;border-color:#dcdcf8!important;border-radius:17px!important;padding:16px 18px!important;margin:16px 0 19px!important;box-shadow:0 10px 26px #4949bc0a}
.console-main .notice{box-shadow:none;border-radius:13px;padding:15px 18px;font-size:12px}.console-main .notice.info{color:#515db3;border:1px solid #d9dff9;background:#f0f2ff}.console-main .notice.warn{color:#8d6c26;background:#fff8e9;border-color:#f5e7c9}.console-main .notice.error{color:#b34f64;background:#fff1f5;border-color:#f3d4dc}
.console-main .welcome-owner{background:linear-gradient(110deg,#eeefff,#e8f9ff);border:1px solid #d9defb;padding:28px 31px;border-radius:20px}.console-main .welcome-owner h2{font-size:25px;color:#272b69;font-weight:850}.console-main .welcome-badge{color:#6961d5}.console-main .quick-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.console-main .quick-link{min-height:151px;background:#fff;border:1px solid #e7ebf5;box-shadow:var(--neo-shadow);border-radius:18px;padding:20px}.console-main .quick-link strong{color:#233051;font-size:14px}.console-main .quick-link small{color:#8792a7}.console-main .quick-icon{background:#eceaff;color:#6d61e3;border-radius:12px;width:43px;height:43px}.console-main .quick-link:nth-child(3n+2) .quick-icon{background:#def8f9;color:#1da2b2}.console-main .quick-link:nth-child(3n+3) .quick-icon{background:#fff0e1;color:#dd8b42}.console-main .quick-link:hover{box-shadow:0 16px 34px #2b377018;transform:translateY(-3px)}
.console-main .guide-grid{gap:16px}.console-main .guide-item{border-radius:18px;border:1px solid #e7ebf5;background:#fff;box-shadow:var(--neo-shadow)}.console-main .guide-item span{color:#6d61e3}
.console-main .login-panel{border:1px solid #e5e8f4;box-shadow:0 28px 70px #22286316;border-radius:24px}.console-main .login-panel h1{color:#24284e}
/* Login pages: no navigation so do not display a misleading empty sidebar. */
body:has(.login-wrap) .console-sidebar{position:relative;width:auto;min-height:70px!important;height:auto!important;padding:15px 22px!important;box-shadow:none!important;overflow:visible}
body:has(.login-wrap) .console-sidebar .sidebar-divider,body:has(.login-wrap) .console-sidebar .sidebar-caption,body:has(.login-wrap) .console-sidebar .sidebar-feature,body:has(.login-wrap) .console-sidebar .sidebar-spacer,body:has(.login-wrap) .console-sidebar .sidebar-copyright{display:none}
body:has(.login-wrap) .console-right{margin-left:0}
body:has(.login-wrap) .workspace-toolbar{display:none}
body:has(.login-wrap) .console-main{padding:0 22px 48px!important}
body:has(.login-wrap) .console-footer{justify-content:center;text-align:center}
@media(max-width:1250px){:root{--neo-sidebar:234px}.console-main .cards{grid-template-columns:repeat(2,minmax(0,1fr))}.console-main .stats{gap:12px}.console-main .stats .stat{padding:19px 17px!important}.console-main .stat .value{font-size:27px!important}}
@media(max-width:940px){:root{--neo-sidebar:212px}.console-sidebar.topbar{padding-inline:12px!important}.console-main .tabbar{left:12px;width:calc(var(--neo-sidebar) - 24px)}.console-main .stats{grid-template-columns:repeat(2,minmax(0,1fr))}.console-main .hero{padding:27px 29px!important}.toolbar-label{display:none}}
@media(max-width:760px){
  .shell.console-layout{display:block}.console-sidebar.topbar{position:relative;top:auto;bottom:auto;left:auto;width:100%;min-height:0!important;height:auto!important;overflow:visible;padding:13px 16px!important;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-between;border-radius:0!important;box-shadow:none!important}
  .console-brand.brand{min-height:45px;padding:0}.console-brand .brand-icon{width:35px!important;height:35px!important;border-radius:10px!important;font-size:21px!important}.brand-stack strong{font-size:13px}.brand-stack small{font-size:7px}
  .console-sidebar .sidebar-divider,.console-sidebar .sidebar-caption,.console-sidebar .sidebar-feature,.console-sidebar .sidebar-spacer,.console-sidebar .sidebar-copyright{display:none!important}
  .console-sidebar .nav{width:auto;flex-direction:row;flex-wrap:wrap;gap:3px;justify-content:flex-end;align-items:center}.console-sidebar .nav>a{min-height:35px;padding:7px 9px!important;gap:4px;font-size:10px!important}.console-sidebar .nav>a::before{display:none}.console-sidebar .logout-form{width:auto;margin:0;padding:0;border:0}.console-sidebar .logout-form .button{font-size:10px!important;padding:8px 10px!important;min-height:34px}.console-sidebar .logout-form .button::before{display:none}
  .console-right{margin-left:0}.workspace-toolbar{min-height:55px;padding:0 17px}.toolbar-location{font-size:11px}.toolbar-end{gap:5px}.toolbar-monogram{width:30px;height:30px;border-radius:10px}
  .console-main.main{padding:20px 16px 40px!important}.console-main .hero{min-height:0;padding:25px 22px!important;border-radius:18px!important;gap:14px}.console-main .hero h1{font-size:30px!important}.console-main .hero .lead{font-size:12px}
  .console-main .cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.console-main .cards .card{padding:15px!important}.console-main .cards .owner-name{font-size:15px}.console-main .cards .avatar{width:38px;height:38px;border-radius:12px!important;font-size:17px}.console-main .cards .pill{font-size:9px;padding:4px 6px}.console-main .stats{gap:10px}
  .console-main .stats .stat{min-height:110px;padding:14px 15px!important;border-radius:15px!important}.console-main .stat .value{font-size:23px!important}.console-main .stat .label{font-size:10px;padding-right:27px}.console-main .stats .stat::before{right:12px!important;top:11px!important;width:31px!important;height:31px!important;border-radius:10px!important}.console-main .stats .stat::after{right:20px;top:14px;font-size:17px}
  .console-main .tabbar{position:relative!important;left:auto;top:auto;width:100%;max-height:none;overflow-x:auto!important;overflow-y:hidden!important;flex-direction:row!important;align-items:center;gap:6px!important;margin:4px 0 14px!important;padding:8px!important;border:1px solid #e7eaf4!important;border-radius:14px!important;background:#fff!important;box-shadow:var(--neo-shadow)!important}
  .console-main .tabbar::before{display:none}.console-main .tab{display:inline-flex!important;flex:0 0 auto;width:auto;min-width:max-content!important;min-height:38px;padding:7px 10px!important;color:#66738e!important;border-radius:9px!important;font-size:11px!important}.console-main .tab:hover{color:#4d4ab4!important;background:#f2f2ff!important}.console-main .tab.active{color:#fff!important}.console-main .tab-dot,.console-main .tab.active .tab-dot{width:25px!important;height:25px!important;background:#eeedff!important;color:#6e61db!important}.console-main .tab.active .tab-dot{background:#ffffff20!important;color:#fff!important}
  .console-main .quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.console-main .welcome-owner{padding:20px;flex-direction:column;align-items:flex-start}
  .console-footer.footer{margin:0 16px;padding:14px 0 20px!important;flex-direction:column;gap:3px;text-align:center}
}
@media(max-width:490px){
  .console-sidebar.topbar{align-items:flex-start;gap:8px}.console-sidebar .nav{justify-content:flex-start;width:100%}.console-sidebar .nav>a{font-size:10px!important}.console-sidebar .logout-form .button{min-height:35px}
  .console-main .hero{align-items:flex-start;flex-direction:column}.console-main .hero .button{width:100%;justify-content:center}.console-main .cards{grid-template-columns:1fr}.console-main .stats{grid-template-columns:repeat(2,minmax(0,1fr))}.console-main .section-head h2{font-size:19px!important}.console-main .quick-grid{grid-template-columns:1fr 1fr}.console-main .quick-link{min-height:133px;padding:14px}.console-main .quick-link strong{font-size:12px}.console-main .quick-link small{font-size:10px}.console-main .quick-icon{width:33px;height:33px;font-size:18px}
  .console-main .filters{padding:13px!important}.console-main .pager{flex-wrap:wrap}.console-main .pager span{flex-wrap:wrap}
}
@media(prefers-reduced-motion:reduce){.console-main .cards .card,.console-main .stats .stat,.console-main .button,.console-main .tab{transition:none!important;transform:none!important}}
/* Owner-specific desktop sidebar: avoid overlap with global navigation. */
@media(min-width:761px){
  body:has(.owner-hero) .sidebar-feature,body:has(.owner-hero) .sidebar-copyright{display:none!important}
  body:has(.owner-hero) .console-sidebar .nav>a:nth-of-type(3){display:none}
  body:has(.owner-hero) .console-main .tabbar{top:319px;max-height:calc(100vh - 333px)}
}
/* Financial figures can be longer than ordinary KPIs; prioritize readability. */
.console-main .tab-content > .stats.finance-stats .stat::before,
.console-main .tab-content > .stats.finance-stats .stat::after{display:none!important}
.console-main .tab-content > .stats.finance-stats .stat .label{padding-right:0}
.console-main .tab-content > .stats.finance-stats .stat .value{font-size:clamp(20px,2.1vw,30px)!important;overflow-wrap:anywhere}
.console-brand .brand-stack strong span{margin-left:3px}


/* SANES CONSOLE SLATE V2 — clean, neutral, accessible layout overrides.
   Scope: dashboard and owner panels only; no landing page or business logic. */
:root {
  --neo-sidebar: 242px;
  --neo-bg: #f5f7fa;
  --neo-ink: #172338;
  --neo-secondary: #64748b;
  --neo-accent: #2563eb;
  --neo-line: #e3e9f1;
  --neo-shadow: 0 2px 10px rgba(15, 23, 42, .035);
}
html, body { max-width: 100%; }
body {
  background: var(--neo-bg) !important;
  color: var(--neo-ink);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  font-size: 14px;
  line-height: 1.55;
}
body::before { display: none !important; }
.shell.console-layout, .console-right, .console-main.main, .console-main > * { min-width: 0; }
.shell.console-layout { overflow: clip; }
.console-sidebar.topbar {
  background: #fff !important;
  box-shadow: none !important;
  border-right: 1px solid var(--neo-line) !important;
  padding: 24px 15px 16px !important;
  scrollbar-color: #cbd5e1 transparent;
}
.console-brand.brand {
  padding: 0 8px;
  min-height: 46px;
  gap: 10px;
  color: #14243c !important;
  letter-spacing: 0;
}
.console-brand .brand-icon {
  background: #2563eb !important;
  box-shadow: none !important;
  border-radius: 10px !important;
  width: 36px !important;
  height: 36px !important;
  font-size: 0 !important;
}
.console-brand .brand-icon::before { content: 'S'; font: 700 17px/1 'Segoe UI', sans-serif; color: #fff; }
.brand-stack strong { font-size: 14px; font-weight: 750; letter-spacing: -.15px; }
.brand-stack strong span { color: #2563eb; }
.brand-stack small { font-size: 9px; letter-spacing: .9px; color: #8390a3; font-weight: 600; }
.sidebar-divider { background: #e5eaf1; margin: 21px 7px 17px; }
.sidebar-caption { color: #8591a1; font-weight: 700; letter-spacing: 1.05px; font-size: 10px; margin: 0 10px 9px; }
.console-sidebar .nav { gap: 3px; }
.console-sidebar .nav > a {
  color: #475569 !important;
  min-height: 42px;
  font-size: 13px !important;
  font-weight: 580 !important;
  padding: 10px 12px !important;
  gap: 10px;
  border-radius: 9px !important;
  transition: background .14s, color .14s;
}
.console-sidebar .nav > a::before { display: none !important; }
.console-sidebar .nav > a:hover {
  color: #1d4ed8 !important; background: #f1f5fa !important;
  transform: none !important;
}
.console-sidebar .nav > a[href$='/app'] {
  background: #edf4ff !important; color: #1d4ed8 !important;
  border-color: transparent !important;
  font-weight: 700 !important;
}
body:has(.owner-hero) .console-sidebar .nav > a[href$='/app'] {
  background: transparent !important;
  color: #475569 !important;
  font-weight: 580 !important;
}
.console-sidebar .logout-form { border-color: #e5eaf1; margin: 9px 0 0; padding-top: 9px; }
.console-sidebar .logout-form .button {
  background: #fff !important; color: #64748b !important;
  border: 1px solid #e3e9f1 !important;
  padding: 10px 12px !important;
  border-radius: 9px; font-size: 13px !important;
  font-weight: 600 !important;
}
.console-sidebar .logout-form .button::before { content: none !important; }
.console-sidebar .logout-form .button:hover { background: #f1f5fa !important; color: #334155 !important; }
.sidebar-feature { display: none !important; }
.sidebar-copyright { color: #94a3b8; font-size: 10px; font-weight: 500; letter-spacing: .1px; border-top: 1px solid #edf0f4; padding: 14px 5px 0; }
.sidebar-copyright span { color: #94a3b8; }
.workspace-toolbar {
  min-height: 64px;
  padding: 0 clamp(20px, 2.8vw, 42px);
  background: #fff;
  backdrop-filter: none;
  border-bottom: 1px solid var(--neo-line);
}
.toolbar-location { color: #64748b; font-size: 12px; }
.toolbar-location strong { color: #334155; font-weight: 650; }
.toolbar-dot { width: 7px; height: 7px; box-shadow: none; background: #2563eb; }
.toolbar-separator { color: #cbd5e1; margin: 0 7px; }
.toolbar-label { font-size: 10px; color: #94a3b8; letter-spacing: .65px; font-weight: 600; }
.toolbar-monogram { width: 32px; height: 32px; font-size: 12px; background: #eff5fd; color: #2563eb; border: 1px solid #e2eaf7; border-radius: 9px; }
.console-main.main {
  max-width: 1450px;
  padding: 26px clamp(20px, 2.8vw, 42px) 48px !important;
}
.console-footer.footer { margin: 0 clamp(20px, 2.8vw, 42px); padding: 14px 0 18px !important; font-size: 11px; color: #8995a6; }
/* Header: restrained B2B workspace; no ornamental gradients or oversized shapes. */
.console-main .hero {
  background: #fff !important;
  border: 1px solid #e2e8f0 !important;
  border-left: 4px solid #2563eb !important;
  min-height: 136px;
  padding: 24px 28px !important;
  border-radius: 12px !important;
  margin-bottom: 20px !important;
  box-shadow: none !important;
  gap: 16px;
}
.console-main .hero::before, .console-main .hero::after { display: none !important; }
.console-main .hero .eyebrow { font-size: 10px; letter-spacing: 1.25px; color: #2563eb !important; font-weight: 720; margin-bottom: 6px; }
.console-main .hero h1 { color: #172338 !important; font-size: clamp(24px, 2.5vw, 32px) !important; line-height: 1.2; letter-spacing: -.85px; font-weight: 740; margin: 0 0 6px; overflow-wrap: anywhere; }
.console-main .hero .lead { color: #64748b !important; font-size: 13px; line-height: 1.55; max-width: 680px; }
.console-main .hero .button {
  background: #fff !important; color: #2563eb !important;
  border: 1px solid #d2def0 !important;
  box-shadow: none !important;
  font-size: 13px; font-weight: 650;
  border-radius: 8px; min-height: 40px;
  padding: 9px 14px; white-space: nowrap;
}
.console-main .hero .button:hover { background: #eff6ff !important; transform: none !important; }
/* Consistent KPI sizing: no colored placeholder icon tiles. */
.console-main .stats { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 23px; }
.console-main .stats .stat {
  min-width: 0;
  min-height: 114px;
  padding: 19px 20px !important;
  border: 1px solid var(--neo-line) !important;
  background: #fff !important;
  border-radius: 12px !important;
  box-shadow: var(--neo-shadow) !important;
  transition: border-color .15s;
}
.console-main .stats .stat::before, .console-main .stats .stat::after { display: none !important; }
.console-main .stats .stat:hover { border-color: #cbd5e1 !important; transform: none !important; box-shadow: var(--neo-shadow) !important; }
.console-main .stat .label { padding-right: 0; color: #64748b !important; font-size: 12px; font-weight: 600; letter-spacing: 0; line-height: 1.35; }
.console-main .stat .value { font-size: clamp(23px, 2.3vw, 31px) !important; font-weight: 750; color: #0f172a !important; letter-spacing: -.7px; margin: 9px 0 3px; overflow-wrap: anywhere; }
.console-main .stat-note { font-size: 11px; color: #8592a5; }
/* Owner cards: uniform and predictable; one accent for all cards. */
.console-main .section-head { margin: 27px 0 13px; }
.console-main .section-head h2 { font-size: 19px !important; letter-spacing: -.4px; font-weight: 720; color: #172338 !important; }
.console-main .section-head .lead { font-size: 12px; color: #718096; }
.console-main .cards { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.console-main .cards .card {
  min-width: 0; min-height: 199px;
  padding: 20px !important; background: #fff !important;
  border: 1px solid var(--neo-line) !important;
  border-radius: 12px !important;
  box-shadow: var(--neo-shadow) !important;
  transition: border-color .15s, box-shadow .15s;
}
.console-main .cards .card::before, .console-main .cards .card::after { display: none !important; }
.console-main .cards .card:hover { border-color: #93b4e8 !important; box-shadow: 0 4px 12px rgba(15,23,42,.055) !important; transform: none !important; }
.console-main .cards .avatar,
.console-main .cards .card:nth-child(n) .avatar {
  background: #edf4ff !important; color: #2563eb !important;
  width: 42px; height: 42px; border-radius: 10px !important;
  box-shadow: none !important; font-size: 18px;
}
.console-main .cards .pill { font-size: 11px; font-weight: 600; background: #f8fafc !important; color: #64748b !important; padding: 5px 8px; }
.console-main .cards .owner-name { font-size: 16px; margin-top: 14px; font-weight: 750; letter-spacing: -.35px; }
.console-main .cards .owner-id { color: #8a96a9; font-size: 11px; letter-spacing: 0; overflow-wrap: anywhere; }
.console-main .cards .card-meta { margin-top: 15px; padding-top: 12px; font-size: 11px; }
.console-main .cards .card-meta strong { font-size: 17px; font-weight: 740; }
/* Bugfix: the old fixed-position owner menu overlapped sidebar and broke at smaller heights.
   Keep the owner menu in normal document flow instead of hardcoding top: 270/319px. */
.console-main .tabbar {
  position: relative !important;
  z-index: 1 !important;
  inset: auto !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  max-height: none !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 4px !important;
  margin: 0 0 16px !important;
  padding: 7px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  overscroll-behavior-x: contain;
  border: 1px solid var(--neo-line) !important;
  border-radius: 11px !important;
  background: #fff !important;
  box-shadow: none !important;
  scrollbar-width: thin;
  scrollbar-color: #cbd5e1 transparent;
}
.console-main .tabbar::before { display: none !important; }
.console-main .tab {
  min-width: max-content !important;
  flex: 0 0 auto;
  min-height: 37px;
  width: auto;
  padding: 8px 13px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: #64748b !important;
  font-size: 12px !important;
  font-weight: 620 !important;
  gap: 7px !important;
  border-radius: 8px !important;
  transform: none !important;
  transition: background .14s, color .14s;
}
.console-main .tab:hover { background: #f1f5f9 !important; color: #334155 !important; transform: none !important; }
.console-main .tab.active { background: #edf4ff !important; border-color: #dbeafe !important; color: #1d4ed8 !important; box-shadow: none !important; }
.console-main .tab-dot, .console-main .tab.active .tab-dot {
  width: 22px !important; height: 22px !important;
  background: #f1f5f9 !important;
  color: #64748b !important;
  border-radius: 6px !important;
}
.console-main .tab.active .tab-dot { background: #dbeafe !important; color: #1d4ed8 !important; }
.console-main .tab-dot::after { font-size: 13px !important; font-weight: 600; }
/* Table, forms, and monetary amounts. */
.console-main .tab-content { min-height: 200px; margin-top: 0; min-width: 0; }
.console-main .table-wrap {
  max-width: 100%; overflow-x: auto !important;
  border: 1px solid var(--neo-line) !important;
  border-radius: 11px !important;
  box-shadow: none !important;
  scrollbar-width: thin;
}
.console-main .table { min-width: 720px; width: 100%; font-size: 13px; }
.console-main .table thead th { background: #f8fafc !important; font-size: 11px; letter-spacing: .3px; color: #64748b !important; padding: 12px 14px; font-weight: 690; }
.console-main .table tbody td { padding: 12px 14px; font-size: 13px; line-height: 1.5; max-width: 350px; overflow-wrap: anywhere; color: #334155; }
.console-main .table tbody tr:nth-child(even) { background: #fcfdff; }
.console-main .table tbody tr:hover { background: #f3f7ff !important; }
.console-main .table .code { font-size: 12px; font-weight: 650; color: #1d4ed8; }
.console-main .table .amount { font-size: 13px; color: #172338; font-weight: 720; }
.console-main .table .time { font-size: 12px; }
.console-main .pill { border-radius: 7px; font-size: 11px; padding: 5px 9px; font-weight: 650; }
.console-main .pill.ok { background: #eef8f1 !important; color: #23764d !important; }
.console-main .pill.pending { background: #fff7e6 !important; color: #986a24 !important; }
.console-main .pill.failed { background: #fff0f0 !important; color: #b53e47 !important; }
.console-main .filters { border: 1px solid var(--neo-line); border-radius: 11px; padding: 15px !important; box-shadow: none; }
.console-main .filters label { font-size: 12px; font-weight: 650; color: #475569; }
.console-main .filters :is(input,select) { min-height: 41px; border-radius: 8px; background: #fff; font-size: 13px; }
.console-main .button { min-height: 39px; padding: 9px 13px; font-size: 13px; font-weight: 650; color: #334155; border-radius: 8px; box-shadow: none !important; }
.console-main .button:hover { transform: none !important; background: #f1f5f9; color: #1d4ed8; }
.console-main .button.primary { background: #2563eb !important; color: #fff !important; border: 1px solid #2563eb !important; box-shadow: none !important; }
.console-main .button.primary:hover { background: #1d4ed8 !important; filter: none; }
.console-main .balance-refresh-form .button { white-space: nowrap; }
.console-main .table .balance-refresh-form .button {
  background: #fff !important;
  color: #1d4ed8 !important;
  border: 1px solid #d3e1f3 !important;
  font-size: 12px !important;
  box-shadow: none !important;
}
.console-main .table .balance-refresh-form .button:hover {
  background: #eff6ff !important;
  color: #1d4ed8 !important;
  border-color: #b7cbed !important;
}
.console-main .tab-content > form.balance-refresh-form {
  background: #f8fafc !important;
  border: 1px solid var(--neo-line) !important;
  padding: 15px !important; border-radius: 11px !important;
}
.console-main .notice { border-radius: 9px; font-size: 13px; }
.console-main .welcome-owner { background: #fff !important; border: 1px solid var(--neo-line); border-left: 3px solid #2563eb; border-radius: 12px; padding: 22px 24px; }
.console-main .welcome-owner h2 { color: #172338; font-size: 21px; font-weight: 730; }
.console-main .welcome-badge { color: #2563eb; }
.console-main .quick-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.console-main .quick-link { min-height: 132px; padding: 18px; border: 1px solid var(--neo-line); border-radius: 12px; box-shadow: var(--neo-shadow); }
.console-main .quick-link:hover { transform: none; border-color: #93b4e8; box-shadow: var(--neo-shadow); }
.console-main .quick-link strong { color: #172338; font-size: 14px; font-weight: 690; }
.console-main .quick-link small { color: #64748b; font-size: 12px; }
.console-main .quick-icon, .console-main .quick-link:nth-child(n) .quick-icon { background: #edf4ff !important; color: #2563eb !important; border-radius: 9px; width: 36px; height: 36px; font-size: 18px; }
.console-main .guide-grid { gap: 14px; }
.console-main .guide-item { border-radius: 12px; box-shadow: none; }
.console-main .guide-item span { color: #2563eb; }
.console-main .login-panel { border-radius: 14px; box-shadow: 0 7px 25px rgba(15,23,42,.065); }
:focus-visible { outline: 2px solid #2563eb !important; outline-offset: 2px; }
/* All breakpoints use one navigation strategy; no desktop fixed tabbar reintroduced. */
@media (max-width: 1270px) {
  .console-main .cards { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .console-main .stats { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .console-main .quick-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 950px) {
  :root { --neo-sidebar: 220px; }
  .console-sidebar.topbar { padding: 20px 11px 14px !important; }
  .console-main .tabbar { left: auto !important; top: auto !important; width: 100% !important; }
  .toolbar-label { display: none; }
  .console-main .hero { padding: 21px 23px !important; }
}
@media (max-width: 760px) {
  .shell.console-layout { overflow: visible; }
  .console-sidebar.topbar {
    position: relative !important; height: auto !important;
    width: 100% !important; min-height: 0 !important;
    display: flex; flex-direction: column !important;
    align-items: stretch !important;
    gap: 8px;
    padding: 12px 16px !important;
    border-right: 0 !important; border-bottom: 1px solid var(--neo-line) !important;
  }
  .console-brand.brand { min-height: 36px; }
  .console-sidebar .nav {
    flex-direction: row;
    flex-wrap: nowrap;
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    justify-content: flex-start;
    gap: 5px;
    padding: 0 0 2px;
  }
  .console-sidebar .nav > a { flex: 0 0 auto; min-height: 35px; padding: 7px 10px !important; font-size: 12px !important; }
  .console-sidebar .logout-form { flex: 0 0 auto; width: auto; border: 0; margin: 0; padding: 0; }
  .console-sidebar .logout-form .button { min-height: 35px; padding: 6px 10px !important; font-size: 12px !important; }
  .console-right { margin-left: 0; }
  .workspace-toolbar { min-height: 49px; padding: 0 16px; }
  .toolbar-location { font-size: 11px; }
  .toolbar-monogram { width: 28px; height: 28px; }
  .console-main.main { padding: 17px 16px 35px !important; }
  .console-main .hero { padding: 20px 19px !important; border-radius: 11px !important; }
  .console-main .hero h1 { font-size: 25px !important; }
  .console-main .stats { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .console-main .stats .stat { min-height: 105px; padding: 15px !important; border-radius: 11px !important; }
  .console-main .stat .label { font-size: 11px; }
  .console-main .stat .value { font-size: 24px !important; }
  .console-main .cards { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .console-main .cards .card { padding: 16px !important; min-height: 175px; }
  .console-main .cards .owner-name { font-size: 15px; }
  .console-main .cards .avatar { width: 37px; height: 37px; font-size: 15px; }
  .console-main .tabbar { position: relative !important; margin: 0 0 14px !important; padding: 6px !important; }
  .console-main .tab { min-height: 34px; padding: 6px 10px !important; font-size: 12px !important; }
  .console-main .quick-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .console-main .quick-link { min-height: 120px; padding: 15px; }
  .console-footer.footer { margin: 0 16px; text-align: center; }
  .console-main .table-wrap { border-radius: 10px !important; }
}
@media (max-width: 460px) {
  .console-main .hero { flex-direction: column; align-items: flex-start; }
  .console-main .hero .button { width: 100%; }
  .console-main .cards { grid-template-columns: 1fr; }
  .console-main .quick-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .console-main .quick-icon { width: 32px; height: 32px; }
  .console-main .stat .value { font-size: 21px !important; }
  .console-main .section-head { gap: 8px; }
  .console-main .section-head h2 { font-size: 17px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .console-main .card, .console-main .button, .console-main .tab { transition: none !important; }
}

/* PESANAN ABDI MACOS MINIMAL V2 — refined macOS-inspired workspace, no external assets */
:root {
  --mac-bg: #edf0f4; --mac-app: #fbfbfc; --mac-white: #fff;
  --mac-ink: #22252c; --mac-muted: #777e8b; --mac-stroke: #e4e6eb;
  --mac-blue: #1475e6; --mac-soft: #eef5ff;
  --neo-sidebar: 224px; --neo-bg: var(--mac-bg); --neo-ink:var(--mac-ink);
  --neo-secondary: var(--mac-muted); --neo-accent:var(--mac-blue);
  --neo-line:var(--mac-stroke); --neo-shadow:0 3px 10px rgba(23,30,42,.025);
}
html { scroll-behavior: smooth; }
body { background:var(--mac-bg)!important; color:var(--mac-ink);
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",sans-serif!important;
  font-size:13px; font-weight:440; line-height:1.53; }
body::before{display:none!important}
:focus-visible {outline:2px solid var(--mac-blue)!important;outline-offset:2px}
.shell.console-layout.macos-app { max-width:1600px!important; width:calc(100% - 48px)!important;
  min-height:calc(100vh - 48px)!important; margin:24px auto!important;
  background:var(--mac-app); border:1px solid #d9dde5; border-radius:19px!important;
  overflow:clip; position:relative; box-shadow:0 22px 65px rgba(37,46,64,.095),0 2px 6px rgba(37,46,64,.035); }
.macos-app .console-sidebar.topbar {position:absolute; top:0;bottom:0;left:0;height:auto!important;
  min-height:100%!important;width:var(--neo-sidebar); overflow-y:auto;
  padding:20px 14px 20px!important;border:0!important;border-right:1px solid var(--mac-stroke)!important;
  border-radius:0!important;background:#f5f6f8!important;box-shadow:none!important; }
.macos-window-controls {display:flex;align-items:center;gap:8px;padding:0 10px 29px;flex:none}
.macos-window-controls i {width:11px;height:11px;display:block;border-radius:50%;background:#ff6058;border:1px solid #ea514b}
.macos-window-controls i:nth-child(2) {background:#ffbd2e;border-color:#e9ab25}
.macos-window-controls i:nth-child(3) {background:#29c941;border-color:#21b537}
.macos-app .console-brand.brand {padding:0 9px;min-height:45px;gap:10px;color:var(--mac-ink)!important}
.macos-app .console-brand .brand-icon {background:#23262e!important;color:#fff!important;
  width:37px!important;height:37px!important;font-size:0!important;border-radius:11px!important;
  font-weight:700;box-shadow:0 4px 8px rgba(29,36,49,.08)!important}
.macos-app .console-brand .brand-icon::before{content:"P";font-size:18px;font-weight:730}
.macos-app .brand-stack strong{font-size:14px;font-weight:730;letter-spacing:-.42px;line-height:1.1}
.macos-app .brand-stack strong span{color:#585e68!important;font-weight:530;margin:0!important}
.macos-app .brand-stack small {color:#969ca6;font-size:10px;letter-spacing:.05px;font-weight:530;margin-top:3px}
.macos-app .sidebar-divider {background:#e3e6ed;margin:22px 9px 18px}
.macos-app .sidebar-caption {margin:0 11px 10px;color:#949ba5;font-size:10px;letter-spacing:.9px;font-weight:680}
.macos-app .console-sidebar .nav{display:flex;flex-direction:column;align-items:stretch;gap:4px}
.macos-app .console-sidebar .nav>a{border:0!important;background:transparent!important;color:#535967!important;
  font-size:12.5px!important;font-weight:575!important;letter-spacing:-.1px;min-height:40px;padding:8px 12px!important;
  border-radius:9px!important;gap:9px;transform:none!important;white-space:nowrap}
.macos-app .console-sidebar .nav>a::before{display:block!important;content:""!important;
  background:transparent!important;box-shadow:inset 0 0 0 1.5px currentColor;
  border-radius:4px;width:15px;height:15px;flex:none;opacity:.56}
.macos-app .console-sidebar .nav>a:nth-child(2)::before{border-radius:50%}
.macos-app .console-sidebar .nav>a:nth-child(3)::before{border-radius:5px 5px 2px 2px}
.macos-app .console-sidebar .nav>a:hover{color:#1e293b!important;background:#e9edf3!important;transform:none!important}
.macos-app .console-sidebar .nav>a[href="/app#overview"],
.macos-app .console-sidebar .nav-owner>a:nth-child(2) {background:#e6edf8!important;color:#1e65bf!important;font-weight:700!important}
.macos-app .console-sidebar .logout-form {border-top:1px solid #e1e5eb;margin-top:14px;padding-top:13px}
.macos-app .console-sidebar .logout-form .button {color:#69707c!important;background:transparent!important;border:0!important;
  font-size:12px!important;min-height:38px;border-radius:8px!important;font-weight:570!important}
.macos-app .console-sidebar .logout-form .button::before {content:"⇥"!important;font-size:16px;margin-right:7px}
.macos-sidebar-note {display:flex;align-items:center;gap:8px;font-size:10.5px;color:#959ca5;padding:14px 10px 0;white-space:nowrap}
.macos-status-dot {width:7px;height:7px;background:#aab4c2;border-radius:50%;display:inline-block}
.macos-app .console-right {margin-left:var(--neo-sidebar); min-height:calc(100vh - 50px);}
.macos-app .workspace-toolbar {min-height:68px;background:#fbfbfc!important;border-bottom:1px solid #e7e9ef;
  padding:0 clamp(20px,2.8vw,40px);backdrop-filter:none}
.macos-location-icon {display:inline-flex;width:28px;height:28px;justify-content:center;align-items:center;
  background:#f0f1f4;border:1px solid #e7e8ec;border-radius:9px;color:#666b76;font-size:17px}
.macos-app .toolbar-location {color:#9298a3;font-size:12px;gap:11px}
.macos-app .toolbar-location strong{color:#4f5561;font-weight:630}
.macos-app .toolbar-separator{color:#bcc2cc;margin:0 5px}
.macos-app .toolbar-label {font-size:10px;font-weight:580;letter-spacing:.75px;color:#adb2bb}
.macos-app .toolbar-monogram {background:#f3f4f7!important;color:#565c67!important;border:1px solid #e4e6ea;
  width:30px;height:30px;font-size:12px;border-radius:50%}
.macos-app .console-main.main {max-width:1320px; padding:30px clamp(21px,3vw,43px) 45px!important;}
.macos-app .console-footer.footer {color:#a1a7b2; font-size:11px;margin:0 clamp(21px,3vw,43px);
  border-color:#e7e9ec;padding:15px 0 21px!important}
/* Page titles remain calm, flat and readable */
.macos-app .console-main .hero{background:transparent!important;border:0!important;border-left:0!important;
  padding:7px 0 8px!important;margin:0 0 24px!important;min-height:106px;border-radius:0!important;
  box-shadow:none!important;align-items:center;gap:18px;overflow:visible}
.macos-app .console-main .hero::before,.macos-app .console-main .hero::after{display:none!important}
.macos-app .console-main .hero .eyebrow {font-size:10px!important;color:#8b93a1!important;
  letter-spacing:1.1px;font-weight:690;margin-bottom:7px}
.macos-app .console-main .hero h1{font-size:clamp(26px,2.6vw,34px)!important;font-weight:760!important;
  letter-spacing:-1.1px;line-height:1.2;color:#242a35!important;margin-bottom:6px}
.macos-app .console-main .hero .lead{font-size:12.5px;color:#7c8491!important;line-height:1.55;max-width:750px}
.macos-app .console-main .hero .button{border:1px solid #e1e4eb!important;background:#fff!important;
  color:#454e5d!important;border-radius:10px;font-size:12px;font-weight:580;padding:9px 13px;min-height:38px;
  box-shadow:0 2px 5px rgba(50,60,80,.02)!important}
.macos-app .console-main .hero .button:hover{background:#f3f5fa!important;color:#175db6!important}
/* Dashboard KPIs as four consistent white macOS tiles */
.macos-app .console-main .stats {gap:12px;margin-bottom:24px;grid-template-columns:repeat(4,minmax(0,1fr))}
.macos-app .console-main .stats .stat{border:1px solid #e7e9ee!important;
  background:#fff!important;border-radius:13px!important;min-height:112px;padding:20px 20px 18px!important;
  box-shadow:0 2px 8px rgba(28,39,56,.024)!important;transform:none!important}
.macos-app .console-main .stats .stat::before,.macos-app .console-main .stats .stat::after {display:none!important}
.macos-app .console-main .stat .label {color:#828a96!important;font-size:11.5px;letter-spacing:0;font-weight:575}
.macos-app .console-main .stat .value {color:#262d37!important;font-size:clamp(23px,2.3vw,30px)!important;
  font-weight:725;margin:10px 0 2px;line-height:1.2!important;letter-spacing:-.75px;font-variant-numeric:tabular-nums}
.macos-app .console-main .stat-note{color:#a0a6b1;font-size:10.5px}
.macos-app .console-main .section-head {margin:26px 0 13px;gap:9px;flex-wrap:wrap}
.macos-app .console-main .section-head h2{font-size:18px!important;color:#313844!important;letter-spacing:-.5px;font-weight:720}
.macos-app .console-main .section-head .lead{font-size:11.5px;color:#89919e}
/* Cards: monochrome avatars, no neon gradients */
.macos-app .console-main .cards {grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.macos-app .console-main .cards .card {min-height:160px;padding:16px!important;border:1px solid #e5e8ee!important;
  border-radius:13px!important;background:#fff!important;box-shadow:0 3px 12px rgba(30,42,58,.024)!important;
  transition:border-color .15s,box-shadow .15s}
.macos-app .console-main .cards .card::before,.macos-app .console-main .cards .card::after {display:none!important}
.macos-app .console-main .cards .card:hover {transform:none!important;border-color:#c5cdd7!important;
  box-shadow:0 5px 17px rgba(30,42,58,.07)!important}
.macos-app .console-main .cards .avatar,.macos-app .console-main .cards .card:nth-child(n) .avatar {
  width:36px;height:36px;background:#eff1f5!important;color:#646d7e!important;
  border-radius:11px!important;box-shadow:none!important;font-size:15px;font-weight:700}
.macos-app .console-main .cards .pill{background:#f6f7f9!important;color:#7c8796!important;font-size:10px;
  font-weight:560;padding:4px 8px;border:1px solid #ecedf1}
.macos-app .console-main .cards .owner-name {font-size:14px;color:#29303a;font-weight:720;margin-top:12px}
.macos-app .console-main .cards .owner-id {color:#a1a7af;font-size:10px}
.macos-app .console-main .cards .card-meta {margin-top:12px;padding-top:10px;border-color:#edf0f4}
.macos-app .console-main .cards .card-meta strong{font-size:15px;font-weight:720;color:#333a45}
/* Owner navigation: flat six-item row */
.macos-app .console-main .tabbar.mac-owner-tabs {
  position:relative!important;inset:auto!important;z-index:15!important;overflow:visible!important;
  display:flex!important;flex-direction:row!important;align-items:center!important;flex-wrap:wrap!important;
  width:100%!important;max-width:100%!important;max-height:none!important;
  background:#edeff3!important;border:1px solid #e4e6eb!important;border-radius:12px!important;
  padding:6px!important;gap:4px!important;margin:2px 0 20px!important;
  box-shadow:inset 0 1px 2px rgba(25,35,50,.025)!important}
.macos-app .console-main .tabbar::before {display:none!important}
.macos-app .console-main .tabbar.mac-owner-tabs>.tab,
.macos-app .console-main .mac-finance-trigger {
  position:relative;display:inline-flex!important;align-items:center;justify-content:center;gap:7px!important;
  flex:0 0 auto;min-width:0!important;min-height:37px; padding:8px 13px!important;
  border:1px solid transparent!important;border-radius:9px!important;
  color:#646d7b!important;background:transparent!important;font-size:12px!important;font-weight:630!important;
  text-align:center;white-space:nowrap;transition:background .15s,color .15s;cursor:pointer;transform:none!important}
.macos-app .console-main .tabbar .tab.active,.macos-app .console-main .mac-finance-trigger.active {
  background:#fff!important;color:#2871c1!important;border-color:#e3e8f0!important;
  box-shadow:0 1px 5px rgba(35,45,60,.07)!important}
.macos-app .console-main .tabbar .tab:hover {background:#f9fafb!important;color:#293e56!important;transform:none!important}
.macos-app .console-main .tab-dot,.macos-app .console-main .tab.active .tab-dot {
  width:18px!important;height:18px!important;border-radius:5px!important;
  background:transparent!important;color:#818997!important;font-size:0!important}
.macos-app .console-main .tab.active .tab-dot{color:#2a74c8!important}
.macos-app .console-main .tab-dot::after{font-size:15px!important;font-weight:500}
.macos-app .console-main .mac-finance{display:inline-flex;position:relative;flex:0 0 auto;align-items:center;z-index:20}
.macos-app .console-main .mac-finance-trigger {list-style:none;user-select:none}
.macos-app .console-main .mac-finance-trigger::-webkit-details-marker {display:none}
.macos-app .console-main .mac-chevron {margin-left:4px;transform:translateY(-2px);color:#939aa6;font-size:16px;line-height:1}
.macos-app .console-main .mac-finance[open] .mac-chevron {transform:rotate(180deg) translateY(2px)}
.macos-app .console-main .mac-finance-subnav {position:absolute;min-width:202px;top:calc(100% + 9px);left:0;
  padding:6px;display:flex;flex-direction:column;align-items:stretch;gap:3px;background:#fff;
  border:1px solid #e0e4ea;border-radius:12px;box-shadow:0 14px 35px rgba(32,42,60,.14)}
.macos-app .console-main .mac-finance-subnav::before{content:"";position:absolute;top:-7px;left:25px;
  background:#fff;width:12px;height:12px;transform:rotate(45deg);border-top:1px solid #e0e4ea;border-left:1px solid #e0e4ea}
.macos-app .console-main .mac-finance-subnav .tab {padding:9px 12px!important;min-height:37px;
  border-radius:8px!important;font-size:12px!important;color:#545d6b!important;font-weight:550!important;
  display:flex!important;align-items:center;justify-content:flex-start;gap:9px!important;min-width:0!important}
.macos-app .console-main .mac-finance-subnav .tab.active {background:#eff5ff!important;color:#1764bb!important;border-color:transparent!important;box-shadow:none!important}
.macos-app .console-main .mac-finance-subnav .tab:hover {background:#f3f5f8!important;color:#1a3653!important}
.macos-app .console-main .mac-nav-spacer{flex:1 1 0;min-width:3px}
.macos-app .console-main .mac-owner-tabs>.tab:last-child {margin-left:auto;color:#87909d!important}
/* Content surfaces */
.macos-app .console-main .tab-content {min-height:220px;margin-top:0}
.macos-app .console-main .table-wrap {overflow-x:auto!important;max-width:100%;
  background:#fff!important;border:1px solid #e4e7ed!important;border-radius:12px!important;box-shadow:none!important}
.macos-app .console-main .table {width:100%;min-width:690px;font-size:12px}
.macos-app .console-main .table thead th {background:#f8f9fb!important;color:#8a929e!important;
  font-size:10px;letter-spacing:.5px;text-transform:uppercase;padding:13px 15px;font-weight:670;
  border-bottom:1px solid #e8ebf0}
.macos-app .console-main .table tbody td{padding:13px 15px;font-size:12px;color:#48505e;
  background:#fff!important;border-bottom:1px solid #f0f1f4}
.macos-app .console-main .table tbody tr:nth-child(even) td {background:#fcfcfd!important}
.macos-app .console-main .table tbody tr:hover td{background:#f6f9fd!important}
.macos-app .console-main .table .code{color:#286bbd;font-size:11.5px}
.macos-app .console-main .table .amount{color:#2d3541;font-weight:700;font-size:12px}
.macos-app .console-main .pill{font-size:10px;padding:5px 8px;border-radius:7px;font-weight:620}
.macos-app .console-main .pill.ok {background:#edf7f0!important;color:#31744f!important}
.macos-app .console-main .pill.pending{background:#fff7e6!important;color:#946e25!important}
.macos-app .console-main .pill.failed{background:#fff0f1!important;color:#a84854!important}
.macos-app .console-main .button {background:#fff;color:#50596a;font-size:12px;font-weight:610;
  min-height:38px;border:1px solid #dfe3ea;border-radius:9px;padding:8px 13px;box-shadow:none!important}
.macos-app .console-main .button:hover{background:#f4f7fa!important;color:#1764bb!important;transform:none!important}
.macos-app .console-main .button.primary{background:#1475e6!important;color:#fff!important;border-color:#1475e6!important}
.macos-app .console-main .button.primary:hover{background:#0965d1!important}
.macos-app .console-main .filters{border:1px solid #e6e9ef;background:#fff;padding:15px!important;border-radius:12px;gap:10px}
.macos-app .console-main .filters :is(input,select){border:1px solid #dce1e8;border-radius:8px;background:#fff;font-size:12px}
.macos-app .console-main .tab-content > form.balance-refresh-form {border:1px solid #e3e8ef!important;
  background:#f8fafd!important;border-radius:12px!important;padding:15px!important;margin:15px 0 20px!important}
.macos-app .console-main .table .balance-refresh-form .button{border-color:#d9e3f0!important;background:#fff!important;color:#1767c5!important;font-size:12px!important}
.macos-app .console-main .welcome-owner {background:#fff!important;border:1px solid #e6e9ef!important;
  border-radius:13px;padding:22px 24px;border-left:0!important}
.macos-app .console-main .welcome-owner h2{font-size:21px;color:#29303b;font-weight:740}
.macos-app .console-main .welcome-badge{color:#858f9d;font-size:10px;letter-spacing:1px}
.macos-app .console-main .quick-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.macos-app .console-main .quick-link{min-height:123px;padding:17px;border-radius:12px;
  border:1px solid #e7e9ed;background:#fff;box-shadow:none!important}
.macos-app .console-main .quick-link:hover{border-color:#c3ceda;transform:none!important}
.macos-app .console-main .quick-link strong{font-size:13px;color:#343b47}
.macos-app .console-main .quick-link small{font-size:11px;color:#858e9b}
.macos-app .console-main .quick-icon,.macos-app .console-main .quick-link:nth-child(n) .quick-icon {
  width:34px;height:34px;border-radius:9px;background:#f0f2f6!important;color:#737e8e!important;font-size:17px}
.macos-app .console-main .guide-item{border-radius:12px;box-shadow:none!important}
/* New admin anchors: real data, no fake worker-status metrics */
.macos-app .mac-section {margin:30px 0 8px;scroll-margin-top:18px}
.macos-app #overview,.macos-app #pemilik{scroll-margin-top:18px}
.macos-app .mac-system-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.macos-app .mac-system-card{display:flex;align-items:flex-start;gap:14px;background:#fff;
  border:1px solid #e6e9ef;border-radius:13px;padding:19px;min-width:0}
.macos-app .mac-system-symbol{display:grid;place-items:center;flex:none;width:39px;height:39px;
  background:#f0f3f7;color:#6c7989;font-size:18px;border-radius:10px}
.macos-app .mac-system-card .label{display:block;color:#8b93a0;font-size:11px;margin-bottom:6px}
.macos-app .mac-system-card strong{display:block;color:#344050;font-size:17px;font-weight:720}
.macos-app .mac-system-card p{font-size:11px;color:#88909d;line-height:1.65;margin-top:7px}
.macos-app .login-panel{border:1px solid #e1e5ec;border-radius:16px;box-shadow:0 12px 35px rgba(20,30,50,.065)}
/* The login remains full-width because it is not an authenticated workspace */
body:has(.login-wrap) .shell.console-layout.macos-app {max-width:720px!important;min-height:0!important;margin:40px auto!important}
body:has(.login-wrap) .macos-app .console-sidebar.topbar{position:relative;width:100%!important;min-height:0!important;display:flex;flex-direction:column;
  border-right:0!important;border-bottom:1px solid #e7e9ef!important;padding:13px 20px!important}
body:has(.login-wrap) .macos-window-controls{padding-bottom:7px}
body:has(.login-wrap) .macos-app .sidebar-divider,body:has(.login-wrap) .macos-app .sidebar-caption,
body:has(.login-wrap) .macos-app .nav,body:has(.login-wrap) .macos-sidebar-note{display:none!important}
body:has(.login-wrap) .macos-app .console-right{margin-left:0!important;min-height:0}
body:has(.login-wrap) .macos-app .workspace-toolbar{display:none}
body:has(.login-wrap) .macos-app .console-main.main{padding:24px 22px 35px!important}
@media (max-width:1220px){
  .macos-app .console-main .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .macos-app .console-main .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .macos-app .console-main .quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:920px){
  :root{--neo-sidebar:195px}
  .macos-app .console-sidebar.topbar{padding:17px 10px!important}
  .macos-app .console-main .tabbar.mac-owner-tabs>.tab,.macos-app .console-main .mac-finance-trigger{padding:8px 10px!important;font-size:11px!important}
  .macos-app .console-main .tab-dot{display:none!important}
  .macos-app .toolbar-label{display:none}
}
@media (max-width:760px){
  .shell.console-layout.macos-app{width:100%!important;min-height:100vh!important;margin:0!important;border:0!important;border-radius:0!important;overflow:visible}
  .macos-app .console-sidebar.topbar {position:relative!important;top:auto;bottom:auto;left:auto;
    width:100%!important;min-height:0!important;height:auto!important;padding:12px 16px!important;
    border-right:0!important;border-bottom:1px solid #e5e8ee!important;overflow:visible;
    display:flex;flex-direction:column;align-items:stretch;gap:7px}
  .macos-app .macos-window-controls{padding:0 0 5px 2px;gap:6px}
  .macos-app .macos-window-controls i{width:9px;height:9px}
  .macos-app .console-brand.brand{min-height:31px}
  .macos-app .brand-stack small{font-size:9px}
  .macos-app .sidebar-divider,.macos-app .sidebar-caption,.macos-sidebar-note{display:none!important}
  .macos-app .console-sidebar .nav {display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;
    width:100%;overflow-x:auto;overflow-y:hidden;gap:4px;padding:1px 0 3px}
  .macos-app .console-sidebar .nav>a{flex:0 0 auto!important;min-height:33px;padding:7px 10px!important;font-size:11px!important}
  .macos-app .console-sidebar .nav>a::before{display:none!important}
  .macos-app .console-sidebar .logout-form{flex:0 0 auto;border:0;margin:0;padding:0;width:auto}
  .macos-app .console-sidebar .logout-form .button{min-height:33px!important;padding:7px 11px!important;font-size:11px!important}
  .macos-app .console-right{margin-left:0;min-height:0}
  .macos-app .workspace-toolbar{min-height:51px;padding:0 16px}
  .macos-app .toolbar-location{font-size:11px}
  .macos-app .toolbar-monogram{width:27px;height:27px}
  .macos-app .console-main.main{padding:22px 16px 38px!important}
  .macos-app .console-main .hero{gap:14px;min-height:0;margin-bottom:22px!important;padding:0 0 4px!important}
  .macos-app .console-main .hero h1{font-size:25px!important}
  .macos-app .console-main .stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .macos-app .console-main .stats .stat{min-height:103px;padding:16px!important}
  .macos-app .console-main .cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .macos-app .console-main .cards .card{min-height:154px;padding:14px!important}
  .macos-app .console-main .tabbar.mac-owner-tabs{flex-wrap:nowrap!important;overflow:visible!important;padding:6px!important;gap:2px!important}
  .macos-app .console-main .tabbar.mac-owner-tabs>.tab,.macos-app .console-main .mac-finance-trigger{padding:7px 7px!important;min-height:34px;font-size:10px!important}
  .macos-app .console-main .mac-finance-subnav{left:-45px;min-width:170px}
  .macos-app .console-main .mac-nav-spacer{display:none}
  .macos-app .console-main .mac-owner-tabs>.tab:last-child{display:none!important}
  .macos-app .console-footer.footer{margin:0 16px;align-items:center;text-align:center;flex-direction:column;gap:3px}
  .macos-app .mac-system-grid{grid-template-columns:1fr}
}
@media (max-width:460px){
  .macos-app .console-main .hero{flex-direction:column;align-items:flex-start}
  .macos-app .console-main .hero .button{width:100%}
  .macos-app .console-main .stats .stat{min-height:100px;padding:13px!important}
  .macos-app .console-main .stat .label{font-size:11px}
  .macos-app .console-main .stat .value{font-size:23px!important}
  .macos-app .console-main .cards{grid-template-columns:1fr}
  .macos-app .console-main .quick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .macos-app .console-main .quick-link{min-height:118px;padding:13px}
  .macos-app .console-main .tabbar.mac-owner-tabs>.tab,.macos-app .console-main .mac-finance-trigger{padding:6px 5px!important;font-size:9.7px!important}
  .macos-app .console-main .tabbar.mac-owner-tabs{gap:0!important}
  .macos-app .console-main .mac-finance-subnav{left:-22px}
}
@media(prefers-reduced-motion:reduce){.macos-app *, .macos-app *::before, .macos-app *::after{transition:none!important;animation:none!important}}
/* Financial sub-navigation is a second segmented row, never an overlay on top of saldo data. */
.macos-app .console-main .mac-owner-tabs:has(.mac-finance[open]){margin-bottom:70px!important}
.macos-app .console-main .mac-finance{position:static!important}
.macos-app .console-main .mac-finance:not([open])>.mac-finance-subnav{display:none!important}
.macos-app .console-main .mac-finance-subnav{position:absolute;top:calc(100% + 10px);left:0;right:0;
  width:100%;min-width:0;display:flex;flex-direction:row;align-items:center;gap:5px;
  padding:5px;background:#f0f2f5;border:1px solid #e5e8ed;border-radius:10px;
  box-shadow:none;z-index:10}
.macos-app .console-main .mac-finance-subnav::before{display:none!important}
.macos-app .console-main .mac-finance-subnav .tab{flex:1 1 0;justify-content:center;min-width:0!important;
  white-space:nowrap;min-height:33px;padding:7px 10px!important}
.macos-app .console-main .mac-finance-subnav .tab.active{background:#fff!important;
  color:#226dc6!important;box-shadow:0 1px 4px rgba(25,45,65,.05)!important}
@media(max-width:760px){
  .macos-app .console-main .mac-finance-subnav{left:0!important;right:0!important;min-width:0!important}
  .macos-app .console-main .mac-owner-tabs>.tab:last-child{display:inline-flex!important}
}


/* V2 owner tabs: put Saldo, Denda, Iklan back into the primary row and remove Ringkasan. */
.macos-app .console-main .mac-finance, .macos-app .console-main .mac-finance-subnav, .macos-app .console-main .mac-chevron{display:none!important}
.macos-app .console-main .mac-owner-tabs{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr));align-items:stretch!important}
.macos-app .console-main .mac-owner-tabs > .tab{width:100%;min-width:0!important}
@media (max-width:920px){.macos-app .console-main .mac-owner-tabs{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media (max-width:520px){.macos-app .console-main .mac-owner-tabs{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
/* Brand rename */
.macos-app .toolbar-monogram::before{content:none!important}
.macos-app .console-main .mac-owner-tabs>.tab:last-child{margin-left:0!important;display:inline-flex!important;color:#636c79!important}



/* PESANAN ABDI HORIZONTAL MENU V3 — compact macOS-style owner navigation */
.macos-app .console-main nav.tabbar.mac-owner-tabs {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  justify-content: flex-start !important;
  align-items: stretch !important;
  gap: 7px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 54px !important;
  margin: 2px 0 20px !important;
  padding: 6px !important;
  background: linear-gradient(115deg, #e6edfa 0%, #eef3fc 54%, #f0f3fb 100%) !important;
  border: 1px solid #d8e1f0 !important;
  border-radius: 13px !important;
  box-shadow: inset 0 1px 2px rgba(29, 67, 129, .045) !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #c8d6ee transparent;
}
.macos-app .console-main nav.tabbar.mac-owner-tabs::before,
.macos-app .console-main nav.tabbar.mac-owner-tabs::after {
  display: none !important;
}
.macos-app .console-main nav.tabbar.mac-owner-tabs > a.tab {
  display: inline-flex !important;
  position: relative !important;
  box-sizing: border-box !important;
  flex: 1 0 98px !important;
  width: auto !important;
  min-width: 98px !important;
  max-width: none !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 9px 12px !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 8px !important;
  border: 1px solid transparent !important;
  border-radius: 9px !important;
  background: transparent !important;
  color: #50617c !important;
  font: 600 12.5px/1.3 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  text-decoration: none !important;
  text-align: center !important;
  white-space: nowrap !important;
  box-shadow: none !important;
  transform: none !important;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease !important;
}
.macos-app .console-main nav.tabbar.mac-owner-tabs > a.tab:hover {
  background: rgba(255, 255, 255, .68) !important;
  color: #2459b0 !important;
}
.macos-app .console-main nav.tabbar.mac-owner-tabs > a.tab.active,
.macos-app .console-main nav.tabbar.mac-owner-tabs > a.tab[aria-current="page"] {
  background: #ffffff !important;
  color: #1e5ec4 !important;
  border: 1px solid #d7e3f8 !important;
  box-shadow: 0 2px 7px rgba(44, 85, 148, .10), inset 0 -2px #4784ed !important;
  font-weight: 700 !important;
}
.macos-app .console-main nav.tabbar.mac-owner-tabs > a.tab .tab-dot {
  display: inline-flex !important;
  flex: 0 0 17px !important;
  align-items: center !important;
  justify-content: center !important;
  width: 17px !important;
  height: 17px !important;
  margin: 0 !important;
  color: #6683ab !important;
}
.macos-app .console-main nav.tabbar.mac-owner-tabs > a.tab.active .tab-dot,
.macos-app .console-main nav.tabbar.mac-owner-tabs > a.tab[aria-current="page"] .tab-dot {
  color: #2a6dd1 !important;
}
@media (max-width: 1100px) {
  .macos-app .console-main nav.tabbar.mac-owner-tabs { gap: 5px !important; }
  .macos-app .console-main nav.tabbar.mac-owner-tabs > a.tab {
    flex: 0 0 auto !important;
    min-width: 106px !important;
    padding: 9px 13px !important;
  }
}
@media (max-width: 760px) {
  .macos-app .console-main nav.tabbar.mac-owner-tabs {
    flex-wrap: nowrap !important;
    min-height: 50px !important;
    border-radius: 12px !important;
    padding: 5px !important;
  }
  .macos-app .console-main nav.tabbar.mac-owner-tabs > a.tab {
    display: inline-flex !important;
    min-width: 106px !important;
    min-height: 38px !important;
    height: 38px !important;
    font-size: 12px !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .macos-app .console-main nav.tabbar.mac-owner-tabs > a.tab { transition: none !important; }
}