/* New color-only preferences. Source layout and AA metrics are not changed. */
html[data-skin="brown"]{--skin-page:#deb887;--skin-text:#000000;--skin-link:#443000;--skin-header:#deb887;--skin-nav:#deb887;--skin-panel:#ffdaa9;--skin-border:#444444;--skin-aa:#ffffff;--skin-hover:#ccddee;--skin-menu:#deb887}
html[data-skin="green"]{--skin-page:#98fb98;--skin-text:#000000;--skin-link:#004430;--skin-header:#98fb98;--skin-nav:#98fb98;--skin-panel:#cbfdcb;--skin-border:#444444;--skin-aa:#ffffff;--skin-hover:#ccddee;--skin-menu:#98fb98}
html[data-skin="grey"]{--skin-page:#e5e5ff;--skin-text:#000000;--skin-link:#000033;--skin-header:#e5e5ff;--skin-nav:#e5e5ff;--skin-panel:#e5e5ff;--skin-border:#444444;--skin-aa:#ffffff;--skin-hover:#ccddee;--skin-menu:#e5e5ff}
html[data-skin="mono"]{--skin-page:#f9f9f9;--skin-text:#000000;--skin-link:#002bb8;--skin-header:#f9f9f9;--skin-nav:#f9f9f9;--skin-panel:#ffffff;--skin-border:#aaaaaa;--skin-aa:#ffffff;--skin-hover:#ffffff;--skin-menu:#ffffff}
html[data-skin="simple"]{--skin-page:#ffffff;--skin-text:#000000;--skin-link:#000000;--skin-header:#ffffff;--skin-nav:#ffffff;--skin-panel:#ffffff;--skin-border:#888888;--skin-aa:#ffffff;--skin-hover:#ccddee;--skin-menu:#ffffff}
html[data-skin="flower"]{--skin-page:#ffffff;--skin-text:#000000;--skin-link:#215dc6;--skin-header:#ffffff;--skin-nav:#ffffff;--skin-panel:#ffffff;--skin-border:#554036;--skin-aa:#ffffff;--skin-hover:#ccddee;--skin-menu:#ffffff}
html[data-skin="flowerb"]{--skin-page:#ffffff;--skin-text:#000000;--skin-link:#215dc6;--skin-header:#ffffff;--skin-nav:#ffffff;--skin-panel:#ffffff;--skin-border:#554036;--skin-aa:#ffffff;--skin-hover:#ccddee;--skin-menu:#ffffff}
html[data-skin="sea"]{--skin-page:#c5d5ff;--skin-text:#000000;--skin-link:#554036;--skin-header:#c5d5ff;--skin-nav:#b5c5ff;--skin-panel:#c5d5ff;--skin-border:#554036;--skin-aa:#ffffff;--skin-hover:#ccddee;--skin-menu:#c5d5ff}
/* New controls: only this added UI receives sizing rules. */
.skin-picker{font:12px/1.5 sans-serif;margin:4px 0 8px;padding:4px 7px;border:1px solid #888;background:#f4f4f4;color:#111;clear:both}
.skin-picker select{font:inherit;max-width:100%;color:#111;background:#fff}
.skin-picker .skin-explanation p{margin:4px 0}
.skin-explanation summary{cursor:pointer}
[data-skin-choice]{cursor:pointer}
[data-skin-choice][aria-pressed="true"]{outline:2px solid currentColor;outline-offset:1px}
/* Everything below changes only color properties, never font/spacing/AA layout.
   !important intentionally wins over surviving inline white source panels.
   The standard choice also sets data-skin=green so source page colors cannot leak. */
html[data-skin],html[data-skin] body{background-color:var(--skin-page)!important;color:var(--skin-text)!important;background-image:none!important}
html[data-skin] body :is(main,div,section,article,header,footer,aside,nav,table,tbody,thead,tfoot,tr,td,th,p,pre,blockquote,ul,ol,li,dl,dt,dd,span,font,strong,em,b,i,h1,h2,h3,h4,h5,h6,form,label,details,summary){background-color:transparent!important;background-image:none!important;color:inherit!important;border-color:var(--skin-border)!important}
html[data-skin] :is(#header,header){background-color:var(--skin-header)!important;color:var(--skin-text)!important}
html[data-skin] :is(#navigator,nav){background-color:var(--skin-nav)!important;color:var(--skin-text)!important}
html[data-skin] :is(#bbs_headline,.bbs_thread,.skin-picker,.restoration-note,.notice,.font-warning,.badge,.review,span.aamidasi){background-color:var(--skin-panel)!important;color:var(--skin-text)!important;border-color:var(--skin-border)!important}
html[data-skin] :is(#menubar,td.menubar,.pBody){background-color:var(--skin-menu)!important;color:var(--skin-text)!important;border-color:var(--skin-border)!important}
html[data-skin] :is(p.aapro,p.aapro2,span.aaview,.aa){background-color:var(--skin-aa)!important;color:var(--skin-text)!important}
html[data-skin] a:not([data-skin-choice]),html[data-skin] a:not([data-skin-choice]):visited{color:var(--skin-link)!important;background-color:transparent!important}
html[data-skin] a:hover,html[data-skin] a:focus-visible{color:var(--skin-text)!important;background-color:var(--skin-hover)!important}
html[data-skin] :is(input,select,button){background-color:var(--skin-aa)!important;color:var(--skin-text)!important;border-color:var(--skin-border)!important}
html[data-skin] :is(.disabled-action,[aria-disabled="true"],:disabled){color:var(--skin-text)!important}