
:root{
  --bg: transparent;
  --fg: inherit;
  --muted: color-mix(in srgb, currentColor 60%, transparent);
  --border: color-mix(in srgb, currentColor 18%, transparent);
  --btn-bg: color-mix(in srgb, currentColor 10%, transparent);
  --btn-fg: currentColor;
  --btn-border: color-mix(in srgb, currentColor 18%, transparent);
  --ctl-h: 44px; --ctl-fs:16px; --radius: 10px; --space:16px; --space-lg:28px;
  --h3: clamp(1.22rem, 2.2vw, 1.5rem);
}
.svb-astro{background:var(--bg);color:var(--fg);border:1px solid var(--border);border-radius:12px;padding:var(--space);margin:12px 0;width:100%}
.svb-h3{font-size:var(--h3);margin:.2em 0 .6em;letter-spacing:.02em;text-transform:uppercase}
.svb-separator{height:1px;background:var(--border);margin:var(--space-lg) 0}
.svb-row{display:grid;gap:var(--space);margin-top:var(--space-lg)}
@media(min-width:720px){.svb-row{grid-template-columns:1fr 1fr}}
.svb-card{background:color-mix(in srgb, currentColor 6%, transparent);border:1px solid var(--border);border-radius:var(--radius);padding:14px}
.svb-form label{display:block;margin:.2em 0 .2em}
.svb-form select,.svb-form input[type=time],.svb-form input[type=date],.svb-form input[type=text]{
  width:100%;height:var(--ctl-h);padding:0 .75em;border:1px solid var(--border);border-radius:8px;background:var(--bg);color:var(--fg);
  line-height:calc(var(--ctl-h) - 2px);box-sizing:border-box;appearance:none;font-size:var(--ctl-fs);
  text-align:left; text-align-last:left; direction:ltr;
}
.svb-form--mb{ margin-bottom: 10px; }
.svb-daily-head{ margin-top: 10px; }
.svb-btn{margin-top:.6em;padding:.6em 1em;border:1px solid var(--btn-border);border-radius:8px;background:var(--btn-bg);color:var(--btn-fg);cursor:pointer}
.svb-score{font-weight:700;margin:.6em 0}
.svb-date{color:var(--muted);display:block;margin-bottom:.4em}
.svb-article{white-space:pre-wrap;line-height:1.7;margin-top:.4em;min-height:1.2em}
.svb-facts{list-style:none;padding:0;margin:10px 0 0 0;display:grid;gap:8px}
.svb-facts li{display:flex;align-items:center;gap:8px}
.svb-colorline .svb-color-chip{display:inline-block;width:14px;height:14px;border-radius:3px;border:1px solid var(--border);vertical-align:middle}
/* iOS Safari left-align helpers */
.svb-form input[type=time]::-webkit-date-and-time-value,
.svb-form input[type=date]::-webkit-date-and-time-value{{ text-align:left; }}

.svb-profile-out{margin-top:.6em}.svb-profile-out .svb-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
