/* Shared interface scale. Deliberately excluded from printable template-ljk.html. */
:root {
  --egp-label: 13px;
  --egp-input: 15px;
  --egp-help: 11px;
  --egp-heading: 15px;
  --egp-dialog-heading: 17px;
  --egp-control: 47px;
  --egp-label-gap: 9px;
  --egp-field-gap: 15px;
  --egp-panel-padding: 11px;
  --space-field: var(--egp-label-gap);
  --space-section: var(--egp-field-gap);
}

/* The repeated class beats legacy theme rules; !important also covers old inline sizes. */
body.egp-ui.egp-ui label {
  font-size: var(--egp-label) !important;
  font-weight: 600;
  line-height: 1.5;
}
body.egp-ui.egp-ui :is(.card,.panel,.guide-box,.feature,main>section:not(.hero):not(.features):not(.section)) {
  padding: var(--egp-panel-padding) !important;
  box-sizing: border-box;
}
body.egp-ui.egp-ui :is(.card,.panel,.guide-box,.feature,main>section) :is(h2,h3,h4,.settings-section-title),
body.egp-ui.egp-ui :is(.sidebar-heading,.pricing-head)>:is(h2,h3),
body.egp-ui.egp-ui .section>h2 {
  font-size: var(--egp-heading) !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
}
html[data-ui-design] body.egp-ui.egp-ui .container .card :is(h2,h3,h4,.settings-section-title),
html[data-ui-design] body.egp-ui.egp-ui aside .panel>h2 {
  font-size: var(--egp-heading) !important;
}
html[data-ui-design] body.egp-ui.egp-ui .container :is(.analysis-disclosure,.topic-editor,.statistics-method)>summary {
  font-size: var(--egp-heading) !important;
}
body.egp-ui.egp-ui :is(dialog,[role=dialog],.swal2-popup) :is(h2,.swal2-title),
body.egp-ui.egp-ui .privacy-heading h2,
body.egp-ui.egp-ui #account-dialog-title {
  font-size: var(--egp-dialog-heading) !important;
  line-height: 1.4 !important;
}
body.egp-ui.egp-ui :is(dialog,[role=dialog]) :is(h3,h4) {
  font-size: var(--egp-heading) !important;
}
body.egp-ui.egp-ui :is(.account-card,.privacy-heading,.privacy-content,.account-loading) {
  padding: var(--egp-panel-padding) !important;
}
body.egp-ui.egp-ui :is(#reg-school-manager,#reg-upgrade-panel,#account-delete-panel,.account-verification-note) {
  padding: var(--egp-panel-padding) !important;
}

