*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{background:#fff;color:#111;font-family:Noto Sans Thai,system-ui,sans-serif}#root{min-height:100%}.qr-screen{min-height:100vh;display:flex;flex-direction:column;align-items:center;background:#fff;padding:0 16px 16px}.statusbar{width:100%;display:flex;gap:12px;align-items:center;font-size:14px;color:#555;padding:10px 4px}.statusbar b{color:#000;font-size:16px}.statusbar .ok{color:#16a34a;margin-left:auto}.statusbar .off{color:#b91c1c;margin-left:auto}.clock-warning{width:100%;background:#dc2626;color:#fff;font-weight:700;padding:14px;border-radius:10px;margin-bottom:8px;font-size:16px}.qr-holder{background:#fff}.qr-holder canvas{display:block}.countdown-track{width:100%;max-width:480px;height:4px;background:#eee;border-radius:999px;overflow:hidden;margin:6px 0 10px}.countdown-fill{height:100%;background:#999;transition:width .25s linear}.backup-code{font-size:64px;font-weight:800;letter-spacing:6px;font-variant-numeric:tabular-nums;color:#000}.backup-hint{color:#666;font-size:15px;margin-top:2px;text-align:center}.actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:auto;padding-top:18px}.actions button{font-family:inherit;font-size:15px;padding:12px 18px;border:1px solid #ccc;background:#f7f7f7;border-radius:10px;cursor:pointer}.setup{max-width:420px;margin:0 auto;padding:32px 20px;display:flex;flex-direction:column;gap:16px}.setup h1{font-size:22px}.setup p{color:#555}.setup label{display:flex;flex-direction:column;gap:6px;font-weight:600}.setup input{font-size:20px;padding:12px;border:1px solid #bbb;border-radius:10px;font-family:inherit}.setup button{font-size:18px;font-weight:700;padding:14px;background:#111;color:#fff;border:none;border-radius:10px;cursor:pointer}.setup button:disabled{opacity:.4}.setup .err{color:#b91c1c;font-weight:600}.setup .hint{font-size:14px}.guide{border:1px solid #ddd;border-radius:12px;padding:4px 14px;background:#fafafa}.guide summary{cursor:pointer;font-weight:700;font-size:16px;padding:10px 0;list-style:none}.guide summary::-webkit-details-marker{display:none}.guide-body{padding:4px 0 12px}.guide-body h3{font-size:15px;margin:14px 0 6px;color:#b45309}.guide-body ol,.guide-body ul{margin:0 0 4px 20px;line-height:1.7;font-size:15px}.guide-body li{margin-bottom:3px}.spot-table{width:100%;border-collapse:collapse;margin-top:6px;font-size:15px}.spot-table td{border:1px solid #e5e5e5;padding:7px 10px}.spot-table td:first-child{font-weight:800;width:58px;text-align:center;background:#f3f4f6}.guide-body .note{margin-top:10px;padding:10px 12px;background:#fef3c7;border:1px solid #fcd34d;border-radius:10px;font-size:14px;line-height:1.6}.help-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:flex;align-items:center;justify-content:center;background:#00000080;padding:20px}.help-card{background:#fff;border-radius:16px;padding:22px;max-width:440px;width:100%;box-shadow:0 20px 60px #0000004d}.help-card h2{font-size:20px;margin-bottom:14px}.help-card ul{margin:0 0 18px 4px;list-style:none;line-height:1.8;font-size:16px}.help-card li{margin-bottom:10px}.help-close{width:100%;font-family:inherit;font-size:17px;font-weight:700;padding:14px;background:#111;color:#fff;border:none;border-radius:12px;cursor:pointer}