*{box-sizing:border-box} :root{font-family:"Segoe UI",Tahoma,Arial,sans-serif;color:#eef7fa;background:#081d27;font-synthesis:none}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 85% 8%,#133f49 0,transparent 40%),#081d27}button,input,select{font:inherit}button,a,input,select{outline-offset:5px}button{cursor:pointer}button:disabled{opacity:.5;cursor:wait}button{border:0;border-radius:14px;padding:14px 20px;background:#22c6b2;color:#07252c;font-weight:700}button:hover{filter:brightness(1.08)}button.secondary{background:#183b47;color:#d8e9ec;border:1px solid #34525c}a{color:#4dd9c6}input,select{width:100%;padding:15px;border:1px solid #42616d;border-radius:12px;background:#102e39;color:#fff;min-height:52px}input[type=checkbox]{width:22px;min-height:22px;accent-color:#24cbb4}h1,h2,h3,p{margin:0}.muted{color:#9db5bd}.eyebrow{color:#69dacc;font-size:13px;letter-spacing:3px;font-weight:700;direction:ltr}.brand{display:flex;align-items:center;gap:13px}.brand-mark{width:46px;height:46px;border:1px solid #61d0c6;border-radius:14px;display:grid;place-items:center;color:#75eee0;font-size:31px;font-family:Georgia,serif}.brand strong{display:block;font-size:22px}.brand small{font-size:12px;color:#9db5bd}.topbar{padding:28px 3.2vw;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #29424b;gap:20px}.clock{direction:ltr;font-size:36px;font-weight:600;letter-spacing:1px}.date{color:#bad0d7;font-size:17px;text-align:left;margin-top:3px}.live{display:flex;align-items:center;gap:8px;font-size:13px;color:#b3cbd1}.dot{width:7px;height:7px;background:#3bd4a6;border-radius:50%;display:inline-block;box-shadow:0 0 12px #3bd4a644}.offline .dot{background:#ffc56d}.loading{height:100vh;display:grid;place-items:center;font-size:22px}.login-layout{min-height:calc(100vh - 114px);display:grid;grid-template-columns:1fr 1fr;gap:6vw;align-items:center;max-width:1440px;margin:auto;padding:5vh 5vw}.login-copy h1{font-size:clamp(40px,4.5vw,72px);line-height:1.45;letter-spacing:-2px;margin:15px 0 20px}.accent{color:#57dccc}.login-copy p{color:#a9c0c8;font-size:21px;line-height:1.9;max-width:530px}.steps{margin-top:35px;display:grid;gap:18px}.step{display:flex;align-items:center;gap:15px;color:#dbe9ee;font-size:19px}.step span{width:33px;height:33px;display:grid;place-items:center;border:1px solid #37646e;border-radius:50%;color:#6bdfd0;font-size:15px}.qr-card{background:#102d38;border:1px solid #34515b;border-radius:28px;padding:35px;text-align:center;box-shadow:0 30px 80px #0004;max-width:500px;width:100%;justify-self:center}.qr-card h2{font-size:26px;margin-bottom:10px}.qr-wrap{background:#fff;padding:20px;border-radius:20px;margin:25px auto 20px;width:min(310px,100%);aspect-ratio:1;display:grid;place-items:center}.qr-wrap img{display:block;width:100%;height:100%;image-rendering:pixelated}.pair-code{font-size:28px;letter-spacing:7px;direction:ltr;font-weight:600;margin:14px 0}.qr-card .muted{font-size:14px;line-height:1.8}.pill{display:inline-flex;align-items:center;gap:8px;border:1px solid #2d5860;padding:7px 13px;border-radius:100px;font-size:13px;color:#aac9cf}.login-copy .pill{margin-top:30px}.notice{padding:12px 20px;background:#4b3824;color:#ffe1aa;border:1px solid #795e31;border-radius:12px;font-size:15px;line-height:1.7}.notice.error{background:#492a32;border-color:#79505c;color:#ffd7df}.notice.success{background:#143f39;border-color:#326e59;color:#bcfce0}.tv{padding:22px 3.2vw 18px}.tv-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;gap:20px}.tv-heading h1{font-size:25px;font-weight:600}.tv-heading .muted{font-size:13px;margin-top:5px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:22px}.stat{border:1px solid #2c4853;background:#0f2b36;border-radius:17px;padding:16px 22px;display:flex;align-items:center;justify-content:space-between}.stat strong{font-size:36px;line-height:1.2;direction:ltr}.stat span{font-size:15px;color:#bdd0d6}.stat .small-dot{width:7px;height:7px;border-radius:50%;display:inline-block;margin-left:7px;background:#68b8ff}.stat.done .small-dot{background:#3ed4a4}.stat.pending .small-dot{background:#ffd17a}.stat.lost .small-dot{background:#f696a8}.doctors{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.doctor{background:#0d2833;border:1px solid #2d4d58;border-radius:20px;overflow:hidden}.doctor-head{background:linear-gradient(100deg,#163c46,#15313e);padding:19px 22px;display:flex;align-items:center;gap:13px;border-bottom:1px solid #34515a}.avatar{width:45px;height:45px;background:#255563;border:1px solid #367384;border-radius:50%;display:grid;place-items:center;color:#9beade;font-size:18px;font-weight:700}.doctor-head h2{font-size:21px;direction:auto;text-align:start}.doctor-head small{display:block;font-size:12px;color:#9bb7c1;margin-top:3px}.doctor-count{margin-right:auto;background:#234651;border-radius:9px;padding:7px 11px;font-size:14px;white-space:nowrap}.appointments{min-height:350px;padding:4px 20px}.appointment{display:grid;grid-template-columns:100px minmax(0,1fr) auto;gap:14px;align-items:center;padding:17px 2px;border-bottom:1px solid #25434e;min-height:75px}.appointment:last-child{border:0}.appointment.current{background:#12514755;border-radius:12px;box-shadow:inset -3px 0 #43d4be;padding-inline:13px;margin-inline:-11px}.appointment time{direction:ltr;font-size:20px;font-weight:600;text-align:center}.appointment time small{display:block;font-size:11px;color:#9dbac4;font-weight:400;margin-top:4px}.patient{font-size:20px;font-weight:600;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;direction:auto}.file{font-size:11px;color:#8daeb9;margin-top:4px}.status{font-size:12px;white-space:normal;text-align:center;border-radius:7px;padding:7px 9px;background:#234f66;color:#b2ddff;max-width:125px}.status.done{background:#164d42;color:#a0f0d3}.status.lost{background:#4b303b;color:#f7bac8}.status.waiting{background:#55462b;color:#ffdda2}.doctor-foot{display:flex;justify-content:space-between;padding:11px 22px;color:#8fb1bc;font-size:12px;border-top:1px solid #294550}.tv-footer{display:flex;justify-content:space-between;color:#7397a4;font-size:12px;gap:20px;margin-top:17px}.empty{min-height:350px;display:grid;place-content:center;gap:15px;text-align:center;color:#b1cbd4}.empty h2{font-size:25px;color:#e6f1f4}.banner{margin-bottom:18px}.demo{color:#ffe2a7;background:#473c29;border:1px solid #746446;padding:9px 15px;border-radius:10px;font-size:13px}.mobile-shell{max-width:510px;margin:0 auto;padding:32px 24px 50px}.mobile-shell h1{font-size:31px;line-height:1.5;margin-top:26px;margin-bottom:13px}.mobile-shell>p{font-size:16px;line-height:1.8}.mobile-card{margin-top:24px;border:1px solid #34515b;background:#102c37;border-radius:22px;padding:25px}.code-box{text-align:center;padding:17px;background:#183b45;border:1px solid #34616c;border-radius:13px;margin:20px 0}.code-box .pair-code{margin-bottom:0}form{display:grid;gap:18px}label{display:grid;gap:9px;color:#bfd5dc;font-size:14px}label input{direction:ltr;text-align:left}form button{margin-top:4px;min-height:53px}.password-wrap{position:relative}.password-wrap input{padding-right:65px}.password-wrap button{position:absolute;right:5px;top:5px;padding:8px;font-size:11px;min-height:40px;background:transparent;color:#8de2d6}.form-status{margin-top:16px}.control-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;border-bottom:1px solid #2e4e59}.control-row label{font-size:15px;color:#d7e7ec}.control-row small{font-size:12px;color:#93b2bd;line-height:1.7}.control-row select{max-width:120px}.settings-date{padding:18px 0}.settings-date label{margin-bottom:10px}.mobile-card>.secondary{width:100%;margin-top:24px}.connected-mark{display:inline-flex;background:#164d42;color:#9eeed4;padding:7px 12px;border-radius:50px;font-size:13px;margin-top:20px}.controller-note{font-size:12px;line-height:1.9;color:#8faeb8;margin-top:20px}.pair-expired{text-align:center;padding:30px 0}.small-link{font-size:13px}.refresh-btn{background:transparent;color:#81e0d2;padding:7px 12px;margin-top:10px;font-size:12px}.privacy-label{border:1px solid #31535d;padding:7px 12px;border-radius:100px;color:#abc9cf;font-size:12px}.timer-text{font-variant-numeric:tabular-nums}.connection-banner{margin-top:15px}
@media(min-width:1800px){.doctor-head{padding:23px 26px}.doctor-head h2{font-size:26px}.appointment{min-height:95px;padding-block:21px;grid-template-columns:120px minmax(0,1fr) auto}.appointment time{font-size:24px}.patient{font-size:25px}.status{font-size:15px;max-width:170px}.appointments{min-height:470px}.doctor-foot{font-size:14px}.stat strong{font-size:44px}.stat span{font-size:18px}.tv-heading h1{font-size:30px}}
@media(max-width:800px){.topbar{padding:22px}.clock{font-size:25px}.date{font-size:12px}.brand strong{font-size:18px}.brand-mark{width:37px;height:37px}.login-layout{grid-template-columns:1fr;padding:35px 25px;gap:30px}.login-copy h1{font-size:37px}.login-copy p{font-size:17px}.login-copy .steps{display:none}.login-copy .pill{display:none}.qr-card{padding:24px}.tv{padding:18px}.stats{gap:8px}.stat{padding:13px 10px;display:block}.stat strong{display:block;font-size:26px;margin-top:5px}.stat span{font-size:11px}.doctors{grid-template-columns:1fr}.appointment{grid-template-columns:78px minmax(0,1fr) auto;gap:8px}.patient{font-size:16px}.appointment time{font-size:17px}.status{font-size:10px;max-width:93px}.doctor-head h2{font-size:18px}.tv-footer{line-height:1.7}.tv-heading h1{font-size:22px}.privacy-label{display:none}.mobile-shell .brand{margin-bottom:15px}.mobile-shell{padding-top:25px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
@media(min-width:900px){
  :root{--header-height:clamp(82px,11vh,118px)}
  .topbar{height:var(--header-height);padding:18px 3.2vw}
  .tv{height:calc(100dvh - var(--header-height));display:flex;flex-direction:column;min-height:0;padding-top:clamp(12px,2vh,22px)}
  .tv-heading{margin-bottom:clamp(10px,1.7vh,20px)}
  .stats{margin-bottom:clamp(10px,1.7vh,22px)}
  .stat{padding:clamp(10px,1.5vh,18px) 22px}
  .stat strong{font-size:clamp(28px,4vh,44px)}
  .doctors{flex:1;min-height:0}
  .doctor{display:flex;flex-direction:column;min-height:0}
  .doctor-head{padding:clamp(12px,1.8vh,22px) 22px;flex-shrink:0}
  .doctor-head h2{font-size:clamp(19px,2.4vh,26px)}
  .appointments{flex:1;min-height:0;display:flex;flex-direction:column}
  .appointment{flex:1;min-height:0;padding-block:clamp(6px,1.1vh,15px)}
  .patient{font-size:clamp(17px,2.3vh,25px)}
  .appointment time{font-size:clamp(18px,2.3vh,24px)}
  .doctor-foot{flex-shrink:0;padding-block:9px}
  .tv-footer{flex-shrink:0;margin-top:12px}
  .banner:empty{display:none}
  .login-layout{min-height:calc(100dvh - var(--header-height));padding-block:3vh}
}
