/* Compact reports share the same layout in device tabs and manager dialogs. */
.activity-report,.activity-output{min-width:0}
.activity-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:0 0 12px;border-bottom:1px solid #e3e5f3}
.activity-toolbar h3{flex:1;min-width:180px;font-size:18px;margin:0}
.activity-toolbar label{display:flex;align-items:center;gap:8px;margin:0;font-size:13px;min-width:0}
.activity-toolbar .activity-month{width:175px;max-width:100%;min-width:0;margin:0;min-height:44px;box-sizing:border-box}
.activity-toolbar button{min-height:44px;padding:10px 14px}
.activity-summary,.activity-stamp,.activity-legend{font-size:12px;line-height:1.5;margin:10px 0;overflow-wrap:anywhere}
.activity-stamp{font-size:11px;margin:8px 0 12px}
.activity-about{font-size:12px;line-height:1.5;margin-top:12px;border-top:1px solid #e3e5f3}
.activity-about summary{cursor:pointer;padding:12px 0;min-height:44px;box-sizing:border-box;color:#5541a6}
.activity-about p{margin:0 0 10px}
.attendance-calendar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.calendar-weekday{text-align:center;font-size:12px;color:#66718c;padding:6px 0}
.calendar-day{min-width:0;min-height:82px;display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:10px;background:#ffffffaa;color:#394964;border:1px solid #e3e5f3;border-radius:12px}
.calendar-day span,.calendar-day small{font-size:11px;white-space:normal;text-align:left}
.calendar-day.has-record{background:#dcf7ee;color:#17644c}
.calendar-day.incomplete{background:#fff0d7;color:#815719}
.calendar-day.selected{outline:2px solid #6653e8;outline-offset:1px}
.attendance-day-detail,.activity-total{margin:12px 0;padding:14px;background:#ffffffc9;border-radius:14px}
.attendance-day-detail h4{margin:0 0 8px;font-size:14px}
.attendance-day-detail p{margin:5px 0;font-size:12px;line-height:1.5}
.activity-total{display:flex;align-items:center;justify-content:space-between;gap:12px}
.activity-total small{font-size:12px;color:#66718c}
.activity-total strong{font-size:28px;color:#5541d9;white-space:nowrap}
.usage-row{display:grid;grid-template-columns:24px minmax(0,1fr) auto;align-items:center;gap:10px;padding:14px;background:#ffffffba;border-radius:12px;margin:8px 0}
.usage-row strong{overflow-wrap:anywhere;font-size:14px}
.usage-row b{font-size:12px;white-space:nowrap}
.usage-rank{color:#847ba4;font-size:12px}
.usage-track{height:6px;border-radius:10px;background:#ece9fb;margin-top:8px;overflow:hidden}
.usage-track span{display:block;height:100%;border-radius:10px;background:linear-gradient(90deg,#6552e9,#24b9b4)}
.activity-dialog{width:min(940px,calc(100vw - 32px));max-width:calc(100vw - 32px);height:fit-content;max-height:calc(100dvh - 32px);inset:0;margin:auto;overflow:hidden;border:1px solid #ddd;border-radius:20px;padding:0;background:#f8f9fd;color:#243149}
.activity-dialog[open]{display:flex;flex-direction:column}
.activity-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-shrink:0;padding:16px 20px;border-bottom:1px solid #e3e5f3;background:#fff}
.activity-dialog-head h2{font-size:22px;margin:0;min-width:0;overflow-wrap:anywhere}
.activity-close{flex-shrink:0;min-height:44px;padding:10px 16px}
.manager-activity{padding:16px 20px;overflow:auto;overscroll-behavior:contain;min-height:0;scrollbar-gutter:stable}
.connection-dot.is-online{background:#18b87b!important;box-shadow:0 0 0 4px #18b87b22!important}
.monitor-device-heading{gap:10px;margin-bottom:10px}
.monitor-device-heading h3{flex:1;min-width:0;margin:0}
.monitor-single-page button{display:none}
#monitoringPage .monitor-single-page{justify-content:center;margin:12px 0}
@media(max-width:760px){
 .activity-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 8px;padding-bottom:10px}
 .activity-toolbar h3{grid-column:1/-1;min-width:0;font-size:16px}
 .activity-toolbar label{gap:6px;font-size:12px}
 .activity-toolbar .activity-month{flex:1;width:100%;padding:8px;appearance:none;-webkit-appearance:none}
 .activity-month::-webkit-date-and-time-value{min-width:0;text-align:left}
 .activity-dialog{width:calc(100vw - 16px);max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px);border-radius:16px}
 .activity-dialog-head{padding:10px 12px}
 .activity-dialog-head h2{font-size:20px}
 .manager-activity{padding:12px;scrollbar-gutter:auto}
 .attendance-calendar{gap:4px}
 .calendar-day{min-height:44px;padding:6px 2px;align-items:center;justify-content:center;gap:3px;font-size:13px;border-radius:10px}
 .calendar-day span,.calendar-day small{display:none}
 .calendar-day.has-record:after,.calendar-day.incomplete:after{content:"";height:4px;width:4px;background:currentColor;border-radius:50%}
 .calendar-weekday{font-size:10px;padding:4px 0}
 .activity-total{padding:12px;margin:10px 0}
 .activity-total strong{font-size:26px}
 .usage-row{padding:10px;gap:8px;grid-template-columns:18px minmax(0,1fr) auto}
 .usage-row strong{font-size:13px}
 .monitoring-only .workspace-header{margin-bottom:14px;min-height:64px;padding-top:10px;padding-bottom:10px}
 .monitoring-only .workspace-header h2{font-size:16px;line-height:1.2}
 #monitoringPage .section-heading{margin-bottom:12px}
 #monitoringPage .section-heading .eyebrow,#monitoringPage .section-heading p{display:none}
 #monitoringPage .section-heading h3{font-size:18px;margin:0}
 #monitorSearchForm{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;margin-bottom:14px}
 #monitorSearchForm input{width:100%;min-width:0;padding:10px 12px}
 #monitorSearchForm button{padding:10px 12px}
 .monitor-device{padding:14px;border-radius:16px}
 .monitor-symbol{width:34px;height:34px;flex:0 0 34px;border-radius:10px}
 .monitor-symbol svg{width:18px;height:18px}
 .monitor-device-heading h3{font-size:18px}
 .monitor-device small{font-size:12px;line-height:1.6}
 .monitor-device-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}
 .monitor-device-actions button{min-width:0;min-height:44px;padding:8px 6px;font-size:13px;gap:5px}
 .monitor-device-actions svg{width:16px;height:16px;flex-shrink:0}
 .monitor-device-actions p{grid-column:1/-1}
 .monitoring-only footer{margin-top:16px;padding-top:12px;gap:4px 12px;flex-wrap:wrap}
}

/* Clearer acrylic treatment for the attendance report. */
.activity-report .activity-toolbar{border-color:#ffffffa8}
.activity-report .calendar-day{position:relative;z-index:0;min-height:94px;padding:10px 8px;gap:5px;background:linear-gradient(145deg,#ffffffc9,#f1eff9ad 58%,#eaf8f3b0);backdrop-filter:blur(18px) saturate(155%);-webkit-backdrop-filter:blur(18px) saturate(155%);border-color:#ffffffd9;border-radius:16px;box-shadow:0 9px 24px #3c47710d,inset 0 1px #ffffffed;transition:transform .16s ease,box-shadow .16s ease}
.activity-report .calendar-day.has-record{background:linear-gradient(145deg,#eafff5dc,#d9f5e9bd 62%,#eaf8f3c4);color:#17644c}
.activity-report .calendar-day.incomplete{background:linear-gradient(145deg,#fff7e5e8,#ffedc9c9 65%,#fff8e8cc);color:#815719}
.activity-report .calendar-day:hover,.activity-report .calendar-day:focus-visible{z-index:10;transform:translateY(-2px);box-shadow:0 14px 30px #3c47711a,inset 0 1px #fff}
.calendar-power{display:grid;gap:2px;font-style:normal;font-variant-numeric:tabular-nums}
.calendar-power span{font-size:10px!important;line-height:1.25}
.calendar-day small{font-size:10px!important;opacity:.82}
.calendar-tooltip{position:absolute;z-index:20;top:calc(100% + 7px);left:50%;width:max-content;max-width:min(250px,calc(100vw - 32px));padding:10px 12px;border:1px solid #ffffffed;border-radius:14px;background:linear-gradient(145deg,#ffffffef,#f2f0fbe8 60%,#eaf8f4e8);box-shadow:0 15px 36px #2735572b;backdrop-filter:blur(24px) saturate(155%);-webkit-backdrop-filter:blur(24px) saturate(155%);color:#34415b;font-size:11px!important;line-height:1.5;text-align:left;white-space:normal;visibility:hidden;opacity:0;pointer-events:none;transform:translate(-50%,-4px);transition:opacity .14s ease,transform .14s ease}
.calendar-day:hover .calendar-tooltip,.calendar-day:focus-visible .calendar-tooltip{visibility:visible;opacity:1;transform:translate(-50%,0)}
.attendance-day-detail,.activity-total{border:1px solid #ffffffd9;background:linear-gradient(145deg,#ffffffd9,#f3f1f9c9 62%,#eaf8f3c7);backdrop-filter:blur(20px) saturate(145%);-webkit-backdrop-filter:blur(20px) saturate(145%);box-shadow:0 10px 28px #39437310,inset 0 1px #ffffffdb}
.activity-dialog{border-color:#ffffffd9;background:linear-gradient(145deg,#ffffffed,#f2f0fbe6 60%,#e9f6f3e3);backdrop-filter:blur(28px) saturate(150%);-webkit-backdrop-filter:blur(28px) saturate(150%);box-shadow:0 24px 90px #25304e36}
@supports not (backdrop-filter:blur(1px)){.activity-report .calendar-day,.attendance-day-detail,.activity-total,.activity-dialog{background:#f8f9fd}}
@media(max-width:760px){
 .activity-report .calendar-day{min-height:68px;padding:5px 1px;gap:3px;border-radius:10px}
 .activity-report .calendar-day .calendar-power{display:grid}
 .activity-report .calendar-day .calendar-power span{display:block;font-size:8px!important;line-height:1.15;letter-spacing:-.025em}
 .activity-report .calendar-day .calendar-tooltip,.activity-report .calendar-day small{display:none}
}
