/* Setup wizard (js/setup.js) and its first-visit welcome */
.su-dlg{width:min(880px,calc(100vw - 24px))}
.su-dlg .modal-head h2{font-size:1.2rem}
.su-dlg .modal-head,.su-steps,.su-foot{flex:none}
.su-dlg .su-body{flex:1 1 auto}
.su-steps{display:flex;gap:4px;list-style:none;margin:0;padding:10px 18px;border-bottom:1px solid var(--line-l);overflow-x:auto}
.su-steps li{flex:1;min-width:96px}
.su-steps button{width:100%;border:0;background:transparent;text-align:start;padding:0;font-size:12.5px;color:var(--muted)}
.su-steps button::before{content:"";display:block;height:4px;border-radius:2px;background:var(--line);margin-bottom:5px}
.su-steps button:disabled{cursor:default;opacity:.7}
.su-steps li.done button::before{background:var(--sage-d)}
.su-steps li.on button{color:var(--plum);font-weight:700}
.su-steps li.on button::before{background:var(--plum)}
.su-body{min-height:340px}
.su-body h3{margin:0 0 4px;font-size:1.35rem;outline:0}
.su-lead{margin:0 0 14px;color:var(--muted)}
.su-foot{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:12px 18px;border-top:1px solid var(--line-l);background:var(--soft)}
.su-foot .su-note{flex:1;min-width:200px;font-size:12.5px;color:var(--muted)}
.su-foot .su-note.warn{color:var(--amber);font-weight:700}
.su-opt{display:flex;gap:12px;align-items:flex-start;width:100%;text-align:start;border:1px solid var(--line);border-radius:10px;background:#fff;padding:12px 14px;margin:0 0 8px;color:var(--ink)}
.su-opt:hover{border-color:var(--plum-m)}
.su-opt[aria-pressed=true]{border-color:var(--plum);background:var(--plum-t);box-shadow:0 0 0 1px var(--plum) inset}
.su-opt .su-ic{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--line-l);color:var(--plum)}
.su-opt[aria-pressed=true] .su-ic{background:var(--plum);color:#fff}
.su-opt b{display:block}
.su-opt small{display:block;color:var(--muted);font-size:13px}
.su-none{width:100%;min-height:46px;font-size:15px;margin-top:6px}
.su-outs{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px}
.su-outs .su-opt{margin:0;height:100%}
.su-panel{border-radius:10px;padding:14px 16px;margin:4px 0 10px;background:#FFF8EC;border:1px solid var(--amber-b)}
.su-panel.danger{background:var(--red-t);border-color:#E3B9B9}
.su-panel>h4{margin:0 0 8px;font-size:1.05rem}
.su-panel .helpnow{margin:0 0 8px}
.su-chips{display:flex;flex-wrap:wrap;gap:6px}
.su-pick{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:4px 12px;border:1px solid var(--line);border-radius:18px;background:#fff;font-size:14px;color:var(--ink)}
.su-pick:hover{border-color:var(--plum-m)}
.su-pick[aria-pressed=true]{background:var(--plum);border-color:var(--plum);color:#fff;font-weight:700}
.su-q{display:block;margin:18px 0 6px;font-weight:700}
.su-q small{font-weight:400;color:var(--muted)}
.su-words textarea{width:100%;min-height:62px;padding:8px 10px;border:1px solid #C9D2CD;border-radius:8px;resize:vertical;line-height:1.45}
.su-heard{display:flex;flex-wrap:wrap;gap:5px;align-items:center;margin-top:6px;font-size:13px;min-height:22px}
.su-heard .chip{font-weight:400}
.su-clock{background:#fff;border:1px solid var(--amber-b);border-radius:10px;padding:12px 14px;margin-top:8px}
.su-clock label{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-weight:700;font-size:14px}
.su-clock input[type=date]{padding:6px 8px;border:1px solid var(--amber-b);border-radius:7px}
.su-clock .su-due{font-size:1.15rem;font-weight:700}
.su-clock .card{margin-top:8px}
.su-kept{margin:0 0 12px}
.su-name{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.su-name input{flex:1;min-width:220px;font-size:1.15rem;font-weight:700;color:var(--plum)}
.su-banner{border-radius:10px;padding:10px 14px;margin:0 0 12px;background:var(--plum-t);border:1px solid #EAD7E3;font-size:14px}
.su-card{margin:0 0 12px}
.su-card h4{margin:0 0 8px;color:var(--amber)}
.su-dlg .grp{border:1px solid var(--line-l);border-radius:10px;margin:0 0 10px;background:#fff}
.su-dlg .grp>summary{display:flex;align-items:center;gap:8px;padding:10px 12px;cursor:pointer;list-style:none;font-weight:700}
.su-dlg .grp>summary::-webkit-details-marker{display:none}
.su-dlg .grp>summary::before{content:"▸";color:var(--muted);transition:transform .15s}
html[dir=rtl] .su-dlg .grp>summary::before{content:"◂"}
.su-dlg .grp[open]>summary::before{transform:rotate(90deg)}
html[dir=rtl] .su-dlg .grp[open]>summary::before{transform:rotate(-90deg)}
.su-dlg .grp>summary .n{margin-inline-start:auto;font-weight:400;font-size:12.5px;color:var(--muted)}
.su-dlg .grp .rows{padding:0 12px 8px}
.row-t{display:flex;gap:10px;align-items:flex-start;padding:8px 0;border-top:1px solid var(--line-l);cursor:pointer}
.row-t input{margin-top:4px;width:17px;height:17px;flex:none;accent-color:var(--plum)}
.row-t .bd{flex:1;min-width:0}
.row-t .sub{display:block;font-size:13px;color:var(--muted)}
.row-t.off .bd b{color:var(--muted);font-weight:400}
.su-why{display:flex;flex-wrap:wrap;gap:4px;margin-top:3px}
.su-why .chip{font-weight:400;font-size:11.5px}
.su-gates{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:6px;padding:8px 0}
.su-gates div{border:1px solid var(--line-l);border-radius:8px;padding:6px 8px;font-size:13px}
.su-gates b{display:block;font-size:12px;color:var(--muted)}
.su-st-go{color:var(--green);font-weight:700}.su-st-pause{color:#9a5c00;font-weight:700}.su-st-no{color:var(--red);font-weight:700}.su-st-later{color:var(--muted)}
.su-list{margin:6px 0 8px;padding-inline-start:20px}
.su-mode{margin-top:6px}
.su-mode label{display:flex;gap:8px;align-items:flex-start;margin-top:6px;font-size:14px}
.su-done{margin:10px 0 14px}
.su-done-list{columns:2 200px;margin:8px 0 4px;padding-inline-start:18px}
.su-welcome .su-opt{height:100%;margin:0}
.su-start{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;margin:0 0 12px}
.su-start p{margin:2px 0 0}
.su-search,.su-town{max-width:520px}
.su-town{max-width:300px;margin-bottom:6px}
.su-hits{margin-top:6px;border:1px solid var(--line-l);border-radius:8px;overflow:hidden;background:#fff}
.su-hits:empty{display:none}
.su-hit{display:flex;gap:10px;align-items:center;width:100%;border:0;border-bottom:1px solid var(--line-l);background:#fff;padding:8px 10px;text-align:start;color:var(--ink)}
.su-hit:last-child{border-bottom:0}
.su-hit:hover,.su-hit:focus-visible{background:var(--plum-t)}
.su-kind{flex:none;width:76px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--muted)}
.su-hit-t{flex:1;min-width:0}
.su-hit-t small{display:block;color:var(--muted);font-size:12.5px}
.su-nohits{margin:0;padding:8px 10px}
.su-picked .row{gap:8px}
.su-narrow{margin:0 0 10px}
.su-sub{margin:10px 0 4px}
.su-seg{display:flex;flex-wrap:wrap;gap:6px}
.su-seg button{border:1px solid #C9D2CD;border-radius:8px;background:#fff;padding:7px 14px;font-size:14px;color:var(--ink)}
.su-seg button:hover{border-color:var(--plum-m)}
.su-seg button[aria-pressed=true]{background:var(--plum);border-color:var(--plum);color:#fff;font-weight:700}
.su-welcome-mode{width:min(640px,calc(100vw - 24px))}
.su-welcome-mode .su-body{min-height:0}
@media (max-width:620px){
  .su-dlg:not(.su-welcome-mode){width:100vw;max-width:100vw;max-height:100dvh;height:100dvh;margin:0;border-radius:0}
  .su-dlg:not(.su-welcome-mode) .modal-inner{max-height:100dvh;height:100%}
  .su-dlg .su-body{flex:1}
  .su-steps li{min-width:84px}
}

/* the setup card on Start is the first step (design review, Nov 2026) */
.su-start{padding:18px 20px;border-width:2px}
.su-start b{font-size:var(--fs-h2)}
.su-start .btn{min-height:var(--tap);font-size:15px;padding:6px 16px}