:root{--ui-text-scale:1;--menu-width:calc(224px + 100px * (var(--ui-text-scale) - 1))}
body{font-size:calc(15px * var(--ui-text-scale))}
button,input,select,textarea,.button{font-size:calc(14px * var(--ui-text-scale))}
h1{font-size:calc(30px * var(--ui-text-scale))}h2{font-size:calc(18px * var(--ui-text-scale))}h3{font-size:calc(16px * var(--ui-text-scale))}
small,.form-hint,.search,.row .button,.pagination span,footer,.entity-actions button,.member-list span{font-size:calc(13px * var(--ui-text-scale))}
.eyebrow,.tag{font-size:calc(11px * var(--ui-text-scale))}
.calendar-event{font-size:calc(12px * var(--ui-text-scale))}.calendar-add{font-size:calc(13px * var(--ui-text-scale))}
aside{width:var(--menu-width);padding:18px 16px;height:100dvh;min-height:0;gap:0}
.content{margin-left:var(--menu-width);width:calc(100% - var(--menu-width))}
aside .brand{font-size:28px;flex-shrink:0}aside>.eyebrow{margin:12px 0 9px;flex-shrink:0}
aside nav{display:flex;flex-direction:column;gap:3px;min-height:0;overflow-y:auto;overflow-x:hidden;flex:1;scrollbar-width:none;overscroll-behavior:contain;padding:3px}
aside nav::-webkit-scrollbar{display:none}
aside nav button{flex-shrink:0;min-height:36px;padding:7px 9px;line-height:1.35;font-size:calc(14px * var(--ui-text-scale));overflow-wrap:anywhere}
aside nav:focus-visible{outline:2px solid var(--blue);outline-offset:0;border-radius:6px}
.aside-bottom{margin-top:8px;flex-shrink:0;font-size:calc(12px * var(--ui-text-scale))}
.text-size-setting{flex-shrink:0;padding:12px 3px 0;margin-top:9px;border-top:1px solid var(--line)}
.text-size-setting>div{display:flex;justify-content:space-between;align-items:center;gap:6px;font-size:calc(12px * var(--ui-text-scale))}
.text-size-setting output{font-variant-numeric:tabular-nums;color:var(--muted)}
.text-size-setting input{display:block;width:100%;height:36px;margin:0;cursor:pointer;accent-color:var(--blue)}
.content>header{height:auto;min-height:72px;padding:12px 24px;gap:14px;flex-wrap:wrap}
.header-identity{display:flex;flex-direction:column;min-width:0;max-width:100%;flex:1 1 170px}
.header-identity small{color:var(--muted);font-size:calc(11px * var(--ui-text-scale))}
.header-identity #profile{color:var(--text);font-size:calc(15px * var(--ui-text-scale));font-weight:600;margin:0;overflow-wrap:anywhere;line-height:1.35}
.content>header>div{flex-wrap:wrap;justify-content:flex-end;gap:6px;min-width:0}
.content>header>div button{white-space:normal;min-height:40px;font-size:calc(14px * var(--ui-text-scale))}
.grid,.metrics,.room-grid{min-width:0}.grid>* ,.metrics>* ,.room-grid>* ,.row>div{min-width:0}
.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.metrics{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:1100px){.grid{grid-template-columns:minmax(0,1fr)}.row,.panel-head{flex-wrap:wrap}.row .button{white-space:normal}html[data-text-size=large] .metrics,html[data-text-size=large] .room-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:700px){
  aside{width:100%;height:auto;padding:16px 18px;gap:0}
  .content{margin:0;width:100%}
  aside nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));overflow-y:auto;max-height:240px;flex:none;gap:4px}
  aside nav button{min-height:44px;padding:8px 4px;text-align:center}
  html[data-text-size=large] aside nav{grid-template-columns:repeat(2,minmax(0,1fr))}
  .text-size-setting{margin-top:12px;padding-top:8px;max-width:280px;width:100%}
  .aside-bottom{display:none}
  .content>header{padding:12px 18px;gap:12px}
  .content>header>div{justify-content:flex-start;width:100%}
  h1{font-size:calc(26px * var(--ui-text-scale))}
  .row,.panel-head,.entity-actions,.dialog-actions{flex-wrap:wrap}
  .metrics,.grid{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:380px){aside nav{grid-template-columns:repeat(2,minmax(0,1fr))}}