/* Venue clock-in kiosk (Windows tablets, landscape-first, works in portrait) */
body.kiosk { background: #0f172a; color: #e5e7eb; user-select: none; -webkit-user-select: none; overscroll-behavior: none; }
.k-setup { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 16px; color: var(--ink); }
.k-main { min-height: 100vh; display: flex; flex-direction: column; }
.k-head { display: flex; justify-content: space-between; align-items: center; padding: 18px 28px; border-bottom: 1px solid #1f2937; }
.k-venue { font-size: 26px; font-weight: 800; color: #fff; }
.k-date { color: #94a3b8; }
.k-clock { font-size: 44px; font-weight: 300; font-variant-numeric: tabular-nums; color: #fff; }
.k-body { flex: 1; display: flex; align-items: center; justify-content: center; padding: 16px; }
.k-left { width: 100%; max-width: 440px; text-align: center; }
.k-prompt { font-size: 20px; color: #cbd5e1; margin: 0 0 14px; }
.k-dots { display: flex; justify-content: center; gap: 18px; margin-bottom: 8px; }
.k-dots i { width: 20px; height: 20px; border-radius: 50%; border: 2px solid #64748b; display: block; }
.k-dots i.on { background: #fff; border-color: #fff; }
.k-dots.shake { animation: shake .35s; }
@keyframes shake { 25% { transform: translateX(-10px); } 75% { transform: translateX(10px); } }
.k-msg { min-height: 22px; color: #fca5a5; margin: 6px 0 10px; }
.k-pad { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.k-pad button { height: 78px; font-size: 30px; border-radius: 14px; background: #1e293b; color: #fff; border: 1px solid #334155; justify-content: center; }
.k-pad button:active { background: #334155; }
.k-pad button.fn { font-size: 18px; color: #94a3b8; }
.k-act, .k-done { padding: 10px; }
.k-name { font-size: 30px; font-weight: 700; color: #fff; }
.k-shift { color: #94a3b8; margin: 6px 0 20px; font-size: 17px; }
.k-buttons { display: grid; gap: 14px; }
.k-buttons button { height: 84px; font-size: 24px; font-weight: 700; border-radius: 14px; justify-content: center; border: 0; color: #fff; }
.k-buttons .in { background: #15803d; }
.k-buttons .out { background: #b91c1c; }
.k-buttons .break_start, .k-buttons .break_end { background: #a16207; }
.k-cancel { margin-top: 18px; background: transparent; color: #94a3b8; border-color: #334155; min-height: 48px; padding: 0 24px; }
.k-tick { font-size: 74px; color: #4ade80; line-height: 1; }
.k-foot { display: flex; gap: 14px; align-items: center; padding: 10px 20px; border-top: 1px solid #1f2937; color: #94a3b8; font-size: 13px; flex-wrap: wrap; }
.k-net::before { content: ''; display: inline-block; width: 9px; height: 9px; border-radius: 50%; background: #22c55e; margin-right: 6px; }
.k-net.off::before { background: #f59e0b; }
.k-small { background: transparent; color: #94a3b8; border-color: #334155; min-height: 30px; font-size: 12px; }
@media (max-height: 640px) { .k-pad button { height: 60px; } .k-clock { font-size: 32px; } .k-head { padding: 10px 18px; } }