html { background:var(--page); color:var(--ink); }
body { background:var(--page); color:var(--ink); }
.theme-picker { display:flex; align-items:center; gap:10px; font-size:14px; font-weight:500; }
.theme-picker>span { color:var(--muted); }
.theme-picker select { appearance:auto; width:auto; max-width:100%; min-height:38px; padding:7px 12px; border:1px solid var(--line); border-radius:5px; background-color:transparent; cursor:pointer; }
.theme-picker select:hover { border-color:var(--muted); }
.homework-toolbar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-bottom:12px; }
.homework-toolbar h2 { margin:0!important; }
.refresh-tools { display:flex; align-items:center; flex-wrap:wrap; gap:8px 16px; }
.refresh-time { font-size:13px; color:var(--muted); }
button.refresh-status { font-size:15px; min-height:36px; padding:6px 10px; gap:7px; }
.refresh-status .ui-icon { width:18px; height:18px; flex-basis:18px; }
.assign-arrow { color:var(--on-accent)!important; }
.state-CLOSED { color:var(--muted); }
.sidebar-account .theme-picker { flex-wrap:wrap; }
@media(max-width:760px) { header { height:auto; min-height:82px; padding-top:12px; padding-bottom:12px; flex-wrap:wrap; } #account { flex-wrap:wrap; max-width:100%; } }
.state-CANCELLED { color:var(--danger-ink); }
.state-CANCELLED:before { background:currentColor; }
.badge.cancelled { color:var(--danger-ink); background:var(--danger-soft); ;box-shadow:var(--danger-surface-glow)}
.attachment-info { display: flex; flex-direction: column; gap: .3rem; min-width: 0; overflow-wrap: anywhere; }
.file-retention-note { color: var(--muted, #64748b); }
.attachment-preview { width: 88px; height: 66px; object-fit: contain; background: var(--surface); border: 1px solid var(--line); border-radius: 4px; }
.image-preview-button { display: flex; flex-direction: column; gap: .4rem; font-size: .8rem; }
.image-viewer { width: min(94vw, 1200px); max-height: 94vh; padding: 1rem; border: 0; background: var(--surface); color: var(--ink); }
.image-viewer::backdrop { background: rgb(0 0 0 / 75%); }
.image-viewer-controls { position:absolute; top:12px; right:12px; z-index:1; display:flex; align-items:center; gap:5px; }
.image-viewer-controls>.ui-action.ui-action--icon { background:color-mix(in srgb,var(--surface) 65%,transparent); backdrop-filter:blur(10px) saturate(1.08); border-color:color-mix(in srgb,var(--line) 70%,transparent); box-shadow:none; }
@media(max-width:600px){.image-viewer-controls{top:8px;right:8px}}
.image-viewer-viewport { position:relative; overflow:hidden; min-height:64px; margin-top:1rem; touch-action:none; user-select:none; }
.image-viewer-viewport.is-zoomed { cursor:grab; }
.image-viewer-viewport.is-panning { cursor:grabbing; }
.image-viewer-viewport:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.image-viewer-picture { display:block; position:absolute; inset:0; max-width:none; max-height:none; object-fit:contain; margin:auto; transform-origin:center; pointer-events:none; }
.image-viewer-controls[hidden], .image-viewer-viewport[hidden] { display:none; }
.image-viewer-picture[hidden] { display: none; }
/* Timezone settings: compact search, keyboard-accessible choices. */
.timezone-toggle{display:flex;align-items:center;gap:12px;margin:16px 0;cursor:pointer}
.timezone-toggle input{appearance:none;flex:0 0 42px;width:42px;height:24px;border:1px solid currentColor;border-radius:20px;padding:3px;background:transparent;cursor:pointer}
.timezone-toggle input::before{content:'';display:block;width:16px;height:16px;border-radius:50%;background:currentColor;transition:transform .15s}
.timezone-toggle input:checked::before{transform:translateX(17px)}
.timezone-toggle input:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.report-policy-state{display:block;margin:4px 0;font-size:15px}.profile-report-policy>.muted{display:block;margin-top:4px}
.timezone-manual[hidden]{display:none}
.timezone-manual input{width:100%;max-width:640px}
.timezone-results{display:grid;gap:6px;margin-top:12px;max-width:640px}
.timezone-results .timezone-option{text-align:left;white-space:normal;overflow-wrap:anywhere;width:100%;padding:12px}