:root{--bg:#0b0d10;--surface:#14181d;--surface-raised:#1c2127;--border:#2a3138;--text:#eef2f6;--text-dim:#9aa6b2;--accent:#ffb300;--accent-ink:#1a1204;--ok:#3ddc84;--warn:#ffb300;--error:#ff6b5e;--radius:14px;--shadow:0 8px 30px #00000073}*{box-sizing:border-box}html,body{background:var(--bg);color:var(--text);-webkit-text-size-adjust:100%;margin:0;padding:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:17px;line-height:1.5}.shell{max-width:34rem;margin:0 auto;padding:1.5rem 1.15rem 3rem}h1{letter-spacing:-.01em;margin:0 0 .4rem;font-size:1.6rem;line-height:1.2}h2{margin:0 0 .5rem;font-size:1.1rem}p{margin:0 0 .9rem}.lede{color:var(--text-dim);margin-bottom:1.5rem}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);margin-bottom:1rem;padding:1.1rem}.steps{gap:.4rem;margin-bottom:1.4rem;padding:0;list-style:none;display:flex}.steps li{background:var(--border);border-radius:999px;flex:1;height:4px;transition:background .2s}.steps li[data-state=done],.steps li[data-state=active]{background:var(--accent)}.steps li[data-state=active]{opacity:.55}.step-label{color:var(--text-dim);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.35rem;font-size:.85rem}button{font:inherit;cursor:pointer;border:1px solid #0000;border-radius:11px;width:100%;min-height:48px;padding:.85rem 1.1rem;font-weight:600;transition:transform 80ms,filter .15s}button:active:not(:disabled){transform:scale(.985)}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.primary{background:var(--accent);color:var(--accent-ink)}.secondary{background:var(--surface-raised);color:var(--text);border-color:var(--border)}.button-row{flex-direction:column;gap:.6rem;margin-top:1rem;display:flex}label{margin-bottom:.35rem;font-weight:600;display:block}.hint{color:var(--text-dim);margin:-.1rem 0 .8rem;font-size:.88rem}input[type=text]{font:inherit;background:var(--bg);width:100%;min-height:48px;color:var(--text);border:1px solid var(--border);border-radius:11px;padding:.8rem .9rem}input[type=text]:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.swatches{grid-template-columns:repeat(auto-fill,minmax(4.4rem,1fr));gap:.55rem;display:grid}.swatch{border:2px solid var(--border);color:#0000;border-radius:11px;width:100%;min-height:3.4rem;padding:0}.swatch[aria-pressed=true]{border-color:var(--text);box-shadow:0 0 0 3px #ffffff26}.swatch-name{color:var(--text-dim);text-align:center;margin-top:.25rem;font-size:.72rem;display:block}.viewfinder{aspect-ratio:3/4;border-radius:var(--radius);border:1px solid var(--border);background:#000;width:100%;position:relative;overflow:hidden}.viewfinder video{object-fit:cover;width:100%;height:100%;transform:scaleX(-1)}.pose{text-align:center;background:linear-gradient(#0000,#000000d1);padding:.7rem .9rem;font-weight:600;position:absolute;inset:auto 0 0}.thumbs{gap:.5rem;margin-top:.7rem;display:flex}.thumbs img{object-fit:cover;border:1px solid var(--border);border-radius:8px;width:3.6rem;height:4.8rem;transform:scaleX(-1)}.thumb-empty{border:1px dashed var(--border);border-radius:8px;width:3.6rem;height:4.8rem}.consent{background:var(--bg);border:1px solid var(--border);white-space:pre-wrap;overflow-wrap:anywhere;max-height:17rem;color:var(--text-dim);border-radius:11px;padding:.9rem 1rem;font-size:.93rem;overflow-y:auto}.checkline{align-items:flex-start;gap:.7rem;margin-top:1rem;font-weight:500;display:flex}.checkline input{width:1.4rem;height:1.4rem;accent-color:var(--accent);flex:none;margin:.15rem 0 0}.notice{border:1px solid;border-radius:11px;margin-bottom:1rem;padding:.85rem 1rem}.notice.error{border-color:var(--error);background:#ff6b5e1a}.notice.warn{border-color:var(--warn);background:#ffb3001a}.notice.ok{border-color:var(--ok);background:#3ddc841a}.notice p:last-child{margin-bottom:0}.badge{color:var(--text-dim);border:1px solid var(--border);border-radius:999px;align-items:center;gap:.4rem;margin-bottom:1rem;padding:.25rem .7rem;font-size:.8rem;display:inline-flex}.badge:before{content:"";background:var(--ok);border-radius:999px;width:.5rem;height:.5rem}.spinner{border:3px solid var(--border);border-top-color:var(--accent);border-radius:999px;width:2.2rem;height:2.2rem;margin:.5rem auto 1rem;animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.spinner{animation-duration:3s}button:active:not(:disabled){transform:none}}.center{text-align:center}.footnote{color:var(--text-dim);margin-top:1.6rem;font-size:.85rem}code{background:var(--surface-raised);overflow-wrap:anywhere;border-radius:5px;padding:.1rem .35rem;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.85em}textarea{font:inherit;background:var(--bg);width:100%;color:var(--text);border:1px solid var(--border);resize:vertical;border-radius:11px;min-height:6rem;padding:.8rem .9rem}textarea:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.notice:not(.ok):not(.warn):not(.error){border-color:var(--border);background:var(--surface-raised)}.checkline input[type=radio]{width:1.3rem;height:1.3rem}.colour-exact{margin-top:1rem}.colour-exact__row{align-items:center;gap:.6rem;display:flex}.colour-exact__row input[type=color]{cursor:pointer;background:0 0;border:1px solid #ffffff40;border-radius:10px;width:3.4rem;height:3.4rem;padding:0}.colour-exact__hex{text-transform:lowercase;width:8ch;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.colour-exact__preview{border:1px solid #ffffff4d;border-radius:50%;flex:none;width:2.2rem;height:2.2rem}
