/* One visual theme, with accessible day/night presentation. */
@layer app {
.appearance-settings { min-width:0; margin-inline:0; }
.appearance-settings legend { padding:0 8px; font-size:20px; font-weight:700; color:var(--text); }
.appearance-settings > p { margin:0 0 18px; }
.appearance-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.appearance-option { position:relative; cursor:pointer; min-width:0; }
.appearance-option input { position:absolute; opacity:0; width:1px; height:1px; }
.appearance-choice { display:grid; gap:12px; padding:14px; height:100%; border:2px solid var(--border); border-radius:18px; background:var(--surface); font-size:14px; font-weight:700; text-align:center; }
.appearance-option input:checked + .appearance-choice { border-color:var(--accent); background:var(--accent-soft); color:var(--accent); box-shadow:0 3px 0 var(--accent-edge); }
.appearance-option input:focus-visible + .appearance-choice { outline:3px solid var(--accent); outline-offset:4px; }
.appearance-preview { display:block; height:64px; position:relative; overflow:hidden; border-radius:10px; background:var(--preview-light); border:1px solid var(--border); }
.appearance-preview.dark { background:var(--preview-dark); }
.appearance-preview.system { background:linear-gradient(90deg,var(--preview-light) 50%,var(--preview-dark) 50%); }
.appearance-preview i { position:absolute; inset:8px auto 8px 8px; width:18%; background:var(--preview-blue); border-radius:5px; }
.appearance-preview b,.appearance-preview em { position:absolute; left:32%; right:10%; height:8px; top:17px; border-radius:4px; background:var(--preview-blue); opacity:.65; }
.appearance-preview em { top:35px; right:24%; opacity:.35; }
.appearance-select { width:auto; max-width:190px; min-height:44px; font-size:13px; padding:8px 10px; }
:root[data-mode="dark"] .btn.danger,
:root[data-mode="dark"] .toast.err { color:var(--danger-contrast); }
:root[data-mode="dark"] .title-badge { color:var(--accent-contrast); }
:root[data-mode="dark"] .tech-node.done .tn-ic { color:var(--success-contrast); }
:root[data-mode="dark"] .scene .island-img { filter:drop-shadow(0 22px 22px var(--bg)); }
:root[data-mode="dark"] .ct-scroll::-webkit-scrollbar-thumb,
:root[data-mode="dark"] .build-dock .build-menu::-webkit-scrollbar-thumb { background:var(--border); }
:root[data-mode="dark"] input::placeholder,
:root[data-mode="dark"] textarea::placeholder { color:var(--text-dim); opacity:.8; }
:root[data-mode="dark"] input[type="checkbox"],
:root[data-mode="dark"] input[type="radio"] { accent-color:var(--accent); }
:root[data-mode="dark"] .scene-topbar .btn { box-shadow:0 3px 0 var(--accent-edge); }
:root[data-mode="dark"] ::selection { background:var(--accent-soft); color:var(--text); }
@media(max-width:540px) {
 .appearance-options { gap:8px; }
 .appearance-choice { padding:9px 6px; font-size:12px; gap:9px; }
 .appearance-preview { height:52px; }
 .lp-nav { flex-wrap:wrap; gap:10px; }
 .lp-nav .appearance-select { max-width:154px; }
}
}