.cc-demo .cc-appearance{background:var(--bg-canvas);min-height:100dvh;color:var(--text-primary);font-family:var(--font-ui);grid-template-columns:11em minmax(0,1fr);line-height:1.4;display:grid;overflow:auto}.cc-demo .cc-appearance svg{flex:none;width:1.2em;height:1.2em}.cc-demo .cc-appearance__sidebar{border-right:1px solid var(--border-subtle);background:var(--bg-surface-1);flex-direction:column;gap:1.5em;padding:1.25em 1em;display:flex}.cc-demo .cc-appearance__sidebar>strong{font-family:var(--font-editorial);letter-spacing:-.02em;font-size:1.05em}.cc-demo .cc-appearance__sidebar nav{gap:.25em;display:grid}.cc-demo .cc-appearance__sidebar nav span{color:var(--text-secondary);border-radius:.5em;align-items:center;gap:.6em;padding:.55em .7em;font-size:.9em;font-weight:600;display:flex}.cc-demo .cc-appearance__sidebar nav span.is-active{background:var(--brand-wash);color:var(--brand-600)}.cc-demo .cc-appearance__main{align-content:start;gap:1.1em;min-width:0;padding:1.25em 1.5em;display:grid}.cc-demo .cc-appearance__main>header{justify-content:space-between;align-items:flex-start;gap:1em;display:flex}.cc-demo .cc-appearance__main header small{color:var(--brand-600);letter-spacing:.08em;font-size:.7em;font-weight:700}.cc-demo .cc-appearance__main h2{font-family:var(--font-editorial);letter-spacing:-.035em;margin:.15em 0 0;font-size:1.75em;line-height:1.1}.cc-demo .cc-appearance__hint{color:var(--text-secondary);margin:0;font-size:.9em}.cc-demo .cc-appearance__cards{grid-template-columns:repeat(auto-fit,minmax(10em,1fr));gap:.75em;display:grid}.cc-demo .cc-appearance__cards article{border:1px solid var(--border-subtle);background:var(--bg-surface-1);border-radius:.75em;gap:.2em;padding:.9em 1em;display:grid}.cc-demo .cc-appearance__cards article svg{color:var(--brand-600)}.cc-demo .cc-appearance__cards small{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.04em;font-size:.75em;font-weight:600}.cc-demo .cc-appearance__cards strong{font-family:var(--font-mono);font-size:1.4em}.cc-demo .cc-appearance__rows{gap:.5em;margin:0;padding:0;list-style:none;display:grid}.cc-demo .cc-appearance__rows li{border:1px solid var(--border-subtle);border-radius:.6em;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:1em;padding:.6em .8em;display:grid}.cc-demo .cc-appearance__rows span{display:grid}.cc-demo .cc-appearance__rows span small{color:var(--text-secondary);font-size:.78em}.cc-demo .cc-appearance__rows b{font-family:var(--font-mono);color:var(--text-danger,#b3262d);font-size:.95em}.cc-demo .cc-appearance__rows button{border:1px solid var(--border-strong);min-height:2.2em;color:inherit;font:inherit;background:0 0;border-radius:.5em;padding:0 .9em;font-size:.85em;font-weight:600}.cc-demo .cc-appearance__menu{flex:none;position:relative}.cc-demo .cc-appearance__trigger{border:1px solid var(--border-subtle);background:var(--bg-surface-2);width:2.6em;height:2.6em;color:var(--text-secondary);cursor:pointer;border-radius:.6em;place-items:center;display:grid}.cc-demo .cc-appearance__trigger:hover,.cc-demo .cc-appearance__trigger[aria-expanded=true]{background:var(--bg-surface-4,var(--bg-surface-3));color:var(--text-primary)}.cc-demo .cc-appearance__panel{z-index:5;border:1px solid var(--border-subtle);background:var(--bg-surface-2);border-radius:1em;gap:1.1em;width:17em;max-width:80vw;padding:1.1em;display:grid;position:absolute;top:calc(100% + .5em);right:0;box-shadow:0 14px 40px #00000038}.cc-demo .cc-appearance__panel section{gap:.6em;display:grid}.cc-demo .cc-appearance__panel h3{color:var(--text-secondary);font-family:var(--font-ui);letter-spacing:.04em;text-transform:uppercase;margin:0;font-size:.72em;font-weight:700}.cc-demo .cc-appearance__choices{grid-template-columns:1fr 1fr;gap:.6em;display:grid}.cc-demo .cc-appearance__panel button{border:1px solid var(--border-subtle);background:var(--bg-surface-1);min-height:2.5em;color:var(--text-primary);font:inherit;cursor:pointer;border-radius:.6em;justify-content:center;align-items:center;gap:.5em;padding:0 .8em;font-size:.9em;display:inline-flex}.cc-demo .cc-appearance__panel button:hover:not(:disabled){background:var(--bg-surface-3)}.cc-demo .cc-appearance__panel button[aria-pressed=true]{border-color:var(--brand-500);background:var(--brand-wash);font-weight:700}.cc-demo .cc-appearance__panel button:disabled{opacity:.4;cursor:not-allowed}.cc-demo .cc-appearance__size{grid-template-columns:2.75em 1fr 2.75em;align-items:center;gap:.6em;display:grid}.cc-demo .cc-appearance__size button{padding:0}.cc-demo .cc-appearance__size output{text-align:center;font-variant-numeric:tabular-nums;font-size:1.15em;font-weight:700}.cc-demo .cc-appearance__panel .cc-appearance__reset{color:var(--text-secondary);background:0 0;border-color:#0000;font-size:.8em}@media (width<=560px){.cc-demo .cc-appearance{grid-template-columns:1fr}.cc-demo .cc-appearance__sidebar{display:none}}