.display-mode{display:flex;gap:8px;align-items:center;margin:0;font-size:13px}.display-mode select{width:auto}.login>.display-mode{margin-top:20px}.room-actions{display:grid;gap:6px}.room-actions .pause-delete{flex-wrap:nowrap}.diamond-filters{align-items:end}.diamond-filters label{margin-bottom:0}
html[data-display-mode="mobile"] body{min-width:0;overflow-wrap:anywhere}
html[data-display-mode="mobile"] :is(main,header,nav){width:100%;max-width:680px;min-width:0;margin:auto;padding-left:14px;padding-right:14px}
html[data-display-mode="mobile"] header{flex-direction:column;align-items:stretch;padding-top:16px;padding-bottom:16px}
html[data-display-mode="mobile"] header .actions{justify-content:flex-start}
html[data-display-mode="mobile"] .subtitle{display:none}
html[data-display-mode="mobile"] nav{flex-wrap:wrap;overflow:visible}
html[data-display-mode="mobile"] :is(button,input,select){min-height:44px;font-size:16px;min-width:0;max-width:100%}
html[data-display-mode="mobile"] button{white-space:normal;overflow-wrap:anywhere}
html[data-display-mode="mobile"] :is(input[type="checkbox"],input[type="radio"]){min-height:22px;width:22px;height:22px}
html[data-display-mode="mobile"] :is(.login,.panel,.card,section,form,label,.toolbar,.page-heading>div){min-width:0;max-width:100%}
html[data-display-mode="mobile"] .login{width:calc(100% - 28px);max-width:460px;margin:28px auto;padding:22px}
html[data-display-mode="mobile"] .page-heading{align-items:flex-start;flex-wrap:wrap}
html[data-display-mode="mobile"] :is(.grid,.monitor-plans,.registration-filters){grid-template-columns:minmax(0,1fr)}
html[data-display-mode="mobile"] .cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
html[data-display-mode="mobile"] .cards .card:last-child:nth-child(odd){grid-column:1/-1}
html[data-display-mode="mobile"] .toolbar{display:grid;grid-template-columns:minmax(0,1fr)}
html[data-display-mode="mobile"] .toolbar :is(select,input){width:100%;max-width:100%;min-width:0}
html[data-display-mode="mobile"] .table-wrap{width:100%;min-width:0;border:0;overflow:visible;background:transparent}
html[data-display-mode="mobile"] table{display:block;width:100%;min-width:0;white-space:normal}
html[data-display-mode="mobile"] thead{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap}
html[data-display-mode="mobile"] tbody{display:grid;gap:14px;width:100%;min-width:0}
html[data-display-mode="mobile"] tbody tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));min-width:0;border:1px solid var(--border);background:white;border-radius:9px;padding:6px}
html[data-display-mode="mobile"] td{display:block;min-width:0;max-width:100%;padding:9px;white-space:normal;overflow-wrap:anywhere}
html[data-display-mode="mobile"] td::before{content:attr(data-label);display:block;color:#667c88;font-size:12px;margin-bottom:4px}
html[data-display-mode="mobile"] td:last-child{grid-column:1/-1}
html[data-display-mode="mobile"] td[colspan]{grid-column:1/-1}
html[data-display-mode="mobile"] td[colspan]::before{content:none}
html[data-display-mode="mobile"] td small{max-width:100%}
html[data-display-mode="mobile"] .room-actions .actions{display:flex;flex-wrap:nowrap}
html[data-display-mode="mobile"] .room-actions button{flex:1 1 0}
html[data-display-mode="mobile"] dialog{width:calc(100% - 16px);max-width:680px;max-height:calc(100dvh - 16px);padding:16px;min-width:0}
html[data-display-mode="mobile"] .pagination{flex-wrap:wrap;justify-content:center}
html[data-display-mode="mobile"] .monitor-plan{padding:12px}
html[data-display-mode="mobile"] .monitor-plan .step{grid-template-columns:minmax(0,1fr) 85px 55px}
html[data-display-mode="mobile"] .monitor-plan .step>span{grid-column:1/-1}
html[data-display-mode="mobile"] .duration-control{grid-template-columns:minmax(0,1fr) 85px}
html[data-display-mode="mobile"] #notice{left:12px;right:12px;max-width:none}
html[data-display-preference="desktop"] body{min-width:1100px}
html[data-display-preference="desktop"] header{padding:20px 36px;align-items:center;flex-direction:row}
html[data-display-preference="desktop"] header .actions{justify-content:flex-start;font-size:14px}
html[data-display-preference="desktop"] .subtitle{display:inline}
html[data-display-preference="desktop"] main{padding:28px 36px}
html[data-display-preference="desktop"] nav{padding:10px 36px}
html[data-display-preference="desktop"] .page-heading{align-items:center}
html[data-display-preference="desktop"] h1{font-size:25px}
html[data-display-preference="desktop"] .card{padding:20px}
html[data-display-preference="desktop"] .login{margin:12vh auto}
html[data-display-preference="desktop"] :is(.grid,.monitor-plans){grid-template-columns:repeat(2,minmax(0,1fr))}
html[data-display-preference="desktop"] .monitor-plan{padding:18px}
html[data-display-preference="desktop"] .monitor-plan .step{grid-template-columns:60px minmax(0,1fr) 85px 60px;gap:7px}
html[data-display-preference="desktop"] .monitor-plan .step>span{grid-column:auto}
html[data-display-preference="desktop"] .duration-control{grid-template-columns:minmax(0,1fr) 100px}
html[data-display-preference="desktop"] th,html[data-display-preference="desktop"] td{padding:13px 16px}
.stopped-section{margin-top:28px;padding-top:20px;border-top:1px solid var(--border)}.stopped-toggle{margin-bottom:14px;font-weight:600;width:100%;text-align:left}
