h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}:root {
    font-family: var(--tw-font-body);
    color: var(--tw-text);
    background: var(--tw-background);
    line-height: 1.6;
}

body { margin: 0; }
main { max-width: 44rem; margin: 12vh auto; padding: 1.5rem; }
h1 { font-size: 2.5rem; margin-bottom: 0.75rem; }
a { color: var(--tw-accent); }

/* Keep the editor background stationary while selecting tasks or confirming changes. */
body:has(.editor-backdrop) { overflow: hidden; }

.fun-badge { display:inline-block; padding:.4rem .7rem; color:#a34d00; background:#ffe5c4; border-radius:8px; font-weight:600; }
.fun-answer-card { padding:2rem; background:#fff; border-radius:20px; text-align:center; } .fun-answer-card blockquote { font-size:clamp(1.6rem,4vw,4rem); font-weight:700; margin:1rem 0; white-space:pre-wrap; overflow-wrap:anywhere; } .fun-correct-participants { display:flex; flex-wrap:wrap; gap:.6rem; justify-content:center; } .fun-correct-participants span { padding:.5rem 1rem; background:#e7edf3; border-radius:10px; }

.question-additional-text { white-space: pre-wrap; overflow-wrap: anywhere; font-size: clamp(1rem, 1.5vw, 1.4rem); line-height: 1.5; }
.preview-screen .question-additional-text { font-size: .9em; text-align: left; }

html { scrollbar-gutter:stable; }
h1, h2, h3, h4, h5, h6, label { cursor:default; }
input, textarea, [contenteditable="true"] { cursor:text; }
label:has(input[type="checkbox"]), label:has(input[type="radio"]), label.attachment-upload { cursor:pointer; }


/* Shared design tokens used by layouts and component styles. */

* { box-sizing:border-box; }
body { background:var(--tw-background); color:var(--tw-text); }
h1,h2,h3,h4 { font-family:"Arial Black","Segoe UI",system-ui,sans-serif; font-weight:900; letter-spacing:-.035em; line-height:1.25; color:var(--tw-text); }
p { overflow-wrap:anywhere; }
a { color:var(--tw-accent); text-underline-offset:.2em; }
button,input,select,textarea { font:inherit; }
button { border:1px solid var(--tw-border); border-radius:var(--tw-radius); background:var(--tw-surface); color:var(--tw-text); padding:.65rem 1rem; cursor:pointer; }
button:hover:not(:disabled) { border-color:var(--tw-accent); }
button:disabled { opacity:.5; cursor:default; }
input,textarea,select { color:var(--tw-text); background:var(--tw-input); border:1px solid var(--tw-border); border-radius:.45rem; padding:.65rem .75rem; }
input::placeholder,textarea::placeholder { color:#999faf; opacity:1; }
input[type=checkbox],input[type=radio] { accent-color:var(--tw-accent); }
:focus-visible { outline:3px solid var(--tw-orange); outline-offset:3px; }
::selection { color:var(--tw-ink); background:var(--tw-accent); }
.primary { background:var(--tw-accent); border-color:var(--tw-accent); color:var(--tw-ink); font-weight:800; }
.site-header { background:var(--tw-background); }
.site-header .brand img { width:6.5rem; height:5rem; }
.site-header .account { color:var(--tw-accent); border-color:#ffd33d70; }
.public-page { max-width:72rem; margin:0 auto; padding:4.5rem 2rem 6rem; min-height:calc(100dvh - 6rem); }
.public-page .eyebrow { margin:0 0 1rem; color:var(--tw-orange); text-transform:uppercase; letter-spacing:.18em; font-size:.75rem; font-weight:800; }
.public-page h1 { font-size:clamp(2.5rem,5vw,4rem); letter-spacing:-.05em; margin:0 0 2rem; }
.public-page .public-content { max-width:48rem; background:var(--tw-surface); border:1px solid var(--tw-border); border-left:4px solid var(--tw-orange); border-radius:var(--tw-radius); padding:2rem; color:var(--tw-muted); line-height:1.8; }
.public-page .public-content p:first-child { margin-top:0; }
.public-page .public-content p:last-child { margin-bottom:0; }
.public-back { display:inline-block; margin-top:2rem; font-size:.9rem; font-weight:700; }
@media(max-width:48rem) { .public-page { padding:2.5rem 1.25rem 4rem; } .public-page .public-content { padding:1.5rem; } }

/* Selection controls use the regular arrow, including their labels. */
input[type="checkbox"], label:has(input[type="checkbox"]),
.team-page .team-setting-switch, .team-page .wake-lock-control .team-setting-switch,
.team-page .team-setting-switch input[type="checkbox"] { cursor: default !important; }

/* Library dialogs keep the table mounted and preserve its scroll position. */
html:has(.library-dialog[open]), body:has(.library-dialog[open]) { overflow:hidden; overscroll-behavior:none; }
html { scrollbar-gutter:stable; }
.library-dialog { box-sizing:border-box; padding:0; border:1px solid var(--tw-border); border-radius:.8rem; background:var(--tw-surface); color:var(--tw-text); width:min(980px,96vw); max-height:94dvh; overscroll-behavior:contain; box-shadow:0 20px 90px #0008; }
.library-dialog[open] { display:flex; flex-direction:column; }
.library-dialog::backdrop { background:#090b16b8; backdrop-filter:blur(3px); }
.library-dialog.library-dialog .dialog-heading { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:1rem 1.5rem; flex-shrink:0; }
.library-dialog h2 { margin:0; font-size:1.5rem; }
.library-dialog.library-dialog .dialog-heading p { margin:.3rem 0 0; color:var(--tw-muted); }
.library-dialog.library-dialog .dialog-content { padding:0 1.5rem 1rem; min-height:0; overflow-y:auto; overscroll-behavior:contain; }
.library-dialog.library-dialog .editor-footer { flex-shrink:0; margin:0; padding:1rem 1.5rem; border-top:1px solid var(--tw-border); display:flex; justify-content:flex-end; gap:.7rem; }
.question-editor-dialog > form { display:flex; flex-direction:column; min-height:0; }
.library-dialog.library-dialog .editor-layout { display:block; }
.library-dialog.library-dialog .editor-panel,.library-dialog.library-dialog .preview-panel { position:static; border:0; padding:0; }
.library-dialog.library-dialog .editor-section { border-top:1px solid var(--tw-border); margin-top:1.25rem; padding-top:.5rem; }
.library-dialog.library-dialog .picture-editor-preview { width:min(360px,100%); margin:1rem auto; }
.bulk-editor { width:min(850px,96vw); }
.bulk-editor .bulk-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.5rem 1.25rem; }
.bulk-editor .bulk-media { border:1px solid var(--tw-border); border-radius:.5rem; padding:0 .85rem; }
.bulk-editor h3 { font-size:.85rem; text-transform:uppercase; color:var(--tw-muted); margin:1.3rem 0 .7rem; }
.bulk-editor label { display:grid; gap:.4rem; margin:.75rem 0; font-weight:600; }
.bulk-editor select,.bulk-editor input { min-width:0; width:100%; padding:.65rem; color:var(--tw-text); background:var(--tw-input); border:1px solid var(--tw-border); border-radius:.4rem; font:inherit; }
.bulk-editor .bulk-changed select { border-color:var(--tw-accent); }
.bulk-editor small { display:block; font-weight:400; color:var(--tw-muted); font-size:.8rem; }
.bulk-editor .bulk-summary { background:var(--tw-input); padding:.75rem 1.5rem; border-top:1px solid var(--tw-border); max-height:20dvh; overflow:auto; overscroll-behavior:contain; font-size:.85rem; }
.bulk-summary p,.bulk-summary ul { margin:.4rem 0; }
.bulk-editor button { padding:.6rem .85rem; border:1px solid var(--tw-border); border-radius:.4rem; color:var(--tw-text); background:var(--tw-surface-raised); cursor:pointer; font:inherit; }
.bulk-editor button.primary { background:var(--tw-accent); color:var(--tw-ink); }
.bulk-editor button:disabled { opacity:.5; cursor:default; }
.confirmation-dialog { width:min(550px,94vw); }
@media(max-width:650px) { .bulk-editor .bulk-fields { grid-template-columns:1fr; }.library-dialog.library-dialog .dialog-content { padding:0 1rem 1rem; } }

.bulk-editor fieldset { margin:0; padding:0; border:0; min-width:0; }
.bulk-editor label.bulk-field { display:flex; flex-direction:column; align-items:stretch; justify-content:flex-start; }
.bulk-editor .bulk-fields { align-items:start; }
.bulk-editor .bulk-summary { flex-shrink:0; }
.bulk-editor h4 { margin:.9rem 0; }

.dismissible-region { display:contents; }

.zoom-focus-picker { position:relative; width:min(360px,100%); margin:1rem auto; overflow:hidden; border-radius:.5rem; cursor:grab; touch-action:none; user-select:none; background:var(--tw-input); }
.zoom-focus-picker:active { cursor:grabbing; }

.zoom-focus-picker { cursor:grab; }
.zoom-focus-picker canvas { display:block; width:100%; height:auto; }
.zoom-focus-picker .picture-error { display:none; }
.zoom-focus-picker:has(canvas[data-loaded="error"]) .picture-error { display:block; }

@media(max-width:800px) {
 dialog.library-dialog.question-editor-dialog { width:100vw; max-width:100vw; height:100dvh; max-height:100dvh; margin:0; border-radius:0; border:0; }
 dialog.library-dialog.question-editor-dialog .dialog-heading { padding:1rem; }
 dialog.library-dialog.question-editor-dialog .dialog-content { padding:1rem; }
 dialog.library-dialog.question-editor-dialog input:not([type=checkbox]):not([type=range]), dialog.library-dialog.question-editor-dialog select, dialog.library-dialog.question-editor-dialog textarea { font-size:16px; }
}

body:has(.backend-sidebar.open) { overflow:hidden; }
