/* #45 What is this? */
.wi-capture { display:flex;flex-direction:column;gap:12px;max-width:640px; }
/* Segments as in the kit: 44 px, the chosen one on clay-soft, no shadow. */
.wi-switch { display:flex;border-radius:10px;background:var(--tw-surface);padding:2px;gap:2px;align-self:flex-start; }
.wi-switch label { display:flex;flex:1; } .wi-switch input { position:absolute;opacity:0; }
.wi-switch span { display:inline-flex;align-items:center;justify-content:center;flex:1;min-height:44px;padding:0 16px;border-radius:8px;font:500 14px var(--tw-font);color:var(--tw-text-2);cursor:pointer; }
.wi-switch input:checked + span { background:var(--tw-accent-soft);color:var(--tw-accent-text); }
.wi-switch input:focus-visible + span { outline:2px solid var(--tw-accent); }
.wi-viewfinder { position:relative;aspect-ratio:4/3;background:var(--tw-surface-2);border-radius:16px;overflow:hidden; }
.wi-viewfinder[hidden] { display:none; }
.wi-viewfinder video { position:absolute;inset:0;width:100%;height:100%;object-fit:contain; }
.wi-guide { position:absolute;inset:20px;border:1.5px dashed var(--tw-divider-strong);border-radius:10px;pointer-events:none; }
.wi-primary { display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:56px;padding:0 20px;border-radius:10px;border:0;background:var(--tw-accent);color:#1A1816;font:600 16px var(--tw-font);cursor:pointer; }
.wi-primary svg { width:20px;height:20px; }
.wi-split { display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap; }
.wi-link { min-height:44px;padding:0 12px;margin-left:-12px;display:inline-flex;align-items:center;color:var(--tw-accent-text);font:500 14px var(--tw-font);cursor:pointer; }
.wi-link:focus-within { outline:2px solid var(--tw-accent);outline-offset:2px; }
.wi-note { margin:0 0 12px;font-size:13px; }
.wi-status { min-height:20px;font:500 14px var(--tw-font); }
.wi-results { display:flex;flex-direction:column;gap:12px; }
.wi-card { display:grid;grid-template-columns:96px minmax(0,1fr);gap:16px;padding:12px;border-radius:16px;background:var(--tw-surface); }
.wi-pic { width:96px;height:96px;border-radius:10px;background:#fff;display:grid;place-items:center;overflow:hidden; }
.wi-pic img { width:100%;height:100%;object-fit:contain; }
.wi-number { font-size:12px;color:var(--tw-text-muted); } .wi-name { font:600 16px/22px var(--tw-font);margin:2px 0 6px; }
.wi-owned { margin:0 0 8px;font:500 14px/20px var(--tw-font); } .wi-none { color:var(--tw-text-2); }
.wi-colours { list-style:none;margin:0 0 8px;padding:0;display:flex;flex-direction:column;gap:6px; }
.wi-colours li { display:grid;grid-template-columns:auto 40px minmax(0,1fr);gap:8px;align-items:center;font:400 13px var(--tw-font); }
.wi-chip { display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:6px;background:var(--tw-surface-2);font:500 12px var(--tw-font);border:.5px solid var(--tw-divider); }
.wi-card-actions { display:flex;flex-wrap:wrap;gap:8px; }
.wi-card-actions .button { min-height:44px; }
@media(max-width:480px){ .wi-card { grid-template-columns:72px minmax(0,1fr); } .wi-pic { width:72px;height:72px; } }