html[data-app-style]{--ui-bg:#090b0f;--ui-panel:#10283f;--ui-soft:#0c1c2c;--ui-head:#05264b;--ui-ink:#f5f6fa;--ui-muted:#b3c1cf;--ui-line:#3b5064;--ui-gold:#f4a023;--ui-gold-ink:#211604;--ui-active:#26384a;--ui-head-ink:#fff;--ui-shadow:#0004;color-scheme:dark}
html[data-app-style=white]{--ui-bg:#f5f7fa;--ui-panel:#fff;--ui-soft:#edf1f6;--ui-head:#fff;--ui-head-ink:#052952;--ui-ink:#052952;--ui-muted:#536478;--ui-line:#c9d2de;--ui-active:#fff0d8;--ui-shadow:#05295212;color-scheme:light}
html[data-app-style=royal]{--ui-bg:#f1f4f8;--ui-panel:#fff;--ui-soft:#eaf0f6;--ui-ink:#052952;--ui-muted:#536478;--ui-line:#c6d1dd;--ui-active:#fff0d8;--ui-shadow:#05295216;color-scheme:light}
html[data-app-style=navy]{--ui-bg:#061428;--ui-panel:#102d4b;--ui-soft:#0a223c;--ui-head:#05264b;--ui-active:#263e58}
html[data-app-style=black]{--ui-bg:#0b0b0d;--ui-panel:#1b1b1e;--ui-soft:#131315;--ui-head:#0b0b0d;--ui-line:#45454b;--ui-muted:#bebec6;--ui-active:#353029}
html[data-app-style]{--ink:var(--ui-ink);--muted:var(--ui-muted);--bg:var(--ui-bg);--white:var(--ui-panel);--line:var(--ui-line);--green:var(--ui-gold);--accent:var(--ui-gold);--deep:var(--ui-head);--lime:var(--ui-gold)}
html[data-app-style] body{background:var(--ui-bg);color:var(--ui-ink)}
html[data-app-style] :is(.topbar,.studio-header,.control-header,.classroom-header,.lab-header,.login-header,.sc-nav,.preview-strip){background:var(--ui-head)!important;color:var(--ui-head-ink)!important;border-color:var(--ui-line)!important}
html[data-app-style] :is(.topbar,.studio-header,.control-header,.classroom-header,.lab-header,.login-header,.sc-nav) :is(a,b,strong,small,.brand-name,.brand-name>span,#controlName){color:inherit}
html[data-app-style] :is(.sidebar,.sidebar-bottom,.bench-card,.controls-card,.readings-card,.insight-card,.balance-card,.studio-room-picker,.class-card,.card,.stat,.ticket-sidebar,.ticket-main,.ticket-header,.person-hero,.control-card,.teacher-card,.student-card,.login-card,.mobile-app-menu,.guest-card,.scientist-card,.guest-form,.instruction-panel,.steps-panel,.scene-panel,.editor-shell,.editor-toolbar,.editor-ribbon,.pages-panel,.layers-panel,.layer-row,.ribbon-panel,.ribbon-content,.ribbon-tabs,dialog){background:var(--ui-panel)!important;color:var(--ui-ink)!important;border-color:var(--ui-line)!important;box-shadow:0 5px 22px var(--ui-shadow)}
html[data-app-style] :is(.experiment-button,.reagent-card,.bench-toolbar,.bench-bottom,.detail-tabs,.reading-row,.pro-reading-note,.mass-balance,.ticket-item,.ticket-description,.ticket-compose,.message,.comment,.revision,.tip-card,.top-search,.input-wrap,.scene-caption,.live-badge,.scene-bottom,.reaction-card,.law-card,.science-notes details,.reader-controls,.editor-desk,.editor-grid,.reader-stage,.control-filters,.control-stat,.control-class,.account-card,.classroom-card){background:var(--ui-soft)!important;color:var(--ui-ink)!important;border-color:var(--ui-line)!important}
html[data-app-style] :is(.experiment-button,.sidebar,.controls-card,.readings-card,.insight-card,.balance-card,.card,.stat,.login-card,.control-card,.ticket-main,.ticket-sidebar,.mobile-app-menu,.instruction-panel,.steps-panel,.scene-caption,.reaction-card,.law-card) :is(h1,h2,h3,strong,b,p,small,label,span){color:inherit}
html[data-app-style] :is(h1,h2,h3,.brand-name,.reading-main .reading-value,.reading-row strong,.range-value b,.experiment-button strong,.studio-room-picker h1,.welcome h1){color:var(--ui-ink)}
html[data-app-style] :is(.eyebrow,.breadcrumbs,.experiment-heading p,.sidebar-head p,.sidebar-bottom p,.side-footer,.main-footer,.heading-meta,.range-value small,.control-small,.control-group label,.reading-label,.reading-category,.learning-tip p,.section-heading p,.hero p,.form-field,.modal-note,.intro,.remember-note,.help-note,.form-message,.reader-controls,.book-saved,.empty,.studio-footer,.login-layout footer){color:var(--ui-muted)}
html[data-app-style] :is(.experiment-icon,.avatar,.count,.art-symbol,.tag,.badge,.tiny-tag){background:var(--ui-soft)!important;color:var(--ui-ink)!important;border-color:var(--ui-line)!important}
html[data-app-style] :is(.btn,.outline-button,.quiet-button,.secondary,.tool-button,.icon-button,.save-reading,.text-button,.mobile-menu-close,.app-session-logout,.pwa-desktop-install,.install-link,.step,.choice){background:var(--ui-soft);color:var(--ui-ink);border-color:var(--ui-line);text-shadow:none}
html[data-app-style] :is(.btn.primary,.primary-button,.primary,.sulfur-start,.btn.gold,.start-button,.next-button,#nextBtn,#startBtn){background:linear-gradient(135deg,#ffb94d,var(--ui-gold))!important;border-color:var(--ui-gold)!important;color:var(--ui-gold-ink)!important;box-shadow:none}
html[data-app-style] :is(.primary-button,.primary,.btn.primary,.btn.gold) :is(svg,span){color:inherit}
html[data-app-style] :is(.experiment-button.active,.view-tabs .selected,.nav-button.active,.studio-header nav button.active,.ticket-item.active,.mobile-app-item.is-active,.ribbon-tab[aria-selected=true]){background:var(--ui-active)!important;color:var(--ui-ink)!important;border-color:var(--ui-gold)!important;box-shadow:none}
html[data-app-style] :is(.nav-button.active:after,.experiment-button.active:before){background:var(--ui-gold);box-shadow:none}
html[data-app-style] :is(input:not([type=range]):not([type=color]):not([type=checkbox]):not([type=radio]),select,textarea){background:var(--ui-soft);color:var(--ui-ink);border-color:var(--ui-line)}
html[data-app-style] :is(input[type=checkbox],input[type=radio],input[type=range]){accent-color:var(--ui-gold)}
html[data-app-style] :is(button,a,input,textarea,select):focus-visible{outline:2px solid var(--ui-gold);outline-offset:3px}
html[data-app-style] .mobile-app-nav{background:var(--ui-head)!important;border-color:var(--ui-line)}
html[data-app-style] .mobile-app-item{color:var(--ui-head-ink)}
html[data-app-style] .mobile-app-menu>nav :is(a,button){background:var(--ui-soft);color:var(--ui-ink);border-color:var(--ui-line)}
html[data-app-style] .mobile-app-menu :is(h2,small){color:var(--ui-ink)}
html[data-app-style] .mobile-app-menu>nav>a svg{stroke:var(--ui-gold)}
html[data-app-style] #sanabil-contact-preview{background:var(--ui-bg);color:var(--ui-ink);--sc-ink:var(--ui-ink);--sc-muted:var(--ui-muted)}
html[data-app-style] #sanabil-contact-preview :is(.sc-card,.sc-channel,.sc-form,.sc-preview,.sc-bubble){background:var(--ui-panel);color:var(--ui-ink);border-color:var(--ui-line)}
html[data-app-style] #sanabil-contact-preview :is(h1,h2,h3,p,.sc-subtitle,.sc-lead,.sc-direct-note,.sc-channel small){color:var(--ui-ink)}
html[data-app-style] #sanabil-contact-preview :is(input,textarea){background:var(--ui-soft);color:var(--ui-ink);border-color:var(--ui-line)}
html[data-app-style] #sanabil-contact-preview .sc-channel-icon{background:var(--ui-soft);color:var(--ui-gold)}
html[data-app-style] #sanabil-learning-models{--sl-ink:var(--ui-ink);--sl-muted:var(--ui-muted);--sl-panel:var(--ui-panel);--sl-border:var(--ui-line);--sl-gold:var(--ui-gold);--sl-cyan:var(--ui-gold);background:var(--ui-bg);color:var(--ui-ink)}
html[data-app-style] #sanabil-learning-models :is(header,button,select,textarea,.sl-scale,.sl-scene){background-color:var(--ui-soft);color:var(--ui-ink);border-color:var(--ui-line)}
html[data-app-style] .paper{color-scheme:light}
.app-style-trigger,.app-style-menu-trigger{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:8px 11px;min-height:38px;border:1px solid var(--ui-line);border-radius:10px;background:var(--ui-soft);color:var(--ui-ink);font:12px/1.6 Tahoma,Arial,sans-serif;cursor:pointer;white-space:nowrap;flex-shrink:0}
.app-style-trigger svg,.app-style-menu-trigger svg{width:20px;height:20px;stroke:var(--ui-gold)}
.style-floating{position:fixed;inset-block-start:14px;inset-inline-end:14px;z-index:120}
#appStyleDialog{box-sizing:border-box;width:min(460px,calc(100% - 24px));max-height:calc(100dvh - 32px);padding:22px;border:1px solid var(--ui-line);border-radius:20px;background:var(--ui-panel);color:var(--ui-ink);direction:rtl;text-align:right;font:14px/1.7 Tahoma,Arial,sans-serif;box-shadow:0 30px 100px #0006}
#appStyleDialog::backdrop{background:#0009;backdrop-filter:blur(6px)}
#appStyleDialog header{display:flex;align-items:center;justify-content:space-between;gap:12px}
#appStyleDialog h2{margin:2px 0;font-size:23px;color:var(--ui-ink)}
#appStyleDialog header small{color:var(--ui-muted);font-size:11px}
#appStyleDialog>p{font-size:12px;color:var(--ui-muted);margin:12px 0 17px}
#appStyleDialog .style-close{width:36px;height:36px;min-height:36px;display:grid;place-items:center;background:var(--ui-soft);color:var(--ui-ink);border:1px solid var(--ui-line);border-radius:10px;font:24px Arial;cursor:pointer}
.style-options{display:grid;gap:9px}
#appStyleDialog .style-option{box-sizing:border-box;display:flex;align-items:center;gap:12px;width:100%;min-height:76px;padding:10px;border:1px solid var(--ui-line);border-radius:13px;background:var(--ui-soft);color:var(--ui-ink);cursor:pointer;text-align:right;font:inherit}
#appStyleDialog .style-option[aria-pressed=true]{border-color:var(--ui-gold);box-shadow:inset 0 0 0 1px var(--ui-gold)}
.style-sample{width:76px;height:52px;border:1px solid #7d879755;border-radius:7px;background:var(--sample-bg);overflow:hidden;flex-shrink:0;display:block}
.style-sample>i{display:block;height:11px;background:var(--sample-panel);border-bottom:2px solid #f4a023}
.style-sample>span{display:flex;gap:4px;padding:9px 5px}
.style-sample b{display:block;width:19px;height:18px;background:var(--sample-panel);border:1px solid #929ba944;border-radius:3px}
.style-sample b:last-child{border-top:3px solid #f4a023}
.style-copy{display:grid;gap:4px;flex:1;min-width:0}
.style-copy strong{font-size:12px;font-weight:700;line-height:1.7}
.style-copy small{font-size:10px;color:var(--ui-muted);line-height:1.7}
.style-check{opacity:0;color:var(--ui-gold);font-size:18px}
[aria-pressed=true]>.style-check{opacity:1}
#appStyleDialog .style-status{min-height:20px;margin-bottom:0;color:var(--ui-ink)}
@media(max-width:760px){.app-style-trigger{width:36px;min-width:36px;padding:7px}.app-style-trigger>span{display:none}.app-style-trigger{position:relative}.app-style-trigger:after{content:'';position:absolute;inset:-3px}.app-style-menu-trigger{justify-content:flex-start;min-height:55px;padding:12px;font-size:12px}.app-style-menu-trigger svg{width:22px;height:22px}#appStyleDialog{padding:18px}.topbar .top-end{gap:4px}.style-floating{inset-block-start:10px;inset-inline-end:10px}}
@media print{.app-style-trigger,.app-style-menu-trigger,#appStyleDialog{display:none!important}}
html[data-app-style] :is(.login-card,.login-layout,.control-header,.studio-header,.card,.ticket-main,.ticket-sidebar) :is(input:not([type=color]):not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea){background:var(--ui-soft)!important;color:var(--ui-ink)!important;border-color:var(--ui-line)!important}
html[data-app-style] .welcome :is(em,.nucleus){color:var(--ui-gold);text-shadow:none}
html[data-app-style] .welcome .orbit{border-color:var(--ui-line)}
html[data-app-style] .welcome .electron{background:var(--ui-gold);box-shadow:none}
html[data-app-style] :is(.features span,.secure-tag){color:var(--ui-muted);border-color:var(--ui-line)}
html[data-app-style] .login-card :is(label,.intro,.remember-note,.help-note){color:var(--ui-muted)}
html[data-app-style] :is(.control-person,.control-hero,.control-info,.control-empty){background:var(--ui-panel);color:var(--ui-ink);border-color:var(--ui-line)}
html[data-app-style] :is(.control-person,.control-hero,.control-stat) :is(h1,h3,p,strong,span){color:inherit}
html[data-app-style] .topbar .app-style-trigger{width:36px;padding:7px}
html[data-app-style] .topbar .app-style-trigger>span{display:none}
html[data-app-style] #sanabil-contact-preview{--sc-bg:var(--ui-bg);--sc-panel:var(--ui-panel);--sc-line:var(--ui-line);--sc-soft:var(--ui-muted);--sc-cyan:var(--ui-gold);--sc-gold:var(--ui-gold);--sc-field:var(--ui-soft);color-scheme:inherit}
html[data-app-style] #sanabil-contact-preview .sc-content{background:none}
html[data-app-style] #sanabil-contact-preview .sc-channel{display:flex}
html[data-app-style] #sanabil-contact-preview .sc-form-card{background:var(--ui-panel);border-color:var(--ui-line)}
html[data-app-style] #sanabil-contact-preview :is(.sc-nav-links [aria-current=page],.sc-send,.sc-whatsapp){background:var(--ui-gold);color:var(--ui-gold-ink);border-color:var(--ui-gold)}