/* Theme styles affect the application UI only; the printable LJK is a separate document. */
html[data-ui-design] {background:var(--bg-body,#fff);}
html[data-ui-design] body {--shadow:none;--score-shadow:none;--panel-radius:4px;--bg-body:#fafaf8;--bg-card:#fff;--bg-input:#fff;--text-main:#191c21;--text-muted:#56606b;--border:#9aa2aa;--ui-line:#1e242b;background:var(--bg-body);}
html[data-ui-design] body.dark-mode {--bg-body:#14171b;--bg-card:#1e2228;--bg-input:#252a31;--text-main:#f4f5f7;--text-muted:#b9c2ce;--border:#82909f;--ui-line:#b7c2cd;}
html[data-ui-design] body::before {display:none!important;}
html[data-ui-design] body .header,html[data-ui-design] body .bottom-nav {background:var(--bg-card);box-shadow:none!important;}
html[data-ui-design] body .header {border-bottom:1px solid var(--ui-line);}
html[data-ui-design] body .bottom-nav {border-top:1px solid var(--ui-line);}
html[data-ui-design] body .container .card {background:var(--bg-card)!important;border:1px solid var(--ui-line)!important;border-radius:4px!important;box-shadow:none!important;}
html[data-ui-design] body .input-css,html[data-ui-design] body .correction-picker-trigger,html[data-ui-design] body .table-container,html[data-ui-design] body .score-card {border-radius:4px!important;box-shadow:none!important;}
html[data-ui-design] body .btn-utama,html[data-ui-design] body .rekap-action-btn {border-radius:4px!important;box-shadow:none!important;}
html[data-ui-design] body .sub-nav-container {background:transparent;border-radius:0!important;border-bottom:1px solid var(--ui-line);padding:0;}
html[data-ui-design] body .sub-nav-btn,html[data-ui-design] body .sub-nav-btn.active {background:transparent;box-shadow:none;border-radius:0;}
html[data-ui-design] body .scan-setting-card {border-radius:4px!important;background:var(--bg-card);color:var(--text-main);}
html[data-ui-design] body .scan-setting-label {color:var(--text-main);}
html[data-ui-design] body #statusSenter.off,html[data-ui-design] body #statusSuara.off {color:var(--text-muted);}
html[data-ui-design] body #wadahKamera {border-radius:4px!important;box-shadow:none!important;outline:1px solid var(--ui-line);}
html[data-ui-design] body #btnNyalakan,html[data-ui-design] body #statusPindai {border-radius:4px!important;}
html[data-ui-design] body .swal2-popup {border:1px solid var(--ui-line);border-radius:4px!important;background:var(--bg-card);color:var(--text-main);}
html[data-ui-design] body .swal2-title,html[data-ui-design] body .swal2-html-container {color:var(--text-main);}
html[data-ui-design] body :is(button,input,select,textarea,a):focus-visible {outline:2px solid var(--primary);outline-offset:3px;}
.scan-ready-placeholder {box-sizing:border-box;position:relative;display:flex;min-height:260px;padding:28px 16px;margin:11px 0;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:var(--bg-card);border:1px solid var(--ui-line);border-radius:4px;color:var(--text-main);}
.scan-ready-placeholder[hidden] {display:none!important;}
.scan-ready-placeholder svg {width:54px;height:68px;margin-bottom:16px;color:var(--text-muted);}
.scan-ready-placeholder h3 {margin:0;font-size:17px;line-height:1.4;}
.scan-ready-placeholder p {margin:8px 0 0;font-size:13px;line-height:1.5;color:var(--text-muted);}
/* Editor chrome only: the paper iframe retains all original print/scanner geometry. */
html[data-ui-design] body > header,html[data-ui-design] body aside {background:var(--bg-card);border-color:var(--ui-line);}
html[data-ui-design] body .panel {background:var(--bg-card);border:1px solid var(--ui-line);border-radius:4px;box-shadow:none;}
html[data-ui-design] body > header button,html[data-ui-design] body aside button,html[data-ui-design] body aside select,html[data-ui-design] body aside input:not([type=range]):not([type=checkbox]),html[data-ui-design] body aside textarea {border:1px solid var(--ui-line);border-radius:4px;background:var(--bg-input);color:var(--text-main);}
html[data-ui-design] body {--ink:var(--text-main);--muted:var(--text-muted);--accent:var(--primary);}
html[data-ui-design] body #workspace {background:var(--bg-body);}
@media(max-width:360px) {.scan-ready-placeholder {min-height:220px;padding:22px 11px;}}

html[data-ui-design="outline"] body {--ui-line:#242424;--border:#767676;--bg-body:#fbfaf7;}
html[data-ui-design="outline"] body.dark-mode {--ui-line:#b9c2cc;--border:#929dab;--bg-body:#14171b;}
html[data-ui-design="outline"] body .container .card {border-width:1.5px!important;}
html[data-ui-design="outline"] body .container .scan-shell {padding:0;border:0!important;background:transparent!important;}
html[data-ui-design="outline"] body .scan-settings-row {gap:0;border:1.5px solid var(--ui-line);background:var(--bg-card);border-radius:0;}
html[data-ui-design="outline"] body .scan-settings-row .scan-setting-card {border:0;border-radius:0!important;min-height:58px;padding:11px;}
html[data-ui-design="outline"] body .scan-settings-row .scan-setting-card:first-child {border-right:1.5px solid var(--ui-line);}
html[data-ui-design="outline"] body .scan-mode-control {border:1.5px solid var(--ui-line);min-height:48px;}
html[data-ui-design="outline"] body .scan-setting-label {font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:11px;}
html[data-ui-design="outline"] body .btn-utama {border:1.5px solid var(--ui-line);background:var(--bg-card)!important;color:var(--text-main)!important;}
html[data-ui-design="outline"] body #statusPindai {border:1.5px solid var(--ui-line)!important;background:var(--bg-card)!important;color:var(--text-main)!important;}
html[data-ui-design="outline"] body .btn-utama:hover {background:var(--bg-input)!important;}
html[data-ui-design="outline"] body .scan-ready-placeholder {border:1.5px solid var(--ui-line);border-radius:0;min-height:290px;}
html[data-ui-design="outline"] body .scan-ready-placeholder svg {color:var(--text-main);}
html[data-ui-design="outline"] body .header .app-title {font-weight:800;}
html[data-ui-design="outline"] body >header button.primary {background:var(--bg-card);color:var(--text-main);}

html[data-ui-design="instrument"] body {--bg-body:#f0f3f6;--bg-input:#f7f9fc;--ui-line:#7f8e9f;--border:#a2afbd;--primary:#1769e0;}
html[data-ui-design="instrument"] body.dark-mode {--bg-body:#111820;--bg-card:#1c2631;--bg-input:#222f3d;--ui-line:#7e92aa;--border:#7e92aa;--primary:#4d9cff;}
html[data-ui-design="instrument"] body .container .scan-shell {border-color:var(--ui-line)!important;padding:11px;}
html[data-ui-design="instrument"] body .scan-settings-row {gap:0;border:1px solid var(--ui-line);border-radius:4px;overflow:hidden;}
html[data-ui-design="instrument"] body .scan-settings-row .scan-setting-card {border:0;min-height:50px;}
html[data-ui-design="instrument"] body .scan-settings-row .scan-setting-card:first-child {border-right:1px solid var(--ui-line);border-radius:0!important;}
html[data-ui-design="instrument"] body .scan-mode-control {border-color:var(--ui-line);border-left:3px solid var(--primary);min-height:46px;}
html[data-ui-design="instrument"] body #statusModeScan {font-family:ui-monospace,SFMono-Regular,Consolas,monospace;}
html[data-ui-design="instrument"] body .input-css:focus {box-shadow:inset 3px 0 var(--primary)!important;}
html[data-ui-design="instrument"] body .scan-ready-placeholder {min-height:320px;background:var(--bg-card);border-color:var(--ui-line);}
html[data-ui-design="instrument"] body .scan-ready-placeholder::before {content:"";position:absolute;inset:16px;pointer-events:none;background:linear-gradient(var(--primary),var(--primary)) left top/20px 2px no-repeat,linear-gradient(var(--primary),var(--primary)) left top/2px 20px no-repeat,linear-gradient(var(--primary),var(--primary)) right top/20px 2px no-repeat,linear-gradient(var(--primary),var(--primary)) right top/2px 20px no-repeat,linear-gradient(var(--primary),var(--primary)) left bottom/20px 2px no-repeat,linear-gradient(var(--primary),var(--primary)) left bottom/2px 20px no-repeat,linear-gradient(var(--primary),var(--primary)) right bottom/20px 2px no-repeat,linear-gradient(var(--primary),var(--primary)) right bottom/2px 20px no-repeat;}
html[data-ui-design="instrument"] body .scan-ready-placeholder svg {color:var(--primary);}
html[data-ui-design="instrument"] body >header button.primary {background:var(--primary);color:#fff;}

html[data-ui-design="modular"] body {--bg-body:#f2f5fa;--bg-input:#f7f9fc;--ui-line:#cbd5e1;--border:#cbd5e1;--text-main:#172334;--text-muted:#526172;--panel-radius:12px;}
html[data-ui-design="modular"] body.dark-mode {--bg-body:#121820;--bg-card:#202a36;--bg-input:#263242;--ui-line:#526276;--border:#526276;--text-main:#f0f4fa;--text-muted:#bac6d4;}
html[data-ui-design="modular"] body .container .card {border:1px solid var(--ui-line)!important;border-radius:12px!important;box-shadow:0 3px 10px #18284208!important;}
html[data-ui-design="modular"] body .container .scan-shell {border:0!important;background:transparent!important;padding:0;box-shadow:none!important;}
html[data-ui-design="modular"] body .scan-setting-card {border:1px solid var(--ui-line);border-radius:12px!important;background:var(--bg-card);}
html[data-ui-design="modular"] body .scan-settings-row {gap:11px;}
html[data-ui-design="modular"] body .btn-utama,html[data-ui-design="modular"] body #btnNyalakan,html[data-ui-design="modular"] body #statusPindai,html[data-ui-design="modular"] body .input-css {border-radius:12px!important;}
html[data-ui-design="modular"] body .scan-ready-placeholder {border-radius:12px;min-height:290px;box-shadow:0 3px 10px #18284208;}
html[data-ui-design="modular"] body .scan-ready-placeholder svg {color:var(--primary);}
html[data-ui-design="modular"] body .panel {border-radius:12px;}
.theme-settings label {display:block;font-size:13px;font-weight:700;margin-bottom:8px;}
.theme-settings h3 {margin-top:0;margin-bottom:11px;}
.theme-settings .input-css {margin:0;min-height:44px;}
.theme-settings p {font-size:11px;line-height:1.5;color:var(--text-muted);margin:8px 0 0;}
/* Keep destructive actions visually distinct in the outline theme. */
html[data-ui-design="outline"] body {--ui-danger:#b42318;}
html[data-ui-design="outline"] body.dark-mode {--ui-danger:#ff887f;}
html[data-ui-design="outline"] body .btn-utama[style*="var(--danger)"] {color:var(--ui-danger)!important;border-color:var(--ui-danger)!important;}
html[data-ui-design] body {min-height:100dvh;}
html[data-ui-design="outline"] body .switch input:not(:checked) + .slider {background:var(--bg-card);border:1px solid var(--ui-line);box-sizing:border-box;}
html[data-ui-design="outline"] body .switch input:not(:checked) + .slider:before {background:var(--text-main);}
html[data-ui-design] body .app-version-badge {background:#e5e5ea;border-color:#e5e5ea;color:#007aff;}
html[data-ui-design] body.dark-mode .app-version-badge {background:#38383a;border-color:#38383a;color:#79b9ff;}
/* An app-owned, keyboard-operable menu instead of the OS/browser select popup. */
.theme-picker {position:relative;}
.theme-picker-trigger {box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:11px;width:100%;min-height:46px;padding:11px 14px;border:1.5px solid var(--ui-line);border-radius:4px;background:var(--bg-input);color:var(--text-main);font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;text-align:left;}
.theme-picker-trigger svg {flex:0 0 16px;}
.theme-picker-trigger[aria-expanded=true] svg {transform:rotate(180deg);}
.theme-picker-menu {position:absolute;left:0;right:0;top:calc(100% + 5px);z-index:30;box-sizing:border-box;max-height:300px;overflow-y:auto;padding:4px;background:var(--bg-card);border:1.5px solid var(--ui-line);border-radius:4px;box-shadow:0 5px 16px #0002;}
.theme-picker-menu[hidden] {display:none;}
.theme-picker-menu.open-above {top:auto;bottom:calc(100% + 5px);}
.theme-option {display:flex;align-items:center;gap:10px;width:100%;min-height:44px;padding:10px;border:0;border-radius:3px;background:transparent;color:var(--text-main);font:600 13px/1.3 'Inter',sans-serif;text-align:left;cursor:pointer;box-sizing:border-box;}
.theme-option:hover,.theme-option:focus-visible {background:var(--bg-input);}
.theme-option[aria-selected=true] {background:var(--bg-input);color:var(--primary);}
.theme-check {margin-left:auto;visibility:hidden;flex-shrink:0;}
.theme-option[aria-selected=true] .theme-check {visibility:visible;}
.theme-swatch {width:21px;height:21px;box-sizing:border-box;border:1px solid #657080;border-radius:3px;flex:0 0 21px;}
.theme-swatch-modular {background:linear-gradient(135deg,#fff 50%,#007aff 50%);border-radius:6px;}
.theme-swatch-outline {background:#fff;border:2px solid #222;}
.theme-swatch-instrument {background:linear-gradient(90deg,#1769e0 25%,#f0f3f6 25%);}
.theme-swatch-retro {background:linear-gradient(135deg,#f5e9d5 50%,#b74e21 50%);border-color:#805939;}
.theme-swatch-brutalist {background:linear-gradient(135deg,#d8f14a 50%,#d7c8f5 50%);border:2px solid #222;box-shadow:2px 2px #222;border-radius:0;}
html[data-ui-design="modular"] .theme-picker-trigger,html[data-ui-design="modular"] .theme-picker-menu {border-radius:12px;}
html[data-ui-design="outline"] .theme-picker-menu {box-shadow:none;}
/* Match ALL report actions to the outline vocabulary, including per-student actions. */
html[data-ui-design="outline"] body .rekap-action-btn,
html[data-ui-design="outline"] body #tabelRiwayat .wa-btn,
html[data-ui-design="outline"] body #tabelRiwayat .pdf-btn {background:var(--bg-card)!important;color:var(--text-main)!important;border:1.5px solid var(--ui-line)!important;border-radius:4px!important;box-shadow:none!important;}
html[data-ui-design="outline"] body .rekap-delete-btn {color:var(--ui-danger)!important;border-color:var(--ui-danger)!important;}
html[data-ui-design="outline"] body #tabelRiwayat .wa-btn:hover,
html[data-ui-design="outline"] body #tabelRiwayat .pdf-btn:hover {transform:none!important;background:var(--bg-input)!important;}
/* Warm retro: ivory, ink-brown, editorial title, burnt-orange actions. */
html[data-ui-design="retro"] body {--bg-body:#f6efe3;--bg-card:#fffaf1;--bg-input:#f7eddf;--text-main:#3b3028;--text-muted:#725b49;--ui-line:#93765f;--border:#af9680;--primary:#b74e21;--ui-action:#a64620;}
html[data-ui-design="retro"] body.dark-mode {--bg-body:#211b17;--bg-card:#30261f;--bg-input:#3b2f25;--text-main:#f5ebdf;--text-muted:#d1bbaa;--ui-line:#af8b6d;--border:#9e8169;--primary:#f1a880;--ui-action:#a64620;}
html[data-ui-design="retro"] body .header .app-title {font-family:Georgia,'Times New Roman',serif;font-weight:700;letter-spacing:0;}
html[data-ui-design="retro"] body .container .card,html[data-ui-design="retro"] body .scan-setting-card,html[data-ui-design="retro"] body .input-css,html[data-ui-design="retro"] body .scan-ready-placeholder,html[data-ui-design="retro"] .theme-picker-trigger,html[data-ui-design="retro"] .theme-picker-menu {border-radius:6px!important;border-color:var(--ui-line);}
html[data-ui-design="retro"] body .btn-utama:not(.btn-outline),html[data-ui-design="retro"] body #btnNyalakan,html[data-ui-design="retro"] body #statusPindai {background:var(--ui-action)!important;color:#fff!important;border-radius:6px!important;}
html[data-ui-design="retro"] body .scan-ready-placeholder svg {color:var(--text-muted);}
html[data-ui-design="retro"] body .rekap-download-btn {background:var(--ui-action);}
/* Neo-brutalist: lime/lavender, hard shadows, thick outlines, compact geometry. */
html[data-ui-design="brutalist"] body {--bg-body:#faf6e9;--bg-card:#fffdf6;--bg-input:#f4f0e5;--text-main:#171717;--text-muted:#515151;--ui-line:#202020;--border:#767676;--primary:#0058c9;--brutal-lime:#d8f14a;--brutal-lavender:#d7c8f5;}
html[data-ui-design="brutalist"] body.dark-mode {--bg-body:#151515;--bg-card:#252525;--bg-input:#303030;--text-main:#f7f4eb;--text-muted:#c6c3b9;--ui-line:#b9b9b1;--border:#96968d;--primary:#84b6ff;--brutal-lime:#d8f14a;--brutal-lavender:#d7c8f5;}
html[data-ui-design="brutalist"] body .header .app-title {font-weight:800;letter-spacing:-.6px;}
html[data-ui-design="brutalist"] body .container .card,html[data-ui-design="brutalist"] body .scan-setting-card,html[data-ui-design="brutalist"] body .scan-ready-placeholder {border:2px solid var(--ui-line)!important;border-radius:3px!important;box-shadow:3px 3px var(--ui-line)!important;}
html[data-ui-design="brutalist"] body .scan-settings-row .scan-setting-card:first-child {background:var(--brutal-lime);color:#171717;}
html[data-ui-design="brutalist"] body .scan-settings-row .scan-setting-card:last-child {background:var(--brutal-lavender);color:#171717;}
html[data-ui-design="brutalist"] body .scan-settings-row .scan-setting-label,html[data-ui-design="brutalist"] body .scan-settings-row .scan-setting-state.off {color:#252525;}
html[data-ui-design="brutalist"] body #btnNyalakan,html[data-ui-design="brutalist"] body #statusPindai {background:var(--brutal-lime)!important;color:#171717!important;border:2px solid var(--ui-line)!important;box-shadow:3px 3px var(--ui-line)!important;border-radius:3px!important;}
html[data-ui-design="brutalist"] body .theme-picker-trigger,html[data-ui-design="brutalist"] body .theme-picker-menu {border:2px solid var(--ui-line);border-radius:3px;box-shadow:3px 3px var(--ui-line);}
html[data-ui-design="brutalist"] body .btn-utama {border:2px solid var(--ui-line);border-radius:3px!important;}

html[data-ui-design="retro"] body .btn-utama[style*="background:var(--danger)"] {background:#b42318!important;}
html[data-ui-design="outline"] body .rekap-action-btn {box-sizing:border-box;}
/* Status colors follow the bright tile, even while the rest of the UI is dark. */
html[data-ui-design="brutalist"] body .scan-settings-row .scan-setting-card {--text-main:#171717;--text-muted:#333333;--success:#166534;--warning:#854d0e;}