.vh-stepper{align-items:center;margin-bottom:28px;display:flex}.vh-step{flex:1;align-items:center;gap:10px;display:flex}.vh-step-dot{border:2px solid var(--vh-line);width:38px;height:38px;color:var(--vh-faint);background:#fff;border-radius:50%;flex-shrink:0;place-items:center;font-size:14px;font-weight:700;display:grid}.vh-step-txt b{color:var(--vh-ink);font-size:14px;display:block}.vh-step-txt span{color:var(--vh-faint);font-size:12px}.vh-step-line{background:var(--vh-line);flex:1;height:2px;margin:0 8px}.vh-step.is-done .vh-step-dot{background:var(--vh-green);border-color:var(--vh-green);color:#fff}.vh-step.is-active .vh-step-dot{background:var(--vh-primary);border-color:var(--vh-primary);color:#fff}.vh-step.is-active .vh-step-line,.vh-step.is-done .vh-step-line{background:var(--vh-primary)}.vh-wizard-panel{display:none}.vh-wizard-panel.is-active{display:block}.vh-wallet{background:linear-gradient(135deg, var(--vh-primary), var(--vh-violet));color:#fff;border-radius:var(--vh-radius);padding:22px}.vh-wallet small{color:#ddd6fe;font-size:13px}.vh-wallet b{color:#fff;margin:4px 0 14px;font-size:30px;font-weight:800;display:block}.vh-checklist{margin:0;padding:0;list-style:none}.vh-checklist li{color:var(--vh-body);align-items:center;gap:10px;padding:9px 0;font-size:14px;display:flex}.vh-checklist li .vh-ck{background:var(--vh-green-soft);width:20px;height:20px;color:var(--vh-green);border-radius:50%;flex-shrink:0;place-items:center;font-size:11px;display:grid}.vh-checklist li.todo .vh-ck{color:var(--vh-faint);background:#f1f5f9}.vh-chart{height:300px;position:relative}.vh-chart-sm{height:220px;position:relative}.vh-donut{height:200px;position:relative}.vh-bar{background:var(--vh-bg);border-radius:999px;height:8px;overflow:hidden}.vh-bar>span{background:var(--vh-primary);border-radius:999px;height:100%;display:block}.vh-dropzone-vh{border:2px dashed var(--vh-line);border-radius:var(--vh-radius);text-align:center;color:var(--vh-muted);background:var(--vh-bg);padding:40px 20px}.vh-dropzone-vh div{color:var(--vh-faint);margin-bottom:8px}.vh-dropzone-vh p{color:var(--vh-ink);margin:4px 0;font-weight:600}.vh-wizard-foot{border-top:1px solid var(--vh-line);justify-content:space-between;margin-top:20px;padding-top:20px;display:flex}.vh-list-row{border-bottom:1px solid var(--vh-line);align-items:center;gap:14px;padding:14px 0;display:flex}.vh-list-row:last-child{border-bottom:0}.vh-list-row img{object-fit:cover;border-radius:50%;width:46px;height:46px}.vh-list-row .vh-list-meta{flex:1}.vh-list-row b{color:var(--vh-ink);font-size:14px}.vh-list-row span{color:var(--vh-faint);font-size:12px}@media (width<=768px){.vh-stepper{overflow-x:auto}.vh-step-txt span{display:none}}

/* --- fix: tabbed panels show only the active [data-panel] (author pages) --- */
[data-panel]{display:none}
[data-panel].is-active{display:block}

/* ===== Author Analytics (demo-parity) ===== */
.vh-ana-head{align-items:flex-start;gap:1rem;flex-wrap:wrap}
.vh-page-sub{margin:.25rem 0 0;color:var(--vh-muted,#6b7280);font-size:.9rem}
.vh-select-wrap{display:inline-flex;align-items:center;gap:.45rem;border:1px solid var(--vh-border,#e5e7eb);border-radius:.6rem;padding:.15rem .7rem;background:#fff}
.vh-select-wrap svg{color:var(--vh-muted,#6b7280);flex:none}
.vh-select-wrap .vh-select-sm{border:0;padding:.45rem .25rem;background:transparent}
.vh-ana-tabs{overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.vh-ana-tabs::-webkit-scrollbar{display:none}

.vh-ana-stats{display:grid;grid-template-columns:1fr;gap:1rem;margin:1.25rem 0}
.vh-stat-card{align-items:flex-start;gap:.85rem;background:#fff;border:1px solid var(--vh-border,#e5e7eb);border-radius:.9rem;padding:1rem}
.vh-stat-card .vh-stat-body{display:flex;flex-direction:column;gap:.15rem;min-width:0}
.vh-stat-label{font-size:.8rem;color:var(--vh-muted,#6b7280)}
.vh-stat-card b{font-size:1.35rem;font-weight:700;line-height:1.2}
.vh-stat-ico.i-rose{background:#ffe4e6;color:#e11d48}
.vh-trend{display:inline-flex;align-items:center;gap:.25rem;font-size:.72rem;font-weight:600;margin-top:.1rem}
.vh-trend.is-up{color:#059669}
.vh-trend.is-down{color:#e11d48}

.vh-ana-grid{display:grid;grid-template-columns:1fr;gap:1rem;margin-bottom:1rem}
.vh-chart-tall{min-height:320px}
.vh-ana-donut-body{display:flex;flex-direction:column;gap:1rem}
.vh-ana-legend{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.55rem}
.vh-ana-legend-item{display:flex;align-items:center;gap:.55rem;font-size:.85rem}
.vh-ana-legend-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vh-ana-legend-val{font-weight:700;color:var(--vh-muted,#6b7280)}
.vh-ana-dot{display:inline-block;width:.65rem;height:.65rem;border-radius:50%;flex:none}
.vh-ana-dot-0{background:#4f46e5}
.vh-ana-dot-1{background:#3b82f6}
.vh-ana-dot-2{background:#10b981}
.vh-ana-dot-3{background:#f59e0b}
.vh-ana-dot-4{background:#ec4899}

.vh-ana-cols{display:grid;grid-template-columns:1fr;gap:1rem;margin-bottom:1rem}
.vh-ana-col{display:flex;flex-direction:column}
.vh-ana-list{list-style:none;margin:0 0 1rem;padding:0;display:flex;flex-direction:column;gap:.7rem;flex:1}
.vh-ana-list-row{display:flex;align-items:center;justify-content:space-between;gap:.75rem;font-size:.88rem}
.vh-ana-list-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vh-ana-list-val{font-weight:700;flex:none}

.vh-ana-bars{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.9rem}
.vh-ana-bar-row{display:grid;grid-template-columns:auto minmax(4.5rem,1fr) 2.2fr auto;align-items:center;gap:.6rem;font-size:.82rem}
.vh-ana-bar-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vh-ana-bar-track{height:.5rem;background:var(--vh-track,#eef2f7);border-radius:99px;overflow:hidden}
.vh-ana-bar-fill{display:block;height:100%;width:0;border-radius:99px;transition:width .5s ease}
.vh-ana-bar-fill.i-blue-fill{background:#3b82f6}
.vh-ana-bar-val{white-space:nowrap;color:var(--vh-muted,#6b7280);font-weight:600}
.vh-ana-bar-val em{font-style:normal;opacity:.75}
.vh-ana-flag{display:inline-flex;color:var(--vh-muted,#6b7280)}

.vh-ana-cta{display:flex;align-items:center;gap:1rem;padding:1.1rem 1.25rem;flex-wrap:wrap}
.vh-ana-cta-ico{width:2.75rem;height:2.75rem;border-radius:.75rem;background:#eef2ff;color:#4f46e5;display:flex;align-items:center;justify-content:center;flex:none}
.vh-ana-cta-text{display:flex;flex-direction:column;gap:.15rem;flex:1;min-width:12rem}
.vh-ana-cta-text b{font-size:.95rem}
.vh-ana-cta-text span{font-size:.85rem;color:var(--vh-muted,#6b7280)}

.vh-btn-block{width:100%;justify-content:center}

@media (min-width:640px){
    .vh-ana-stats-sm{grid-template-columns:repeat(2,1fr)}
    .vh-ana-donut-body{flex-direction:row;align-items:center}
    .vh-ana-donut-body .vh-chart-donut{flex:none;width:220px}
    .vh-ana-legend{flex:1}
}
@media (min-width:900px){
    .vh-ana-stats{grid-template-columns:repeat(5,1fr)}
    .vh-ana-stats-sm{grid-template-columns:repeat(4,1fr)}
    .vh-ana-grid{grid-template-columns:1.6fr 1fr}
    .vh-ana-cols{grid-template-columns:repeat(3,1fr)}
    .vh-ana-cols-2{grid-template-columns:repeat(2,1fr)}
}

/* ===== Followers page (demo-parity) ===== */
.vh-fol-layout { display: grid; grid-template-columns: 1fr; gap: 1.25rem; margin-bottom: 1rem; }
.vh-fol-main { min-width: 0; }
.vh-fol-side { display: flex; flex-direction: column; gap: 1rem; min-width: 0; }
.vh-fol-toolbar { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }
.vh-fol-toolbar .vh-fol-search { flex: 1; min-width: 12rem; }
.vh-fol-table th, .vh-fol-table td { vertical-align: middle; }
.vh-fol-user { display: flex; align-items: center; gap: .6rem; min-width: 0; }
.vh-fol-user img { width: 2.25rem; height: 2.25rem; border-radius: 50%; flex: none; object-fit: cover; }
.vh-fol-user b { display: block; line-height: 1.2; }
.vh-fol-user .vh-faint { font-size: .8rem; }
.vh-fol-loc { display: inline-flex; align-items: center; gap: .4rem; white-space: nowrap; }
.vh-fol-flag { font-size: 1.05rem; line-height: 1; }
.vh-fol-since span { display: block; }
.vh-fol-since .vh-faint { font-size: .78rem; }
.vh-fol-actions { display: inline-flex; align-items: center; gap: .3rem; justify-content: flex-end; }
.vh-fol-act { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border-radius: .5rem; border: 1px solid var(--vh-line); background: #fff; color: var(--vh-muted); cursor: pointer; }
.vh-fol-act:hover { color: var(--vh-primary); border-color: var(--vh-primary); }
.vh-fol-menu { right: 0; left: auto; }
.vh-fol-menu a { display: flex; align-items: center; gap: .5rem; }
.vh-fol-foot { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .75rem; padding: 1rem; border-top: 1px solid var(--vh-line); }
.vh-fol-eng { list-style: none; margin: 0 0 1rem; padding: 0; display: flex; flex-direction: column; gap: .85rem; }
.vh-fol-eng li { display: flex; align-items: center; gap: .6rem; }
.vh-fol-eng-ico { width: 2rem; height: 2rem; border-radius: .55rem; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.vh-fol-eng-ico.i-amber { background: #fef3c7; color: #d97706; }
.vh-fol-eng-ico.i-blue { background: #dbeafe; color: #2563eb; }
.vh-fol-eng-ico.i-green { background: #dcfce7; color: #16a34a; }
.vh-fol-eng-ico.i-violet { background: #ede9fe; color: #7c3aed; }
.vh-fol-eng-label { flex: 1; min-width: 0; font-size: .88rem; }
.vh-fol-eng li b { font-weight: 700; }
@media (min-width: 1024px) {
    .vh-fol-layout { grid-template-columns: minmax(0, 1fr) 340px; align-items: start; }
}

/* Followers stat grid fix (4 cards, not analytics 5-col) */
.vh-fol-stats.vh-ana-stats { grid-template-columns: 1fr; }
@media (min-width: 620px) { .vh-fol-stats.vh-ana-stats { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1800px) { .vh-fol-stats.vh-ana-stats { grid-template-columns: repeat(4, 1fr); } }
.vh-fol-stats .vh-trend { white-space: normal; overflow-wrap: anywhere; }

/* fol-stat-minwidth */
.vh-fol-stats .vh-stat-card { min-width: 0; }
.vh-fol-stats .vh-stat-card .vh-stat-body { min-width: 0; }

/* fol-stat-contain */
.vh-fol-stats .vh-stat-card { overflow: hidden; }
.vh-fol-stats .vh-stat-body { min-width: 0; max-width: 100%; }
.vh-fol-stats .vh-trend { max-width: 100%; }

/* Top Locations: stack donut over full-width legend (narrow sidebar) */
.vh-fol-side .vh-ana-donut-body { flex-direction: column; align-items: stretch; gap: 1rem; }
.vh-fol-side .vh-ana-donut-body .vh-chart-donut { flex: none; width: 100%; max-width: 210px; margin: 0 auto; }
.vh-fol-side .vh-ana-legend { flex: none; width: 100%; }
.vh-fol-side .vh-ana-legend-name { overflow: visible; text-overflow: clip; white-space: normal; }
.vh-fol-side .vh-ana-legend-val { white-space: nowrap; flex: none; }

/* Followers table fit: scroll if needed, tighter cells */
.vh-fol-tablewrap { overflow-x: auto; }
.vh-fol-table th, .vh-fol-table td { padding-left: 10px; padding-right: 10px; }
.vh-fol-table th:first-child, .vh-fol-table td:first-child { padding-left: 16px; }
.vh-fol-table th:last-child, .vh-fol-table td:last-child { padding-right: 16px; }
.vh-fol-actions { gap: .25rem; }
.vh-fol-act { width: 1.9rem; height: 1.9rem; }
.vh-fol-user .vh-faint { overflow: hidden; text-overflow: ellipsis; max-width: 15rem; }

/* ===== Author Reviews (demo-parity) ===== */
.vh-arev-layout { display: grid; grid-template-columns: 1fr; gap: 1.25rem; margin-bottom: 1rem; align-items: start; }
.vh-arev-main { min-width: 0; }
.vh-arev-side { display: flex; flex-direction: column; gap: 1rem; min-width: 0; }
.vh-arev-main .vh-card { overflow: visible; }

.vh-arev-tabs { display: flex; gap: .35rem; overflow-x: auto; border-bottom: 1px solid var(--vh-line); margin-bottom: 1rem; scrollbar-width: none; }
.vh-arev-tabs::-webkit-scrollbar { display: none; }
.vh-arev-tab { display: inline-flex; align-items: center; gap: .4rem; padding: .7rem .9rem; font-size: .9rem; font-weight: 600; color: var(--vh-muted); border-bottom: 2px solid transparent; white-space: nowrap; }
.vh-arev-tab:hover { color: var(--vh-primary); }
.vh-arev-tab.is-active { color: var(--vh-primary); border-bottom-color: var(--vh-primary); }
.vh-arev-tabcount { font-size: .7rem; }

.vh-arev-toolbar { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }
.vh-arev-toolbar .vh-arev-search { flex: 1; min-width: 12rem; }

.vh-arev-list { display: flex; flex-direction: column; }
.vh-arev-item { display: flex; gap: .9rem; padding: 1.1rem 1.25rem; border-top: 1px solid var(--vh-line); }
.vh-arev-item:first-child { border-top: 0; }
.vh-arev-thumb { width: 3rem; height: 3rem; border-radius: .6rem; object-fit: cover; flex: none; background: #eef2ff; }
.vh-arev-body { flex: 1; min-width: 0; }
.vh-arev-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.vh-arev-prod { display: block; font-size: .95rem; }
.vh-arev-by { display: inline-flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-top: .15rem; font-size: .82rem; }
.vh-arev-verified { display: inline-flex; align-items: center; gap: .2rem; color: #16a34a; font-weight: 600; }
.vh-arev-meta { display: flex; flex-direction: column; align-items: flex-end; gap: .15rem; text-align: right; }
.vh-arev-meta .vh-faint { font-size: .78rem; }
.vh-arev-title { margin: .55rem 0 .2rem; font-weight: 700; font-size: .9rem; }
.vh-arev-text { margin: .15rem 0 .6rem; color: var(--vh-muted); font-size: .88rem; line-height: 1.5; }
.vh-arev-foot { display: flex; align-items: center; justify-content: space-between; gap: .75rem; }

.vh-arev-actions { position: relative; }
.vh-arev-kebab { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border-radius: .5rem; border: 1px solid var(--vh-line); background: #fff; color: var(--vh-muted); cursor: pointer; }
.vh-arev-kebab:hover { color: var(--vh-primary); border-color: var(--vh-primary); }
.vh-arev-menu { right: 0; left: auto; min-width: 200px; }
.vh-arev-menu form { margin: 0; }
.vh-arev-menu button { display: flex; align-items: center; gap: .5rem; width: 100%; text-align: left; padding: 8px 12px; font-size: 14px; border-radius: 8px; color: var(--vh-body); background: none; border: 0; cursor: pointer; font: inherit; }
.vh-arev-menu button:hover { background: var(--vh-primary-soft); color: var(--vh-primary); }
.vh-arev-menu svg { flex: none; opacity: .85; }
.vh-arev-menu .vh-arev-del { color: #dc2626; }
.vh-arev-menu .vh-arev-del:hover { background: #fee2e2; color: #b91c1c; }

.vh-arev-foot-bar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .75rem; padding: 1rem 1.25rem; border-top: 1px solid var(--vh-line); }
.vh-arev-per label { display: inline-flex; align-items: center; gap: .4rem; font-size: .85rem; color: var(--vh-muted); }

.vh-arev-avg { display: flex; align-items: center; gap: 1rem; padding-bottom: 1rem; margin-bottom: 1rem; border-bottom: 1px solid var(--vh-line); }
.vh-arev-avg-num { font-size: 2.4rem; font-weight: 800; line-height: 1; }
.vh-arev-avg-meta { display: flex; flex-direction: column; gap: .2rem; }
.vh-arev-bars { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .7rem; }
.vh-arev-bar-row { display: grid; grid-template-columns: 3.6rem 1fr auto; align-items: center; gap: .6rem; font-size: .82rem; }
.vh-arev-bar-label { color: var(--vh-muted); white-space: nowrap; }
.vh-arev-bar-track { height: .5rem; background: var(--vh-track, #eef2f7); border-radius: 99px; overflow: hidden; }
.vh-arev-bar-fill { display: block; height: 100%; width: 0; border-radius: 99px; background: #4f46e5; transition: width .5s ease; }
.vh-arev-bar-val { white-space: nowrap; color: var(--vh-muted); font-weight: 600; }

.vh-arev-recent { list-style: none; margin: 0 0 1rem; padding: 0; display: flex; flex-direction: column; gap: .85rem; }
.vh-arev-recent li { display: flex; gap: .6rem; align-items: flex-start; }
.vh-arev-thumb-sm { width: 2.25rem; height: 2.25rem; border-radius: .5rem; object-fit: cover; flex: none; background: #eef2ff; }
.vh-arev-recent-body { display: flex; flex-direction: column; gap: .1rem; min-width: 0; }
.vh-arev-recent-body b { font-size: .85rem; }
.vh-arev-recent-body .vh-muted { font-size: .78rem; }
.vh-arev-recent-foot { display: flex; align-items: center; gap: .5rem; margin-top: .1rem; }
.vh-arev-help p { font-size: .85rem; margin: .35rem 0 .8rem; }

@media (min-width: 1100px) {
    .vh-arev-layout { grid-template-columns: minmax(0, 1fr) 320px; }
}

/* ===== Author Announcements (demo-parity) ===== */
.vh-ann-head { align-items: flex-start; gap: 1rem; flex-wrap: wrap; }
.vh-ana-dot-5 { background: #06b6d4; }

.vh-ann-table th, .vh-ann-table td { vertical-align: middle; }
.vh-ann-cell { display: flex; align-items: center; gap: .7rem; min-width: 0; }
.vh-ann-ico { width: 2.4rem; height: 2.4rem; border-radius: .6rem; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.vh-ann-ico-sm { width: 2rem; height: 2rem; border-radius: .5rem; }
.vh-ann-ico.i-violet { background: #ede9fe; color: #7c3aed; }
.vh-ann-ico.i-amber { background: #fef3c7; color: #d97706; }
.vh-ann-ico.i-blue { background: #dbeafe; color: #2563eb; }
.vh-ann-ico.i-green { background: #dcfce7; color: #16a34a; }
.vh-ann-ico.i-red { background: #fee2e2; color: #dc2626; }
.vh-ann-ico.i-gray { background: #f1f5f9; color: #64748b; }
.vh-ann-txt { min-width: 0; }
.vh-ann-txt b { display: block; line-height: 1.25; }
.vh-ann-txt .vh-faint { display: block; font-size: .8rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 22rem; }
.vh-ann-aud { display: inline-flex; align-items: center; gap: .35rem; white-space: nowrap; color: var(--vh-muted); font-size: .85rem; }
.vh-ann-aud svg { flex: none; opacity: .7; }
.vh-ann-date span { display: block; white-space: nowrap; }
.vh-ann-date .vh-faint { font-size: .78rem; }
.vh-ann-actions { display: inline-flex; align-items: center; gap: .3rem; justify-content: flex-end; }
.vh-ann-actions form { margin: 0; }
.vh-ann-del:hover { color: #dc2626 !important; border-color: #dc2626 !important; }
.vh-ann-overview li b { margin-left: auto; }

/* Form */
.vh-ann-form-card { max-width: 780px; }
.vh-ann-form { display: flex; flex-direction: column; gap: 1.1rem; }
.vh-field-group { display: flex; flex-direction: column; gap: .4rem; }
.vh-label { font-size: .85rem; font-weight: 600; color: var(--vh-ink); }
.vh-ann-form .vh-field { width: 100%; padding: .7rem .9rem; border: 1px solid var(--vh-line); border-radius: .6rem; background: #fff; font: inherit; font-size: .92rem; color: inherit; transition: border-color .15s ease, box-shadow .15s ease; }
.vh-ann-form .vh-field:hover { border-color: #c7cbd1; }
.vh-ann-form .vh-field:focus { outline: none; border-color: #4f46e5; box-shadow: 0 0 0 3px rgba(79, 70, 229, .15); }
.vh-ann-form textarea.vh-field { resize: vertical; min-height: 120px; line-height: 1.5; }
.vh-ann-form-row { display: grid; grid-template-columns: 1fr; gap: 1.1rem; }
.vh-ann-form-actions { display: flex; justify-content: flex-end; gap: .6rem; flex-wrap: wrap; }
@media (min-width: 640px) {
    .vh-ann-form-row { grid-template-columns: 1fr 1fr; }
}

/* Announcement types donut: stack + full legend */
.vh-arev-side .vh-ana-donut-body { flex-direction: column; align-items: stretch; gap: 1rem; }
.vh-arev-side .vh-ana-donut-body .vh-chart-donut { flex: none; width: 100%; max-width: 210px; margin: 0 auto; }
.vh-arev-side .vh-ana-legend { flex: none; width: 100%; }
.vh-arev-side .vh-ana-legend-name { overflow: visible; text-overflow: clip; white-space: normal; }
.vh-arev-side .vh-ana-legend-val { white-space: nowrap; flex: none; }
.vh-ana-dot-6 { background: #f97316; }
.vh-ana-dot-7 { background: #8b5cf6; }

/* ===== Store Appearance tab (demo-parity) ===== */
.vh-sa-block { margin-bottom: 1.75rem; }
.vh-sa-title { margin: 0 0 .2rem; font-size: .95rem; font-weight: 700; }
.vh-sa-sub { margin: 0 0 .8rem; color: var(--vh-muted); font-size: .85rem; }
.vh-sa-block input[type="radio"] { position: absolute; opacity: 0; width: 0; height: 0; }

/* Theme cards */
.vh-sa-themes, .vh-sa-banners { display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; }
@media (min-width: 640px) { .vh-sa-themes, .vh-sa-banners { grid-template-columns: repeat(4, 1fr); } }
.vh-sa-theme, .vh-sa-banner { position: relative; display: flex; flex-direction: column; gap: .45rem; border: 1px solid var(--vh-line); border-radius: .7rem; padding: .5rem; cursor: pointer; transition: border-color .15s ease, box-shadow .15s ease; }
.vh-sa-theme:has(input:checked), .vh-sa-banner:has(input:checked) { border-color: var(--vh-primary); box-shadow: 0 0 0 2px var(--vh-primary-soft); }
.vh-sa-theme-name, .vh-sa-banner-name { text-align: center; font-size: .82rem; font-weight: 600; }
.vh-sa-theme-prev { aspect-ratio: 16 / 10; border-radius: .45rem; border: 1px solid rgba(0, 0, 0, .06); padding: .5rem; display: flex; flex-direction: column; gap: .3rem; overflow: hidden; }
.vh-sa-theme-prev i { display: block; height: .3rem; border-radius: 99px; background: currentColor; opacity: .55; }
.vh-sa-theme-prev i:nth-child(1) { width: 55%; }
.vh-sa-theme-prev i:nth-child(2) { width: 90%; }
.vh-sa-theme-prev i:nth-child(3) { width: 72%; }
.vh-sa-theme-light { background: #f8fafc; color: #94a3b8; }
.vh-sa-theme-dark { background: #1e293b; color: #cbd5e1; }
.vh-sa-theme-modern { background: #fff; color: #6366f1; }
.vh-sa-theme-colorful { background: linear-gradient(135deg, #f97316, #ec4899); color: #fff; }

/* Colors */
.vh-sa-colors { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; }
.vh-sa-color { cursor: pointer; display: inline-flex; align-items: center; }
.vh-sa-swatch { display: block; width: 1.7rem; height: 1.7rem; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .08); }
.vh-sa-color:has(input:checked) .vh-sa-swatch { box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--vh-primary); }
.vh-sa-sw-0 { background: #4f46e5; }
.vh-sa-sw-1 { background: #3b82f6; }
.vh-sa-sw-2 { background: #10b981; }
.vh-sa-sw-3 { background: #f59e0b; }
.vh-sa-sw-4 { background: #ef4444; }
.vh-sa-custom { gap: .45rem; border: 1px solid var(--vh-line); border-radius: .55rem; padding: .35rem .65rem; font-size: .85rem; font-weight: 600; }
.vh-sa-custom:has(input[value="custom"]:checked) { border-color: var(--vh-primary); }
.vh-sa-colorpick { width: 1.5rem; height: 1.5rem; border: 0; padding: 0; background: none; border-radius: 50%; cursor: pointer; }
.vh-sa-colorpick::-webkit-color-swatch-wrapper { padding: 0; }
.vh-sa-colorpick::-webkit-color-swatch { border: 0; border-radius: 50%; }

/* Banner style previews */
.vh-sa-banner-prev { aspect-ratio: 16 / 6; border-radius: .45rem; }
.vh-sa-banner-1 { background: linear-gradient(135deg, #4f46e5, #7c3aed); }
.vh-sa-banner-2 { background: linear-gradient(135deg, #0ea5e9, #2563eb); }
.vh-sa-banner-3 { background: linear-gradient(120deg, #06b6d4, #3b82f6 60%, #6366f1); }
.vh-sa-banner-4 { background: linear-gradient(135deg, #f59e0b, #ef4444); }

/* Uploads */
.vh-sa-upload { display: flex; align-items: center; gap: 1rem; border: 1px dashed var(--vh-line); border-radius: .7rem; padding: .85rem 1rem; cursor: pointer; transition: border-color .15s ease, background .15s ease; }
.vh-sa-upload:hover { border-color: var(--vh-primary); background: var(--vh-primary-soft); }
.vh-sa-upimg { width: 3.6rem; height: 3.6rem; border-radius: .55rem; overflow: hidden; flex: none; background: #eef2ff; color: #6366f1; }
.vh-sa-upimg-wide { width: 6.5rem; }
.vh-sa-upimg .va-img-slot { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; }
.vh-sa-upimg img { width: 100%; height: 100%; object-fit: cover; }
.vh-sa-uptxt { display: flex; flex-direction: column; gap: .1rem; }
.vh-sa-uptxt b { font-size: .9rem; }
.vh-sa-uptxt .vh-faint { font-size: .8rem; }

/* ===== SEO Settings tab (demo-parity) ===== */
.vh-seo-grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
.vh-seo-main { min-width: 0; display: flex; flex-direction: column; gap: 1.1rem; }
.vh-seo-side { min-width: 0; display: flex; flex-direction: column; gap: 1rem; }
@media (min-width: 1200px) { .vh-seo-grid { grid-template-columns: minmax(0, 1fr) 300px; align-items: start; } }

.vh-seo-field .vh-hint { margin: 0 0 .45rem; }
.vh-seo-inwrap { position: relative; }
.vh-seo-count { position: absolute; right: .6rem; bottom: .5rem; font-size: .72rem; font-weight: 600; color: var(--vh-muted); background: #fff; padding: 0 .2rem; border-radius: .3rem; }
.vh-seo-ta { padding-bottom: 1.4rem; }
.vh-seo-garow { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.vh-seo-garow .vh-input { flex: 1; min-width: 12rem; }
.vh-seo-inline { display: inline-flex; align-items: center; gap: .5rem; font-size: .85rem; font-weight: 600; white-space: nowrap; }

.vh-seo-card { padding: 1rem 1.1rem; }
.vh-seo-h { margin: 0 0 .8rem; font-size: .92rem; font-weight: 700; }
.vh-seo-sub { margin: -.4rem 0 .7rem; font-size: .8rem; }
.vh-seo-opt { display: flex; align-items: flex-start; justify-content: space-between; gap: .75rem; padding: .6rem 0; border-top: 1px solid var(--vh-line); }
.vh-seo-opt:first-of-type { border-top: 0; }
.vh-seo-opt-txt { display: flex; flex-direction: column; gap: .1rem; min-width: 0; }
.vh-seo-opt-txt b { font-size: .85rem; }
.vh-seo-opt-txt .vh-faint { font-size: .78rem; }

/* SERP preview */
.vh-seo-serp { border: 1px solid var(--vh-line); border-radius: .55rem; padding: .8rem .9rem; display: flex; flex-direction: column; gap: .25rem; }
.vh-seo-serp-url { font-size: .78rem; color: #202124; }
.vh-seo-serp-title { font-size: 1rem; color: #1a0dab; font-weight: 500; line-height: 1.3; }
.vh-seo-serp-desc { font-size: .82rem; color: #4d5156; line-height: 1.5; }

/* Score gauge */
.vh-seo-scorewrap { display: flex; align-items: center; gap: 1rem; margin-bottom: 1rem; }
.vh-seo-gauge { position: relative; width: 5rem; height: 5rem; flex: none; }
.vh-seo-gauge svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.vh-seo-gauge-bg { fill: none; stroke: #eef2f7; stroke-width: 3.2; }
.vh-seo-gauge-fg { fill: none; stroke-width: 3.2; stroke-linecap: round; transition: stroke-dasharray .6s ease; }
.vh-seo-gauge-good .vh-seo-gauge-fg { stroke: #16a34a; }
.vh-seo-gauge-ok .vh-seo-gauge-fg { stroke: #f59e0b; }
.vh-seo-gauge-bad .vh-seo-gauge-fg { stroke: #ef4444; }
.vh-seo-gauge-num { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 1.25rem; font-weight: 800; }
.vh-seo-gauge-num small { font-size: .7rem; font-weight: 600; color: var(--vh-muted); margin-left: .05rem; }
.vh-seo-scoremsg { display: flex; flex-direction: column; gap: .15rem; min-width: 0; }
.vh-seo-scoremsg-t { color: #16a34a; }
.vh-seo-gauge-ok ~ .vh-seo-scoremsg .vh-seo-scoremsg-t { color: #d97706; }

.vh-seo-check { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .55rem; }
.vh-seo-check li { display: flex; align-items: center; gap: .5rem; font-size: .83rem; }
.vh-seo-check li svg { flex: none; }
.vh-seo-check li.is-ok { color: var(--vh-ink); }
.vh-seo-check li.is-ok svg { color: #16a34a; }
.vh-seo-check li.is-warn { color: var(--vh-muted); }
.vh-seo-check li.is-warn svg { color: #f59e0b; }

/* ===== Policy Pages tab ===== */
.vh-hidden-form { display: none; }
.vh-pp-count { padding: 1rem 1.25rem 0; margin: 0; }
.vh-pp-status { max-width: 260px; }
[data-panel="policy"] .vh-ann-head { align-items: flex-start; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; }

/* Policy slug pill: keep on one line */
.vh-pp-slug { white-space: nowrap; }
.vh-ann-table td:nth-child(2) { white-space: nowrap; }

/* ===== Social Links tab (demo-parity) ===== */
.vh-soc-grid { display: grid; grid-template-columns: 1fr; gap: 1.5rem; }
@media (min-width: 1200px) { .vh-soc-grid { grid-template-columns: minmax(0, 1fr) 300px; align-items: start; } }
.vh-soc-main { min-width: 0; display: flex; flex-direction: column; }
.vh-soc-side { min-width: 0; display: flex; flex-direction: column; gap: 1rem; }

.vh-soc-row { display: flex; align-items: center; gap: .85rem; padding: .85rem 0; border-top: 1px solid var(--vh-line); flex-wrap: wrap; }
.vh-soc-row:first-child { border-top: 0; }
.vh-soc-ico { width: 2.2rem; height: 2.2rem; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex: none; color: #fff; }
.vh-soc-meta { display: flex; flex-direction: column; gap: .05rem; min-width: 8rem; flex: 1; }
.vh-soc-meta b { font-size: .88rem; }
.vh-soc-meta .vh-faint { font-size: .78rem; }
.vh-soc-input { flex: 2; min-width: 13rem; }
.vh-soc-toggle { display: inline-flex; align-items: center; gap: .5rem; font-size: .82rem; color: var(--vh-muted); white-space: nowrap; cursor: pointer; }

.vh-soc-facebook { background: #1877f2; }
.vh-soc-twitter { background: #000; }
.vh-soc-instagram { background: linear-gradient(45deg, #feda75, #d62976 50%, #4f5bd5); }
.vh-soc-linkedin { background: #0a66c2; }
.vh-soc-youtube { background: #ff0000; }
.vh-soc-github { background: #181717; }
.vh-soc-tiktok { background: #010101; }
.vh-soc-whatsapp { background: #25d366; }
.vh-soc-dribbble { background: #ea4c89; }
.vh-soc-more { background: #64748b; }

.vh-soc-add { margin-top: .8rem; border: 1px dashed var(--vh-line); border-radius: .7rem; }
.vh-soc-addbtn { display: flex; align-items: center; justify-content: center; gap: .5rem; padding: .85rem; font-weight: 600; color: var(--vh-primary); cursor: pointer; list-style: none; }
.vh-soc-addbtn::-webkit-details-marker { display: none; }
.vh-soc-custom { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; padding: 0 1rem 1rem; }
.vh-soc-custom .vh-input { flex: 1; min-width: 10rem; }

.vh-soc-prevcard { border-radius: .8rem; padding: 1.2rem; text-align: center; background: linear-gradient(135deg, #4f46e5, #7c3aed); color: #fff; display: flex; flex-direction: column; align-items: center; gap: .15rem; }
.vh-soc-prev-av { width: 3.5rem; height: 3.5rem; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .5); object-fit: cover; margin-bottom: .35rem; }
.vh-soc-prev-name { font-size: 1rem; }
.vh-soc-prev-sub { font-size: .78rem; opacity: .85; }
.vh-soc-prev-icons { display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem; margin-top: .8rem; }
.vh-soc-prev-icons .vh-soc-ico { width: 1.9rem; height: 1.9rem; }
.vh-soc-prev-icons:empty::after { content: "Add links to preview them here"; font-size: .78rem; opacity: .8; }

.vh-soc-tips { list-style: disc; margin: 0; padding-left: 1.1rem; display: flex; flex-direction: column; gap: .45rem; font-size: .82rem; color: var(--vh-muted); }
.vh-soc-platforms { display: flex; flex-wrap: wrap; gap: .45rem; }
.vh-soc-plat { display: inline-flex; align-items: center; gap: .4rem; font-size: .78rem; font-weight: 600; border: 1px solid var(--vh-line); border-radius: 99px; padding: .22rem .65rem .22rem .28rem; }
.vh-soc-plat .vh-soc-ico { width: 1.4rem; height: 1.4rem; }

/* Social layout fix: rows full-width, extras stack below (no squeeze) */
.vh-soc-grid { display: block; }
.vh-soc-main { width: 100%; }
.vh-soc-side { display: grid; grid-template-columns: 1fr; gap: 1rem; margin-top: 1.5rem; }
@media (min-width: 860px) { .vh-soc-side { grid-template-columns: repeat(3, 1fr); align-items: start; } }
.vh-soc-row { flex-wrap: nowrap; }
@media (max-width: 720px) { .vh-soc-row { flex-wrap: wrap; } }

/* Supported Platforms: 2-per-row so the card is not too tall */
.vh-soc-platforms { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem; }
.vh-soc-plat { justify-content: flex-start; min-width: 0; overflow: hidden; }
.vh-soc-plat span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vh-soc-side .vh-card { align-self: start; }
@media (min-width: 860px) and (max-width: 1200px) { .vh-soc-side { grid-template-columns: 1fr 1fr; } }

/* ===== Featured Settings tab (demo-parity) ===== */
.vh-feat-toggle { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 0; border-top: 1px solid var(--vh-line); margin-top: 1rem; flex-wrap: wrap; }
.vh-feat-toggle h4 { margin: 0; }
.vh-feat-block { margin: 1.4rem 0; }
.vh-feat-count { max-width: 320px; }
.vh-feat-grid { display: grid; grid-template-columns: 1fr; gap: .6rem; margin-top: .7rem; }
@media (min-width: 700px) { .vh-feat-grid { grid-template-columns: 1fr 1fr; } }
.vh-feat-item { position: relative; display: flex; align-items: center; gap: .7rem; border: 1px solid var(--vh-line); border-radius: .6rem; padding: .5rem .7rem; cursor: pointer; transition: border-color .15s ease, background .15s ease; }
.vh-feat-item input { position: absolute; opacity: 0; width: 0; height: 0; }
.vh-feat-item:hover { border-color: #c7cbd1; }
.vh-feat-item:has(input:checked) { border-color: var(--vh-primary); background: var(--vh-primary-soft); }
.vh-feat-thumb { width: 2.8rem; height: 2.1rem; border-radius: .35rem; object-fit: cover; flex: none; background: #eef2ff; }
.vh-feat-info { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.vh-feat-info b { font-size: .85rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vh-feat-info .vh-faint { font-size: .8rem; }
.vh-feat-check { width: 1.4rem; height: 1.4rem; border-radius: 50%; background: var(--vh-primary); color: #fff; display: inline-flex; align-items: center; justify-content: center; flex: none; opacity: 0; transition: opacity .15s ease; }
.vh-feat-item:has(input:checked) .vh-feat-check { opacity: 1; }
.vh-feat-interval { max-width: 320px; }

/* Search Engine Preview: keep long URL inside the card */
.vh-seo-serp { overflow: hidden; }
.vh-seo-serp-url { overflow-wrap: anywhere; word-break: break-all; }
.vh-seo-serp-title, .vh-seo-serp-desc { overflow-wrap: anywhere; }