
:root{color-scheme:light;--ink:#17283c;--muted:#637186;--line:#dee5ed;--paper:#f3f6fa;--orange:#c85814;--brand:#ed7d31;--navy:#10263d;--blue:#276caa;--green:#1c725b;--radius:15px;font-family:Inter,'Segoe UI',Arial,sans-serif;font-size:16px}
*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--paper);line-height:1.5}button,input,select,textarea{font:inherit}button,.button{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;border:1px solid var(--line);border-radius:8px;padding:.62rem .9rem;background:white;color:var(--ink);font-size:.875rem;font-weight:650;cursor:pointer;text-decoration:none;line-height:1.35;min-height:41px}button:hover,.button:hover{background:#edf2f8;border-color:#9aadc2}button:disabled{opacity:.48;cursor:not-allowed}button.primary,.button.primary{background:var(--orange);color:white;border-color:var(--orange)}button.primary:hover{background:#a7470e}button.danger{color:#a93232}button.quiet,button.link{background:transparent;border-color:transparent}a{color:#1c66a1}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #3389ce;outline-offset:3px}h1,h2,h3,p{margin-top:0}h1{font-size:2.05rem;line-height:1.18;letter-spacing:-.045em;margin-bottom:.7rem}h2{font-size:1.18rem;line-height:1.35;margin-bottom:.8rem;letter-spacing:-.02em}h3{font-size:.95rem;margin-top:1.7rem}p{margin-bottom:.85rem}.muted,.help{color:var(--muted)}.help{font-size:.875rem}.eyebrow{font-size:.75rem;letter-spacing:.14em;color:var(--orange);font-weight:800;margin-bottom:.6rem}.full{width:100%}[hidden]{display:none!important}
label{display:block;font-size:.875rem;font-weight:650;margin:.85rem 0 .3rem}input,select,textarea{display:block;border:1px solid #bfcbd8;border-radius:8px;width:100%;padding:.65rem .75rem;background:white;color:var(--ink);min-height:43px;margin-top:.35rem}textarea{resize:vertical}input[type=checkbox]{width:18px;min-height:18px;margin:0;accent-color:var(--orange)}.check{display:flex;align-items:center;gap:.65rem;font-weight:500}fieldset{border:1px solid var(--line);border-radius:8px;margin-top:1rem;padding:1rem}legend{font-size:.875rem;font-weight:650}form .primary.full{margin-top:1.4rem}small{font-size:.8rem}.brand{display:flex;align-items:center;gap:.75rem;font-size:1.22rem;font-weight:750;letter-spacing:-.03em;text-decoration:none;color:inherit}.brandmark{display:grid;place-items:center;width:36px;height:40px;flex-shrink:0;border-radius:11px;background:var(--brand);color:var(--navy);font-size:1.5rem;font-weight:900}.brand.large{font-size:1.6rem;justify-content:center;margin-bottom:2rem}.brand.large .brandmark{width:45px;height:49px;font-size:2rem}
#app{display:flex;min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:232px;padding:28px 18px;background:var(--navy);color:#edf4fc;display:flex;flex-direction:column}.sidebar .brand{padding-left:8px}.sidebar-caption{font-size:.6875rem;font-weight:700;letter-spacing:.13em;color:#a2b5c9;margin:40px 12px 15px}.sidebar nav{display:grid;gap:7px}.nav{width:100%;justify-content:flex-start;border:0;color:#b9c9db;background:transparent;min-height:48px;font-weight:550;padding:12px 14px}.nav span{font-size:1.3rem;width:27px;color:#94abc4;line-height:1}.nav:hover{background:#193852;color:white}.nav.active{background:#25425e;color:white;box-shadow:inset 3px 0 var(--brand)}.nav.active span{color:#ffb77f}.count{background:#ffd8bb;color:#843800;border-radius:6px;padding:1px 5px;margin-left:auto;font-size:.75rem}.sidebar-bottom{display:flex;align-items:center;gap:10px;margin-top:auto;padding:20px 0 0;border-top:1px solid #355068}.sidebar-bottom strong{display:block;font-size:.8rem;max-width:126px;overflow-wrap:anywhere}.sidebar-bottom small{color:#adc0d4;font-size:.75rem}.sidebar-bottom .link{color:#cad8e8;padding:4px;min-width:20px}.avatar{width:33px;height:33px;display:grid;place-items:center;border-radius:50%;background:#35516d;color:white;font-size:.875rem}.workspace{margin-left:232px;width:calc(100% - 232px);padding:0 40px}.topbar{display:flex;justify-content:space-between;align-items:center;min-height:92px;border-bottom:1px solid var(--line);gap:12px}.topbar .muted{font-size:.8125rem}.topbar-right{display:flex;gap:18px;align-items:center}#clock{font-variant-numeric:tabular-nums;font-size:1.25rem;font-weight:650;white-space:nowrap}.connection{font-size:.75rem;color:var(--green);margin-top:3px}.page-heading{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:34px 0 24px}.page-heading p:last-child{margin-bottom:0}.room-filter{margin:0;min-width:200px;color:var(--muted)}.room-filter select{color:var(--ink);min-width:210px}.summary-strip{display:grid;grid-template-columns:repeat(4,1fr);background:white;border:1px solid var(--line);border-radius:var(--radius);padding:20px 0;margin-bottom:25px}.summary-strip>div{display:flex;gap:15px;align-items:center;padding:0 22px;border-right:1px solid var(--line)}.summary-strip>div:last-child{border:0}.summary-strip>div>span:last-child{font-size:.8125rem;color:var(--muted);max-width:95px}.summary-number{font-size:1.95rem;font-weight:750;font-variant-numeric:tabular-nums;line-height:1}.orange{color:var(--orange)}.toolbar,.section-heading{display:flex;justify-content:space-between;gap:15px;align-items:center;margin-bottom:20px;flex-wrap:wrap}.button-group{display:flex;flex-wrap:wrap;gap:8px}.room-section{margin-top:26px}.room-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;gap:15px}.room-heading h2{margin:0;font-size:1.12rem}.room-meta{display:flex;gap:10px;align-items:center;margin-top:3px;font-size:.8125rem;color:var(--muted)}.room-meta .locked{color:#a44812}.room-heading .button-group button,.room-heading .button-group a{font-size:.8rem;min-height:35px;padding:.45rem .65rem}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,285px),1fr));gap:18px}.timer-card{position:relative;background:white;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;min-width:0;padding:22px 22px 15px;border-top:4px solid #90a2b6;box-shadow:0 2px 3px #17283c03}.timer-card.running{border-top-color:var(--blue)}.timer-card.paused,.timer-card.break{border-top-color:var(--brand)}.timer-card.finished,.timer-card.ended{border-top-color:#99a8b9}.card-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.card-top h3{font-size:1.07rem;margin:0;overflow-wrap:anywhere}.badge{border-radius:5px;padding:3px 7px;font-size:.7rem;font-weight:700;white-space:nowrap;background:#edf1f6;color:#556577}.badge.running{background:#e7f1fa;color:#216492}.badge.paused,.badge.break{background:#fff0dd;color:#965018}.badge.warning{background:#fff0dd;color:#a4440a}.variant{color:var(--muted);font-size:.8rem;min-height:20px;margin:5px 0 15px;overflow-wrap:anywhere}.timer-time{font-size:3.15rem;font-weight:750;font-variant-numeric:tabular-nums;letter-spacing:-.055em;line-height:1.2}.timer-time.soon{color:#ac4a13}.timer-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.09em;color:var(--muted);margin:4px 0 15px}.progress{height:5px;border-radius:5px;background:#e6edf5;overflow:hidden;margin:14px 0}.progress span{display:block;height:100%;width:100%;background:var(--blue);transition:width .25s linear}.paused .progress span,.break .progress span{background:var(--brand)}.timer-details{display:flex;justify-content:space-between;gap:10px;font-size:.8125rem;color:var(--muted);margin-bottom:12px;flex-wrap:wrap}.timer-details strong{color:var(--ink);font-weight:600}.break-note{font-size:.8rem;padding:8px 10px;background:#fff6e9;border-radius:6px;margin-bottom:12px}.timer-actions{display:flex;gap:6px;flex-wrap:wrap;padding-top:13px;border-top:1px solid var(--line)}.timer-actions button{font-size:.8rem;min-height:35px;padding:7px 9px}.timer-actions button:first-child{flex-grow:1}.timer-actions .primary{background:#286797;border-color:#286797}.timer-more{margin-top:9px;font-size:.75rem}.timer-more summary{cursor:pointer;color:var(--muted)}.timer-more .button-group{padding-top:8px}.timer-more p{margin-top:8px}.empty{padding:45px 25px;text-align:center;border:1px dashed #b8c8d7;border-radius:var(--radius);background:#ffffff65}.empty p{color:var(--muted);margin-bottom:0}.empty .button{margin-top:16px}.surface{background:white;border:1px solid var(--line);border-radius:var(--radius);padding:23px;min-width:0}.two-column{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(285px,1fr);gap:24px}.sticky{position:sticky;top:20px;align-self:start}.quick-messages{display:grid;gap:8px}.quick-messages button{justify-content:flex-start;font-weight:500;font-size:.8125rem}.message{padding:18px 20px;border:1px solid var(--line);border-radius:12px;background:white;margin-bottom:12px}.message.event,.message.attendance{border-left:3px solid var(--brand)}.message-head{display:flex;justify-content:space-between;gap:10px;font-size:.8125rem;color:var(--muted)}.message-head strong{color:var(--ink)}.message p{white-space:pre-wrap;overflow-wrap:anywhere;margin:12px 0;font-size:.9375rem}.message .receipt{font-size:.75rem;color:var(--green)}.message button{font-size:.75rem;min-height:32px;padding:5px 8px}.toilet-card h3{margin:0}.toilet-state{font-size:1.6rem;font-weight:700;margin:18px 0 2px;color:var(--green)}.toilet-card.occupied .toilet-state{color:#9d5218}.toilet-card.long{border-color:#c95420;background:#fff9f4}.toilet-card.locked .toilet-state{color:var(--muted)}.toilet-card .help{min-height:22px}.history-row{display:grid;grid-template-columns:130px minmax(140px,1fr) minmax(150px,1.6fr);gap:18px;padding:14px 0;border-bottom:1px solid var(--line);font-size:.875rem}.history-row:last-child{border:0}.history-row small{display:block;color:var(--muted)}.spaced{margin-top:30px}.user-row{display:flex;align-items:center;justify-content:space-between;padding:15px 0;gap:12px;border-bottom:1px solid var(--line)}.user-row:last-child{border:0}.user-row small{display:block;color:var(--muted)}.page-footer{display:flex;justify-content:space-between;color:var(--muted);font-size:.75rem;border-top:1px solid var(--line);padding:18px 0;margin-top:40px}.notice{padding:14px 17px;border-radius:8px;margin:15px 0;font-size:.875rem}.notice.error{background:#fff0eb;color:#922d20;border:1px solid #e6b4a7}.notice.success{background:#e5f4ed;color:#236247}#toast{position:fixed;bottom:25px;right:25px;max-width:min(470px,90vw);z-index:20;padding:16px 20px;color:white;background:var(--navy);box-shadow:0 5px 25px #0003;border-radius:10px}#toast.error{background:#8e3127}#toast button{margin:10px 5px 0 0}dialog{border:1px solid var(--line);border-radius:18px;padding:28px;width:min(540px,94vw);max-height:90vh;box-shadow:0 20px 100px #0003;color:var(--ink)}dialog::backdrop{background:#0c233b88;backdrop-filter:blur(3px)}.dialog-heading{display:flex;justify-content:space-between;gap:16px;align-items:center}.dialog-heading button{font-size:1.4rem;min-height:30px;padding:0 8px}.dialog-heading h2{font-size:1.45rem}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:25px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.auth-page{min-height:100vh;background:linear-gradient(145deg,#edf3f9,#f7f9fc)}.auth-shell{width:min(470px,92vw);margin:0 auto;padding:70px 0}.auth-card{padding:36px;background:white;border:1px solid var(--line);border-radius:19px;box-shadow:0 14px 60px #1b395b0a}.auth-card h1{font-size:2.2rem}.auth-card .help{margin-top:23px;margin-bottom:0}.auth-foot{text-align:center;font-size:.8125rem;color:var(--muted);margin-top:25px}.errorlist{color:#a32d23;font-size:.875rem;padding-left:20px}
.display-page{background:#102134;color:#f5f8fc;min-height:100vh}.display-page #display{padding:35px 4vw;min-height:100vh;display:flex;flex-direction:column}.display-header{display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid #34506a;padding-bottom:24px;margin-bottom:30px}.display-header .brand{font-size:1rem;color:#a9bfd5}.display-header .brandmark{width:25px;height:29px;font-size:1.05rem;border-radius:7px}.display-header h1{margin:12px 0 0;font-size:2rem}.display-clock{text-align:right}.display-clock #clock{font-size:2.2rem;display:block}.display-clock span{color:#a8bed5;font-size:.875rem}.display-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:26px;flex-grow:1;align-content:center}.display-card{border:1px solid #3a526b;border-top:5px solid #6caadb;border-radius:18px;padding:30px;background:#182e45}.display-card h2{font-size:1.6rem;margin:0}.display-card .variant{color:#b8c8d8;font-size:1rem}.display-card .timer-time{font-size:clamp(3.5rem,8vw,7rem);letter-spacing:-.05em}.display-card .timer-label{color:#afc3d8;font-size:.875rem;margin-top:7px}.display-card .timer-details{font-size:1.05rem;color:#bacadc}.display-card .timer-details strong{color:#edf5fd}.display-card .progress{background:#344b64;height:7px}.display-card .progress span{background:#7ab1db}.display-card.paused,.display-card.break{border-top-color:#ffb56e}.display-card .break-note{background:#583e23;color:#ffe4c4;font-size:1rem}.display-card .badge{font-size:.85rem}.display-card.finished,.display-card.ended{opacity:.65}.display-card .timer-time.soon{color:#ffb872}.display-toilets{display:flex;justify-content:center;flex-wrap:wrap;gap:14px;margin:35px 0 15px}.display-wc{padding:9px 16px;border-radius:8px;background:#26485b;font-size:.9375rem}.display-wc.occupied{background:#63462a}.display-footer{display:flex;align-items:center;justify-content:space-between;gap:15px;padding-top:20px;color:#a8bed5;font-size:.8rem}.display-footer button{background:transparent;border:1px solid #536980;color:#d8e3ef;margin-right:6px;font-size:.75rem;min-height:32px}.display-footer a{color:#c5d5e6;margin-left:10px}
@media(min-width:1500px){.workspace{padding-left:55px;padding-right:55px}.cards{grid-template-columns:repeat(auto-fit,minmax(310px,1fr))}.timer-card{max-width:550px}}
@media(max-width:1100px){.sidebar{width:195px;padding:24px 12px}.workspace{margin-left:195px;width:calc(100% - 195px);padding:0 24px}.sidebar .brand{font-size:1.1rem}.summary-strip>div{padding:0 13px;gap:8px}.summary-number{font-size:1.65rem}.topbar-right{gap:8px}.topbar-right .quiet{font-size:.75rem;padding:5px}.two-column{grid-template-columns:1fr}.sticky{position:static}.page-heading{gap:16px}.room-filter{min-width:155px}.room-filter select{min-width:155px}}
@media(max-width:760px){#app{display:block}.sidebar{position:static;width:100%;padding:16px 18px;display:block}.sidebar .brand{font-size:1.1rem;padding:0}.sidebar-caption,.sidebar-bottom{display:none}.sidebar nav{display:flex;margin-top:15px;gap:3px;overflow-x:auto}.nav{min-width:max-content;width:auto;min-height:37px;padding:8px 10px;font-size:.8rem}.nav span{font-size:1rem;width:16px}.workspace{margin-left:0;width:100%;padding:0 18px}.topbar{min-height:77px}.topbar-right{flex-direction:column;gap:0;align-items:flex-end}.topbar-right .quiet{min-height:25px}.page-heading{padding-top:26px;align-items:flex-start;flex-direction:column;gap:15px}h1{font-size:1.75rem}.room-filter,.room-filter select{width:100%}.summary-strip{grid-template-columns:1fr 1fr;padding:4px 0}.summary-strip>div{padding:15px 20px;border-right:0}.summary-strip>div:nth-child(odd){border-right:1px solid var(--line)}.summary-strip>div:nth-child(-n+2){border-bottom:1px solid var(--line)}.summary-strip>div>span:last-child{max-width:none}.toolbar{gap:12px}.toolbar .button-group{width:100%;gap:6px}.toolbar .button-group button{flex:1;font-size:.75rem;padding:8px 5px}.room-heading{align-items:flex-start;flex-direction:column;gap:8px}.room-heading .button-group{width:100%}.room-heading .button-group a{flex:1}.cards{grid-template-columns:1fr}.timer-card{padding:19px}.timer-time{font-size:3.25rem}.two-column{gap:20px}.surface{padding:18px}.message-head{flex-wrap:wrap}.history-row{grid-template-columns:1fr 1.5fr;gap:8px}.history-row>div:first-child{grid-column:1/-1;font-size:.75rem}.user-row{align-items:flex-start;flex-direction:column}.form-grid{gap:12px}.dialog-actions{flex-wrap:wrap}.auth-shell{padding:35px 0}.auth-card{padding:28px}.display-page #display{padding:20px}.display-header{align-items:flex-start}.display-clock #clock{font-size:1.4rem}.display-clock span{font-size:.75rem}.display-header h1{font-size:1.45rem}.display-header .brand{font-size:.85rem}.display-grid{grid-template-columns:1fr}.display-card{padding:23px}.display-card h2{font-size:1.35rem}.display-card .timer-time{font-size:4rem}.display-footer{flex-direction:column;align-items:flex-start}.display-footer>div{display:flex;flex-wrap:wrap;gap:8px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

.dialog-feedback{position:static;overflow-wrap:anywhere;margin:0 0 1rem}.dialog-feedback button{margin-top:.6rem}.message-notice,.request-actions{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:20px}.message-notice{background:#fff1da;border:1px solid #dfb074}.request-actions{padding:14px 0;border-bottom:1px solid var(--line)}
