.appearance-controls{font-family:var(--font-archivo), sans-serif;color:var(--color-ink);flex-shrink:0;align-items:center;gap:.4rem;display:inline-flex}.appearance-controls button{cursor:pointer}.appearance-controls button:focus-visible{outline:2px solid var(--color-motorway);outline-offset:3px}.appearance-modes{border:1px solid var(--color-line-strong);background:var(--color-kerb);border-radius:8px;padding:3px;display:inline-flex}.appearance-modes button{min-height:38px;color:var(--color-ink);border-radius:5px;padding:0 10px;font-size:13px;font-weight:600}.appearance-modes button[aria-pressed=true]{background:var(--color-ink);color:var(--color-surface)}.appearance-mode:disabled,.appearance-modes button:disabled{cursor:not-allowed;opacity:.4}.appearance-mode,.appearance-open{width:44px;height:44px;color:var(--color-ink);border-radius:50%;place-items:center;display:inline-grid}.appearance-mode svg{width:20px;height:20px}.appearance-moon,[data-mode=dark] .appearance-sun{display:none}[data-mode=dark] .appearance-moon{display:block}@media (prefers-color-scheme:dark){[data-mode=auto] .appearance-sun{display:none}[data-mode=auto] .appearance-moon{display:block}}.appearance-mode:hover:not(:disabled),.appearance-open:hover{background:color-mix(in srgb, var(--color-ink) 8%, transparent)}.appearance-look:hover{border-color:var(--color-ink)}.appearance-swatch{border:1px solid var(--color-line-strong);border-radius:50%;flex-shrink:0;width:20px;height:20px;display:flex;overflow:hidden}.appearance-swatch i{flex:1}.appearance-panel{overscroll-behavior:contain;border:1px solid var(--color-line-strong);background:var(--color-surface);width:min(36rem,100vw - 2rem);max-height:calc(100dvh - 6rem);color:var(--color-ink);scrollbar-gutter:stable;border-radius:14px;margin:0;position:fixed;inset:5rem 1rem auto auto;overflow-y:auto;box-shadow:0 18px 60px #0004}.appearance-panel-head{z-index:1;border-bottom:1px solid var(--color-line);background:var(--color-surface);padding:12px 16px 10px;position:sticky;top:0}.appearance-panel-title{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.appearance-panel-title h2{font-size:17px;font-weight:700}.appearance-panel-title button{border-radius:6px;place-items:center;min-width:44px;min-height:44px;display:grid}.appearance-panel-title button:hover{background:var(--color-kerb)}.appearance-modes{display:flex}.appearance-modes button{flex:1;min-height:40px}.appearance-mode-hint{color:var(--color-muted);margin-top:8px;font-size:12px;line-height:1.5}.appearance-looks-title{padding:14px 16px 8px;font-size:14px;font-weight:700}.appearance-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:0 12px 12px;display:grid}.appearance-look{border:1px solid var(--color-line);text-align:left;border-radius:9px;width:100%;height:100%;padding:6px;display:block}.appearance-look[aria-pressed=true]{border-color:var(--color-ink);box-shadow:inset 0 0 0 1px var(--color-ink)}.appearance-look-name{margin-top:6px;padding:0 2px;font-size:13px;font-weight:700;line-height:1.35;display:block}.appearance-look-description{color:var(--color-muted);margin-top:3px;padding:0 2px 3px;font-size:11px;line-height:1.4;display:block}.appearance-preview:has(.appearance-layout-preview){padding:0}.appearance-layout-preview{width:100%;height:100%}@media (max-width:40rem){.appearance-panel{max-height:calc(100dvh - 7.5rem);inset:6.5rem 1rem auto}.appearance-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media print{.appearance-controls{display:none}}