*{box-sizing:border-box}:root{--blue:#003B73;--light:#DCEAF6;--red:#E30613;--green:#16843B;--gray:#25313B;--bg:#F5F7FA}
html,body{margin:0;min-height:100%;background:var(--bg);font-family:Arial,sans-serif;color:var(--gray)}body{min-height:100dvh}
.app{width:min(100%,480px);min-height:100dvh;margin:auto;padding:max(28px,env(safe-area-inset-top)) 22px 20px;text-align:center}
h1{margin:0;color:var(--blue);font-size:28px}.date{margin-top:8px;font-size:16px}.clock{color:var(--blue);font-size:26px;font-weight:600}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.top{margin-top:22px}.bottom{margin-top:22px}
.tile{border:0;border-radius:14px;box-shadow:0 3px 8px #0002;display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:700}
.tile b{font-size:28px;line-height:1.05;margin-bottom:4px}.start,.stop{height:90px;font-size:14px}.start{background:var(--light);color:var(--blue)}.stop{background:#FFE4E4;color:var(--red)}
.circle{width:210px;height:210px;margin:20px auto 0;border:7px solid #B9C5CF;border-radius:50%;background:#fff;box-shadow:0 8px 16px #0003;display:flex;flex-direction:column;align-items:center;justify-content:center}
.circle.on{border-color:var(--red)}.circle img{width:140px;height:95px;object-fit:contain}.circle strong{margin-top:14px;color:var(--blue);font-size:19px}.circle.on strong{color:var(--red)}
.function,.connection{height:82px;font-size:14px}.function{background:var(--light);color:var(--blue)}.connection{background:#DDF4E4;color:var(--green)}
.next{margin-top:18px;font-size:14px}.next strong{display:block;margin-top:3px;color:var(--blue);font-size:18px}.hidden{display:none}
dialog{border:0;border-radius:18px;width:min(90vw,360px);box-shadow:0 16px 40px #0005}dialog::backdrop{background:#0006}dialog form{padding:8px}dialog h2{color:var(--blue)}
#time{width:100%;padding:12px;border:1px solid #B9C5CF;border-radius:10px;font-size:22px}.actions{display:flex;gap:10px;justify-content:flex-end;margin-top:20px}.actions button{border:0;border-radius:10px;padding:10px 14px;background:var(--blue);color:#fff;font-weight:700}.actions .cancel{background:#E1E4E7;color:var(--gray)}
