@font-face{font-family:RK;src:url('/tv-font.woff2') format('woff2');font-weight:500;font-display:swap}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#09090b;color:#f5f4f1;font-family:RK,Arial,sans-serif}
button,input{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer;border:0;color:inherit}
button:focus,a:focus,input:focus{outline:3px solid #e6bd72;outline-offset:3px}
::selection{background:#e6bd72;color:#09090b}a{color:#e6bd72;text-underline-offset:4px}
.tv-start,.tv-login{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:32px}
.tv-start img,.tv-login img{width:250px;max-width:60vw}
.tv-start h1,.tv-login h1{font-size:36px;letter-spacing:-.025em;margin:30px 0 12px}
.tv-start p,.tv-login p{color:#b5b4bb;font-size:20px}
.tv-start button,.tv-login button{background:#fa1937;padding:14px 34px;border-radius:12px;font-weight:700;margin:16px}
.tv-start a,.tv-login a{font-size:16px}.tv-login form{width:360px;max-width:85vw}
.tv-login label{display:block;text-align:left;color:#b5b4bb;margin:22px 0 10px}
.tv-login input{width:100%;background:#202023;border:1px solid #64626a;border-radius:12px;color:#fff;padding:16px;font-size:22px}
.tv-login button{width:100%;margin:16px 0}.tv-login button:disabled{opacity:.55}
.tv-login .login-error{color:#ff99aa;min-height:24px;font-size:17px}
.tv-shell{height:100%;width:100%;padding:14px 20px 10px;display:flex;flex-direction:column}
.tv-header{display:flex;align-items:center;justify-content:space-between;flex:0 0 auto;padding-bottom:12px}
.tv-brand{display:flex;align-items:center;min-width:0}.tv-brand img{width:150px;height:68px;object-fit:contain}
.tv-heading{margin-left:22px}.tv-heading h1{font-size:26px;font-weight:700;letter-spacing:-.025em;line-height:1.1;margin:0 0 7px}
.tv-heading p{margin:0;color:#b5b4bb;font-size:14px}
.tv-clock-box{text-align:right;display:flex;align-items:center}.tv-live{font-size:14px;color:#b5b4bb;margin-right:18px;white-space:nowrap}
.tv-dot{display:inline-block;vertical-align:middle;width:8px;height:8px;border-radius:50%;background:#80c8a3;margin-right:8px}
.tv-live.offline .tv-dot{background:#e6bd72}.tv-clock{font-size:34px;letter-spacing:-.025em;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.tv-manage{margin-left:22px;padding:12px 16px;border-radius:10px;background:#202023;color:#e6bd72;text-decoration:none;font-size:13px;white-space:nowrap}
.tv-manage:hover,.tv-fullscreen:hover{background:#302b22}.tv-fullscreen{width:44px;height:44px;background:#202023;border-radius:10px;margin-left:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.tv-fullscreen svg{width:23px;height:23px;stroke:#e6bd72;stroke-width:1.6;fill:none}
.tv-panels{display:flex;flex:1;min-height:0}.tv-panel{display:flex;flex-direction:column;width:100%;min-width:0;background:#101012;border-radius:12px;overflow:hidden}
.tv-panel-top{display:flex;align-items:center;justify-content:space-between;padding:7px 18px;border-bottom:1px solid rgba(255,255,255,.07);flex:0 0 auto}
.tv-panel-top h2{font-size:14px;letter-spacing:-.015em;margin:0;font-weight:600}.tv-panel-top span{color:#b5b4bb;font-size:12px}
.tv-barbers{display:flex;flex:0 0 auto;border-bottom:1px solid rgba(255,255,255,.14);padding:10px 0;background:#18181b}
.tv-rail-spacer,.tv-rail{width:76px;flex-shrink:0}
.tv-barber{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;padding:0 6px}
.tv-photo{width:36px;height:36px;border:1px solid #e6bd72;border-radius:50%;flex-shrink:0;overflow:hidden;background:#242015;position:relative}
.tv-photo-image{position:absolute;height:1990.476%;width:1120.238%;max-width:none}
.tv-any-icon{width:100%;height:100%;padding:22%;stroke:#e6bd72;stroke-width:1.7;fill:none}
.tv-barber-copy{min-width:0;margin-left:9px}.tv-barber strong{display:block;font-size:16px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tv-barber small{font-size:11px;display:block;line-height:1.5;color:#b5b4bb}.tv-barber small.available{color:#80c8a3}.tv-barber small.busy{color:#ff8298}
.tv-schedule{display:flex;flex:1;min-height:0;position:relative;margin-bottom:17px}
.tv-rail{position:relative}.tv-tick{position:absolute;right:12px;transform:translateY(-50%);font-size:11px;color:#b5b4bb;font-variant-numeric:tabular-nums;white-space:nowrap}
.tv-tick.first{transform:translateY(2px)}.tv-tick.last{transform:translateY(-40%)}
.tv-lanes{position:relative;display:flex;flex:1;min-width:0}.tv-lane{position:relative;flex:1;min-width:0;border-left:1px solid rgba(255,255,255,.04)}
.tv-rule{position:absolute;left:0;right:0;border-top:1px solid rgba(255,255,255,.035);pointer-events:none}.tv-rule.hour{border-color:rgba(255,255,255,.10)}
.tv-event{position:absolute;border-radius:5px;background:#361d28;color:#ffe0e7;overflow:hidden;padding:0 8px;display:flex;align-items:center;box-shadow:inset 3px 0 #fa1937}
.tv-event.flexible{background:#302a1a;color:#f8e4bb;box-shadow:inset 3px 0 #e6bd72}.tv-event.completed{background:#17251f;color:#b8dac8;box-shadow:inset 3px 0 #80c8a3}.tv-event.in-progress{background:#632034;color:#fff}
.tv-event strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:600;line-height:1.1;width:100%;font-size:14px}
.tv-event .tv-event-time{display:block;font-size:10px;margin-top:2px;white-space:nowrap;line-height:1.1;opacity:.88}.tv-event.tall{align-items:flex-start;flex-direction:column;justify-content:center}
.tv-block{position:absolute;left:3px;right:3px;background:#242426;color:#a4a3aa;border:1px dashed #64626a;border-radius:5px;overflow:hidden;font-size:12px;display:flex;align-items:center;justify-content:center;text-align:center}
.tv-off{position:absolute;top:0;bottom:0;left:0;right:0;background:rgba(255,255,255,.015);color:#a4a3aa;display:flex;align-items:center;justify-content:center;font-size:14px}
.tv-now{position:absolute;left:0;right:0;border-top:2px solid #fa1937;z-index:3;pointer-events:none}.tv-now span{position:absolute;left:-75px;top:-9px;font-size:10px;background:#fa1937;color:#fff;padding:3px 9px;border-radius:4px;font-weight:700}
.tv-empty{position:absolute;top:40%;width:100%;text-align:center;color:#a4a3aa;font-size:16px}
.tv-footer{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding-top:9px;color:#b5b4bb;font-size:12px}
.tv-legend{display:flex;align-items:center}.tv-legend span{margin-right:20px;white-space:nowrap}.tv-legend i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#fa1937;margin-right:7px}.tv-legend .gold{background:#e6bd72}.tv-legend .green{background:#80c8a3}
.tv-footer button{background:transparent;padding:4px 10px;color:#e6bd72}.tv-sync-note{color:#e6bd72}
@media(min-width:1700px) and (min-height:850px){.tv-shell{padding:22px 28px 14px}.tv-brand img{width:180px;height:80px}.tv-heading h1{font-size:34px}.tv-heading p{font-size:17px}.tv-clock{font-size:44px}.tv-live{font-size:17px}.tv-barbers{padding:14px 0}.tv-photo{width:44px;height:44px}.tv-barber strong{font-size:21px}.tv-barber small{font-size:13px}.tv-tick{font-size:13px}.tv-panel-top h2{font-size:17px}.tv-panel-top span,.tv-footer{font-size:14px}}
@media(max-width:1000px){.tv-shell{padding:10px}.tv-heading h1{font-size:21px}.tv-brand img{width:120px;height:54px}.tv-heading{margin-left:14px}.tv-clock{font-size:28px}.tv-live{margin-right:12px}.tv-manage{font-size:12px;padding:11px 12px;margin-left:12px}.tv-photo{width:28px;height:28px}.tv-barber-copy{margin-left:5px}.tv-barber strong{font-size:13px}.tv-barber small{font-size:9px}}
@media(max-width:600px){.tv-heading h1{font-size:17px}.tv-heading p{font-size:11px}.tv-header{flex-wrap:wrap}.tv-clock-box{width:100%;justify-content:space-between;margin-top:8px}.tv-manage{font-size:11px}.tv-fullscreen{width:34px;height:34px}.tv-footer{font-size:9px}.tv-legend span{margin-right:9px}.tv-photo{display:none}.tv-rail-spacer,.tv-rail{width:60px}.tv-tick{right:6px;font-size:9px}.tv-now span{left:-59px}.tv-panel-top{padding:6px 10px}.tv-panel-top h2{font-size:12px}.tv-panel-top span{font-size:10px}.tv-barber{padding:0 2px}.tv-barber-copy{margin:0}.tv-barber strong{font-size:9px}.tv-barber small{font-size:7px}.tv-event{padding:0 4px}.tv-barbers{padding:8px 0}}

.tv-event{z-index:2}.tv-block{z-index:1}.tv-now{z-index:1}

/* A distant TV needs a clear hierarchy, rather than eleven tiny equal lanes. */
.tv-barber.primary,.tv-lane.primary{flex:2}.tv-barber.shared,.tv-lane.shared{flex:1.4}
.tv-barber.primary strong{font-size:23px}.tv-barber.primary .tv-photo{width:42px;height:42px}
.tv-barber.shared{justify-content:flex-start;padding-left:16px}
.tv-barber.shared strong{font-size:18px}.tv-barber.shared small{font-size:11px}
.tv-barber.shared .tv-photo{width:32px;height:32px}
.tv-lane.shared{background:#151517;border-left:1px solid #454249}
.tv-lane.primary{border-left:1px solid #36343b}
.tv-event{background:#422631;color:#fff3f5;padding:0 11px}
.tv-event.flexible{background:#39311e;color:#fff0cb}.tv-event.completed{background:#20372d;color:#d5f3e3}
.tv-tick{color:#d0cfd4}.tv-rule.hour{border-color:rgba(255,255,255,.14)}
.tv-fullscreen{width:auto;min-height:44px;padding:0 13px;white-space:nowrap;margin-left:18px;color:#f8e4bb;font-size:13px}
.tv-fullscreen svg{margin-right:8px;flex-shrink:0}
.tv-manage{margin-left:10px}
.tv-login-actions{display:flex;align-items:center;justify-content:center}
.tv-login-actions .tv-fullscreen{width:auto;margin:0 20px 0 0;background:#262327;padding:12px 18px}
.tv-login .tv-remote-help{font-size:15px;margin:18px 0 0}
button:focus,a:focus{background:#42351f;color:#fff5dc}
input:focus{border-color:#e6bd72;background:#29252b}
#tv-remote-hint{color:#e6bd72}
.tv-layout-button{display:flex;align-items:center;min-height:44px;padding:0 13px;margin-left:10px;background:#202023;border-radius:10px;color:#f8e4bb;font-size:13px;white-space:nowrap;flex-shrink:0}
.tv-layout-button svg{width:21px;height:21px;stroke:#e6bd72;stroke-width:1.6;fill:none;margin-right:8px}
.tv-layout-button:hover{background:#302b22}.tv-layout-button:focus{background:#42351f;color:#fff5dc}
.tv-layout-all .tv-barber.primary,.tv-layout-all .tv-lane.primary{flex:1}
.tv-barber-list{display:flex;flex:1;min-width:0}
.tv-layout-all.tv-has-shared .tv-barber.primary,.tv-layout-all.tv-has-shared .tv-lane.primary{flex:0 0 25%}
.tv-layout-all .tv-barber.shared,.tv-layout-all .tv-lane.shared{flex:0 0 50%}
.tv-now span{width:75px;text-align:center}
@media(min-width:1700px) and (min-height:850px){.tv-barber.primary strong{font-size:29px}.tv-barber.primary .tv-photo{width:50px;height:50px}.tv-barber.shared strong{font-size:23px}.tv-fullscreen,.tv-layout-button{font-size:16px}}
@media(max-width:1000px){.tv-heading h1{font-size:20px}.tv-fullscreen{margin-left:12px;padding:0 10px;font-size:12px}.tv-fullscreen svg{width:18px;margin-right:6px}.tv-manage{padding:11px 9px;font-size:11px;margin-left:8px}.tv-heading{margin-left:10px}.tv-barber.primary strong{font-size:20px}.tv-barber.shared{padding-left:10px}.tv-barber.shared strong{font-size:15px}.tv-barber.shared small{font-size:10px}.tv-live{margin-right:8px;font-size:12px}.tv-clock{font-size:25px}.tv-footer{font-size:10px}.tv-legend span{margin-right:12px}.tv-login{padding:14px}.tv-login img{width:160px}.tv-login h1{font-size:28px;margin:12px 0 5px}.tv-login p{font-size:16px;margin:8px 0}.tv-login label{margin:12px 0 7px}.tv-login input{padding:12px}.tv-login .login-error{min-height:18px}.tv-login button{margin:12px 0}}
@media(max-width:600px){.tv-fullscreen{margin-left:0;font-size:11px}.tv-barber.primary strong{font-size:15px}.tv-barber.shared strong{font-size:11px}.tv-barber.shared small{font-size:8px}.tv-footer{flex-wrap:wrap}#tv-sync-note{display:none}.tv-barber.shared{padding-left:4px}.tv-event{padding:0 5px}.tv-now span{width:59px}}
@media(max-width:1100px){.tv-heading h1{font-size:18px}.tv-heading p{font-size:12px}.tv-brand img{width:105px;height:48px}.tv-heading{margin-left:10px}.tv-layout-button{padding:0 10px;font-size:12px}.tv-layout-button svg{width:18px;margin-right:6px}}
