/* ADR 0012: full-screen first-run guide. One job per screen, big targets, motion only as guidance. */
body.setup-wizard-open{overflow:hidden}
.setup-wizard{position:fixed;inset:0;z-index:2147483000;display:flex;justify-content:center;overflow-y:auto;background:var(--surface,#fff);color:var(--text,#22251f)}
.setup-wizard[hidden]{display:none}
.wizard-shell{width:min(100%,760px);min-height:100%;display:flex;flex-direction:column;padding:20px 22px 40px}
.wizard-head{display:grid;grid-template-columns:max-content minmax(0,1fr) max-content;grid-template-areas:"brand progress actions";align-items:center;column-gap:14px;row-gap:8px;min-height:52px;flex-shrink:0}
.wizard-brand{grid-area:brand;display:inline-flex;align-items:center;gap:10px;min-width:0;font-weight:750;font-size:15px;white-space:nowrap}
.wizard-head-actions{grid-area:actions;display:flex;align-items:center;justify-content:flex-end;gap:4px;min-width:0}
.wizard-head-actions .wizard-later,.wizard-head-actions .wizard-nav-back{min-height:42px;height:42px;flex:none;display:inline-flex;align-items:center;justify-content:center;gap:5px;margin:0;padding:0 9px;border:0;border-radius:8px;background:transparent;color:var(--text,#22251f);font-size:13px;font-weight:650;line-height:1.15;box-shadow:none}
.wizard-nav-back[hidden]{display:none!important}
.wizard-progress{grid-area:progress;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px;min-width:0;width:100%;margin:0;padding:0;list-style:none}
.wizard-progress li{display:block;min-width:0}
.wizard-progress-step{display:flex;flex-direction:column;align-items:center;gap:6px;width:100%;min-height:50px;padding:6px 2px;border:0;border-radius:6px;background:transparent;color:var(--muted,#666b61);font:650 11px Geist,Arial,sans-serif;line-height:1.2;text-align:center;white-space:nowrap;cursor:pointer}
.wizard-progress-step:disabled{cursor:default;opacity:1}
.wizard-progress-step:not(:disabled):hover{background:var(--surface-2,#f7f7f3);color:var(--text,#22251f)}
.wizard-progress-step:focus-visible{outline:2px solid var(--focus,#718e28);outline-offset:2px}
.wizard-progress-step i{display:block;width:100%;height:6px;border-radius:999px;background:var(--surface-3,#eff0ea)}
.wizard-progress li.done i{background:var(--success,#3d7e45)}
.wizard-progress li.current i{background:var(--acid,#c5eb48);box-shadow:inset 0 0 0 1px var(--acid-ink,#22251f)}
.wizard-progress li.current .wizard-progress-step{color:var(--text,#22251f)}
.wizard-step{flex:1;display:flex;align-items:center;justify-content:center;padding:28px 0}
.wizard-step[hidden]{display:none}
.wizard-center{width:min(100%,560px);display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center}
.wizard-center h1,.wizard-pairing h1{margin:0;font-family:Geist,ui-sans-serif,system-ui,sans-serif;font-weight:600;font-size:34px;line-height:1.08;letter-spacing:-.04em}
.wizard-center>p,.wizard-pairing p{margin:0;color:var(--muted,#666b61);font-size:15px;line-height:1.5}
.wizard-primary{min-height:56px;min-width:240px;font-size:16px;border-radius:12px}
.wizard-pairing{width:min(100%,560px);display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center}
.wizard-pairing[hidden]{display:none}
.wizard-pairing .pairing-actions{display:flex;flex-direction:column;align-items:center;gap:10px;width:100%}
.wizard-pairing .pairing-replace{display:grid;gap:6px;width:100%;text-align:left}
.wizard-pairing .pairing-name{display:grid;gap:6px;width:100%;text-align:left;font-size:13px;font-weight:700}
.wizard-pairing .pairing-name[hidden],.wizard-pairing .pairing-share[hidden]{display:none}
.wizard-pairing .pairing-name input{min-height:44px;padding:0 12px;border:1px solid var(--control-border,#c9cdc2);border-radius:8px;font:inherit;font-weight:500;font-size:15px}
.wizard-pairing .pairing-name input:focus-visible{outline:2px solid var(--focus,#1b1e18);outline-offset:1px}
.wizard-pairing .pairing-name small{color:var(--muted,#666b61);font-size:12px;font-weight:500;line-height:1.45}
.wizard-pairing .pairing-share{width:100%;margin:0;padding:12px 14px;border:1px solid var(--line,#e2e4dc);border-radius:8px;text-align:left}
.wizard-pairing .pairing-share legend{padding:0 4px;font-size:13px;font-weight:700}
.wizard-pairing .pairing-share-item{display:flex;align-items:center;gap:10px;min-height:36px;font-size:14px;cursor:pointer}
.wizard-pairing .pairing-share-item input{width:18px;height:18px;margin:0;accent-color:#1b1e18}
.wizard-pairing .pairing-share-item small{margin-left:auto;color:var(--muted,#666b61);font-size:12px}
.wizard-wait{display:inline-flex;align-items:center;gap:10px;font-size:14px}
.wizard-spinner{width:16px;height:16px;border-radius:50%;border:2px solid var(--line,#dcddd2);border-top-color:var(--text,#22251f);animation:wizard-spin .9s linear infinite}
@keyframes wizard-spin{to{transform:rotate(360deg)}}
.wizard-choices{display:grid;grid-template-columns:1fr 1fr;gap:12px;width:100%}
.wizard-choice{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:180px;padding:22px 18px;border:2px solid var(--line,#dcddd2);border-radius:14px;background:var(--surface,#fff);color:inherit;text-align:center;font:inherit;cursor:pointer}
.wizard-choice strong{font-size:18px}
.wizard-choice small{color:var(--muted,#666b61);font-size:13px;line-height:1.45}
.wizard-choice em{position:static;margin-top:2px;padding:2px 8px;border-radius:999px;background:var(--acid,#c5eb48);font-style:normal;font-size:11px;font-weight:750}
.wizard-choice.selected{border-color:var(--text,#22251f);box-shadow:none}
.wizard-ack{display:flex;gap:10px;align-items:flex-start;max-width:520px;padding:12px 14px;border:1px solid var(--warning,#8a6719);border-radius:10px;text-align:left;font-size:13px;line-height:1.45}
.wizard-ack[hidden]{display:none}
.wizard-ack input{width:20px;height:20px;flex:none;margin-top:1px}
.wizard-apps{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.wizard-app{display:inline-flex;align-items:center;gap:8px;min-height:52px;padding:0 18px;border:2px solid var(--line,#dcddd2);border-radius:12px;background:var(--surface,#fff);color:inherit;font:650 15px Geist,Arial,sans-serif;cursor:pointer}
.wizard-app.selected{border-color:var(--text,#22251f);box-shadow:3px 3px 0 var(--text,#22251f)}
.wizard-address{display:flex;align-items:center;gap:10px;width:100%;padding:8px 8px 8px 14px;border:1px solid var(--control-border-strong,#b3bb92);border-radius:12px;background:var(--surface-2,#f7f7f3)}
.wizard-address code{flex:1;min-width:0;overflow-wrap:anywhere;text-align:left;font-size:13px}
.wizard-address .button{min-height:44px;flex:none}
.wizard-guide{display:grid;gap:8px;width:100%;margin:0;padding:0;list-style:none;text-align:left}
.wizard-guide li{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--line,#dcddd2);border-radius:12px;font-size:14px;animation:wizard-guide 6s ease-in-out infinite;animation-delay:calc(var(--step,0) * 2s)}
.wizard-guide li>span:first-child{display:grid;place-items:center;width:28px;height:28px;flex:none;border-radius:50%;background:var(--surface-3,#eff0ea);font-weight:800}
.wizard-guide.static li{animation:none}
@keyframes wizard-guide{0%,30%{border-color:var(--text,#22251f);box-shadow:inset 4px 0 0 var(--acid,#c5eb48)}34%,100%{border-color:var(--line,#dcddd2);box-shadow:none}}
.wizard-request{display:block;width:100%;padding:14px;border:1px dashed var(--control-border-strong,#b3bb92);border-radius:12px;text-align:left;white-space:normal;font-size:13px;line-height:1.5}
.wizard-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.wizard-actions .button{min-height:48px}
.wizard-status{min-height:24px;margin:0;font-size:15px;font-weight:650}
.wizard-status[data-tone="success"]{color:var(--success,#3d7e45)}
.wizard-status[data-tone="warning"]{color:var(--warning,#8a6719)}
@media (max-width:700px){.wizard-head{grid-template-columns:minmax(0,1fr) max-content;grid-template-areas:"brand actions" "progress progress"}.wizard-progress{justify-self:stretch}.wizard-brand{font-size:14px}}
@media (max-width:560px){.wizard-center h1,.wizard-pairing h1{font-size:28px}.wizard-choices{grid-template-columns:1fr}.wizard-primary{width:100%;min-width:0}.wizard-address{flex-direction:column;align-items:stretch}}
@media (max-width:375px){.wizard-head{grid-template-areas:"brand brand" "progress progress" "actions actions"}.wizard-head-actions{justify-self:end}}
@media (prefers-reduced-motion:reduce){.wizard-guide li,.tb-cursor,.tb-menu,.tb-pinned,.tb-puzzle,.tb-row .tb-pin,.wizard-spinner{animation:none}.tb-menu,.tb-pinned{opacity:1;transform:none}}

/* Icons are inline SVG in currentColor so they follow the light and dark themes. */
.wz-icon{width:1.25em;height:1.25em;flex:none;vertical-align:-.2em}
.wizard-guide .wz-icon{width:18px;height:18px;margin:0 2px;color:var(--text,#22251f)}
html:not([data-theme="dark"]) .setup-wizard .brand-symbol-dark,html[data-theme="dark"] .setup-wizard .brand-symbol-light{display:none}
.wizard-app img,.wizard-app .wz-icon{width:22px;height:22px}
.wizard-art{display:flex;align-items:center;gap:14px;color:var(--muted,#666b61)}
.art-tile{display:grid;place-items:center;width:64px;height:64px;border:1px solid var(--line,#dcddd2);border-radius:16px;background:var(--surface-2,#f7f7f3);color:var(--text,#22251f)}
.art-tile .wz-icon{width:32px;height:32px}
.art-tile img{width:40px;height:40px}
.art-tile .chrome-symbol{display:block;width:40px;height:40px;background:currentColor;-webkit-mask:url('/icons/chrome.svg') center/contain no-repeat;mask:url('/icons/chrome.svg') center/contain no-repeat}
.wz-arrow{width:24px;height:24px}
.choice-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--surface-3,#eff0ea);color:var(--success,#3d7e45)}
.choice-icon .wz-icon{width:24px;height:24px}
.choice-icon-trusted{color:var(--warning,#8a6719)}
/* A small, faithful Chrome toolbar: cursor opens Extensions, pins BrowserPair, the icon lands in the bar. */
.wizard-toolbar{position:relative;width:min(100%,460px);height:200px;border:1px solid var(--line,#dcddd2);border-radius:14px;background:var(--surface-2,#f7f7f3);overflow:hidden;--tb-blue:#1a73e8}
.tb-bar{display:flex;align-items:center;gap:8px;height:48px;padding:0 10px;border-bottom:1px solid var(--line,#dcddd2);background:var(--surface,#fff)}
.tb-dots{display:flex;gap:5px}.tb-dots i{width:9px;height:9px;border-radius:50%;background:var(--line-strong,#b3bb92)}
.tb-omnibox{flex:1;display:flex;align-items:center;gap:6px;height:30px;padding:0 12px;border-radius:999px;background:var(--surface-3,#eff0ea);color:var(--muted,#666b61);font-size:12px}
.tb-omnibox .wz-icon{width:13px;height:13px}
.tb-btn{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;color:var(--text,#22251f)}
.tb-btn .wz-icon{width:18px;height:18px}
.tb-puzzle{animation:wz-puzzle 7s infinite}
.tb-avatar{width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#8ab4f8,#1a73e8)}
.tb-pinned{display:grid;place-items:center;width:30px;height:30px;opacity:0;transform:scale(.4);animation:wz-pinned 7s infinite}
.tb-pinned img{width:20px;height:20px}
.tb-menu{position:absolute;top:54px;right:46px;width:230px;display:grid;gap:4px;padding:10px;border:1px solid var(--line,#dcddd2);border-radius:12px;background:var(--surface,#fff);box-shadow:0 12px 30px rgba(0,0,0,.18);font-size:12px;text-align:left;opacity:0;transform:translateY(-6px);animation:wz-menu 7s infinite}
.tb-menu strong{padding:0 4px 4px;font-size:12px}
.tb-row{display:flex;align-items:center;gap:8px;padding:6px 6px;border-radius:8px}
.tb-row img,.tb-row i{width:18px;height:18px;border-radius:4px;background:var(--surface-3,#eff0ea)}
.tb-row span:nth-child(2){flex:1}
.tb-row-muted{color:var(--muted,#666b61)}
.tb-pin{display:grid;place-items:center;color:var(--muted,#666b61)}
.tb-pin .wz-icon{width:16px;height:16px}
.tb-row:not(.tb-row-muted) .tb-pin{animation:wz-pin 7s infinite}
.tb-cursor{position:absolute;width:20px;height:20px;animation:wz-cursor 7s infinite;filter:drop-shadow(0 1px 1px rgba(0,0,0,.3))}
.tb-cursor svg{width:20px;height:20px}
@keyframes wz-cursor{0%{top:150px;left:30%}22%,30%{top:20px;left:calc(100% - 60px)}48%,58%{top:92px;left:calc(100% - 70px)}80%,100%{top:150px;left:30%}}
@keyframes wz-puzzle{0%,26%{background:transparent}28%,32%{background:var(--surface-3,#eff0ea)}34%,100%{background:transparent}}
@keyframes wz-menu{0%,30%{opacity:0;transform:translateY(-6px)}34%,62%{opacity:1;transform:none}66%,100%{opacity:0;transform:translateY(-6px)}}
@keyframes wz-pin{0%,54%{color:var(--muted,#666b61)}56%,100%{color:var(--tb-blue)}}
@keyframes wz-pinned{0%,62%{opacity:0;transform:scale(.4)}68%,94%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.4)}}
html[data-theme="dark"] .tb-menu{box-shadow:0 12px 30px rgba(0,0,0,.5)}
html[data-theme="dark"] .wizard-toolbar{--tb-blue:#8ab4f8}
.wizard-guide li .wz-text{flex:1;min-width:0;line-height:1.5}.wizard-guide li .wz-text .wz-icon{margin:0 1px}
/* Selected cards use a soft fill without extra shadows; keyboard navigation still gets a focus outline. */
.wizard-choice:focus{outline:none}
.wizard-choice:focus-visible:not(.selected){outline:2px solid var(--focus,#718e28);outline-offset:3px}
/* Selected safety cards tint the current theme surface, not white; dark-mode text stays legible. */
.wizard-choice[data-wizard-mode="standard"].selected{background:color-mix(in srgb,var(--acid,#c8ff4d) 14%,var(--surface,#fff))}
.wizard-choice[data-wizard-mode="trusted"].selected{background:color-mix(in srgb,#f2c14e 16%,var(--surface,#fff))}
.wizard-app:focus,.wizard-choice:focus{outline:none}
.wizard-app:focus-visible:not(.selected){outline:2px solid var(--focus,#718e28);outline-offset:3px}
.wizard-choice .mode-badge{width:60px;height:60px;margin-bottom:4px}
.wizard-choice .mode-badge svg{width:28px;height:28px}
.wizard-choices + .wizard-primary,.wizard-choices~#wizard-mode-continue{margin-top:14px}
/* Programmatic focus on a quiet text button shows no box; keyboard users still get the ring. */
#wizard-pin-skip:focus:not(:focus-visible),#wizard-pin-skip:focus{outline:none}
#wizard-pin-skip:focus-visible{text-decoration:underline;text-underline-offset:4px}

/* Returning to an earlier setup stage is navigation, not a new pairing or permission change. */
#wizard-browser-connected .wizard-art img{width:48px;height:48px}
#wizard-agent-connected,#wizard-pin-done{color:var(--success,#3d7e45);font-weight:650}
.wizard-head-actions .wizard-nav-back{min-width:73px}
.wizard-head-actions .button.ghost:hover:not(:disabled){border:0;background:var(--surface-2,#f7f7f3)}
.wizard-head-actions .button.ghost:focus-visible{outline:2px solid var(--focus,#718e28);outline-offset:2px}
@media(max-width:560px){.wizard-progress{gap:5px}.wizard-progress-step{padding:6px 1px;min-width:0;font-size:10px}.wizard-head-actions{gap:2px}}