/* Text fields and custom selects share a minimum, not a fixed textarea height. */
body.egp-ui.egp-ui :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]):not([type=file]),select,textarea):not(.account-native-select),
body.egp-ui.egp-ui :is(.account-select-trigger,.correction-picker-trigger) {
  box-sizing: border-box;
  min-width: 0;
  min-height: var(--egp-control) !important;
  font-size: var(--egp-input) !important;
  line-height: 21px !important;
  padding: 12px 14px !important;
  margin-top: 0 !important;
}
body.egp-ui.egp-ui :is(select,input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]):not([type=file])):not(.account-native-select) {
  height: auto !important;
}
body.egp-ui.egp-ui input[type=color] { padding: 5px !important; }
body.egp-ui.egp-ui :is(.account-select-options button,.correction-picker-option) {
  font-size: var(--egp-input) !important;
  min-height: var(--egp-control) !important;
}
body.egp-ui.egp-ui .reg-upload { display: flex; align-items: center; justify-content: center; }
body.egp-ui.egp-ui :is(form button,.account-actions button,.account-session-actions button,.settings-actions button,.print-ljk-actions button,.license-actions button,.object-actions button,.export-actions button,.history-actions button,.analysis-filter-buttons button,.analytics-field button,aside>button,aside .panel>button,.switch button,.btn,.btn-utama,.reg-upload) {
  min-height: var(--egp-control) !important;
  box-sizing: border-box;
}
html[data-ui-design] body.egp-ui.egp-ui :is(#auth-form,#reg-authenticated) .ui-action.ui-action,
html[data-ui-design] body.egp-ui.egp-ui .ui-action.ui-action:not(.ui-icon-action) {
  min-height: var(--egp-control) !important;
}
body.egp-ui.egp-ui :is(#auth-form,#reg-authenticated) .account-auth-actions button {
  font-size: var(--egp-label) !important;
}

/* One label-to-control gap, including labels wrapping their input. */
body.egp-ui.egp-ui :is(.form-group,.analytics-field,.archive-fields,.topic-editor,.scan-confirm-field,form) label:not(.account-consent):not(.consent):not(.reg-upload) {
  display: block;
  margin-bottom: var(--egp-label-gap) !important;
}
html[data-ui-design] body.egp-ui.egp-ui .container label>.input-css,
body.egp-ui.egp-ui label.field>:is(input,select,textarea),
body.egp-ui.egp-ui .archive-fields label>.input-css {
  margin-top: var(--egp-label-gap) !important;
}
body.egp-ui.egp-ui :is(.form-group,.field,.analytics-field) {
  margin-bottom: var(--egp-field-gap) !important;
}
html[data-ui-design] body.egp-ui.egp-ui .container .form-group {
  padding-bottom: 0 !important;
}
body.egp-ui.egp-ui :is(.form-group,.field,.analytics-field):last-child { margin-bottom: 0 !important; }
body.egp-ui.egp-ui :is(aside .grid,.archive-fields)>label { margin-bottom: 0 !important; }
body.egp-ui.egp-ui aside .grid { margin-bottom: var(--egp-field-gap); }
body.egp-ui.egp-ui :is(.account-actions,.account-session-actions,.settings-actions,.archive-fields,.packet-fields,.packet-buttons,aside .grid) {
  gap: var(--egp-field-gap) !important;
}
body.egp-ui.egp-ui :is(.card,.panel) { margin-bottom: var(--egp-field-gap) !important; }
body.egp-ui.egp-ui :is(.panel>h2,.card>h2,.card>h3,.guide-box>h3) { margin-bottom: var(--egp-field-gap) !important; }

/* Authentication uses field wrappers; no extra label margin is added to the grid gap. */
body.egp-ui.egp-ui #account-login-fields {
  --auth-label-size: var(--egp-label);
  --auth-control-size: var(--egp-input);
  --auth-field-gap: var(--egp-label-gap);
  --auth-section-gap: var(--egp-field-gap);
}
body.egp-ui.egp-ui #auth-form .account-auth-field { gap: var(--egp-label-gap); }
body.egp-ui.egp-ui #auth-form .account-auth-field>label { margin: 0 !important; }
body.egp-ui.egp-ui #auth-form .account-auth-field>:is(input,.account-select,select) { margin: 0 !important; }
body.egp-ui.egp-ui #auth-form .account-auth-actions { gap: var(--egp-field-gap); }
body.egp-ui.egp-ui #reg-authenticated label:not(.account-consent):not(.reg-upload) { margin: var(--egp-field-gap) 0 var(--egp-label-gap) !important; }
body.egp-ui.egp-ui #reg-authenticated :is(.input-css,.account-select) { margin-bottom: 0 !important; }
body.egp-ui.egp-ui #reg-authenticated :is(.account-actions,.account-session-actions) { gap: var(--egp-field-gap); }

