html{background-color:var(--paper)}body{background:var(--paper)}.back-link{font-size:11px;color:var(--muted);margin-bottom:16px;display:inline-block}.back-link:hover{color:var(--accent)}#preview{border:1px solid var(--rule-strong);border-radius:var(--rad-md);overflow:hidden;background:var(--paper-card)}#preview-inner{padding:0}.demo-section{background:var(--paper-card);border:1px solid var(--rule);border-radius:var(--rad-md);padding:12px;margin-bottom:12px;box-shadow:0 1px 2px #1c1a140d}.swatch-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;margin-top:10px}.swatch{border-radius:var(--rad-sm);overflow:hidden;font-size:10px;font-family:var(--f-mono);border:1px solid var(--rule);box-shadow:0 1px 2px #1c1a140d}.swatch-color{height:38px}.swatch-label{background:var(--paper-card);padding:4px 6px;color:var(--muted);border-top:1px solid var(--rule)}.swatch-label strong{display:block;color:var(--ink)}.spacing-grid{display:flex;flex-direction:column;gap:6px;margin-top:10px}.spacing-row{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted)}.spacing-bar{height:100%;background:var(--accent);min-height:12px}.spacing-label{width:30px}.spacing-value{color:var(--ink)}.token-table{font-size:11px;font-family:var(--f-mono);color:var(--ink);margin-top:10px}.token-row{display:flex;gap:16px;padding:4px 0;border-bottom:1px solid var(--rule)}.token-key{color:var(--muted);width:150px;flex-shrink:0}.token-val{color:var(--accent-deep)}.css-preview{background:var(--code-surface);border:1px solid var(--rule-strong);border-left:2px solid var(--ink);border-radius:var(--rad-md);padding:12px;font-size:12.5px;font-family:var(--f-mono);color:var(--ink);overflow-x:auto;white-space:pre;max-height:300px;overflow-y:auto;margin-top:10px}.css-preview .prop{color:#2f6f7a}.css-preview .val{color:#9a4a1e}#w5PresetMount{border:1px solid var(--rule-strong);border-radius:var(--rad-md);overflow:hidden}#theme-preview-container{margin-top:12px}.theme-preview-frame{font-family:var(--f-mono);font-size:12px;padding:16px;border-radius:var(--rad-md)}.demo-button-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}.icon-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:12px;margin-top:10px}.icon-cell{background:var(--paper-card);border-radius:var(--rad-sm);padding:11px 7px;text-align:center;border:1px solid var(--rule);box-shadow:0 1px 2px #1c1a140d}.icon-cell img{image-rendering:pixelated;display:block;margin:0 auto 7px}.icon-cell span{font-size:10px;color:var(--muted);word-break:break-all}.icon-fallback-note{font-size:11px;color:var(--muted);margin-top:10px}