:root { --accent: #b3262e; --bg: #f6f5f2; --ink: #1c1c1e; --line: #d9d6cf; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--ink); font: 16px/1.4 system-ui, -apple-system, sans-serif; }
main { max-width: 560px; margin: 0 auto; padding: 12px 16px 40px; }
h1 { font-size: 1.25rem; margin: 4px 0 10px; }
h2 { font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; color: #6b6760; margin: 14px 0 6px; }
model-viewer { width: 100%; height: 52vh; min-height: 300px; background: #e9e7e1; border-radius: 12px; --poster-color: transparent; }
#ar-btn { position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%); background: var(--accent); color: #fff; border: 0; border-radius: 28px; min-height: 56px; padding: 0 28px; font-size: 1.1rem; font-weight: 600; }
.group { margin-top: 6px; }
button { font: inherit; }
.seg { display: flex; gap: 8px; }
.seg button { flex: 1; min-height: 52px; border: 2px solid var(--line); background: #fff; border-radius: 10px; font-weight: 600; }
.seg button.on { border-color: var(--accent); color: var(--accent); }
.swatches { display: flex; gap: 12px; }
.swatches button { width: 56px; height: 56px; border-radius: 50%; border: 3px solid #fff; box-shadow: 0 0 0 2px var(--line); }
.swatches button.on { box-shadow: 0 0 0 3px var(--accent); }
.stepper { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.stepper span { width: 64px; }
.stepper button { width: 56px; height: 56px; font-size: 1.6rem; border: 2px solid var(--line); background: #fff; border-radius: 10px; }
.stepper output { min-width: 64px; text-align: center; font: 600 1.1rem ui-monospace, monospace; }
.wide { display: block; width: 100%; min-height: 56px; margin-bottom: 8px; border: 0; border-radius: 10px; background: var(--ink); color: #fff; font-weight: 600; }
.wide.ghost { background: #fff; color: var(--ink); border: 2px solid var(--line); }
.msg { min-height: 1.4em; margin: 4px 0; font-weight: 600; color: var(--accent); }
pre { font: 12px/1.45 ui-monospace, Menlo, Consolas, monospace; background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 10px; white-space: pre-wrap; word-break: break-all; margin: 0 0 8px; }
