/* Banners, onboarding tooltips, helper chat, checklist. Uses theme.css tokens. */
.yb { display:flex; gap:12px; align-items:center; justify-content:space-between; padding:10px 14px; border-radius:var(--radius-sm); margin:0 0 12px; background:var(--brand-soft); color:var(--text); border:1px solid var(--border); font-size:13px; }
.yb-deal { background:linear-gradient(135deg,var(--pro-from),var(--pro-to)); color:var(--on-brand); border:0; }
.yb-warning { background:var(--warn-soft); }
.yb-success { background:var(--ok-soft); }
.yb-text { display:flex; flex-wrap:wrap; gap:4px 10px; align-items:baseline; min-width:0; }
.yb-text span { opacity:.9; }
.yb-count { font-weight:600; font-variant-numeric:tabular-nums; }
.yb-actions { display:flex; gap:6px; align-items:center; flex-shrink:0; }
.yb button { font:inherit; border-radius:8px; border:1px solid currentColor; background:transparent; color:inherit; padding:5px 10px; cursor:pointer; }
.yb .yb-cta { background:#fff; color:var(--btn-primary); border-color:#fff; font-weight:600; }
.yb:not(.yb-deal) .yb-cta { background:var(--btn-primary); color:var(--on-brand); border-color:var(--btn-primary); }
.yb .yb-coupon { border-style:dashed; font-family:ui-monospace,monospace; }
.yb .yb-x { border:0; font-size:18px; line-height:1; padding:2px 6px; }

.ytour { position:absolute; z-index:10000; width:min(300px,calc(100vw - 16px)); background:var(--text); color:var(--bg); border-radius:12px; padding:12px 14px; box-shadow:0 10px 30px rgba(0,0,0,.25); font-size:13px; }
.ytour p { margin:4px 0 10px; line-height:1.45; }
.ytour-row { display:flex; gap:8px; align-items:center; }
.ytour-row span { margin-right:auto; opacity:.7; font-size:12px; }
.ytour button { font:inherit; border:0; border-radius:8px; padding:5px 10px; cursor:pointer; }
.ytour .ytour-skip { background:transparent; color:inherit; opacity:.75; }
.ytour .ytour-skip:empty { display:none; }
.ytour .ytour-next { background:var(--btn-primary); color:var(--on-brand); }
.ytour-target { outline:3px solid var(--brand-2) !important; outline-offset:3px; border-radius:8px; position:relative; z-index:1; }

.yh-fab { position:fixed; right:18px; bottom:18px; z-index:9998; width:44px; height:44px; border-radius:50%; border:0; background:var(--btn-primary); color:var(--on-brand); font-size:20px; font-weight:700; box-shadow:var(--shadow); cursor:pointer; }
.yh-fab:focus-visible, .yh-box button:focus-visible, .yh-box input:focus-visible { outline:none; box-shadow:var(--shadow-focus); }
.yh-box { position:fixed; right:18px; bottom:72px; z-index:9999; width:min(340px,calc(100vw - 32px)); height:min(460px,calc(100vh - 100px)); display:flex; flex-direction:column; background:var(--surface); color:var(--text); border:1px solid var(--border); border-radius:var(--radius); box-shadow:0 12px 40px rgba(0,0,0,.18); font-size:13px; }
.yh-box[hidden] { display:none; }
.yh-box header { display:flex; justify-content:space-between; align-items:center; padding:10px 14px; border-bottom:1px solid var(--border); }
.yh-close { border:0; background:none; color:var(--text-2); font-size:20px; cursor:pointer; }
.yh-log { flex:1; overflow:auto; padding:12px; display:flex; flex-direction:column; gap:8px; }
.yh-msg { padding:8px 10px; border-radius:10px; max-width:88%; line-height:1.45; white-space:pre-wrap; }
.yh-bot { background:var(--bg-soft); align-self:flex-start; }
.yh-me { background:var(--brand); color:#fff; align-self:flex-end; }
.yh-link { margin-top:6px; border:0; background:none; color:var(--brand); text-decoration:underline; cursor:pointer; padding:0; font:inherit; text-align:left; }
.yh-chips { display:flex; flex-wrap:wrap; gap:6px; padding:0 12px 8px; }
.yh-chips button { font:inherit; font-size:12px; border:1px solid var(--border); background:var(--bg); color:var(--text-2); border-radius:999px; padding:4px 9px; cursor:pointer; }
.yh-form { display:flex; gap:6px; padding:10px; border-top:1px solid var(--border); }
.yh-form input { flex:1; font:inherit; padding:8px 10px; border:1px solid var(--border); border-radius:8px; background:var(--bg); color:var(--text); }
.yh-form button { font:inherit; border:0; border-radius:8px; background:var(--brand); color:#fff; padding:0 12px; cursor:pointer; }
.yh-tip { position:fixed; right:18px; bottom:72px; z-index:9998; width:min(280px,calc(100vw - 32px)); background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:10px 12px; box-shadow:var(--shadow); font-size:13px; color:var(--text); }
.yh-tip p { margin:0 0 8px; line-height:1.45; }
.yh-tip div { display:flex; gap:6px; }
.yh-tip button { font:inherit; border:0; border-radius:8px; padding:5px 10px; cursor:pointer; background:var(--brand); color:#fff; }
.yh-tip .yh-later { background:var(--bg-soft); color:var(--text-2); }

.ychk { border:1px solid var(--border); border-radius:var(--radius); padding:12px 14px; background:var(--surface); margin:0 0 16px; }
.ychk-head { display:flex; justify-content:space-between; font-size:13px; }
.ychk-head span { color:var(--text-3); }
.ychk-bar { height:6px; background:var(--bg-soft); border-radius:3px; margin:8px 0; overflow:hidden; }
.ychk-bar i { display:block; height:100%; background:var(--brand); }
.ychk ul { list-style:none; margin:0; padding:0; display:grid; gap:2px; }
.ychk li button { width:100%; text-align:left; font:inherit; font-size:13px; border:0; background:none; color:var(--text); padding:5px 4px; border-radius:6px; cursor:pointer; }
.ychk li button:hover:not(:disabled) { background:var(--bg-soft); }
.ychk li.done button { color:var(--text-3); text-decoration:line-through; cursor:default; }