/* 全站底色預覽：保留文字、照片與既有版面。 */
html[data-page-tone="1"]{--paper:#efe5d5;--mist:#e6dac7;--sand:#e3d3ba;--tone-surface:#f5eddf;--tone-header:#e7dbc7;--preview-hero:#e7d6ba}
html[data-page-tone="2"]{--paper:#e9e5dc;--mist:#ded9ce;--sand:#d8d0c0;--tone-surface:#f1eee6;--tone-header:#dfd8ca;--preview-hero:#e1d8c6}
html[data-page-tone="3"]{--paper:#eee1da;--mist:#e4d4cc;--sand:#deccbf;--tone-surface:#f4e9e2;--tone-header:#e5d6cb;--preview-hero:#e8d5c4}
html[data-page-tone="4"]{--paper:#e3e8dc;--mist:#d7dece;--sand:#d5d9c5;--tone-surface:#edf0e6;--tone-header:#dce0ce;--preview-hero:#dedec7}
html[data-page-tone="5"]{--paper:#e2e8e7;--mist:#d5dfde;--sand:#d4dcd5;--tone-surface:#ebefec;--tone-header:#dce1d8;--preview-hero:#e0ddcc}
html[data-page-tone] body{background:var(--paper)}
html[data-page-tone] .site-header{background:var(--tone-header)}
html[data-page-tone] #cable-film-guide{background:var(--paper)}
html[data-page-tone] #cable-film-guide .topic{background:var(--tone-surface)}
html[data-page-tone] #cable-film-guide .guide-directory button:not([aria-selected="true"]){background:var(--paper)}
html[data-page-tone] #products .product-card,
html[data-page-tone] #products .cable-brand-card,
html[data-page-tone] #projects .project-card,
html[data-page-tone] #faq .faq-list>details,
html[data-page-tone] #contact .contact-details,
html[data-page-tone] #contact .contact-extra{background:var(--tone-surface)}
.page-tone-picker{margin:0 0 32px;padding:0 0 24px;border-bottom:1px solid var(--line);font-family:var(--sans)}
.page-tone-picker>p{margin:0 0 12px;font-size:14px;line-height:1.7;color:var(--muted)}
.page-tone-options{display:flex;flex-wrap:wrap;gap:10px}
.page-tone-options button{display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:9px 13px;border:1px solid var(--line);border-radius:6px;background:var(--tone-surface);color:var(--ink);font:500 14px/1.5 var(--sans);cursor:pointer}
.page-tone-options button::before{content:"";width:20px;height:20px;border-radius:50%;background:var(--swatch);border:1px solid rgba(55,52,43,.22);flex:none}
.page-tone-options button[aria-pressed="true"]{border-color:var(--pine);box-shadow:inset 0 0 0 1px var(--pine);font-weight:700}
.page-tone-options button:hover{border-color:var(--pine)}
.page-tone-options button:focus-visible{outline:2px solid var(--pine);outline-offset:3px}
@media(max-width:600px){.page-tone-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.page-tone-options button{font-size:13px;padding:9px 10px}}