:root{color-scheme:light}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:32px;padding:6px 11px;background:#f4f2fa;color:#75618f;border:1px solid #e3dfee;border-radius:8px;font:11px 'DM Sans',sans-serif;white-space:nowrap}
.theme-toggle:hover{background:#eae5f5;border-color:#bfb0db}
.theme-icon{font-size:16px;line-height:1}
.header-right{gap:16px}
html[data-theme=dark]{color-scheme:dark;--ink:#eeeaf6;--muted:#b2aabe;--purple:#b9a0ff;--line:#35333e;--bg:#18191e;--theme-panel:#22232b;--theme-control:#292a34;--theme-muted:#b0abb9;--theme-soft:#908b9d}
html[data-theme=dark] body{background:var(--bg);color:var(--ink)}
html[data-theme=dark] aside{background:#1d211e;border-color:#343a32}
html[data-theme=dark] .brand{color:#e6eadf}
html[data-theme=dark] .mark{background:#3f4b38;color:#f2f2d9}
html[data-theme=dark] .nav-label{color:#9aa58f}
html[data-theme=dark] nav a{color:#b2baa8}
html[data-theme=dark] nav a.active{background:#343043;color:#ddd0ff}
html[data-theme=dark] nav small{background:#35412e;color:#c2d5aa}
html[data-theme=dark] .side-card{background:#2a3225;color:#e3e8d8}
html[data-theme=dark] .side-letter{color:#4e5b42}
html[data-theme=dark] .side-card p{color:#b4bda6}
html[data-theme=dark] .side-bottom,html[data-theme=dark] .side-bottom p{color:#a4b197}
html[data-theme=dark] header{background:#1c1d23;border-color:var(--line)}
html[data-theme=dark] .breadcrumb,html[data-theme=dark] .slash{color:#9993a6}
html[data-theme=dark] .local-badge{color:#a4b194}
html[data-theme=dark] .help-btn{color:#c0b8ca}
html[data-theme=dark] .theme-toggle{background:#343044;color:#e0d0ff;border-color:#554968}
html[data-theme=dark] .theme-toggle:hover{background:#443954;border-color:#9e83c2}
html[data-theme=dark] .eyebrow{color:#b4bca4}
html[data-theme=dark] h1 em{color:#aab59b}
html[data-theme=dark] .intro>p,html[data-theme=dark] .guide p{color:var(--theme-muted)}
html[data-theme=dark] .tool-tabs button{color:#aaa3b7}
html[data-theme=dark] .tool-tabs button.active{background:#373044;color:#d0b7ff}
html[data-theme=dark] .tool-tabs>span{color:#adb59e}
html[data-theme=dark] .format-count{color:#b5bda8;border-color:#494c42}
html[data-theme=dark] .editor-card,html[data-theme=dark] .notebook-card,html[data-theme=dark] .art-layout{background:var(--theme-panel);border-color:#3d3b48;box-shadow:0 3px 8px #00000018}
html[data-theme=dark] .output-card{background:#26232d}
html[data-theme=dark] .card-head{border-color:#393641}
html[data-theme=dark] .step{background:#34392c;color:#bdc5ab}
html[data-theme=dark] .step.purple{background:#3c304f;color:#d3b2ff}
html[data-theme=dark] .text-button{color:#beb1d0}
html[data-theme=dark] .ready{color:#afbda0}
html[data-theme=dark] .select-row{background:var(--theme-control);border-color:#45404e}
html[data-theme=dark] .select-row label{color:#b7afc4}
html[data-theme=dark] .select-row select,html[data-theme=dark] select option,html[data-theme=dark] select optgroup{background:var(--theme-control);color:#e2dbe9}
html[data-theme=dark] .select-tag{background:#373440;color:#bcb2ca}
html[data-theme=dark] .editor-card textarea,html[data-theme=dark] #notes{color:#e4ddec;background:transparent}
html[data-theme=dark] .editor-card textarea::placeholder,html[data-theme=dark] #notes::placeholder{color:#a49caf}
html[data-theme=dark] .editor-foot{border-color:#3c3744;color:#a9a0b7}
html[data-theme=dark] .editor-foot button{color:#c3b5d3}
html[data-theme=dark] .editor-foot .primary{color:white}
html[data-theme=dark] .swap{background:#37303f;border-color:#61516f;color:#d8beff}
html[data-theme=dark] .action-bar p{color:#b3a7c2}
html[data-theme=dark] .action-bar p span{color:#c8b0e7}
html[data-theme=dark] .secondary{background:#2b2833;border-color:#51475c;color:#dacbe8}
html[data-theme=dark] .secondary:hover{background:#3e344b;border-color:#9881b0}
html[data-theme=dark] .primary{background:#8c6ce1;border-color:#9f83ec;color:#fff}
html[data-theme=dark] .primary:hover{background:#a184ee}
html[data-theme=dark] .hint{background:#2a3025;border-color:#3e4935;color:#bdc6af}
html[data-theme=dark] .hint strong{color:#d5dfc5}
html[data-theme=dark] .benefits{border-color:var(--line)}
html[data-theme=dark] .benefit-icon{background:#303629;color:#c2caaa}
html[data-theme=dark] .benefits p{color:#aaa5ae}
html[data-theme=dark] .guide-grid>div>span{color:#c2a7e4}
html[data-theme=dark] .guide-number{color:#98909f}
html[data-theme=dark] footer{border-color:var(--line);color:#aaa4b0}
html[data-theme=dark] footer b{color:#bec5aa}
html[data-theme=dark] .font-list{background:#222129;border-color:#3c3747}
html[data-theme=dark] .font-list summary{color:#dbd0e6}
html[data-theme=dark] .font-list summary>span+span,html[data-theme=dark] .font-list>p{color:#afa3bc}
html[data-theme=dark] .font-list[open] summary{border-color:#3c3747}
html[data-theme=dark] .font-chips span{background:#332b43;border-color:#514162;color:#d4bee9}
html[data-theme=dark] .conversion-warning{background:#3b3120;border-color:#6d5730;color:#edce8c}
html[data-theme=dark] .ready.warning{color:#e3bc72}
html[data-theme=dark] .typing-instruction,html[data-theme=dark] .typing-options label{color:#c0b0d1}
html[data-theme=dark] .typing-instruction kbd{background:#302936;border-color:#63516e;color:#e2d3ee}
html[data-theme=dark] .typing-options select{background:#2d2835;border-color:#59486a;color:#deccf1}
html[data-theme=dark] .typing-options>span{color:#b7a8c5}
html[data-theme=dark] .tamil-preview{background:#2d263b;border-color:#56416e}
html[data-theme=dark] .preview-heading{color:#c6a9e4}
html[data-theme=dark] .tamil-preview p{color:#ecdcff}
html[data-theme=dark] .tamil-preview small{color:#b9a7cb}
html[data-theme=dark] .tamil-preview .text-button{color:#d5b7fb}
html[data-theme=dark] .typing-popup{background:#28232e;border-color:#6b517c;box-shadow:0 12px 32px #0008}
html[data-theme=dark] .candidate-word{background:#352a40;border-color:#51405e;color:#e3c9fa}
html[data-theme=dark] #typing-candidates button{background:#28232e;color:#e3d8ee}
html[data-theme=dark] #typing-candidates button[aria-selected=true]{background:#57416f;color:#fff}
html[data-theme=dark] #typing-candidates button:hover{background:#443351}
html[data-theme=dark] .candidate-number{color:#b9a4c9}
html[data-theme=dark] .candidate-help{background:#32283a;border-color:#53405f;color:#c8b2d8}
html[data-theme=dark] .conversion-directions>span{color:#b7a8c5}
html[data-theme=dark] .conversion-directions button{background:#2c2635;border-color:#54445f;color:#d5c0e6}
html[data-theme=dark] .conversion-directions button:hover{background:#42314f;border-color:#9c78b8}
html[data-theme=dark] .conversion-directions a{color:#bda4d0}
html[data-theme=dark] .art-controls label{color:#c0b0ce}
html[data-theme=dark] .art-controls textarea,html[data-theme=dark] .art-controls select{background:#2c2834;border-color:#55485f;color:#e7d9ef}
html[data-theme=dark] .muted{color:#b7a9c1}
html[data-theme=dark] dialog{background:#25212c;border-color:#594669;color:#c8b9d4;box-shadow:0 30px 100px #0008}
html[data-theme=dark] dialog::backdrop{background:#07060cb0}
html[data-theme=dark] button.dialog-close:not(.primary){color:#cab6dc}
html[data-theme=dark] #toast{background:#e1d8ee;color:#2f243b}
html[data-theme=dark] :focus-visible{outline-color:#bd9de8}
@media(max-width:760px){.header-right{gap:8px}.theme-toggle{padding:6px 9px}.help-btn span{display:none}}

html[data-theme=dark] .source-display-controls label{color:#c4b0d3}html[data-theme=dark] .source-display-controls select{background:#302937;border-color:#5c486c;color:#e1cdec}html[data-theme=dark] .source-display-controls p{color:#b3a0bf}
