/* MY AREA v128 — desktop stability and contrast audit */
:root{
  --audit-ink:#102f27;
  --audit-body:#344f46;
  --audit-muted:#536c63;
  --audit-line:#cbd9d2;
  --audit-surface:#ffffff;
  --audit-soft:#f2f7f4;
}

html[data-theme="cahaya"] body{color:var(--audit-ink)}
html[data-theme="cahaya"] main p,
html[data-theme="cahaya"] main small,
html[data-theme="cahaya"] dialog p,
html[data-theme="cahaya"] dialog small,
html[data-theme="cahaya"] .field small,
html[data-theme="cahaya"] .terms-small{color:var(--audit-muted)}
html[data-theme="cahaya"] .field,
html[data-theme="cahaya"] .approval-check,
html[data-theme="cahaya"] .customer-consent{color:var(--audit-ink)}
html[data-theme="cahaya"] input,
html[data-theme="cahaya"] select,
html[data-theme="cahaya"] textarea{
  border-color:#aebfb7!important;
  background:#fff!important;
  color:#102f27!important;
}
html[data-theme="cahaya"] input::placeholder,
html[data-theme="cahaya"] textarea::placeholder{color:#667c73;opacity:1}
html[data-theme="cahaya"] .notice,
html[data-theme="cahaya"] .status-detail,
html[data-theme="cahaya"] .price-summary{
  color:var(--audit-body);
  border-color:var(--audit-line);
}

html[data-theme="malam"]{
  --audit-ink:#f4faf7;
  --audit-body:#d8e7e1;
  --audit-muted:#b9cec5;
  --audit-line:#49675b;
  --audit-surface:#10251e;
  --audit-soft:#162f27;
}
html[data-theme="malam"] body{color:var(--audit-ink)}
html[data-theme="malam"] main p,
html[data-theme="malam"] main small,
html[data-theme="malam"] dialog p,
html[data-theme="malam"] dialog small,
html[data-theme="malam"] .field small,
html[data-theme="malam"] .terms-small{color:var(--audit-muted)!important}
html[data-theme="malam"] h1,
html[data-theme="malam"] h2,
html[data-theme="malam"] h3,
html[data-theme="malam"] b,
html[data-theme="malam"] strong,
html[data-theme="malam"] label,
html[data-theme="malam"] .approval-check,
html[data-theme="malam"] .customer-consent{color:var(--audit-ink)}
html[data-theme="malam"] input,
html[data-theme="malam"] select,
html[data-theme="malam"] textarea{
  border-color:#557367!important;
  background:#0b1d17!important;
  color:#f4faf7!important;
}
html[data-theme="malam"] input::placeholder,
html[data-theme="malam"] textarea::placeholder{color:#9eb5ab!important;opacity:1}
html[data-theme="malam"] option{background:#0b1d17;color:#f4faf7}
html[data-theme="malam"] .notice,
html[data-theme="malam"] .status-detail,
html[data-theme="malam"] .price-summary,
html[data-theme="malam"] .participant-section,
html[data-theme="malam"] .course-worker-assignments,
html[data-theme="malam"] .course-worker-card{
  border-color:var(--audit-line)!important;
  background:var(--audit-soft)!important;
  color:var(--audit-body)!important;
}
html[data-theme="malam"] .course-worker-card em,
html[data-theme="malam"] .course-worker-card small{color:#bdd2c9!important}
html[data-theme="malam"] .text-button{color:#8fd8bd!important}
html[data-theme="malam"] .error-msg{color:#ffaaa0!important}
html[data-theme="malam"] .pill.amber{background:#5a4518!important;color:#ffe7a0!important}
html[data-theme="malam"] .btn:not(.primary):not(.whatsapp):not(.danger){
  border-color:#567267;
  background:#17342b;
  color:#f2f8f5;
}

/* Avoid whole-screen flashing and GPU repaint flicker on desktop. */
html[data-weather="storm"] .weather-ambience:after{display:none!important;animation:none!important}
@media(min-width:851px){
  .official-brandmark,
  .official-brandmark img,
  .mobile-header-logo{animation:none!important}
  .weather-ambience{display:none!important}
  main>*,
  .duty-dot,
  .live-dot,
  .arena-live-pill:before{animation:none!important}
  header,
  dialog::backdrop,
  .arena-game-switcher{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  header{background:#fff!important}
  html[data-theme="malam"] header{background:#10221c!important}
  .customer-ad-media{backface-visibility:hidden;transform:translateZ(0)}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important}
  .weather-ambience *,html[data-weather="storm"] .weather-ambience:after{animation:none!important}
}

/* The desktop admin workspace remains still while notifications refresh. */
@media(min-width:701px){
  body[data-role="admin"] *,
  body[data-role="admin"] *::before,
  body[data-role="admin"] *::after{animation:none!important;transition-duration:0s!important}
  body[data-role="admin"] .weather-ambience{display:none!important}
  body[data-role="admin"] .nav-item:hover,
  body[data-role="admin"] .btn:hover,
  body[data-role="admin"] .login-choice-card:hover{transform:none!important}
}

/* Per-course deposit control and status, legible in both themes. */
.course-deposit-toggle{display:flex!important;align-items:flex-start;gap:10px;margin-top:12px;padding:12px;border:1px solid #a7c5b5;border-radius:10px;background:#edf7ef;color:#17372e!important;cursor:pointer}
.course-deposit-toggle input{width:18px!important;height:18px;margin:1px 0 0;flex:none;accent-color:#0b674e}
.course-deposit-toggle span{display:grid;gap:4px}
.course-deposit-toggle b{color:#17372e!important;font-size:12px}
.course-deposit-toggle small{color:#415d4f!important;font-size:11px;line-height:1.45}
.course-choice-field .course-deposit-status{color:#075f47!important;font-size:11px;font-weight:850}
html[data-theme="malam"] .course-deposit-toggle{border-color:#537867;background:#17382c;color:#f2f8f5!important}
html[data-theme="malam"] .course-deposit-toggle b{color:#f2f8f5!important}
html[data-theme="malam"] .course-deposit-toggle small{color:#c7ddd0!important}
html[data-theme="malam"] .course-choice-field .course-deposit-status{color:#a7f1ce!important}