/* Informational copy only: report values and document body text keep their hierarchy. */
body.egp-ui.egp-ui :is(.account-auth-help,.account-auth-footer,.account-privacy-note,.account-verification-note p,.account-loading p,.resize-hint,.sidebar-heading p,.sidebar-footer p,.range-labels,.position-tools p,.key-syntax-hint,.print-logo-hint,.report-caption,.report-note,.report-empty,.data-storage-intro p,.account-expiry,.account-privacy-links,.account-profile-status+ p,small,.small),
body.egp-ui.egp-ui :is(#auth-form,#reg-authenticated) p,
body.egp-ui.egp-ui :is(#reg-status,#account-status,#account-sync-status,#reg-upload-list p) {
  font-size: var(--egp-help) !important;
  line-height: 1.6;
}
body.egp-ui.egp-ui .account-dialog-heading { margin-bottom: var(--egp-field-gap); }
body.egp-ui.egp-ui .account-auth-tabs { margin-bottom: var(--egp-field-gap); }
body.egp-ui.egp-ui #auth-form+.account-auth-footer { margin-top: var(--egp-field-gap); }
body.egp-ui.egp-ui :is(.account-dialog,.privacy-dialog,.ljk-notice,.account-verification-note) {
  border-radius: var(--theme-box-radius,12px);
}
body.egp-ui.egp-ui .privacy-heading {
  grid-template-columns: 47px minmax(0,1fr) 47px;
}
body.egp-ui.egp-ui :is(.privacy-heading,.account-dialog-heading) button {
  width: 47px;
  height: 47px;
  min-height: 47px;
  flex-basis: 47px;
}

/* Narrow editor fields stack labels above controls instead of squeezing text. */
body.egp-ui.egp-ui aside .rotation-heading { align-items: flex-start; flex-direction: column; gap: var(--egp-label-gap); margin-top: var(--egp-field-gap); }
body.egp-ui.egp-ui aside .panel>.rotation-heading:first-child { margin-top: 0; }
body.egp-ui.egp-ui aside .rotation-heading label { margin: 0; }
body.egp-ui.egp-ui aside .rotation-heading>div { width: 100%; }
body.egp-ui.egp-ui aside .rotation-heading input { flex: 1; width: 100% !important; }
body.egp-ui.egp-ui aside .styles label { min-height: 47px; }
body.egp-ui.egp-ui .egp-help { font-size: var(--egp-help) !important; line-height: 1.6; }
body.egp-ui.egp-ui .egp-kop-field { margin-bottom: var(--egp-field-gap); }
body.egp-ui.egp-ui .egp-kop-field:last-child { margin-bottom: 0; }
body.egp-ui.egp-ui .egp-kop-field input { margin-bottom: 0 !important; }
body.egp-ui.egp-ui :is(#set-kunci,#set-cetak,#set-siswa) .card p:not(.settings-section-title),
body.egp-ui.egp-ui #deletion-form p { font-size: var(--egp-help) !important; }
body.egp-ui.egp-ui #deletion-form label { margin-top: var(--egp-field-gap); }
body.egp-ui.egp-ui #deletion-form>label:first-child { margin-top: 0; }

/* Scan controls use one label style, regardless of label/span markup. */
body.egp-ui.egp-ui :is(.scan-setting-label,.scan-setting-state,#statusModeScan) {
  font-family: inherit !important;
  font-size: calc(var(--egp-label) - 2px) !important;
  line-height: 1.5 !important;
  letter-spacing: normal !important;
}
body.egp-ui.egp-ui .scan-setting-label { font-weight: 600 !important; }
body.egp-ui.egp-ui :is(.scan-setting-state,#statusModeScan) { font-weight: 700 !important; }
body.egp-ui.egp-ui .scan-setting-card .switch { margin: 0 !important; }

/* Track and thumb inherit square/rounded geometry live from the chosen theme. */
body.egp-ui.egp-ui :is(.switch .slider,.scan-slider-track,.scan-slider-fill) {
  border-radius: var(--theme-box-radius,12px) !important;
}
body.egp-ui.egp-ui .switch .slider::before {
  border-radius: min(var(--theme-box-radius,12px),9px) !important;
}
body.egp-ui.egp-ui .switch input:focus-visible+.slider {
  outline: 2px solid var(--primary);
  outline-offset: 3px;
}
body.egp-ui.egp-ui input[type=range] {
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  border-radius: var(--theme-box-radius,12px) !important;
}
body.egp-ui.egp-ui input[type=range]::-webkit-slider-runnable-track {
  height: 8px;
  background: var(--border,#dce4eb);
  border-radius: var(--theme-box-radius,12px) !important;
}
body.egp-ui.egp-ui input[type=range]::-moz-range-track {
  height: 8px;
  background: var(--border,#dce4eb);
  border-radius: var(--theme-box-radius,12px) !important;
}
body.egp-ui.egp-ui input[type=range]::-webkit-slider-thumb {
  appearance: none;
  -webkit-appearance: none;
  width: 18px;
  height: 18px;
  margin-top: -5px;
  border: 0;
  background: var(--primary,var(--accent,#007aff));
  border-radius: min(var(--theme-box-radius,12px),9px) !important;
}
body.egp-ui.egp-ui input[type=range]::-moz-range-thumb {
  width: 18px;
  height: 18px;
  border: 0;
  background: var(--primary,var(--accent,#007aff));
  border-radius: min(var(--theme-box-radius,12px),9px) !important;
}
body.egp-ui.egp-ui input[type=range]::-moz-range-progress {
  border-radius: var(--theme-box-radius,12px) !important;
}
/* The scan slider has its own 24px colored track behind the native hit target. */
body.egp-ui.egp-ui #scanLevel::-webkit-slider-runnable-track { height: 24px; background: transparent; }
body.egp-ui.egp-ui #scanLevel::-moz-range-track { height: 24px; background: transparent; }
body.egp-ui.egp-ui #scanLevel::-webkit-slider-thumb { margin-top: 3px; background: #fff; }
body.egp-ui.egp-ui #scanLevel::-moz-range-thumb { background: #fff; }

/* Win against the older margin-block:0 theme rule visible in the screenshots. */
html[data-ui-design] body.egp-ui.egp-ui .container .form-group {
  margin-block-end: var(--egp-field-gap) !important;
  padding-block-end: 0 !important;
}
html[data-ui-design] body.egp-ui.egp-ui .container .form-group:last-child {
  margin-block-end: 0 !important;
}
html[data-ui-design] body.egp-ui.egp-ui .container #set-kunci .packet-settings {
  margin-block-start: var(--egp-field-gap) !important;
}
body.egp-ui.egp-ui .packet-fields .packet-field label { margin: 0 0 var(--egp-label-gap) !important; }

/* History actions use the card's shared panel inset once, without a second toolbar inset. */
body.egp-ui.egp-ui .rekap-card>.rekap-toolbar {
  padding: 0 0 var(--egp-field-gap) !important;
  margin: 0;
}
body.egp-ui.egp-ui .rekap-toolbar-actions {
  gap: var(--egp-field-gap) !important;
  margin: 0;
}
body.egp-ui.egp-ui .rekap-toolbar-actions .rekap-action-btn { margin: 0; }

/* Upgrade panel: headings, help, fields and submit action have one explicit gap. */
body.egp-ui.egp-ui #reg-upgrade-panel {
  display: grid;
  grid-template-columns: minmax(0,1fr);
  gap: var(--egp-field-gap);
}
body.egp-ui.egp-ui #reg-upgrade-panel>:is(h3,p,button) { margin: 0 !important; }
body.egp-ui.egp-ui #reg-upgrade-panel .account-upgrade-field {
  display: grid;
  grid-template-columns: minmax(0,1fr);
  gap: var(--egp-label-gap);
  min-width: 0;
}
body.egp-ui.egp-ui #reg-authenticated #reg-upgrade-panel .account-upgrade-field>:is(label,select,.account-select) {
  margin: 0 !important;
}

/* Reliability summary: prevent heading/filter/caption from touching. */
html[data-ui-design] body.egp-ui.egp-ui .container .advanced-item-statistics>.analysis-section-title {
  margin-block: 0 var(--egp-field-gap) !important;
}
body.egp-ui.egp-ui .advanced-item-statistics>.statistics-group-buttons {
  gap: var(--egp-field-gap);
  margin: 0 0 var(--egp-field-gap);
}
html[data-ui-design] body.egp-ui.egp-ui .container .advanced-statistics-body>.report-caption:first-child {
  margin-block: 0 var(--egp-field-gap) !important;
}
html[data-ui-design] body.egp-ui.egp-ui .container .advanced-item-statistics .report-metrics {
  gap: var(--egp-field-gap);
  margin-block: 0 var(--egp-field-gap);
}
body.egp-ui.egp-ui .advanced-item-statistics .report-metrics>div {
  padding: var(--egp-panel-padding);
}
@media(max-width:600px) {
  body.egp-ui.egp-ui .advanced-item-statistics .report-metrics {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
}

/* Display language selector uses the same single-check interaction as themes. */
body.egp-ui.egp-ui .language-checklist { display: grid; gap: 9px; margin-block: 15px; }
body.egp-ui.egp-ui .language-option { min-height: 47px; text-align: start; border-radius: var(--theme-box-radius,12px); }
body.egp-ui.egp-ui .theme-check { margin-left: 0; margin-inline-start: auto; }
html[dir=rtl] body.egp-ui :is(.account-select-trigger,.account-select-options button,.theme-option) { text-align: start; }
html[dir=rtl] body.egp-ui :is(.switch,.scan-slider-shell,input[type=range],input[type=number],input[type=email],#inputKunci,#kodePaketSoal,#auth-otp,#paper-wrap) { direction: ltr; }
html[dir=rtl] body.egp-ui :is(.account-select-chevron,.scan-setting-state,#statusModeScan) { unicode-bidi: isolate; }
body.egp-ui.egp-ui .app-title,
body.egp-ui.egp-ui .app-subtitle { direction: ltr; }
body.egp-ui.egp-ui .app-name { white-space: nowrap; }

/* History summary uses the same field gap below as the toolbar above. */
body.egp-ui.egp-ui .rekap-card > .rekap-info {
  margin-block-end: var(--egp-field-gap) !important;
}

/* Shared history geometry: theme borders must not bridge adjacent sections. */
body.egp-ui.egp-ui .container .rekap-card { display: flex; flex-direction: column; gap: var(--egp-field-gap); }
body.egp-ui.egp-ui .rekap-card > .rekap-toolbar { padding: 0 !important; margin: 0 !important; border: 0 !important; background: transparent; box-shadow: none !important; }
body.egp-ui.egp-ui .rekap-card > :is(.rekap-info,.table-container) { margin: 0 !important; }

/* Shared spacing for sync feedback and archive identity fields. */
html[data-ui-design] body.egp-ui.egp-ui #account-sync-status {
  box-sizing:border-box;
  padding:var(--egp-panel-padding)!important;
  margin-block:var(--egp-field-gap) 0!important;
  border:1px solid var(--border);
  border-radius:var(--theme-box-radius,12px);
  background:var(--bg-input);
  color:var(--text-muted);
}
body.egp-ui.egp-ui .archive-fields>label {
  display:block;
  min-width:0;
  padding:0;
  margin:0!important;
}
html[data-ui-design] body.egp-ui.egp-ui .archive-fields>label>:is(#archive-name,#archive-subject,#archive-date) {
  padding:12px 14px!important;
  margin:var(--egp-label-gap) 0 0!important;
  width:100%;
  height:var(--egp-control)!important;
  min-height:var(--egp-control)!important;
}
.archive-fields input[type=date]::-webkit-datetime-edit {padding:0}
body.egp-ui.egp-ui .statistics-method>h4 {margin:0!important;line-height:1.4}

/* Equal touch padding for account deletion/help links. */
body.egp-ui.egp-ui .account-help-links {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--egp-field-gap);margin-block:var(--egp-field-gap) 0}
body.egp-ui.egp-ui .account-help-links a {display:flex;align-items:center;justify-content:center;text-align:center;box-sizing:border-box;min-width:0;min-height:var(--egp-control);padding:var(--egp-panel-padding);font-size:var(--egp-label);line-height:1.5}

/* Login/PIN pages only: 15px inner padding and minimum viewport gutters. */
#account-dialog:has(#account-login-fields:not([hidden])),
#device-pin-dialog {
  --egp-panel-padding:15px;
  width:min(520px,calc(100% - 30px));
  max-height:calc(100dvh - 30px);
}
body.egp-ui.egp-ui #account-dialog:has(#account-login-fields:not([hidden]))>.account-card,
body.egp-ui.egp-ui #device-pin-dialog>.account-card {
  padding:15px!important;
}

/* OTP and PIN sign-in share header rhythm, top feedback and a privacy-only footer. */
body.egp-ui.egp-ui #account-dialog:has(#account-login-fields:not([hidden]))>.account-card {
  display:grid;gap:var(--egp-field-gap);
}
body.egp-ui.egp-ui #account-dialog:has(#account-login-fields:not([hidden]))>.account-card>:is(.account-dialog-heading,.auth-language) {
  margin:0!important;
}
body.egp-ui.egp-ui #account-dialog .auth-feedback:not(:has(p:not(:empty))) {display:none}
body.egp-ui.egp-ui #account-dialog .auth-feedback {margin:0 0 var(--egp-field-gap)}
body.egp-ui.egp-ui #account-dialog .auth-feedback p {margin:0!important}
body.egp-ui.egp-ui #account-dialog .auth-feedback p:not(:empty)+p:not(:empty) {margin-top:var(--egp-label-gap)!important}
body.egp-ui.egp-ui #account-dialog .auth-feedback p:empty {display:none!important}
body.egp-ui.egp-ui #account-dialog:has(#account-login-fields:not([hidden])) .account-privacy-note {
  margin:var(--egp-field-gap) 0 0!important;
}
body.egp-ui.egp-ui #device-pin-dialog :is(.account-actions,.account-privacy-note) {margin:0!important}
body.egp-ui.egp-ui #device-pin-dialog #device-pin-status:not(:empty) {
  padding:12px 14px;border:1px solid var(--border);border-radius:var(--theme-box-radius);background:var(--bg-input);color:var(--text-muted);font-size:var(--egp-help);line-height:1.6;
}
html[data-account-check] #device-pin-dialog::backdrop {background:transparent}

