:root{--bg:#f4f6f9;--panel:#ffffff;--panel2:#f3f5f8;--text:#1f2733;--muted:#3a4350;--brand:#1f6feb;--brand2:#175fd0;--accent:#f59331;--err:#c93a3a;--border:#e6e9ef}
*{box-sizing:border-box}
body.dark{--bg:#0e131d;--panel:#161c28;--panel2:#1e2634;--text:#e5e9f0;--muted:#98a3b3;--border:#2a3342}
body.dark{background:var(--bg)}
html.booting #login{display:none!important}
html.predark body{background:#0e131d}
.topbar{position:sticky;top:0;z-index:80;display:flex;align-items:center;justify-content:space-between;background-color:#f5f7fc;color:#0b1220;padding:0 1.5rem;height:62px;border-bottom:3px solid transparent;background-image:linear-gradient(#f5f7fc,#f5f7fc),linear-gradient(90deg,#1a5cff,#8b1fd6 55%,#e5189d);background-origin:border-box;background-clip:padding-box,border-box;box-shadow:0 1px 6px rgba(20,25,35,.06)}
.tb-logo{display:flex;align-items:center;text-decoration:none}
.tb-logo-img{height:34px;width:auto;display:block}
.tb-caret{font-size:.9rem;margin-left:.05rem}
.tb-right{display:flex;align-items:center;gap:1.4rem}
.tb-item{position:relative;display:flex;align-items:center;gap:.4rem;cursor:pointer;color:#1a2233;font-weight:600;font-size:.9rem}
.tb-badge{position:absolute;top:-7px;right:-9px;background:#ef4444;color:#fff;font-size:.6rem;font-weight:700;min-width:16px;height:16px;border-radius:8px;display:flex;align-items:center;justify-content:center;padding:0 3px}
.tb-drop{position:absolute;top:150%;right:0;background:var(--panel);color:var(--text);border:1px solid var(--border);border-radius:10px;box-shadow:0 12px 34px rgba(0,0,0,.22);min-width:190px;overflow:hidden;z-index:60;font-weight:400}
.tb-drop a{display:block;padding:.6rem .9rem;cursor:pointer;font-size:.88rem;color:var(--text)}
.tb-drop a:hover{background:var(--panel2)}
.tb-switch{position:relative;display:inline-block;width:44px;height:24px;flex:0 0 auto}
.tb-switch input{opacity:0;width:0;height:0}
.tb-sl{position:absolute;inset:0;background:#cbd2dd;border-radius:24px;transition:.2s;cursor:pointer}
.tb-sl::before{content:"";position:absolute;width:18px;height:18px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s}
.tb-switch input:checked + .tb-sl{background:#0b1220}
.tb-switch input:checked + .tb-sl::before{transform:translateX(20px)}
.order-notif{background:#daeefb;color:#1a6ba8;text-align:center;padding:.75rem;border-radius:8px;cursor:pointer;margin:0 0 -.4rem;border:1px solid #b9dcf2;font-size:.92rem}
.bellpanel{padding:0;overflow:hidden}
.bell-head{display:flex;align-items:center;justify-content:space-between;padding:.85rem 1rem;border-bottom:1px solid var(--border);font-weight:700;font-size:1.02rem;color:var(--text)}
.bell-head #bellCount{color:var(--muted);font-weight:600}
.bell-readall{color:#2b57f0;font-size:.85rem;font-weight:600;cursor:pointer;flex:0 0 auto}
.bell-readall:hover{text-decoration:underline}
#bellList{max-height:400px;overflow-y:auto}
.bell-item{display:flex;gap:.7rem;padding:.8rem 1rem;border-bottom:1px solid var(--border);cursor:pointer;align-items:flex-start}
.bell-item:hover{background:var(--panel2)}
.bell-item.unread{background:rgba(43,87,240,.10)}
.bell-ic{position:relative;flex:0 0 auto;width:38px;height:38px;border-radius:50%;background:#fdecd0;color:#e8912a;display:flex;align-items:center;justify-content:center}
.bell-dot{position:absolute;top:1px;right:1px;width:9px;height:9px;border-radius:50%;background:#ef4444;border:2px solid var(--panel)}
.bell-body{flex:1;min-width:0}
.bell-t{display:flex;justify-content:space-between;align-items:baseline;gap:.5rem}
.bell-t b{font-size:.92rem;color:var(--text)}
.bell-time{color:var(--muted);font-size:.72rem;flex:0 0 auto}
.bell-msg{color:var(--muted);font-size:.82rem;margin-top:.15rem;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bell-msg b{color:var(--text);font-weight:600}
.order-notif:hover{background:#cfe7f8}
.mp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem .8rem}
.mp-chk{display:flex;align-items:center;gap:.4rem;font-size:.83rem;color:var(--text);cursor:pointer;font-weight:400}
.mp-chk input{width:auto;margin:0}
@media(max-width:600px){.mp-grid{grid-template-columns:repeat(2,1fr)}}
.isl-opt{display:flex;align-items:center;gap:.5rem;padding:.32rem .6rem;font-size:.82rem;cursor:pointer;white-space:nowrap;color:var(--text)}
.isl-opt:hover{background:var(--panel2)}
.isl-opt input{cursor:pointer;width:auto;margin:0}
.fm-head{display:flex;align-items:center;justify-content:space-between;font-weight:700;font-size:1.05rem;color:var(--text);padding-bottom:.6rem;margin-bottom:.9rem;border-bottom:1px solid var(--border)}
.fm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.fm-grid > label,.fm-islands-wrap{display:flex;flex-direction:column;gap:.35rem;font-size:.8rem;font-weight:600;color:var(--muted)}
.fm-grid select{width:100%;padding:.5rem .6rem;border:1px solid var(--border);border-radius:8px;background:var(--panel);color:var(--text);font-weight:400;font-size:.85rem}
.fm-islands-wrap{grid-column:1/-1}
.fm-islands{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem .9rem;font-weight:400;color:var(--text);font-size:.82rem;margin-top:.2rem}
.fm-islands label{display:flex;align-items:center;gap:.45rem;cursor:pointer}
.fm-islands input{width:auto;margin:0;cursor:pointer}
.fm-foot{display:flex;justify-content:flex-end;gap:.6rem;margin-top:1.3rem}
.btn-light.has-filter{border-color:var(--brand);color:var(--brand);font-weight:600}
.track-div{height:1px;background:var(--border);margin:.9rem 0}
.track-timeline{margin-top:.6rem;display:flex;flex-direction:column}
.tl-item{position:relative;display:flex;gap:.65rem;padding:0 0 .85rem .1rem}
.tl-item:before{content:"";position:absolute;left:5px;top:14px;bottom:-2px;width:2px;background:var(--border)}
.tl-item:last-child:before{display:none}
.tl-dot{width:12px;height:12px;border-radius:50%;background:var(--border);flex:0 0 12px;margin-top:2px;z-index:1}
.tl-item.tl-active .tl-dot{background:var(--brand)}
.tl-body{font-size:.85rem;color:var(--text)}
.tl-item.tl-active .tl-text{font-weight:600}
.tl-time{font-size:.75rem;color:var(--muted);margin-top:.12rem}
.switch,.grid label.switch,.modal-box label.switch{display:inline-flex !important;flex-direction:row !important;align-items:center;gap:.55rem;cursor:pointer;font-weight:700;color:var(--text);user-select:none;flex:0 0 auto}
.switch input{display:none}
.switch .slider{position:relative;width:56px;height:28px;background:#e23b3b;border-radius:999px;transition:.2s;flex:0 0 56px}
.switch .slider:before{content:"";position:absolute;width:22px;height:22px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s;box-shadow:0 1px 2px rgba(0,0,0,.25)}
.switch .slider:after{content:"OFF";position:absolute;top:8px;right:8px;font-size:.62rem;font-weight:800;color:#fff;letter-spacing:.03em}
.switch input:checked + .slider{background:var(--brand)}
.switch input:checked + .slider:before{transform:translateX(28px)}
.switch input:checked + .slider:after{content:"ON";left:9px;right:auto;color:#fff}
.ef-list{display:flex;flex-direction:column;gap:.5rem}
.ef-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:.7rem 1rem}
.ef-name{font-weight:600;color:var(--brand);cursor:pointer}
.ef-actions{display:flex;gap:.4rem;flex-wrap:wrap}
.fb-topbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem}
.fb-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;align-items:start}
.fb-track-tabs{display:flex;gap:.3rem;margin:.3rem 0}
.fbtab{flex:1;padding:.5rem;border:1px solid var(--border);background:var(--panel);color:var(--muted);border-radius:8px;cursor:pointer;font-weight:600;font-size:.82rem}
.fbtab.active{background:var(--brand);color:#fff;border-color:var(--brand)}
.fb-track-pane{display:flex;flex-direction:column;gap:.6rem}
.fb-sub{margin:.5rem 0 0;font-size:.85rem;color:var(--text)}
.fb-left{display:flex;flex-direction:column;gap:.6rem}
.fb-left h3{margin:.6rem 0 .1rem;border-top:1px solid var(--border);padding-top:.6rem}
.fb-left label{display:flex;flex-direction:column;gap:.25rem;font-size:.82rem;color:var(--muted)}
.fb-left input,.fb-left select{padding:.45rem .6rem;border:1px solid var(--border);border-radius:8px;background:var(--panel);color:var(--text);font-size:.85rem}
.fb-left input[type=color]{padding:.15rem;height:34px}
.fb-left .fb-ro input{background:var(--panel2);font-weight:600;color:var(--text)}
.fb-section{border:1px solid var(--border);border-radius:8px;padding:.6rem;display:flex;flex-direction:column;gap:.4rem;background:var(--panel2)}
.fb-right{background:var(--panel2);border-radius:12px;padding:1.2rem;display:flex;flex-direction:column;gap:1rem;align-items:center;position:sticky;top:1rem}
.fb-preview{display:flex;flex-direction:column;gap:1.6rem;align-items:center;width:100%}
.fb-pv-block{display:flex;flex-direction:column;align-items:center;gap:.4rem}
.fb-pv-cap{font-size:.75rem;color:var(--muted);font-weight:600}
.fb-pv-desktop{width:520px;max-width:100%}
.fb-pv-mobile{width:360px;max-width:100%}
.sw-row{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center;margin-top:.25rem}
.sw{width:26px;height:26px;border-radius:50%;border:2px solid transparent;cursor:pointer;padding:0;box-shadow:0 0 0 1px var(--border)}
.sw.on{border-color:#fff;box-shadow:0 0 0 2px #1f6feb}
.sw-rainbow{background:conic-gradient(red,orange,gold,lime,aqua,blue,magenta,red)}
.fb-cf-lbl{display:block;font-size:.82rem;color:var(--muted);margin-bottom:.15rem}
.rekap{background:var(--panel2);border:1px solid var(--border);border-radius:12px;padding:1rem 1.2rem;margin-bottom:1.1rem;max-width:640px}
.rekap-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.15rem .9rem}
.rekap-grid>div{display:flex;justify-content:space-between;gap:.6rem;border-bottom:1px dashed var(--border);padding:.32rem 0}
.rekap-grid span{color:var(--muted)}
.rekap-grid b{white-space:nowrap}
.rekap-top{margin-top:.8rem}
.rekap-top>b{display:block;margin-bottom:.25rem}
.rekap-top>div{color:var(--text);font-size:.9rem;padding:.1rem 0}
.rk-prod{padding:.6rem 0;border-bottom:1px solid var(--border)}
.rk-pname{font-weight:700;margin-bottom:.35rem}
.rk-total{margin-top:.9rem;border-top:2px solid var(--border);padding-top:.7rem}
.rk-total>b{display:block}
.pv-lab{display:flex;flex-direction:column;gap:.2rem;font-size:.72rem;color:var(--muted)}
.fu-card{border:1px solid var(--border);border-radius:12px;padding:.2rem 1rem;display:flex;flex-direction:column}
.fu-row{display:flex;align-items:center;gap:.7rem;padding:.75rem 0;border-bottom:1px solid var(--border)}
.fu-row:last-of-type{border-bottom:none}
.fu-del{margin:.7rem 0;color:#c93a3a;border-color:#eab8b8}
.fu-tpl{border:1px solid var(--border);border-radius:12px;padding:1rem;margin-top:1rem;max-width:820px}
.wa-fu{background:none;border:none;cursor:pointer;padding:.15rem;line-height:0;color:#c2c8d0}
.wa-fu:hover{color:#9aa3b0}
.wa-fu.on{color:#25d366}
.wa-fu.on:hover{color:#1fb457}
.fu-ava{width:40px;height:40px;border-radius:50%;background:var(--panel2);border:1px solid var(--border);display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--text);flex:0 0 auto}
.sc-panel{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:.7rem .8rem}
.sc-title{font-weight:600;font-size:.95rem;margin-bottom:.5rem;color:var(--text)}
.sc-row{display:flex;align-items:center;gap:.6rem;padding:.4rem 0;border-bottom:1px solid var(--border)}
.sc-badge{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:500;font-size:.72rem;flex:0 0 auto}
.sc-logo{width:44px;flex:0 0 auto;display:flex;align-items:center;justify-content:center}
.sc-logo-img{max-width:40px;max-height:22px;object-fit:contain}
.sc-logo-chip{font-weight:500;font-size:.75rem;white-space:nowrap}
.sc-name{flex:1;font-size:.85rem;color:var(--text);font-weight:400}
.sc-num{padding:.28rem .75rem;border-radius:20px;font-weight:500;font-size:.8rem;white-space:nowrap}
.sc-avg{display:flex;gap:.6rem;margin-top:.7rem}
.sc-avg-card{flex:1;display:flex;justify-content:space-between;align-items:center;background:var(--panel2);border:1px solid var(--border);border-radius:10px;padding:.5rem .7rem;font-size:.8rem;gap:.5rem;color:var(--text)}
.sc-A,.sc-num-A{background:#cdeff2;color:#12707c}
.sc-B,.sc-num-B{background:#c9ecd6;color:#1a8a4e}
.sc-C,.sc-num-C{background:#ffe3b0;color:#b45309}
.sc-D,.sc-num-D{background:#ffd9c2;color:#c2410c}
.sc-E,.sc-num-E{background:#ffd6de;color:#c0264a}
.sc-none,.sc-num-none{background:#e2e6ea;color:#8a94a3}
/* Huruf & angka skor: hitam, weight standar (tidak tebal) */
.sc-badge,.sc-num,.sc-avg-card .sc-badge,.sc-avg-card .sc-num{color:#1f2733!important;font-weight:500!important}
.ap-modes{display:flex;gap:.4rem;flex-wrap:wrap}
.ap-mbtn{background:var(--panel);border:1px solid var(--border);color:var(--text);padding:.4rem .9rem;border-radius:8px;cursor:pointer;font-weight:600;font-size:.85rem}
.ap-mbtn.active{background:#1f6feb;color:#fff;border-color:#1f6feb}
.ap-table th,.ap-table td{font-size:.78rem;white-space:nowrap;text-align:right;padding:.4rem .55rem}
.ap-table thead th{background:#2f5fbf;color:#fff;font-weight:600;border-color:rgba(255,255,255,.15)}
.ap-table thead th:nth-child(n+7):nth-child(-n+13){background:#2e7d5b}
.ap-table th:first-child,.ap-table td:first-child{text-align:center;position:sticky;left:0;background:var(--panel)}
.ap-table thead th:first-child{background:#374151;color:#fff}
.ap-table td:nth-child(n+2):nth-child(-n+6){background:rgba(31,111,235,.06)}
.ap-table td:nth-child(n+7):nth-child(-n+9){background:rgba(34,160,107,.11)}
.ap-table td:nth-child(n+10):nth-child(-n+13){background:rgba(34,160,107,.05)}
.ap-table td:nth-child(n+14):nth-child(-n+17){background:rgba(31,111,235,.09)}
.ap-table tbody tr:hover td{background:rgba(31,111,235,.14)}
.ap-table tr.ap-total td{font-weight:700;background:var(--panel2)!important;border-top:2px solid var(--border)}
.ap-pos{color:#1a8a4e;font-weight:700}
.ap-neg{color:#c0264a;font-weight:700}
.sc-mini{display:inline-flex;align-items:center;justify-content:center;min-width:26px;height:22px;border-radius:11px;padding:0 .45rem;font-size:.72rem;font-weight:500;cursor:default}
#scTip{position:fixed;z-index:9999;width:300px;max-width:92vw;display:none}
#scTip .sc-panel{margin:0;box-shadow:0 10px 34px rgba(20,25,35,.22)}
.sc-dbg{cursor:pointer;color:var(--muted);font-size:.72rem;margin-top:.5rem}
#scRawPre{white-space:pre-wrap;word-break:break-all;font-size:.7rem;max-height:220px;overflow:auto;background:var(--panel2);border:1px solid var(--border);border-radius:8px;padding:.5rem;margin-top:.3rem}
.fb-save-row{display:flex;justify-content:flex-end;margin-top:.9rem}
.fb-sec-head{display:flex;align-items:center;justify-content:space-between}
.fb-move{display:flex;gap:.3rem}
.fb-move button{border:1px solid var(--border);background:var(--panel);color:var(--text);border-radius:7px;width:32px;height:30px;cursor:pointer;font-size:1rem;font-weight:900;line-height:1;display:inline-flex;align-items:center;justify-content:center}
.fb-move button:hover{background:var(--brand);border-color:var(--brand);color:#fff}
.ff-card{background:#fff;border:1px solid #e6e9ef;border-radius:14px;padding:1.2rem;box-shadow:0 6px 20px rgba(0,0,0,.08);display:flex;flex-direction:column;gap:.7rem}
.ff-title{font-weight:700;font-size:1.05rem;color:#1f2733;text-align:center;margin-bottom:.2rem}
.ff-field{display:flex;flex-direction:column;gap:.3rem}
.ff-field label{font-size:.85rem;color:#2f3742;font-weight:700}
.ff-field input{padding:.7rem .8rem;border:2px solid #9aa3b0;border-radius:9px;font-size:.92rem;background:#fff;color:#1f2733}
.ff-field input::placeholder{color:#4a5462;opacity:1}
.ff-btn{margin-top:.3rem;border:none;border-radius:10px;padding:.7rem 1rem;font-weight:700;font-size:.95rem;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:.5rem}
@media(max-width:900px){.fb-grid{grid-template-columns:1fr}}
.mgdel{background:none;border:none;color:var(--err);cursor:pointer;padding:.25rem;border-radius:6px;display:inline-flex}
.mgdel:hover{background:var(--panel2)}
body{margin:0;font-family:system-ui,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text)}
.hidden{display:none!important}
.muted{color:var(--muted);font-size:.9rem;margin-top:0}
.err{color:var(--err)}
.ok{color:#1a8a4e;margin-left:.5rem}

/* Login */
.login{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:1.5rem;background:linear-gradient(135deg,#e9eefc 0%,#f1ecfd 45%,#fdecf6 100%)}
.login-card{width:100%;max-width:390px;background:#fff;border-radius:20px;padding:2.4rem 2.1rem;box-shadow:0 22px 60px rgba(40,50,90,.18);text-align:center}
.login-logo{height:50px;width:auto;margin:0 auto .9rem;display:block}
.login-card h1{font-size:1.35rem;font-weight:800;color:#0f1830;margin:.2rem 0 .25rem}
.login-sub{color:#6b7280;font-size:.9rem;margin:0 0 1.7rem}
.login-inp{display:flex;align-items:center;gap:.6rem;padding:0 .85rem;margin-bottom:.85rem;border:1.5px solid #e3e7ef;border-radius:12px;background:#f8fafc;transition:.15s}
.login-inp svg{color:#9aa2b1;flex:0 0 auto}
.login-inp:focus-within{border-color:#2b57f0;background:#fff;box-shadow:0 0 0 3px rgba(43,87,240,.14)}
.login-inp input{flex:1;border:none;outline:none;background:transparent;padding:.82rem 0;font-size:.95rem;color:#0f1830}
.login-card button{width:100%;padding:.85rem;margin-top:.35rem;border:none;border-radius:12px;color:#fff;font-size:.98rem;font-weight:700;cursor:pointer;background:linear-gradient(90deg,#1a5cff,#8b1fd6 60%,#e5189d);box-shadow:0 10px 24px rgba(90,50,200,.3);transition:.15s}
.login-card button:hover{filter:brightness(1.07)}
.login-card button:active{transform:translateY(1px)}
.login-card .err{display:block;margin-top:.9rem;color:#e24b4a;font-size:.85rem}
.card{background:var(--panel);padding:2rem;border-radius:14px;width:320px;text-align:center;border:1px solid var(--border)}
.card h1{margin:0 0 .25rem;color:var(--brand)}
.card input{width:100%;margin:.75rem 0;padding:.7rem;border-radius:8px;border:1px solid var(--border);background:var(--panel2);color:var(--text)}

/* App layout */
.app{display:flex;flex-direction:column;min-height:100vh}
.app-body{display:flex;flex:1;min-height:0}
.sidebar{width:230px;background:var(--panel);padding:1.2rem;display:flex;flex-direction:column;border-right:1px solid var(--border)}
.sidebar h2{color:var(--brand);margin:.2rem 0 1.2rem}
.sidebar nav{display:flex;flex-direction:column;gap:.25rem;flex:1}
.sidebar nav a{padding:.65rem .8rem;border-radius:8px;cursor:pointer;color:var(--muted);font-size:.95rem}
.sidebar nav a:hover{background:var(--panel2);color:var(--text)}
.sidebar nav a{display:flex;align-items:center;gap:.6rem}
.sidebar nav a.active{background:var(--brand2);color:#fff}
.sidebar nav a svg{width:18px;height:18px;flex:0 0 auto;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;opacity:.85}
.sidebar nav a.active svg{opacity:1}
.logout{margin-top:1rem;background:transparent;border:1px solid var(--border);color:var(--muted)}
.content{flex:1;padding:2rem;width:100%;min-width:0}
h1{margin-top:0}

/* Forms */
button{background:var(--brand);color:#fff;border:none;padding:.65rem 1.1rem;border-radius:8px;font-weight:600;cursor:pointer}
button:hover{background:var(--brand2)}
input,textarea,select{background:#fff;border:1px solid var(--border);color:var(--text);padding:.6rem;border-radius:8px;font-family:inherit}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--brand)}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1.2rem}
.grid label,.tab>label{display:flex;flex-direction:column;gap:.35rem;font-size:.85rem;color:var(--muted)}
.grid .full{grid-column:1/-1}
.full{width:100%}
.row{display:flex;gap:.5rem;margin:.8rem 0;flex-wrap:wrap}
.row input{flex:1;min-width:120px}

/* Tables */
table{width:100%;border-collapse:collapse;margin-top:1rem;font-size:.9rem}
th,td{text-align:left;padding:.6rem;border-bottom:1px solid var(--border)}
th{color:var(--muted);font-weight:600}
td button{padding:.35rem .7rem;font-size:.8rem}

/* Chat */
.chatbox{background:var(--panel);border:1px solid var(--border);border-radius:12px;height:50vh;overflow-y:auto;padding:1rem;margin:1rem 0;display:flex;flex-direction:column;gap:.6rem}
.bubble{max-width:75%;padding:.6rem .8rem;border-radius:12px;white-space:pre-wrap;font-size:.92rem}
.bubble.user{align-self:flex-end;background:var(--brand2);color:#fff;border-bottom-right-radius:3px}
.bubble.assistant{align-self:flex-start;background:var(--panel2);border-bottom-left-radius:3px}
.statusbox{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;margin:1rem 0}
.statusbox .item{background:var(--panel);border:1px solid var(--border);padding:.8rem;border-radius:10px}
.statusbox .on{color:#1a8a4e} .statusbox .off{color:var(--err)}
code{background:var(--panel2);padding:.3rem .5rem;border-radius:6px;display:inline-block;word-break:break-all}
/* Nav label */
.navlabel{color:#434c58;font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;margin:.7rem 0 .2rem;padding-left:.3rem}
.ghost{background:transparent;border:1px solid var(--border);color:var(--text)}
.ghost:hover{background:var(--panel2)}
.small{font-size:.78rem}

/* Cards */
.cards{display:flex;flex-wrap:wrap;gap:.8rem;margin:1rem 0}
.cardbox{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:1rem 1.2rem;min-width:130px;flex:1;box-shadow:0 1px 2px rgba(20,25,35,.04)}
.cardbox .num{font-size:1.5rem;font-weight:700;color:var(--accent)}
.cardbox .lbl{color:var(--muted);font-size:.8rem;margin-top:.2rem}
.omzet-hero{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:1.4rem;flex-wrap:wrap;margin:1rem 0;padding:1.6rem 1.9rem;border-radius:20px;background:linear-gradient(120deg,#1a5cff 0%,#6d28d9 52%,#e5189d 100%);box-shadow:0 14px 36px rgba(80,20,140,.28)}
.omzet-hero::after{content:"";position:absolute;inset:0;background:radial-gradient(130% 150% at 100% 0%,rgba(255,255,255,.16),transparent 55%);pointer-events:none}
.oh-main{position:relative;z-index:1}
.oh-label{color:rgba(255,255,255,.72);font-size:.72rem;font-weight:700;letter-spacing:.14em}
.oh-value{color:#fff;font-weight:800;font-size:2.9rem;line-height:1.05;margin:.25rem 0 .35rem;letter-spacing:-.01em}
.oh-rp{font-size:1.35rem;font-weight:700;opacity:.85;margin-right:.15rem;vertical-align:.32em}
.oh-sub{color:rgba(255,255,255,.82);font-size:.9rem}
.oh-stats{position:relative;z-index:1;display:flex;gap:.7rem;flex-wrap:wrap}
.oh-stat{min-width:104px;padding:.75rem 1rem;border-radius:14px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2)}
.ohs-l{color:rgba(255,255,255,.75);font-size:.75rem;font-weight:600;margin-bottom:.35rem}
.ohs-n{color:#fff;font-size:1.5rem;font-weight:800;line-height:1}
.ohs-u{font-size:.9rem;font-weight:700;opacity:.85;margin-left:1px}
#sv-omzet,#sv-rate{display:inline-block}
@keyframes sumPop{0%{transform:scale(1)}30%{transform:scale(1.16);filter:brightness(1.35)}100%{transform:scale(1);filter:none}}
.flash{animation:sumPop .55s ease-out}

/* ===== Landing Page builder ===== */
.btn-primary:disabled{opacity:.6;cursor:default;box-shadow:none}
.lp-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1.1rem}
.lp-head h1{margin:0}
.lp-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.9rem;margin-bottom:1.1rem}
.lp-stat{display:flex;align-items:center;gap:.9rem;background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:1.1rem 1.3rem;box-shadow:0 1px 2px rgba(20,25,35,.04)}
.lp-stat-ic{width:44px;height:44px;border-radius:12px;background:var(--panel2);display:flex;align-items:center;justify-content:center;font-size:1.2rem;flex:0 0 auto}
.lp-stat-l{color:var(--muted);font-size:.82rem}
.lp-stat-n{font-size:1.6rem;font-weight:800;color:var(--text);line-height:1.1}
.lp-empty{background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:3rem 1rem;text-align:center}
.lp-empty-ic{width:56px;height:56px;border-radius:50%;background:var(--panel2);display:flex;align-items:center;justify-content:center;font-size:1.6rem;margin:0 auto .8rem}
.lp-empty h3{margin:.2rem 0}
.lp-empty .btn-primary{margin-top:1rem}
.lp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem}
.lp-card{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:1.2rem;box-shadow:0 1px 2px rgba(20,25,35,.04)}
.lp-card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:.7rem}
.lp-card-ic{width:40px;height:40px;border-radius:10px;background:var(--panel2);display:flex;align-items:center;justify-content:center;font-size:1.1rem}
.lp-badge{font-size:.72rem;font-weight:700;color:var(--muted);background:var(--panel2);border:1px solid var(--border);border-radius:20px;padding:.15rem .6rem}
.lp-badge.live{color:#0a7d43;background:rgba(16,160,90,.12);border-color:rgba(16,160,90,.25)}
.lp-card-title{font-weight:700;font-size:1.05rem;color:var(--text)}
.lp-card-slug{color:var(--muted);font-size:.85rem;font-family:ui-monospace,monospace;margin:.15rem 0}
.lp-card-meta{color:var(--muted);font-size:.8rem;margin:.35rem 0 .8rem}
.lp-card-actions{display:flex;gap:.4rem}
.lp-card-actions .btn-light{flex:0 0 auto;padding:.45rem .8rem;text-decoration:none}
.lp-card-actions .btn-light:first-child{flex:1}
.lp-del{color:#c93a3a !important;border-color:rgba(201,58,58,.3) !important}
/* Modal buat LP */
.lp-modal-wrap,.lp-drawer-wrap{position:fixed;inset:0;background:rgba(20,25,40,.35);z-index:200;display:flex}
.lp-modal-wrap{align-items:center;justify-content:center}
.lp-modal{background:var(--panel);border-radius:16px;padding:1.4rem 1.5rem;width:min(440px,92vw);box-shadow:0 24px 60px rgba(0,0,0,.28)}
.lp-modal-head{display:flex;align-items:center;justify-content:space-between;font-size:1.1rem;margin-bottom:.3rem;color:var(--text)}
.lp-x{cursor:pointer;color:var(--muted);font-size:1.1rem}
.lp-lab{display:block;font-weight:600;font-size:.85rem;color:var(--text);margin:.9rem 0 .3rem}
.lp-modal input,.lp-modal textarea,.lp-modal select,.lp-drawer input,.lp-drawer textarea,.lp-drawer select{width:100%;border:1.5px solid var(--border);border-radius:10px;padding:.6rem .75rem;font-size:.9rem;color:var(--text);background:var(--panel);font-family:inherit}
.lp-modal input:focus,.lp-drawer input:focus,.lp-modal textarea:focus,.lp-drawer textarea:focus,.lp-modal select:focus{outline:none;border-color:var(--accent)}
.lp-slug-row{display:flex;align-items:center;border:1.5px solid var(--border);border-radius:10px;overflow:hidden}
.lp-slug-row span{padding:.6rem .6rem;background:var(--panel2);color:var(--muted);font-family:ui-monospace,monospace;font-size:.85rem}
.lp-slug-row input{border:none;border-radius:0}
.lp-modal-foot{display:flex;justify-content:flex-end;gap:.6rem;margin-top:1.3rem;align-items:center}
.lp-urlbox{background:var(--panel2);border:1px solid var(--border);border-radius:8px;padding:.5rem .7rem;font-family:ui-monospace,monospace;font-size:.8rem;color:var(--muted);margin-top:.4rem;word-break:break-all}
.lp-switch{display:flex;align-items:center;gap:.6rem;font-size:.85rem;color:var(--text);cursor:pointer}
.lp-switch input{width:auto}
/* Drawer SEO */
.lp-drawer-wrap{justify-content:flex-end}
.lp-drawer{background:var(--panel);width:min(440px,94vw);height:100%;padding:1.4rem 1.5rem;overflow:auto;box-shadow:-12px 0 40px rgba(0,0,0,.2)}
/* Editor full-screen */
.lp-editor{position:fixed;top:62px;left:0;right:0;bottom:0;z-index:70;background:var(--bg);display:flex;flex-direction:column}
.lp-editor.hidden{display:none}
.lpic{width:16px;height:16px;flex:0 0 auto}
.lpe-top button,.lpe-tab,.lpe-dev button,.lpe-upload,.lpe-gen,.lp-card-actions button,.lp-card-actions a,.lp-head .btn-primary,.lp-empty .btn-primary,.lpe-panel-h button{display:inline-flex;align-items:center;gap:.4rem}
.lpe-tabs{display:flex;align-items:center;gap:.3rem;padding:.4rem .8rem;background:var(--panel);border-bottom:1px solid var(--border);flex-wrap:wrap}
.lpe-tab{border:1px solid transparent;background:transparent;color:var(--muted);padding:.45rem .8rem;border-radius:9px;cursor:pointer;font-weight:600;font-size:.86rem}
.lpe-tab.on{background:var(--panel2);color:var(--text);border-color:var(--border)}
.lpe-tag{background:rgba(16,160,90,.14);color:#0a7d43;font-size:.68rem;font-weight:700;border-radius:20px;padding:.1rem .45rem}
.lpe-tabhint{color:var(--muted);font-size:.8rem;margin-left:.5rem}
.lpe-hint{color:var(--muted);font-size:.72rem;font-weight:400}
.lpe-mudahpanel{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:1rem;margin-bottom:1rem}
.lp-colors{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.3rem}
.lp-color{display:inline-flex;align-items:center;gap:.4rem;border:1px solid var(--border);border-radius:8px;padding:.25rem .5rem;font-size:.75rem;color:var(--muted);font-family:ui-monospace,monospace}
.lp-color input[type=color]{width:24px;height:24px;border:none;background:none;padding:0;cursor:pointer;border-radius:5px}
.lpe-img-empty{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;gap:.5rem;color:var(--muted);padding:2rem 0}
.lpe-img-empty .lpic{width:34px;height:34px;opacity:.55}
.lpe-img-empty span{font-size:.82rem}
.lpe-prompt{margin-top:1rem;border:1px solid var(--border);border-radius:10px;padding:.8rem;background:var(--panel)}
.lpe-prompt-box{background:var(--panel2);border:1px solid var(--border);border-radius:8px;padding:.55rem;font-family:ui-monospace,monospace;font-size:.72rem;color:var(--muted);white-space:pre-wrap;word-break:break-all;max-height:120px;overflow:auto;margin:0 0 .5rem}
.lpe-copyprompt{width:100%;justify-content:center}
.lpe-top{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.7rem 1.1rem;background:var(--panel);border-bottom:1px solid var(--border);flex-wrap:wrap}
.lpe-top-l{display:flex;align-items:center;gap:.7rem}
.lpe-back{width:34px;height:34px;border-radius:9px;border:1px solid var(--border);background:var(--panel);cursor:pointer;font-size:1.1rem;color:var(--text)}
.lpe-title{font-weight:700;font-size:1rem;color:var(--text);outline:none;border-radius:6px;padding:.1rem .3rem}
.lpe-title:focus{background:var(--panel2)}
.lpe-slug{color:var(--muted);font-size:.8rem;font-family:ui-monospace,monospace}
.lpe-domwrap{position:relative;display:inline-block}
.lpe-dombtn{display:inline-flex;align-items:center;gap:.35rem;background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:.2rem .5rem;font-size:.82rem;font-weight:600;color:var(--text);cursor:pointer;font-family:ui-monospace,monospace}
.lpe-dombtn:hover{border-color:#c7cdd8}
.lpe-dombtn .lpic{width:13px;height:13px}
.lpe-dommenu{position:absolute;top:120%;left:0;z-index:120;background:var(--panel);border:1px solid var(--border);border-radius:10px;box-shadow:0 12px 34px rgba(20,25,40,.18);min-width:230px;padding:.3rem;overflow:hidden}
.lpe-dommenu.hidden{display:none}
.lpe-domitem{display:flex;align-items:center;gap:.5rem;padding:.5rem .6rem;border-radius:7px;cursor:pointer;font-size:.84rem;color:var(--text);font-family:ui-monospace,monospace}
.lpe-domitem:hover{background:var(--panel2)}
.lpe-domitem.on{background:var(--panel2)}
.lpe-dombadge{background:var(--brand);color:#fff;font-family:inherit;font-size:.66rem;font-weight:700;border-radius:6px;padding:.1rem .4rem;flex:0 0 auto}
.lpe-copyurl{background:transparent;border:none;color:var(--muted);cursor:pointer;padding:.1rem;border-radius:5px;display:inline-flex;vertical-align:middle}
.lpe-copyurl:hover{background:var(--panel2);color:var(--text)}
.lpe-copyurl .lpic{width:14px;height:14px}
.lpc-domwrap{position:relative;display:inline-block;margin:.1rem 0}
.lpc-dombtn{display:inline-flex;align-items:center;gap:.3rem;max-width:100%;background:var(--panel2);border:1px solid var(--border);border-radius:8px;padding:.2rem .5rem;font-size:.78rem;font-weight:600;color:var(--text);cursor:pointer;font-family:ui-monospace,monospace}
.lpc-dombtn:hover{border-color:#c7cdd8}
.lpc-dombtn .lpic{width:12px;height:12px;flex:0 0 auto}
.lpc-dombtn span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lpc-dommenu{position:absolute;top:118%;left:0;z-index:60;background:var(--panel);border:1px solid var(--border);border-radius:10px;box-shadow:0 12px 34px rgba(20,25,40,.18);min-width:210px;padding:.3rem}
.lpc-dommenu.hidden{display:none}
.lpe-top-r{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.lpe-dev{display:flex;border:1px solid var(--border);border-radius:9px;overflow:hidden}
.lpe-dev button{border:none;background:var(--panel);color:var(--muted);padding:.4rem .7rem;cursor:pointer;font-size:.82rem;font-weight:600}
.lpe-dev button.on{background:var(--panel2);color:var(--text)}
.lpe-saved{font-size:.8rem;color:#0a7d43}
.lpe-pub{background:var(--panel);color:var(--text);border:1.5px solid var(--border);border-radius:9px;padding:.45rem .95rem;font-weight:700;cursor:pointer;font-size:.85rem;display:inline-flex;align-items:center;gap:.4rem}
.lpe-pub:hover{background:#16a05a;color:#fff;border-color:#16a05a}
.lpe-pub.live:hover{background:var(--panel);color:#c93a3a;border-color:#c93a3a}
.lpe-livepill{background:rgba(16,160,90,.15);color:#0a7d43;font-size:.66rem;font-weight:800;border-radius:20px;padding:.08rem .45rem}
.btn-green{background:#16a05a;color:#fff;border:none;border-radius:10px;padding:.6rem 1.1rem;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:.4rem}
.btn-green:hover{filter:brightness(1.06)}
.btn-dark{background:var(--text);color:var(--panel);border:none;border-radius:10px;padding:.6rem 1.1rem;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:.4rem}
.lp-mtitle{display:inline-flex;align-items:center;gap:.45rem}
.lp-fieldbox{margin-top:.9rem}
.lp-fieldlab{font-size:.72rem;color:var(--muted);font-weight:600;margin-bottom:.25rem;letter-spacing:.03em}
.lp-okbox{background:rgba(16,160,90,.1);border:1px solid rgba(16,160,90,.3);color:#0a7d43;border-radius:10px;padding:.7rem .8rem;font-size:.85rem;margin-top:.8rem;display:flex;gap:.45rem;align-items:flex-start}
.lp-okbox .lpic{flex:0 0 auto;margin-top:1px}
.lp-warnbox{background:rgba(201,58,58,.08);border:1px solid rgba(201,58,58,.3);color:#c93a3a;border-radius:10px;padding:.7rem .8rem;font-size:.85rem;margin-top:.8rem}
.lp-foot2{gap:.6rem}
.lp-foot2 .btn-light{flex:1;justify-content:center;text-decoration:none}
.lp-check-ic{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:rgba(16,160,90,.15);color:#16a05a}
.lp-check-ic .lpic{width:15px;height:15px}
.lp-pubrow{display:flex;align-items:center;justify-content:space-between;gap:1rem;border:1px solid var(--border);border-radius:12px;padding:.85rem 1rem;margin-top:1rem}
.lp-pubtitle{font-weight:700;color:var(--text);font-size:.92rem;margin-bottom:.15rem}
.lp-toggle{position:relative;display:inline-block;width:46px;height:26px;cursor:pointer;flex:0 0 auto}
.lp-toggle input{opacity:0;width:0;height:0;position:absolute}
.lp-toggle-track{position:absolute;inset:0;background:#cbd2de;border-radius:20px;transition:background .15s}
.lp-toggle-knob{position:absolute;top:3px;left:3px;width:20px;height:20px;background:#fff;border-radius:50%;transition:transform .15s;box-shadow:0 1px 3px rgba(0,0,0,.28)}
.lp-toggle input:checked + .lp-toggle-track{background:var(--brand)}
.lp-toggle input:checked + .lp-toggle-track .lp-toggle-knob{transform:translateX(20px)}
.lp-head-btns{display:flex;gap:.5rem;flex-wrap:wrap}
.lp-seo-sec{display:flex;align-items:center;gap:.4rem;font-weight:700;color:var(--text);font-size:.9rem;margin:1.3rem 0 .2rem;padding-top:.9rem;border-top:1px solid var(--border)}
.lp-domlist{display:flex;flex-direction:column;gap:.5rem;margin:.6rem 0}
.lp-dom-row{display:flex;align-items:center;justify-content:space-between;gap:.8rem;border:1px solid var(--border);border-radius:10px;padding:.6rem .8rem}
.lp-dom-name{font-weight:600;color:var(--text);font-family:ui-monospace,monospace;font-size:.85rem;display:flex;align-items:center;gap:.4rem}
.lp-dom-act{display:flex;gap:.4rem;flex:0 0 auto}
.lp-dom-act .btn-light{padding:.35rem .6rem;font-size:.8rem}
.lp-dom-add{display:flex;gap:.5rem}
.lp-dom-add input{flex:1}
.lp-dom-add .btn-primary{flex:0 0 auto}
.lp-dnsbox{background:var(--panel2);border:1px solid var(--border);border-radius:10px;padding:.8rem;font-size:.82rem;color:var(--muted);line-height:1.7;margin-top:1rem}
.lp-dom-row2{border:1px solid var(--border);border-radius:10px;padding:.6rem .8rem;display:flex;flex-direction:column;gap:.5rem}
.lp-dom-rowtop{display:flex;align-items:center;justify-content:space-between;gap:.8rem}
.lp-dom-rowtop .lp-del{padding:.35rem .5rem;flex:0 0 auto}
.lp-dom-home{width:100%}
/* Tombol pilih domain (kartu & header) + tab Edit Mudah/HTML Lanjutan: gaya abu (btn-light), bukan biru */
.lpc-dombtn,.lpe-dombtn{background:#fff!important;color:#3a424e!important;border:1px solid #d7dbe2!important}
.lpc-dombtn:hover,.lpc-dombtn:focus,.lpc-dombtn:active,.lpe-dombtn:hover,.lpe-dombtn:focus,.lpe-dombtn:active{background:#f3f5f8!important;color:#3a424e!important;border-color:#c7cdd8!important}
.lpe-tab{background:transparent!important;color:#6b7280!important;border-color:transparent!important}
.lpe-tab:hover,.lpe-tab:focus{background:#f3f5f8!important;color:#1f2733!important}
.lpe-tab.on{background:#eceff3!important;color:#1f2733!important;border-color:#c7cdd8!important}
.lpe-addcomp{width:100%;justify-content:center;margin-bottom:.6rem}
.lpe-complist{display:flex;flex-direction:column;gap:.45rem}
.lpe-comp{display:flex;align-items:center;justify-content:space-between;gap:.6rem;border:1px solid var(--border);border-radius:9px;padding:.5rem .7rem;background:var(--panel)}
.lpe-comp-nm{font-weight:600;font-size:.85rem;color:var(--text);display:flex;align-items:center;gap:.4rem;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lpe-comp-warn{font-size:.68rem;font-weight:700;color:#c93a3a;background:rgba(201,58,58,.1);border-radius:20px;padding:.05rem .4rem}
.lpe-comp-act{display:flex;gap:.15rem;flex:0 0 auto}
.lpe-comp-act button{background:transparent;border:none;color:var(--muted);cursor:pointer;padding:.3rem;border-radius:6px;display:inline-flex}
.lpe-comp-act button:hover{background:var(--panel2);color:var(--text)}
.lpe-comp-picklist{display:flex;flex-direction:column;gap:.5rem;margin-top:.8rem}
.lpe-comp-pick{display:flex;align-items:center;gap:.6rem;border:1px solid var(--border);border-radius:10px;padding:.7rem .9rem;background:var(--panel);cursor:pointer;font-weight:600;font-size:.9rem;color:var(--text);text-align:left}
.lpe-comp-pick:hover{border-color:var(--brand);background:var(--panel2)}
.lp-linktype{display:inline-flex;border:1px solid var(--border);border-radius:8px;overflow:hidden;margin-bottom:.4rem}
.lp-linktype button{border:none;background:var(--panel);color:var(--muted);padding:.35rem .8rem;cursor:pointer;font-size:.82rem;font-weight:600}
.lp-linktype button.on{background:var(--brand);color:#fff}
.lpbe-a{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:7px;background:var(--accent);color:#fff;font-weight:800;font-size:.85rem}
.lpbe-tools{display:flex;gap:.2rem;border-bottom:1px solid var(--border);padding:.5rem 0;margin-bottom:.5rem}
.lpbe-tools button{background:transparent;border:none;color:var(--muted);cursor:pointer;padding:.35rem;border-radius:7px;display:inline-flex}
.lpbe-tools button:hover{background:var(--panel2);color:var(--text)}
.lpbe-tools .lp-del:hover{color:#c93a3a}
.lpbe-fmt{display:flex;justify-content:flex-end;gap:.2rem;margin-bottom:.4rem}
.lpbe-fmt button{width:30px;height:28px;border:1px solid var(--border);background:var(--panel);border-radius:7px;cursor:pointer;color:var(--text);font-size:.9rem}
.lpbe-fmt button:hover{background:var(--panel2)}
.lpbe-fmt .lpbe-hl{color:var(--accent)}
.lpbe-text{min-height:52px;border:1.5px solid var(--border);border-radius:10px;padding:.6rem .75rem;font-size:.95rem;color:var(--text);background:var(--panel);outline:none}
.lpbe-text:focus{border-color:var(--accent)}
.lpbe-wa{display:flex;align-items:center;border:1.5px solid var(--border);border-radius:10px;overflow:hidden}
.lpbe-wa span{padding:.6rem .7rem;color:var(--muted);background:var(--panel2);font-weight:600}
.lpbe-wa input{border:none;border-radius:0}
.lpbe-track{border:1px solid var(--border);border-radius:12px;padding:.8rem;margin-top:1rem}
.lpbe-track-h{display:flex;align-items:center;justify-content:space-between;font-weight:700;color:var(--text);font-size:.92rem}
.lpbe-track-h span:first-child{display:inline-flex;align-items:center;gap:.4rem}
.lpbe-toggle{color:var(--brand);font-weight:600;font-size:.82rem;cursor:pointer}
.lpbe-tip{margin-top:.5rem;background:var(--panel2);border-radius:8px;padding:.5rem .6rem}
.lpe-body{flex:1;display:grid;grid-template-columns:210px minmax(340px,1fr) minmax(340px,1.05fr);gap:0;overflow:hidden}
.lpe-col-img,.lpe-col-main,.lpe-col-prev{overflow:auto;padding:1rem;border-right:1px solid var(--border)}
.lpe-col-main{background:var(--panel2)}
.lpe-panel-h{display:flex;align-items:center;gap:.5rem;font-weight:700;font-size:.92rem;color:var(--text);margin-bottom:.7rem}
.lpe-upload{width:100%;justify-content:center;margin-bottom:.3rem}
.lpe-imglist{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-top:.5rem}
.lpe-img{border:1px solid var(--border);border-radius:8px;overflow:hidden;background:var(--panel)}
.lpe-img img{width:100%;height:70px;object-fit:cover;display:block}
.lpe-img-b{display:flex}
.lpe-img-b button{flex:1;border:none;background:var(--panel);color:var(--muted);font-size:.72rem;padding:.3rem;cursor:pointer;border-top:1px solid var(--border)}
.lpe-img-b button:first-child{border-right:1px solid var(--border)}
.lpe-aipanel,.lpe-htmlpanel{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:1rem;margin-bottom:1rem}
.lpe-lab{display:block;font-weight:600;font-size:.82rem;color:var(--text);margin:.7rem 0 .25rem}
.lpe-aipanel textarea,.lpe-aipanel input,.lpe-aipanel select{width:100%;border:1.5px solid var(--border);border-radius:9px;padding:.55rem .7rem;font-size:.86rem;color:var(--text);background:var(--panel);font-family:inherit}
.lpe-aipanel textarea:focus,.lpe-aipanel input:focus,.lpe-aipanel select:focus{outline:none;border-color:var(--accent)}
.lpe-ai-row{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.lpe-gen{width:100%;justify-content:center;margin-top:.9rem;padding:.7rem}
.lpe-code{width:100%;min-height:340px;border:1px solid var(--border);border-radius:9px;background:#0f1520;color:#cbd5e6;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.8rem;padding:.7rem;resize:vertical;line-height:1.5}
.lpe-col-prev{border-right:none;background:var(--panel2);display:flex;flex-direction:column}
.lpe-prev-frame{flex:1;background:#fff;border:1px solid var(--border);border-radius:10px;overflow:hidden;transition:max-width .2s;min-height:400px}
.lpe-prev-frame.mob{width:375px;max-width:375px;align-self:center;box-shadow:0 6px 24px rgba(0,0,0,.12)}
.lpe-prev-frame iframe{width:100%;height:100%;border:none;display:block;min-height:400px}
.lp-err{color:#c93a3a !important}
.lp-toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:#1f2733;color:#fff;padding:.6rem 1.1rem;border-radius:10px;font-size:.85rem;z-index:300;opacity:0;transition:opacity .2s,transform .2s;pointer-events:none}
.lp-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@media(max-width:1100px){.lpe-body{grid-template-columns:1fr;overflow:auto}.lpe-col-img,.lpe-col-main,.lpe-col-prev{border-right:none;border-bottom:1px solid var(--border)}}

/* Modal produk */
.modal{position:fixed;inset:0;background:rgba(0,0,0,.6);display:flex;align-items:flex-start;justify-content:center;z-index:50;overflow-y:auto;padding:2rem 1rem}
.modal-box{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:1.5rem;width:100%;max-width:640px;margin:auto}
.modal-box h2{margin:.2rem 0 1rem;color:var(--brand)}
.modal-box h3{margin:1.1rem 0 .5rem;font-size:1rem}
.modal-box label{display:flex;flex-direction:column;gap:.3rem;font-size:.85rem;color:var(--muted);flex:1}
.modal-box label.pm-full{width:100%}
.modal-box label.pm-inline{flex-direction:row;align-items:center;gap:.4rem;flex:0 0 auto;color:var(--text)}
.pm-thumb{max-width:70px;max-height:70px;border-radius:8px;border:1px solid var(--border);object-fit:cover;display:none}
.pm-thumb[src]{display:inline-block}
.pm-var,.pm-support{background:var(--panel2);border:1px solid var(--border);border-radius:10px;padding:.6rem;margin-bottom:.5rem}

/* Panel booking manual */
.manualpanel{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:1rem;margin:.8rem 0}
.mbook{background:var(--panel2);border:1px solid var(--border);border-radius:10px;padding:.7rem;margin-bottom:.6rem}

/* Modal Kirim via Mengantar */
.mgo-overlay{position:fixed;inset:0;background:rgba(20,25,35,.55);display:flex;align-items:flex-start;justify-content:center;z-index:80;overflow-y:auto;padding:2rem 1rem;margin:0}
.mgo-box{background:#fff;color:#1f2733;border-radius:14px;width:100%;max-width:1000px;margin:auto;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.mgo-head{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.4rem;border-bottom:1px solid #eef1f5}
.mgo-head h2{margin:0;font-size:1.1rem}
.mgo-body{padding:1.2rem 1.4rem;max-height:70vh;overflow-y:auto}
.mgo-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1rem}
.mgo-config{display:grid;grid-template-columns:1fr 1fr;gap:.7rem 1rem;margin-bottom:1rem;background:#f7f8fa;border:1px solid #eef1f5;border-radius:12px;padding:1rem}
.mgo-field{display:flex;flex-direction:column;gap:.3rem;font-size:.82rem;color:#434c58}
.mgo-field select,.mgo-field input{background:#fff}
.mgo-row{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.mgo-foot{display:flex;justify-content:flex-end;gap:.6rem;padding:1rem 1.4rem;border-top:1px solid #eef1f5}
@media(max-width:720px){.mgo-summary{grid-template-columns:1fr}.mgo-config{grid-template-columns:1fr}}

/* Hasil pencarian alamat */
.searchres{display:flex;flex-direction:column;gap:.2rem;margin:.3rem 0}
.resitem{padding:.5rem .7rem;background:var(--panel2);border:1px solid var(--border);border-radius:8px;cursor:pointer;font-size:.85rem}
.resitem:hover{border-color:var(--brand)}

/* Badge */
.badge{font-size:.7rem;padding:.1rem .45rem;border-radius:20px;background:var(--panel2);color:var(--muted)}
.badge.escalated,.badge.high{background:#fde0e0;color:#c93a3a}
.badge.takeover{background:#fdf3d7;color:#b7791f}
.badge.agent,.badge.intent{background:#d7f5e3;color:#1a8a4e}

/* Console Live */
.console{display:flex;gap:1rem;height:80vh}
.convcol{width:300px;display:flex;flex-direction:column;flex:0 0 auto}
.convsearch{margin-bottom:.5rem;width:100%}
.convlist{flex:1;overflow-y:auto;border:1px solid var(--border);border-radius:12px;padding:.4rem;background:var(--panel)}
.convinfo{width:300px;flex:0 0 auto;align-self:flex-start;max-height:100%;overflow-y:auto;border:1px solid var(--border);border-radius:12px;padding:1rem;background:var(--panel)}
.convinfo h3{margin:.2rem 0 .6rem}
.inforow{display:flex;justify-content:space-between;gap:.5rem;padding:.4rem 0;border-bottom:1px solid var(--border);font-size:.85rem}
.inforow .lbl{color:var(--muted)}
.inforow .val{text-align:right;font-weight:600}
.convitem{padding:.6rem;border-radius:8px;cursor:pointer;border-bottom:1px solid var(--border)}
.convitem:hover,.convitem.sel{background:var(--panel2)}
.convchat{flex:1;display:flex;flex-direction:column;border:1px solid var(--border);border-radius:12px;padding:.8rem;background:var(--panel)}
.convheader{padding:.3rem .2rem .6rem;border-bottom:1px solid var(--border);margin-bottom:.5rem;font-size:.9rem}
.convchat .chatbox{flex:1;border:none;background:transparent;margin:.4rem 0;height:auto}
canvas{background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:.6rem;margin-top:.6rem}
@media(max-width:720px){.app-body{flex-direction:column}.sidebar{width:100%}.grid{grid-template-columns:1fr}.console{flex-direction:column;height:auto}.convcol,.convinfo{width:100%}.convlist{max-height:30vh}}

/* ===== Detail Order redesign (light, jagaai-style) ===== */
.orders2{background:#fff;color:#1f2733;border-radius:14px;padding:1.3rem 1.5rem;border:1px solid #e6e9ef}
.orders2 h1{color:#1f2733;margin:0 0 .3rem}
.o-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin:1.1rem 0 1.3rem}
.o-stat{background:#fff;border:1px solid #e6e9ef;border-radius:14px;padding:1.2rem 1rem;text-align:center;box-shadow:0 1px 2px rgba(20,25,35,.04)}
.o-stat .n{font-size:1.9rem;font-weight:800;color:#f59331;line-height:1}
.o-stat .l{color:#3a4350;font-size:.85rem;margin-top:.45rem}
.o-toolbar{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap;margin-bottom:.4rem}
.o-search{margin-left:auto;background:#fff;border:1px solid #d7dbe2;color:#2b3441;min-width:220px}
.btn-primary{background:#1f6feb;color:#fff}
.btn-primary:hover{background:#175fd0}
.btn-light{background:#fff;border:1px solid #d7dbe2;color:#3a424e;font-weight:600}
.btn-light:hover{background:#f3f5f8}
.o-table{width:100%;border-collapse:collapse;font-size:.85rem;color:#2b3441;margin-top:.8rem}
.o-table th{color:#434c58;font-weight:600;border-bottom:1px solid #e6e9ef;padding:.7rem .6rem;white-space:nowrap;background:#fff}
.o-table td{border-bottom:1px solid #eef1f5;padding:.7rem .6rem;vertical-align:top}
.o-table tr:hover td{background:#fafbfc}
.o-id{color:#1f6feb;font-weight:600;cursor:pointer}
.o-name{color:#1f6feb;font-weight:600;cursor:pointer;display:block}
.o-name:hover,.o-id:hover{text-decoration:underline}
.o-phone{color:#434c58;font-size:.78rem}
.pill{display:inline-block;font-size:.72rem;padding:.2rem .6rem;border-radius:20px;font-weight:600;white-space:nowrap}
.pill.pending{background:#fdf3d7;color:#b7791f}
.pill.shipped{background:#dbeafe;color:#1e5fbf}
.pill.done{background:#d7f5e3;color:#1a8a4e}
.pill.cancel{background:#eceef1;color:#3a4350}
.pill.returned{background:#fde6d2;color:#b5651d}
.pill.unpaid{background:#fde0e0;color:#c93a3a}
.pill.paid{background:#d7f5e3;color:#1a8a4e}
.o-actions{position:relative}
.o-actions>.btn-light{padding:.35rem .7rem;font-size:.8rem}
.amenu{position:absolute;right:0;top:100%;margin-top:.2rem;background:#fff;border:1px solid #e6e9ef;border-radius:10px;box-shadow:0 8px 24px rgba(20,25,35,.14);min-width:150px;z-index:30;display:none;overflow:hidden}
.amenu.open{display:block}
.amenu button{display:block;width:100%;text-align:left;background:none;color:#2b3441;border:none;border-radius:0;padding:.55rem .85rem;font-weight:500;font-size:.82rem}
.amenu button:hover{background:#f3f5f8}
.amenu button.danger{color:#c93a3a}
.amenu button.danger:hover{background:#fde0e0}
/* invoice modal */
.inv-modal{position:fixed;inset:0;background:rgba(20,25,35,.55);display:flex;align-items:flex-start;justify-content:center;z-index:80;overflow-y:auto;padding:2.5rem 1rem}
.inv-box{background:#fff;color:#1f2733;border-radius:14px;width:100%;max-width:720px;margin:auto;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.inv-head{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.4rem;border-bottom:1px solid #eef1f5}
.inv-head h2{margin:0;font-size:1.1rem}
.inv-x{background:none;border:none;color:#434c58;font-size:1.2rem;cursor:pointer;padding:.2rem .4rem}
.inv-x:hover{color:#2b3441}
.inv-body{padding:1.4rem}
.inv-row{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem}
.inv-store{font-weight:600;font-size:1.05rem}
.inv-no{text-align:right}
.inv-no .big{font-size:1.15rem;font-weight:800}
.inv-no .sub{color:#434c58;font-size:.82rem}
.inv-cust{font-size:1.15rem;font-weight:700;margin:1rem 0 .3rem}
.inv-line{color:#3a424e;font-size:.9rem;margin:.2rem 0}
.inv-contact{margin:.7rem 0 .2rem}
.inv-cline{display:flex;align-items:flex-start;gap:.6rem;color:#2b3441;font-size:1rem;line-height:1.5;margin:.6rem 0}
.inv-cline svg{flex:0 0 auto;margin-top:3px}
.inv-loc{display:block;margin-top:.4rem}
.inv-unpaid{background:#eef0f3;color:#6b7280;font-weight:700;padding:.45rem 1.1rem;border-radius:6px;align-self:center;white-space:nowrap}
.inv-unpaid.paid{background:#d7f5e3;color:#1a8a4e}
.inv-qty{color:#434c58;font-weight:500}
.inv-resi{margin-top:1.1rem}
.inv-items{margin-top:1.3rem}
.inv-items .ih{display:flex;justify-content:space-between;font-weight:700;border-bottom:2px solid #1f2733;padding-bottom:.5rem}
.inv-item{display:flex;justify-content:space-between;gap:1rem;padding:.75rem 0;border-bottom:1px dashed #e0e4ea}
.inv-item .sub{color:#434c58;font-size:.82rem;margin-top:.15rem}
.inv-total{display:flex;justify-content:space-between;font-size:1.15rem;font-weight:800;padding:1.1rem 1.4rem;background:#f7f8fa;border-top:1px solid #eef1f5}
.inv-total .amt{color:#1f6feb}
.inv-foot{display:flex;justify-content:flex-end;gap:.6rem;padding:1rem 1.4rem;border-top:1px solid #eef1f5}
/* filter produk & tanggal */
#prodFilter{padding:.45rem .6rem;font-size:.85rem}
.o-daterange{position:relative}
#dateBtn{display:inline-flex;align-items:center;gap:.4rem;padding:.45rem .7rem;font-size:.85rem}
.dr-panel{position:absolute;right:0;top:calc(100% + .35rem);background:#fff;border:1px solid #e6e9ef;border-radius:12px;box-shadow:0 14px 44px rgba(20,25,35,.2);z-index:60;display:none;min-width:640px}
.dr-panel.open{display:flex}
.dr-presets{width:150px;border-right:1px solid #eef1f5;padding:.6rem;display:flex;flex-direction:column;gap:.15rem}
.dr-presets button{background:none;border:none;text-align:left;color:#2b3441;padding:.5rem .6rem;border-radius:8px;font-weight:500;font-size:.85rem;cursor:pointer}
.dr-presets button:hover{background:#f3f5f8}
.dr-presets button.on{background:#1f5fbf;color:#fff}
.dr-right{flex:1;padding:.9rem 1rem 1rem;position:relative}
.dr-calhead{position:absolute;top:.9rem;left:1rem;right:1rem;display:flex;justify-content:space-between;pointer-events:none}
.dr-nav{background:none;border:none;color:#1f6feb;font-size:1.2rem;line-height:1;cursor:pointer;pointer-events:auto;padding:0 .3rem;font-weight:700}
.dr-grids{display:flex;gap:1.4rem}
.dr-month{width:220px}
.dr-mtitle{text-align:center;font-weight:700;color:#1f2733;margin-bottom:.5rem;font-size:.9rem}
.dr-dow,.dr-days{display:grid;grid-template-columns:repeat(7,1fr);gap:.12rem}
.dr-dow span{text-align:center;color:#434c58;font-size:.72rem;padding:.2rem 0}
.dr-dow span.we{color:#c93a3a}
.dr-day{text-align:center;padding:.38rem 0;font-size:.8rem;color:#2b3441;border-radius:6px;cursor:pointer}
.dr-day.we{color:#c93a3a}
.dr-day:hover{background:#eef4ff}
.dr-day.inr{background:#e6effc}
.dr-day.sel{background:#1f5fbf;color:#fff}
.dr-foot{display:flex;justify-content:flex-end;gap:.5rem;margin-top:.9rem}
@media(max-width:720px){.o-stats{grid-template-columns:repeat(2,1fr)}.dr-panel{min-width:0;left:0;right:auto;flex-direction:column}.dr-grids{flex-direction:column}}

/* bayangan halus panel untuk tema terang + separator sidebar */
.card,.chatbox,.modal-box,.manualpanel,.convinfo,.convlist,.convchat,.statusbox .item,canvas{box-shadow:0 1px 2px rgba(20,25,35,.04)}
.sidebar{box-shadow:1px 0 2px rgba(20,25,35,.03)}
.bubble.assistant{border:1px solid var(--border)}

/* ===== Console Live gaya WhatsApp ===== */
.convchat .chatbox{background:#efeae2;padding:.7rem .85rem;background-image:radial-gradient(rgba(0,0,0,.03) 1px,transparent 1px);background-size:22px 22px}
.reply-row{display:flex;gap:.4rem;align-items:center;margin-top:.4rem}
.reply-row #replyInput{flex:1}
.icon-btn{background:transparent;border:1px solid var(--border);color:#3a4350;padding:.5rem .6rem;border-radius:8px;font-size:1.05rem;line-height:1}
.icon-btn:hover{background:var(--panel2)}
.emoji-panel{display:flex;flex-wrap:wrap;gap:.1rem;background:#fff;border:1px solid var(--border);border-radius:10px;padding:.5rem;max-height:170px;overflow-y:auto;box-shadow:0 8px 24px rgba(20,25,35,.14);margin-bottom:.3rem}
.emoji-panel button{background:none;border:none;font-size:1.25rem;padding:.15rem;cursor:pointer;border-radius:6px}
.emoji-panel button:hover{background:#f3f5f8}
.brow{display:flex;margin:.12rem 0}
.brow.me{justify-content:flex-end}
.brow.them{justify-content:flex-start}
.bubble2{max-width:74%;padding:.45rem .65rem .3rem;border-radius:10px;font-size:.9rem;white-space:pre-wrap;word-break:break-word;box-shadow:0 1px 1px rgba(20,25,35,.08)}
.bubble2.them{background:#fff;border:1px solid #e6e9ef;border-top-left-radius:3px}
.bubble2.me{background:#d9fdd3;border-top-right-radius:3px}
.bmetawrap{display:flex;justify-content:flex-end;margin-top:.1rem}
.bmeta{font-size:.68rem;color:#3a4350}
.bmeta b{color:#1a8a4e;font-weight:700}
.tick{margin-left:.2rem;color:#5b6470;font-weight:800;font-size:.82rem;letter-spacing:-1px}
.tick.read{color:#34b7f1}
.presence{color:#1a8a4e;font-size:.82rem;font-style:italic;margin-left:.3rem}
.convitem-top{display:flex;justify-content:space-between;align-items:center;gap:.4rem}
.convitem-top b{font-size:.9rem;font-weight:700;color:var(--text)}
.conv-time{flex:0 0 auto;font-size:.72rem;color:var(--muted);font-weight:500}
.conv-wa{font-size:.74rem;color:var(--muted);font-weight:500;margin:.05rem 0 .2rem}
.convitem-bot{display:flex;justify-content:space-between;align-items:center;gap:.5rem;margin-top:.15rem}
.convitem-bot .muted{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tg-card{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:1.4rem 1.5rem;max-width:600px;box-shadow:0 1px 3px rgba(30,40,70,.05),0 10px 30px rgba(30,40,70,.05)}
.tg-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.95rem 0;border-top:1px solid var(--border)}
.tg-txt{display:flex;flex-direction:column;gap:.2rem;min-width:0}
.tg-txt b{font-size:.95rem;color:var(--text);font-weight:600}
.tg-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;margin-top:1.1rem;padding-top:1.2rem;border-top:1px solid var(--border)}
.tg-fields label{display:flex;flex-direction:column;gap:.35rem;font-size:.85rem;color:var(--muted)}
.chat-datesep{display:flex;justify-content:center;margin:.7rem 0}
.chat-datesep span{background:#ffffff;color:#33404f;font-size:.74rem;font-weight:600;padding:.28rem .8rem;border-radius:8px;box-shadow:0 1px 2px rgba(0,0,0,.12)}
.unread-badge{background:#25d366;color:#fff;font-size:.7rem;min-width:18px;height:18px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;padding:0 .35rem;font-weight:700}
.unread-txt{color:#1f2733!important;font-weight:600}

/* ===== Modern refresh ===== */
:root{--bg:#f5f7fb;--border:#e7eaf1}
.content{padding:1.8rem 2.1rem}
.sidebar{padding:1.2rem 1rem}
.sidebar nav a{font-weight:500;transition:background .15s,color .15s}
.sidebar nav a:hover{background:rgba(37,99,235,.09);color:var(--text)}
.sidebar nav a.active{background:linear-gradient(90deg,#1a5cff,#7b2ff0);color:#fff;box-shadow:0 6px 16px rgba(80,50,200,.26)}
.sidebar nav a.active:hover{background:linear-gradient(90deg,#1a5cff,#7b2ff0);color:#fff}
.navlabel{color:#8a93a3}
.btn-primary{background:linear-gradient(180deg,#3b82f6,#2563eb);box-shadow:0 4px 12px rgba(37,99,235,.24);transition:filter .15s,transform .05s}
.btn-primary:hover{background:linear-gradient(180deg,#2f78f0,#1f56d6);filter:brightness(1.03)}
.btn-primary:active{transform:translateY(1px)}
.btn-light{border:1px solid #dde1ea;border-radius:9px}
input:focus,textarea:focus,select:focus{border-color:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.15)}
.card,.chatbox,.modal-box,.manualpanel,.convinfo,.convlist,.convchat,.statusbox .item{box-shadow:0 1px 3px rgba(30,40,70,.05),0 10px 30px rgba(30,40,70,.05);border-radius:14px}
.o-table tbody tr:hover{background:rgba(37,99,235,.05)}
.btn-del{background:transparent;border:none;color:#e23b3b;cursor:pointer;padding:.35rem;border-radius:7px;line-height:0;display:inline-flex;align-items:center;justify-content:center;transition:background .15s}
.btn-del:hover{background:rgba(226,59,59,.14)}
.btn-del:active{transform:scale(.92)}
.td-act{white-space:nowrap;text-align:right}
.act-wrap{display:flex;align-items:center;gap:.5rem;justify-content:flex-end}
/* Chip ekspedisi (logo) */
.cour-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(112px,1fr));gap:.6rem;margin-top:.3rem}
.cour-chip{display:flex;align-items:center;justify-content:center;min-height:48px;padding:.5rem .7rem;border:2px solid var(--border);border-radius:12px;background:var(--panel);cursor:pointer;transition:border-color .15s,background .15s;position:relative}
.cour-chip:hover{border-color:#c7cdd8}
.cour-chip input{position:absolute;opacity:0;pointer-events:none}
.cour-chip:has(input:checked){border-color:#2b57f0;background:rgba(43,87,240,.07)}
.cour-chip:has(input:checked)::after{content:"✓";position:absolute;top:2px;right:7px;color:#2b57f0;font-weight:800;font-size:.8rem}
.cour-badge{font-weight:700;font-size:.9rem;color:var(--text)}
/* Kartu Profil Agen */
#tab-profil .grid{background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:1.6rem 1.7rem;box-shadow:0 1px 3px rgba(30,40,70,.05),0 12px 34px rgba(30,40,70,.05);gap:1.1rem 1.3rem}
#tab-profil .grid h3{margin:.2rem 0 .5rem;font-size:1rem;color:var(--text)}
#tab-profil .grid input:not([type=checkbox]),#tab-profil .grid textarea,#tab-profil .grid select{border-radius:10px;padding:.6rem .7rem}