:root{color:#1a1a1a;font-synthesis:none;--orange:#f39c12;--red:#e74c3c;--green:#a2b952;--gray:#e6e6e6;background:#f5f4f0;font-family:system-ui,sans-serif;font-size:16px}*{box-sizing:border-box}body{margin:0}main{max-width:760px;margin:auto;padding:16px}header{justify-content:space-between;align-items:center;gap:12px;display:flex}header b{font-size:1.7rem}header p{letter-spacing:.12em;font-size:.75rem}section{background:#fff;border:1px solid #ccc;border-radius:8px;margin:16px 0;padding:20px}h1{font-size:1.5rem}h2{overflow-wrap:anywhere;font-size:clamp(1.5rem,6vw,2.4rem);line-height:1.1}p{overflow-wrap:anywhere;line-height:1.5}label{gap:8px;margin:12px 0;font-weight:600;display:grid}input,textarea,button{font:inherit;border:1px solid #666;border-radius:8px;width:100%;max-width:100%;min-height:48px;padding:13px}textarea{resize:vertical}button{color:#fff;cursor:pointer;background:#171717;margin:6px 0;font-weight:700}button:disabled{opacity:.5;cursor:not-allowed}.secondary{color:#171717;background:#fff}.labels{grid-template-columns:1fr 1fr;gap:12px;display:grid}.labels label{min-width:0}.online,.offline{overflow-wrap:anywhere;border-radius:4px;padding:8px;font-size:.75rem;font-weight:800}.online{background:#d2f0d8}.offline{background:#ffe2bf}.small{font-variant-numeric:tabular-nums;font-size:.85rem}.camera{object-fit:contain;background:#111;border-radius:10px;width:100%;height:min(40svh,280px);margin:12px 0}.hidden{display:none}.scan{border-width:4px}.VALID{background:#effff1;border-color:#167334}.ALREADY_USED{background:#fff4ce;border-color:#926200}.INVALID,.VOID,.REFUNDED,.WRONG_EVENT{background:#fff2f2;border-color:#a31e1e}.NETWORK_ERROR,.SERVER_ERROR{background:#fff8e8;border-color:#866100}.band{color:#141414;border:2px solid #171717;border-radius:8px;margin:16px 0;padding:18px}.band strong{font-size:3rem;line-height:1}.band p{font-size:1.25rem;font-weight:800}.VVIP{background:var(--orange)}.VIP{background:var(--red)}.REGULER_A{background:var(--green)}.REGULER_B{background:var(--gray)}.notice{background:#fff3d8;border:1px solid #967200;border-radius:8px;padding:12px}li{overflow-wrap:anywhere;margin-bottom:10px;line-height:1.6}ul{padding-left:20px}footer{padding:12px;font-size:.9rem}footer a,.context a{align-items:center;min-height:48px;display:inline-flex}.metrics{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.metrics dd{margin:6px 0;font-size:1.8rem;font-weight:800}a{color:#174e94;text-underline-offset:3px}a,button,input,textarea{touch-action:manipulation}:focus-visible{outline-offset:4px;outline:3px solid #135ecc}.skip{background:#fff;padding:12px;position:absolute;top:-100px}.skip:focus{top:8px}.monitor pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:.8rem}h2:focus{outline:none}@media (width<=380px){main{padding:10px}section{padding:14px}.labels{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.band strong{font-size:2.5rem}}[hidden]{display:none!important}.context h1{margin:0 0 8px}.context>p{margin:8px 0;font-size:14px}.context .labels label{margin-bottom:0}.context-compact{padding:12px 16px}.context-compact h1{font-size:16px}.context-compact>p{font-size:12px}.context-compact .result-context{font-size:14px}.scan h2{margin:4px 0 18px}.scan form{border-top:1px solid #d0cbc1;margin-top:16px;padding-top:4px}.scan form button{color:#1a1a1a;background:#fff}.scan .band{padding:16px}.scan .band p{margin:16px 0}.next-action{padding-block:8px max(8px, env(safe-area-inset-bottom));background:inherit;z-index:2;position:sticky;bottom:0}.next-action button{border:2px solid #fff;min-height:56px;margin:0;box-shadow:0 0 0 1px #1a1a1a}.supervisor-tools{border-top:3px solid #1a1a1a}.supervisor-tools h2{margin-top:0;font-size:22px}.RATE_LIMITED{background:#fff8e8;border-color:#866100}.AUTH_EXPIRED{background:#f0f5fc;border-color:#174e94}@media (width>=1100px){main{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:start;gap:0 24px;max-width:1080px;display:grid}main>header,main>footer,main>.notice{grid-column:1/-1}.scan{grid-area:2/2/span 3}.context,.supervisor-tools{grid-column:1}}@media (height<=500px) and (orientation:landscape){.camera{height:180px}.context{padding:12px}.context>p{font-size:12px}.band{grid-template-columns:auto 1fr;align-items:center;gap:12px;display:grid}.band>b{grid-column:1/-1}.band p{margin:0}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