/* Override the browser's modal width cap to match the OTP page gutters. */
#account-dialog:has(#account-login-fields:not([hidden])),#device-pin-dialog {
  max-width:calc(100% - 30px);
}
body.egp-ui.egp-ui #account-dialog:has(#account-login-fields:not([hidden])) #account-dialog-title,
body.egp-ui.egp-ui #device-pin-title {
  font-family:inherit!important;font-size:var(--egp-dialog-heading)!important;
  font-weight:700!important;line-height:1.4!important;color:var(--text-main);text-align:center;margin:0!important;
}

/* r33: shared sync metadata and feedback padding across every theme. */
body.egp-ui.egp-ui :is(.account-sync-meta,#account-sync-status){box-sizing:border-box;padding:11px!important;margin:15px 0 0!important;border:1px solid var(--border);border-radius:var(--theme-box-radius,12px);background:var(--bg-input);color:var(--text-muted);font-size:var(--egp-help)!important;line-height:1.6;overflow-wrap:anywhere}
body.egp-ui.egp-ui .account-sync-meta[hidden]{display:none!important}
.account-sync-meta time{unicode-bidi:isolate}
.account-sync-change{display:block;margin-top:9px}
body.egp-ui.egp-ui #account-verification-dialog .account-dialog-heading{margin:0 0 15px!important;align-items:center;gap:15px}
body.egp-ui.egp-ui #account-verification-dialog .account-dialog-heading button{margin:0!important}
body.egp-ui.egp-ui #account-verification-dialog #account-login-fields{display:grid;gap:15px;margin:0!important}
body.egp-ui.egp-ui #account-verification-dialog .account-verification-note{padding:15px!important;margin:0!important}
body.egp-ui.egp-ui #account-verification-dialog #account-login-fields{--auth-section-gap:15px}
body.egp-ui.egp-ui #account-verification-dialog #auth-form{gap:15px}
body.egp-ui.egp-ui #account-verification-dialog .account-action-status:not(:empty){margin:0 0 15px!important;padding:15px!important}

/* Account sign-in heading: title on the physical left and close control on the right. */
body.egp-ui.egp-ui #account-dialog>.account-card>.account-dialog-heading {
  display:flex!important;flex-direction:row!important;direction:ltr;
  align-items:center;justify-content:space-between!important;gap:15px;text-align:left!important;
}
body.egp-ui.egp-ui #account-dialog #account-dialog-title {
  flex:1;min-width:0;text-align:left!important;unicode-bidi:plaintext;
}
body.egp-ui.egp-ui #account-dialog #account-close {
  flex:0 0 47px;margin:0!important;align-self:center;
}

/* A switch is a centered control, not a field caption with a bottom gap. */
body.egp-ui.egp-ui #packetToggle { align-items:center; }
body.egp-ui.egp-ui #packetToggle>.switch {
  margin:0!important;
  padding:0;
  align-self:center;
  flex:0 0 44px;
  height:24px;
  line-height:0;
}