.listening-panel label{display:grid;gap:8px}.listening-panel select{width:100%;font:inherit;background:var(--bg);color:var(--fg);border:1px solid var(--dim2);padding:8px}.listening-panel fieldset{border:0;padding:14px 0;margin:0}.listening-panel legend{font:11px var(--mono)}.listening-modes,.listening-toggles{display:flex;flex-wrap:wrap;gap:6px}.listening-panel button{font-size:10px;padding:8px}.listening-panel button[aria-pressed="true"]{outline:2px solid var(--accent);outline-offset:-2px;background:var(--dim2)}.listening-help,#listeningStatus{font:12px/1.6 var(--mono)}.audition-mode .sq{cursor:crosshair}
#resonancePaths{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:8;overflow:visible}#resonancePaths line{stroke:var(--accent);stroke-width:2;opacity:0;stroke-dasharray:3 5}#resonancePaths circle{fill:var(--fg);stroke:var(--accent);stroke-width:2;opacity:0}#resonancePaths .lit{opacity:1}#resonancePaths line.lit{animation:connectionFade 2.2s forwards}.resonating .piece-glyph{animation:resonancePulse .65s ease-out}.sq.resonating{animation:resonanceSquare 1.2s ease-out}@keyframes resonancePulse{20%{transform:translateY(-4px)}100%{transform:translateY(0)}}@keyframes resonanceSquare{0%{box-shadow:inset 0 0 0 2px var(--accent)}100%{box-shadow:inset 0 0 0 0 transparent}}@keyframes connectionFade{0%{opacity:.9}100%{opacity:0}}

:root[data-skin="resonant"]{--bg:#ded4bd!important;--fg:#292c25!important;--dim:#6b705e!important;--dim2:#bab59e!important;--accent:#65482c!important;--accent2:#8b522e!important;--accent3:#496148!important;--light-sq:#d3c4a2!important;--dark-sq:#ac9974!important}
[data-skin="resonant"] body{background:radial-gradient(ellipse at 35% 30%,#f4ecda,#d4c7ae)!important;color:#292c25}
[data-skin="resonant"] main{max-width:1250px;padding:55px 35px}
[data-skin="resonant"] .title-block{text-align:left;margin-bottom:38px}
[data-skin="resonant"] .title-block h1{font-size:clamp(48px,6vw,82px);letter-spacing:-3px}
[data-skin="resonant"] .lede{font:16px/1.65 'DM Sans',sans-serif!important;max-width:610px!important;margin:18px 0!important}
[data-skin="resonant"] .kicker{color:#685c46!important}
[data-skin="resonant"] .layout{gap:55px}
[data-skin="resonant"] .board{border:14px solid #897756!important;border-radius:4px;box-shadow:0 24px 50px #4d3c3540,inset 0 0 0 2px #51492f;overflow:visible}
[data-skin="resonant"] .sq{background-image:repeating-linear-gradient(5deg,transparent 0 4px,#59462e09 5px 6px)!important}
[data-skin="resonant"] .piece-glyph.white{color:#f7f0dc!important;text-shadow:0 2px 1px #675638,0 4px 6px #4b3c3b77!important}
[data-skin="resonant"] .piece-glyph.black{color:#323e34!important;text-shadow:0 2px 1px #8f947b,0 4px 6px #4b3c3b44!important}
[data-skin="resonant"] .panel{background:transparent!important;border:0!important;border-bottom:1px solid #96877066!important;border-radius:0!important;color:#343d30!important;padding:18px 0}
[data-skin="resonant"] .panel h2{color:#5a604e!important}
[data-skin="resonant"] .panel p{font:14px/1.6 'DM Sans',sans-serif}
[data-skin="resonant"] .material-list{columns:2;font-size:12px!important;color:#756951}
[data-skin="resonant"] button{border-radius:2px!important;color:#394231!important;border-color:#8a8b71!important;background:#f1e8d3!important}
[data-skin="resonant"] .gate{background:#d1c4a4bd!important;backdrop-filter:blur(4px)}
[data-skin="resonant"] .gate p{color:#343d30}
[data-skin="resonant"] .relation-panel{order:5}
[data-skin="resonant"] #relationReadout{color:#5b674f}


[data-skin="resonant"] .sq.resonating{animation:resonanceSquare 1.2s ease-out}[data-skin="resonant"] .resonating .piece-glyph{animation:resonancePulse .65s ease-out}

.appearance-help{font:12px/1.6 var(--mono);opacity:.75}#skinSelect{width:100%}