:root,[data-theme=dark]{--bg:#0d1020;--bg2:#151a30;--card:#1b2140;--ink:#eef0fa;--mut:#9aa3c7;--line:#2a3158;--acc:#6c7cff;--acc2:#f5b301;--ok:#2fbf71;--bad:#ff5d6c;--inp:#20274a}
[data-theme=light]{--bg:#f4f6fb;--bg2:#ffffff;--card:#ffffff;--ink:#141a33;--mut:#5d6788;--line:#e1e5f0;--acc:#4b5cf0;--acc2:#d99a00;--ok:#1a9d58;--bad:#d93848;--inp:#f0f2f9}
html,body{background:var(--bg);color:var(--ink)}body{font:15px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
header{background:var(--bg2);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5;padding:10px 14px}
header h1{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:20px}.logo{height:30px;width:30px;object-fit:contain;border-radius:6px;vertical-align:middle;margin-right:6px}.sn{font-weight:800}
nav{display:flex;gap:4px;overflow-x:auto;padding-top:8px;scrollbar-width:none}nav button{background:transparent;color:var(--mut);border:1px solid var(--line);white-space:nowrap}nav button.on{background:var(--acc);color:#fff;border-color:var(--acc)}
button,.btn{background:var(--acc);color:#fff;border:0;border-radius:10px;padding:8px 14px;font-weight:600;text-decoration:none;display:inline-block;transition:transform .05s,filter .15s}button:hover,.btn:hover{filter:brightness(1.1)}button:active{transform:scale(.98)}
.ghost,button.ghost,.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}.sm2{padding:5px 10px;font-size:13px}.danger{background:var(--bad)}button:disabled{opacity:.45}
input,select,textarea{background:var(--inp);color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:8px 10px}input:focus,select:focus,textarea:focus{outline:2px solid var(--acc);outline-offset:0}
.card,.cc,.ev,.kpis div,.paycard,.setc,.calc{background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:0 1px 2px #0002}
.card{padding:14px}td,th{border-bottom:1px solid var(--line)}th{color:var(--mut);font-weight:600;font-size:13px}a{color:var(--acc)}.pr,small{color:var(--mut)}.msg{color:var(--ok)}
.kpis b{color:var(--ink)}.kpis div{color:var(--mut)}.detail{background:var(--bg)}.hist{background:var(--bg2)}
.thumb{height:40px;width:29px;object-fit:cover;border-radius:4px;vertical-align:middle;margin-right:8px;background:var(--inp)}a.cl{text-decoration:none;color:var(--ink);font-weight:600}
.cgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}.cgrid.sm{grid-template-columns:repeat(auto-fill,minmax(110px,1fr))}
.cc{padding:8px;display:flex;flex-direction:column;gap:4px;text-decoration:none;color:var(--ink)}.cc img{width:100%;aspect-ratio:63/88;object-fit:contain;border-radius:8px;background:var(--inp)}
.badge{background:var(--acc2);color:#000;border-radius:6px;padding:1px 6px;font-size:11px;font-weight:700}.badge.ok{background:var(--ok);color:#fff}
.setgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}.setc{padding:10px;display:flex;flex-direction:column;gap:4px;text-decoration:none;color:var(--ink)}.setc img{height:56px;object-fit:contain;width:100%}.setc .ph{font-size:32px;text-align:center}[data-theme=dark] .setc img[src$=".svg"]{filter:invert(1)}
.sethead{display:flex;gap:16px;align-items:center;flex-wrap:wrap}.setlogo{max-height:90px;max-width:240px;object-fit:contain}[data-theme=dark] .setlogo[src$=".svg"],[data-theme=dark] img.mini[src$=".svg"]{filter:invert(1)}img.mini{height:18px;vertical-align:middle;margin-right:6px}
.hero{max-width:760px;margin:auto;padding:20px 4px}.hero h1{font-size:40px;margin:0;background:linear-gradient(90deg,var(--acc),var(--acc2));-webkit-background-clip:text;background-clip:text;color:transparent}.lead{font-size:19px}.ticks li{margin:6px 0}
.stack{display:flex;flex-direction:column;gap:10px;max-width:520px}.stack label{display:flex;flex-direction:column;gap:4px;font-weight:600}fieldset{border:1px solid var(--line);border-radius:12px;display:flex;flex-direction:column;gap:8px}
.paygrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin:12px 0}.paycard{padding:12px;display:flex;flex-direction:column;gap:8px}.qr svg{width:180px;height:180px;background:#fff;border-radius:8px;padding:4px}.copy{user-select:all}
.calc{padding:12px;margin:12px 0;display:flex;flex-direction:column;gap:8px}.calc .sl{display:flex;flex-direction:column}.calc input[type=range]{width:100%;accent-color:var(--acc)}.bar{height:8px;background:var(--inp);border-radius:4px;overflow:hidden}.bar span{display:block;height:100%;background:linear-gradient(90deg,var(--bad),var(--acc2),var(--ok))}.pos{color:var(--ok)!important}.neg{color:var(--bad)!important}
.cam{position:relative;max-width:480px}.cam video{width:100%;border-radius:12px;background:#000;aspect-ratio:3/4;object-fit:cover}.guide{position:absolute;inset:6% 12%;border:2px dashed #fff8;border-radius:12px;pointer-events:none}
.lbls{display:flex;flex-wrap:wrap;gap:4px}.lbl{display:flex;justify-content:space-between;gap:4px;border:1px dashed #999;padding:4px;overflow:hidden;color:#000;background:#fff;box-sizing:border-box}.lbl .lt{flex:1;min-width:0;font-size:9px;line-height:1.2}.lbl .lq svg{width:.7in;height:.7in}.t-toploader .lq svg{width:.6in;height:.6in}.t-shelf .lt{font-size:12px}.t-shelf .lp{font-size:22px}.lbld{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:10px}
footer{border-top:1px solid var(--line);margin-top:24px;color:var(--mut)}
@media(max-width:700px){header h1{font-size:17px}.cgrid{grid-template-columns:repeat(2,1fr)}.paygrid{grid-template-columns:1fr}.qr svg{width:220px;height:220px}button,.btn{padding:9px 12px}}
@media print{.lbl{border:0}}
.cc.best{outline:3px solid var(--ok)}.pby{font-size:11px;font-weight:500;color:var(--mut)}