:root{--bg:#03060b;--panel:#08111b;--panel2:#0b1623;--line:#1c3450;--text:#f5f9ff;--muted:#8ea0b7;--blue:#1677ff;--green:#2ed394;--red:#ff6670;--yellow:#ffd56a}*{box-sizing:border-box}body{margin:0;font-family:Inter,"Noto Sans Thai",system-ui,sans-serif;background:radial-gradient(circle at 80% 0,#0a2345,transparent 25%),#03060b;color:var(--text);min-height:100vh}.bg-grid{position:fixed;inset:0;pointer-events:none;opacity:.16;background-image:linear-gradient(rgba(42,101,176,.15) 1px,transparent 1px),linear-gradient(90deg,rgba(42,101,176,.15) 1px,transparent 1px);background-size:42px 42px}.login-screen{position:relative;z-index:3;min-height:100vh;display:grid;place-items:center;padding:20px}.login-card{width:min(430px,100%);display:grid;gap:13px;padding:34px;border:1px solid #28486d;border-radius:20px;background:rgba(6,13,22,.96);box-shadow:0 35px 100px rgba(0,0,0,.55)}.login-card img{width:110px;height:110px;object-fit:cover;border-radius:20px;margin:auto}.login-card>span,.kicker{font-size:10px;color:#63afff;letter-spacing:2px;font-weight:800}.login-card>span{text-align:center}.login-card h1{font-size:30px;text-align:center;margin:0}.login-card p{text-align:center;color:var(--muted);font-size:12px;margin:0 0 8px}.login-card label,.product-form label,.coupon-form label,.detail-modal label,.settings-form label{display:grid;gap:6px;font-size:11px;color:#9eafc2}.login-card input,.product-form input,.product-form select,.product-form textarea,.coupon-form input,.coupon-form select,.detail-modal textarea,.settings-form input,.settings-form select,.settings-form textarea,.panel input,.panel select{min-height:44px;border:1px solid #203b5b;border-radius:9px;background:#07101a;color:white;padding:9px 11px;outline:0}.login-card button,.primary{border:1px solid #4597ff;border-radius:9px;background:linear-gradient(#2787ff,#0d63d9);color:white;min-height:43px;padding:0 15px;font-weight:800}.login-card small{color:#ff7a84;text-align:center;min-height:16px}.admin-shell{position:relative;z-index:2;min-height:100vh;display:grid;grid-template-columns:240px 1fr}.sidebar{position:sticky;top:0;height:100vh;border-right:1px solid #142a43;background:rgba(4,9,15,.95);padding:18px 13px;display:flex;flex-direction:column}.admin-brand{display:flex;align-items:center;gap:10px;padding:5px 6px 19px;color:white;text-decoration:none}.admin-brand img{width:47px;height:47px;object-fit:cover;border-radius:11px}.admin-brand div{display:grid}.admin-brand b{font-size:16px}.admin-brand span{font-size:9px;letter-spacing:2px;color:#57a9ff}.sidebar nav{display:grid;gap:4px}.nav-item{display:flex;align-items:center;text-decoration:none;border:0;background:transparent;color:#8295ac;padding:11px 12px;border-radius:9px;text-align:left;font-size:12px}.nav-item:hover,.nav-item.active{background:#0b1928;color:white}.nav-item.active{box-shadow:inset 3px 0 #1677ff}.side-bottom{margin-top:auto;border-top:1px solid #14273d;padding-top:13px}.admin-user{display:flex;align-items:center;gap:9px;padding:7px}.avatar{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#126fea}.admin-user div{display:grid}.admin-user b{font-size:11px}.admin-user small{font-size:9px;color:#75899f}.logout{width:100%;margin-top:8px;min-height:36px;border:1px solid #422b31;border-radius:8px;background:#130d11;color:#ff7982}.content{padding:30px 32px 60px;min-width:0}.topbar{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:24px}.topbar h1{font-size:31px;margin:4px 0}.topbar p{margin:0;color:#8295aa;font-size:12px}.top-actions{display:flex;gap:8px}.ghost-link{display:inline-flex;align-items:center;justify-content:center;min-height:43px;padding:0 14px;border:1px solid #26415f;border-radius:9px;color:#b5c7da;text-decoration:none;background:#08111b;font-size:11px}.view{display:none}.view.active{display:block}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:18px}.stats article{padding:17px;border:1px solid #19324d;border-radius:13px;background:linear-gradient(160deg,#0b1724,#06101a)}.stats span{display:block;color:#7f93aa;font-size:10px}.stats strong{display:block;color:#60b1ff;font-size:24px;margin-top:6px}.dashboard-stats{grid-template-columns:repeat(4,1fr)}.dash-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.panel{border:1px solid #19334f;border-radius:15px;background:rgba(7,14,23,.92);overflow:hidden}.panel-head{padding:17px 18px;border-bottom:1px solid #142a42;display:flex;justify-content:space-between;align-items:center;gap:14px}.panel-head h2{font-size:17px;margin:0 0 4px}.panel-head p{margin:0;color:#7b90a8;font-size:10px}.toolbar{display:flex;gap:8px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:780px}th,td{text-align:left;padding:12px 14px;border-bottom:1px solid #11263c;font-size:11px}th{color:#7590ac;background:#07111c;font-size:9px;letter-spacing:.5px}td{color:#c3cfdd}.product-cell{display:flex;align-items:center;gap:9px}.thumb{width:48px;height:40px;border-radius:7px;object-fit:cover;background:#0b1928}.product-cell div{display:grid}.product-cell small{color:#71879f}.status{display:inline-flex;padding:4px 7px;border-radius:20px;border:1px solid #294866;font-size:9px}.status.available,.status.fulfilled,.status.approved,.status.published{color:#58e0a6;border-color:#2b624d}.status.sold,.status.canceled,.status.rejected,.status.needs_attention{color:#ff7e87;border-color:#68353b}.status.processing,.status.pending{color:#ffd66b;border-color:#6c5930}.status.hidden{color:#94a4b7}.row-actions{display:flex;gap:5px}.row-actions button,.mini-action,.secret-line button{min-height:31px;border:1px solid #2a4665;border-radius:7px;background:#0a1522;color:#d6e1ec;padding:0 9px;font-size:9px}.row-actions .danger,.danger,.mini-action.danger{border-color:#65343a;color:#ff7c84;background:#160d11}.empty{padding:30px;text-align:center;color:#7890aa}.compact-list{padding:10px;display:grid;gap:7px}.compact-item{padding:11px;border:1px solid #15304b;border-radius:9px;background:#07121d;display:flex;justify-content:space-between;gap:10px;align-items:center}.compact-item b{display:block;font-size:11px}.compact-item small{color:#778da5;font-size:9px}.compact-item strong{font-size:11px;color:#67b6ff}.review-admin-grid{padding:14px;display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.review-admin-card{padding:13px;border:1px solid #17314c;border-radius:11px;background:#07121e}.review-admin-card .stars{color:#ffd361}.review-admin-card p{font-size:11px;color:#a9b8c9;line-height:1.6}.review-admin-card footer{display:flex;justify-content:space-between;align-items:center}.review-admin-card footer span{font-size:9px;color:#748aa2}.settings-panel{padding-bottom:18px}.settings-form{padding:18px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}.settings-form .wide{grid-column:1/-1}.settings-form button{width:max-content}.system-box{margin:0 18px 18px;padding:16px;border:1px solid #1e456d;border-radius:12px;background:#07192a}.system-box h3{margin:0 0 5px}.system-box p,.system-box small{color:#8399b0;font-size:10px}.secret-line{display:flex;gap:8px;align-items:center;margin:11px 0}.secret-line code{flex:1;padding:10px;border:1px solid #1e3855;border-radius:8px;background:#050b12;overflow:auto;color:#87c5ff}.modal{position:fixed;z-index:100;inset:0;display:grid;place-items:center;padding:18px;opacity:0;pointer-events:none}.modal.open{opacity:1;pointer-events:auto}.modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(6px)}.product-form,.coupon-form,.detail-modal{position:relative;z-index:1;width:min(820px,100%);max-height:calc(100vh - 36px);overflow:auto;border:1px solid #284766;border-radius:16px;background:#07101a;padding:20px;box-shadow:0 30px 100px rgba(0,0,0,.6)}.coupon-form{width:min(620px,100%)}.detail-modal{width:min(760px,100%)}.form-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.form-head h2{margin:4px 0}.x{width:34px;height:34px;border:1px solid #2c4967;border-radius:50%;background:#0b1622;color:white}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.form-grid .wide{grid-column:1/-1}.check{display:flex!important;grid-template-columns:auto 1fr!important;align-items:center}.check input{min-height:auto;width:auto}.secret-field textarea{border-color:#31547a}.upload-label img{display:none;max-width:220px;max-height:150px;border-radius:9px;margin-top:8px}.upload-label img.show{display:block}.form-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:15px}.ghost{min-height:42px;border:1px solid #29425f;border-radius:9px;background:#08111c;color:#aab9ca;padding:0 14px}.form-error{color:#ff7780;font-size:10px;min-height:14px;margin-top:8px}.fulfill-box{margin-top:16px;padding-top:16px;border-top:1px solid #18324e}.detail-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.detail-grid div{padding:11px;border:1px solid #193550;border-radius:9px}.detail-grid span{display:block;color:#758ca4;font-size:9px}.detail-grid b{font-size:11px}.detail-items{display:grid;gap:6px;margin-top:12px}.detail-item{padding:10px;border:1px solid #16304a;border-radius:8px}.toast{position:fixed;z-index:160;bottom:24px;left:50%;transform:translate(-50%,20px);opacity:0;padding:11px 15px;border:1px solid #2c577f;border-radius:9px;background:#081622;transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:1050px){.admin-shell{grid-template-columns:76px 1fr}.admin-brand div,.sidebar .nav-item{font-size:0}.nav-item{justify-content:center;font-size:0}.nav-item::first-letter{font-size:15px}.admin-user div{display:none}.dashboard-stats{grid-template-columns:repeat(2,1fr)}.settings-form{grid-template-columns:1fr 1fr}.review-admin-grid{grid-template-columns:1fr}}
@media(max-width:720px){.admin-shell{display:block}.sidebar{position:relative;width:100%;height:auto}.sidebar nav{display:flex;overflow:auto}.nav-item{min-width:max-content;font-size:10px!important}.admin-brand div,.admin-user div{display:grid}.side-bottom{display:flex;justify-content:space-between;align-items:center}.logout{width:auto}.content{padding:20px 12px 50px}.topbar{align-items:stretch;flex-direction:column}.stats,.dashboard-stats{grid-template-columns:1fr 1fr}.dash-grid{grid-template-columns:1fr}.settings-form{grid-template-columns:1fr}.settings-form .wide{grid-column:auto}.form-grid{grid-template-columns:1fr}.form-grid .wide{grid-column:auto}.detail-grid{grid-template-columns:1fr 1fr}}

/* ===== V4 stock management ===== */
.kind-pill{display:inline-flex;align-items:center;padding:6px 9px;border-radius:999px;border:1px solid #2c4d6e;font-size:10px;font-weight:700}.kind-pill.single{color:#61e2ae;border-color:#245e4a;background:#071b14}.kind-pill.double{color:#b9a7ff;border-color:#51447b;background:#100c20}.stock-btn{border-color:#2b6b51!important;color:#79e8bd!important}.kind-help{padding:12px 14px;border:1px solid #254865;border-radius:10px;background:#081724;color:#94abc1;font-size:11px;line-height:1.6}.stock-modal-card{position:relative;z-index:1;width:min(1050px,calc(100vw - 34px));max-height:calc(100dvh - 34px);overflow:auto}.stock-add-box{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:end;padding:14px;border:1px solid #1c3d5e;border-radius:12px;background:#07131f;margin-bottom:12px}.stock-add-box label{display:grid;gap:6px;color:#9eb0c3;font-size:11px}.stock-add-box textarea{width:100%;resize:vertical;min-height:120px}.stock-add-box small{color:#758ba1}.stock-summary{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}.stock-summary span{padding:8px 10px;border:1px solid #1b3d5c;border-radius:9px;background:#07131f;color:#8ea5ba;font-size:10px}.stock-summary b{color:#dceeff;font-size:13px}.stock-secret{max-width:420px;white-space:pre-wrap;word-break:break-word;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:10px;color:#bcd0e4;padding:6px 8px;border-radius:8px;background:#05101a;border:1px solid #173451}.status.disabled{color:#b0b7c1;border-color:#4b5360}.stock-table{max-height:430px;overflow:auto}.form-head p{margin:4px 0 0;color:#7f95aa;font-size:11px}.row-actions{flex-wrap:wrap}
@media(max-width:760px){.stock-add-box{grid-template-columns:1fr}.stock-modal-card{width:calc(100vw - 18px)}.stock-secret{max-width:230px}}


/* v5.0 admin interaction feedback */
button,.primary,.ghost,.ghost-link,.nav-item,.mini-action,.secret-line button,.row-actions button,.x,.logout{transition:transform .16s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease,color .18s ease,opacity .18s ease;will-change:transform}
button:not(:disabled),.primary,.ghost,.ghost-link,.nav-item,.mini-action,.secret-line button,.row-actions button,.x,.logout{cursor:pointer}
button:not(:disabled):hover,.primary:hover,.ghost:hover,.ghost-link:hover,.mini-action:hover,.secret-line button:hover,.row-actions button:hover,.x:hover,.logout:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(31,126,255,.17)}
button:not(:disabled):active,.primary:active,.ghost:active,.ghost-link:active,.mini-action:active,.secret-line button:active,.row-actions button:active,.x:active,.logout:active{transform:translateY(0) scale(.96);box-shadow:0 3px 12px rgba(31,126,255,.12)}
.nav-item:hover{transform:translateX(3px)}
button:disabled{cursor:not-allowed;transform:none!important;box-shadow:none!important}

/* v5.2 auth visibility fix */
[hidden]{display:none!important}

/* v5.4 sale editor */
.discount-preview-label{padding:12px 14px;border:1px dashed rgba(61,139,255,.35);border-radius:12px;background:rgba(31,111,235,.06)}
.discount-preview-label strong{display:block;margin-top:6px;font-size:18px;color:#68b5ff}
.admin-old-price{text-decoration:line-through;opacity:.55;margin-right:5px}

/* v5.6 - bank settings preview + QR */
.bank-admin-card{--bank:#4f237c;--bank2:#7b3fb2;border:1px solid var(--bank2);border-radius:13px;padding:14px 16px;background:linear-gradient(135deg,rgba(79,35,124,.22),#07101a);display:flex;justify-content:space-between;gap:12px;align-items:center}.bank-admin-card[data-bank="kbank"]{--bank:#138447;--bank2:#20a75d;background:linear-gradient(135deg,rgba(19,132,71,.2),#07101a)}.bank-admin-card[data-bank="ktb"]{--bank:#1499d6;--bank2:#2a6ee8;background:linear-gradient(135deg,rgba(20,153,214,.19),#07101a)}.bank-admin-card[data-bank="bbl"]{--bank:#174a9d;--bank2:#2466c1;background:linear-gradient(135deg,rgba(23,74,157,.2),#07101a)}.bank-admin-card[data-bank="bay"]{--bank:#d5a812;--bank2:#f0c729;background:linear-gradient(135deg,rgba(213,168,18,.18),#07101a)}.bank-admin-card[data-bank="gsb"]{--bank:#d72b86;--bank2:#ee5ca6;background:linear-gradient(135deg,rgba(215,43,134,.18),#07101a)}.bank-admin-card[data-bank="ttb"]{--bank:#1956bf;--bank2:#f17721;background:linear-gradient(135deg,rgba(25,86,191,.18),#07101a)}.bank-admin-card[data-bank="other"]{--bank:#246ba8;--bank2:#338ad0;background:linear-gradient(135deg,rgba(36,107,168,.18),#07101a)}.bank-admin-card div{display:grid;gap:4px}.bank-admin-card b{color:#fff}.bank-admin-card span{font-size:20px;font-weight:900}.bank-admin-card small{color:#8da0b5}.bank-qr-admin{display:flex;align-items:center;gap:14px;padding:12px;border:1px solid #203b58;border-radius:13px;background:#08131f}.bank-qr-admin img{width:120px;height:120px;object-fit:contain;background:#fff;border-radius:10px;padding:5px}.bank-qr-admin>div:last-child{display:flex;flex-wrap:wrap;gap:8px}.bank-qr-admin #bankQrAdminEmpty{width:120px;height:120px;border:1px dashed #34516e;border-radius:10px;display:grid;place-items:center;color:#7f95aa;font-size:11px;text-align:center}.bank-qr-admin button{min-height:38px}.bank-qr-admin button.danger{border-color:#7c343a;color:#ff8a91}
@media(max-width:700px){.bank-admin-card{align-items:flex-start;flex-direction:column}.bank-qr-admin{align-items:flex-start;flex-direction:column}}

/* v7.3 Auto Connect ops / queue / stress test */
.ops-summary{margin:14px 0;padding:12px 14px;border:1px solid var(--line,#2b4052);border-radius:12px;background:rgba(9,24,38,.66);font-size:13px;line-height:1.6}
.compact-table{margin-top:12px;max-height:260px;overflow:auto}
.compact-table table{min-width:620px}
.compact-table th,.compact-table td{padding:10px 12px;font-size:12px;vertical-align:middle}
.inline-otp{display:flex;gap:6px;align-items:center;min-width:150px}
.inline-otp input{width:86px;min-width:0;padding:8px 10px}
.inline-otp button{padding:8px 10px;white-space:nowrap}
.order-timeline{margin-top:16px;border:1px solid var(--line,#2b4052);border-radius:14px;padding:14px;background:rgba(6,18,29,.55)}
.order-timeline h3{margin:0 0 10px;font-size:14px}
.timeline-row{display:grid;grid-template-columns:150px minmax(0,1fr);gap:12px;padding:9px 0;border-top:1px solid rgba(124,151,173,.16)}
.timeline-row:first-of-type{border-top:0}
.timeline-row time{font-size:11px;color:var(--muted,#8195a8)}
.timeline-row div{min-width:0;display:flex;flex-direction:column;gap:3px}
.timeline-row b{font-size:12px;word-break:break-word}
.timeline-row span{font-size:12px;color:var(--muted,#9badbd);line-height:1.5;word-break:break-word}
@media(max-width:760px){.timeline-row{grid-template-columns:1fr;gap:3px}.compact-table table{min-width:540px}}

/* v8.0 analytics / market dashboard */
.analytics-head-panel{margin-bottom:14px}.analytics-note{display:block;color:#7f95aa;line-height:1.6}.analytics-kpis{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:14px}.analytics-kpis article{min-height:108px}.analytics-kpis article small{display:block;margin-top:6px;color:#7f95aa;font-size:10px}.analytics-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:14px}.analytics-grid .analytics-wide{grid-column:1/-1}.analytics-card{min-width:0}.chart-shell{height:300px;min-height:240px;border:1px solid rgba(49,82,113,.42);border-radius:12px;background:linear-gradient(180deg,rgba(9,24,39,.72),rgba(4,11,18,.7));overflow:hidden;padding:8px}.analytics-svg{width:100%;height:100%;display:block}.analytics-svg text{font-family:Inter,"Noto Sans Thai",system-ui,sans-serif;fill:#8096ad;font-size:11px}.analytics-svg .grid{stroke:#17314a;stroke-width:1}.analytics-svg .line{fill:none;stroke:#3c9cff;stroke-width:3;vector-effect:non-scaling-stroke}.analytics-svg .line2{fill:none;stroke:#38d39f;stroke-width:2.5;vector-effect:non-scaling-stroke}.analytics-svg .area{fill:rgba(37,132,255,.12)}.analytics-svg .bar{fill:#2584ff}.analytics-svg .bar2{fill:#37d29f}.analytics-svg .bar-value{fill:#a8bad0;font-weight:700}.analytics-svg .dot{fill:#8dc8ff}.analytics-table{max-height:430px}.analytics-table table{min-width:720px}.analytics-table.compact table{min-width:420px}.analytics-metric-list{display:grid;grid-template-columns:1fr 1fr;gap:8px}.analytics-metric{padding:12px;border:1px solid #193651;border-radius:10px;background:#07131f}.analytics-metric span{display:block;color:#7f95aa;font-size:10px}.analytics-metric b{display:block;margin-top:4px;font-size:18px}.analytics-rank-list{display:grid;gap:8px}.analytics-rank{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 12px;border:1px solid #18334d;border-radius:10px;background:#07131f}.analytics-rank b{white-space:nowrap}.analytics-rank small{display:block;color:#7f95aa;margin-top:2px}.analytics-empty{padding:24px;text-align:center;color:#6f8499}.analytics-toolbar-note{color:#7f95aa;font-size:10px}@media(max-width:1100px){.analytics-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.analytics-grid{grid-template-columns:1fr}.analytics-grid .analytics-wide{grid-column:auto}}@media(max-width:680px){.analytics-kpis{grid-template-columns:1fr 1fr}.chart-shell{height:250px}.analytics-metric-list{grid-template-columns:1fr}}

/* v9.0 order timeline collapse/expand */
.order-timeline h3{margin:0}
.timeline-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px}
.timeline-toggle-btn{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:0 11px;border:1px solid #2a4665;border-radius:8px;background:#0a1522;color:#b5c7da;font-size:10px;white-space:nowrap}
.timeline-toggle-chevron{display:inline-block;transition:transform .18s ease;font-size:10px}
.order-timeline.expanded .timeline-toggle-chevron{transform:rotate(180deg)}
.timeline-summary{display:flex;flex-wrap:wrap;gap:6px 14px;padding:10px 12px;border:1px solid rgba(124,151,173,.16);border-radius:10px;background:rgba(9,24,38,.5);font-size:11px;color:#9badbd}
.timeline-summary b{color:#dceeff}
.timeline-full{overflow:hidden;max-height:0;opacity:0;transition:max-height .22s ease,opacity .18s ease}
.order-timeline.expanded .timeline-full{max-height:460px;opacity:1;overflow-y:auto;margin-top:6px}
@media(max-width:760px){.timeline-head{flex-wrap:wrap}.order-timeline.expanded .timeline-full{max-height:320px}}

/* v8.1 compact product ranking chart */
#productChart{min-height:140px;max-height:360px}
.product-chart-shell{height:auto;min-height:156px;padding:8px 12px}
@media(max-width:680px){.product-chart-shell{min-height:150px;padding:6px}#productChart{min-height:140px}}