@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap";*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0;overflow:hidden;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none;background:#02070c}button{font:inherit;cursor:pointer}.kioskShell{position:relative;width:100vw;height:100vh;overflow:hidden;display:grid;place-items:center;color:#fff7e8;background:linear-gradient(125deg,#02070ce0,#051926d1),radial-gradient(circle at 70% 10%,rgba(212,145,57,.24),transparent 32%),linear-gradient(135deg,#02070c,#082033 58%,#02070c)}.ambient{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:linear-gradient(180deg,rgba(255,255,255,.05),transparent 28%),repeating-linear-gradient(0deg,rgba(255,255,255,.022) 0 1px,transparent 1px 7px)}.kioskTop{position:absolute;top:28px;left:36px;right:36px;z-index:2;min-height:82px;display:flex;align-items:center;gap:14px;justify-content:flex-end}.clockPill,.presencePill{min-height:62px;align-items:center;border:1px solid rgba(214,150,62,.45);border-radius:999px;padding:8px 18px;background:#03101a9e;box-shadow:0 14px 34px #0000003d}.clockPill{min-width:126px;display:grid;place-items:center;color:#fff7e8;font-size:25px;font-weight:900;letter-spacing:0}.presencePill{min-width:142px;display:grid;grid-template-columns:auto 1fr;gap:10px}.presencePill strong{color:#ffd284;font-size:30px}.presencePill span{color:#d8e0e3;font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}.idlePanel,.statusPanel{position:relative;z-index:1;display:grid;justify-items:center;gap:28px;text-align:center;padding:40px}.heroLogo{width:min(238px,38vw);height:auto;filter:drop-shadow(0 18px 28px rgba(0,0,0,.7))}.tapHint{margin:6px 0 0;border:1px solid rgba(214,150,62,.38);border-radius:999px;padding:12px 22px;color:#ffd284;background:#03101a80;font-size:clamp(14px,1.2vw,18px);font-weight:600;letter-spacing:0;text-shadow:0 5px 12px rgba(0,0,0,.56);animation:breathe 1.8s ease-in-out infinite}.lastMessage{max-width:920px;margin:4px 0 0;border:1px solid rgba(214,150,62,.42);border-radius:14px;padding:18px 26px;color:#fff7e8;background:#03101aad;font-size:clamp(24px,3.8vw,48px);font-weight:800;line-height:1.12;box-shadow:0 18px 42px #00000052}.employeePanel{position:relative;z-index:1;width:min(1260px,calc(100vw - 72px));height:min(760px,calc(100vh - 152px));display:grid;grid-template-rows:auto minmax(0,1fr) 116px;gap:24px;border:1px solid rgba(214,150,62,.38);border-radius:24px;padding:30px;background:#03101ab8;box-shadow:0 28px 80px #00000073;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.panelBackButton{position:absolute;top:24px;right:24px;min-width:112px;min-height:48px;border:1px solid rgba(255,244,223,.2);border-radius:999px;color:#fff7e8;background:#ffffff1a;font-size:16px;font-weight:800;box-shadow:0 12px 28px #0000003d}.panelBackButton:active{transform:translateY(1px)}.panelIntro p{margin:0 0 7px;color:#ffd284;font-size:13px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.panelIntro h1{margin:0;color:#fff7e8;font-size:clamp(38px,5vw,68px);line-height:1}.employeeGrid{min-height:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));grid-auto-rows:minmax(150px,1fr);gap:16px;overflow:auto;padding:2px}.employeeTile{min-width:0;min-height:150px;display:grid;justify-items:center;align-content:center;gap:11px;border:1px solid rgba(255,244,223,.14);border-radius:18px;color:#fff7e8;background:#ffffff13;box-shadow:inset 0 1px #ffffff14;transition:transform .16s ease,border-color .16s ease,background .16s ease}.employeeTile.selected{transform:translateY(-2px);border-color:#ffd284;background:#d6963e38;box-shadow:0 18px 40px #00000052}.employeeTile.present{border-color:#75b7709e}.avatar{width:62px;height:62px;display:grid;place-items:center;border-radius:50%;color:#06111c;background:linear-gradient(145deg,#ffd284,#c98a35);font-size:22px;font-weight:900}.employeeTile strong{overflow:hidden;max-width:100%;color:#fff7e8;font-size:30px;line-height:1;text-overflow:ellipsis;white-space:nowrap}.employeeTile small{color:#d8e0e3;font-size:13px;font-weight:700}.actionDock{display:grid;grid-template-columns:minmax(0,1fr);grid-auto-flow:column;grid-auto-columns:220px;gap:14px;align-items:center;border:1px solid rgba(255,244,223,.12);border-radius:18px;padding:14px;background:#02080ead;opacity:.45}.actionDock.visible{opacity:1}.actionDock span{display:block;color:#9fb0b8;font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.actionDock strong{display:block;margin-top:4px;color:#fff7e8;font-size:32px}.primaryAction,.secondaryAction{min-height:76px;border:0;border-radius:14px;padding:0 24px;font-size:23px;font-weight:900}.primaryAction{color:#06111c;background:#ffd284}.secondaryAction{color:#fff7e8;background:#ffffff24;border:1px solid rgba(255,244,223,.2)}.primaryAction:disabled,.secondaryAction:disabled{cursor:default;opacity:.35}.breakChoices{display:grid;gap:16px;margin:40px auto 0;max-width:520px}.breakChoices button,.keypadGrid button{min-height:72px;font-size:24px}.breakKeypad{margin:32px auto 0;max-width:520px}.breakInput{border:1px solid rgba(255,255,255,.18);border-radius:8px;font-size:44px;font-weight:800;padding:20px;text-align:center}.keypadGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:16px}.statusPanel{min-width:min(720px,calc(100vw - 48px));border:1px solid rgba(214,150,62,.4);border-radius:22px;background:#03101ab8;box-shadow:0 24px 74px #0000006b}.statusPanel h1{margin:0;font-size:clamp(36px,5vw,66px)}.statusPanel p{max-width:620px;margin:0;color:#d8e0e3;font-size:22px;line-height:1.35}.pairingPanel{min-width:min(760px,calc(100vw - 48px));gap:24px}.pairingPanel h1{margin:10px 0 14px;color:#ffd284;font-size:clamp(58px,12vw,118px);line-height:.95;letter-spacing:.08em}.pairingLabel{color:#ffd284!important;font-size:14px!important;font-weight:900;letter-spacing:.14em;text-transform:uppercase}.pairingMessage{margin-top:18px!important;color:#ffd284!important;font-size:18px!important}.spinner{width:72px;height:72px;border:7px solid rgba(255,210,132,.22);border-top-color:#ffd284;border-radius:50%;animation:spin .8s linear infinite}.emptyState{min-height:220px;display:grid;place-items:center;border:1px dashed rgba(255,244,223,.22);border-radius:18px;color:#d8e0e3;font-size:22px}@keyframes spin{to{transform:rotate(360deg)}}@keyframes breathe{0%,to{opacity:.68;transform:translateY(0)}50%{opacity:1;transform:translateY(-2px)}}@media(max-width:760px){.kioskTop{left:18px;right:18px}.presencePill{min-width:96px}.clockPill{min-width:94px;min-height:54px;font-size:20px}.employeePanel{width:calc(100vw - 24px);height:calc(100vh - 118px);padding:18px;grid-template-rows:auto minmax(0,1fr) auto}.panelBackButton{top:16px;right:16px;min-width:88px;min-height:42px;font-size:14px}.employeeGrid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:138px}.actionDock{grid-template-columns:1fr;grid-auto-flow:row;grid-auto-columns:auto}}