:root, :root[data-theme="dark"] {
  color-scheme: dark;
  --canvas: #111014; --surface: #18171c; --surface-2: #222027; --surface-3: #18171c;
  --panel: #18171c; --panel-2: #1d1c21; --band: #141317;
  --ink: #ece8e1; --muted: #a9a4ae; --faint: #8d8893;
  --line: rgba(236, 232, 225, 0.12); --line-2: rgba(236, 232, 225, 0.3); --outline: #ece8e1;
  --accent: #b405ec; --accent-hover: #9a00cc; --accent-2: #9a00cc; --accent-soft: rgba(180, 5, 236, 0.16);
  --mark: #cf7dff; --link: #d9a2ff; --tape: #ffd400;
  --inverse: #ece8e1; --on-inverse: #111014; --scroll: #3a3640; --foot: #0c0b0e;
  --display: "Schibsted Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: ui-monospace, "Cascadia Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 72px; --sp-9: 112px;
  --edge: 2px;
}
:root[data-theme="light"] {
  color-scheme: light;
  --canvas: #ebe7e0; --surface: #f5f2ec; --surface-2: #e0dbd2; --surface-3: #f5f2ec;
  --panel: #f5f2ec; --panel-2: #efebe4; --band: #e6e1d9;
  --ink: #141217; --muted: #4c4752; --faint: #5d5863;
  --line: rgba(20, 18, 23, 0.14); --line-2: rgba(20, 18, 23, 0.42); --outline: #141217;
  --accent-soft: rgba(122, 0, 181, 0.1);
  --mark: #7a00b5; --link: #7a00b5; --tape: #ffd400;
  --inverse: #141217; --on-inverse: #f5f2ec; --scroll: #b8b1a6; --foot: #141217;
}
html, body { background: var(--canvas); }
body { color: var(--ink); }
::selection { background: var(--accent); color: #fff; }

:root[data-theme] main h1, :root[data-theme] main h2, :root[data-theme] main h3, :root[data-theme] main .title { font-family: var(--display); color: var(--ink); }
:root[data-theme] main .title { font-weight: 900; font-size: clamp(2rem, 4.2vw, 3.25rem); line-height: 0.95; letter-spacing: -0.035em; }
:root[data-theme] main .title.sub { font-size: clamp(1.5rem, 2.6vw, 2rem); }
:root[data-theme] main .page-head .title { font-size: clamp(2.75rem, 7vw, 5.5rem); letter-spacing: -0.045em; }
:root[data-theme] main .lead { color: var(--muted); font-size: 1.0625rem; line-height: 1.55; }
.mono, .vlen, .minfo small, .say-by, .vfilter button span, .anvil-clips b, .facts dt, .handle, .menu-note { font-family: var(--mono); letter-spacing: 0; }

:root[data-theme] main .sec { padding-block: clamp(56px, 8vw, 104px); }
:root[data-theme] main .sec + .sec:not([hidden]) > .band { border-top: 1px solid var(--line); padding-top: clamp(40px, 6vw, 72px); }
:root[data-theme] main .sec.tight { padding-block: clamp(40px, 5vw, 64px); }
:root[data-theme] main .sec.alt { background: transparent; border: 0; }
:root[data-theme] main .page-head { padding-block: clamp(48px, 8vw, 96px) clamp(24px, 3vw, 40px); border-bottom: 1px solid var(--line); }
:root[data-theme] main .page-head .band { border: 0; }

:root[data-theme] main .btn:not(.site-head .btn), :root[data-theme] .consent .btn, :root[data-theme] .sticky-cta .btn {
  min-height: 48px; padding: 12px 22px; border-radius: var(--edge); border: 1px solid var(--line-2); background: transparent; color: var(--ink);
  font: 800 0.9375rem/1.2 var(--font); letter-spacing: 0; box-shadow: none; transform: none; -webkit-backdrop-filter: none; backdrop-filter: none;
  transition: background-color 0.12s, color 0.12s, border-color 0.12s, transform 0.08s;
}
:root[data-theme] main .btn:not(.site-head .btn):hover, :root[data-theme] .consent .btn:hover { border-color: var(--ink); background: transparent; color: var(--ink); box-shadow: none; filter: none; }
:root[data-theme] main .btn-primary:not(.site-head .btn), :root[data-theme] .consent .btn-primary, :root[data-theme] .sticky-cta .btn-primary { background: var(--accent); border-color: var(--accent); color: #fff; box-shadow: inset 0 -3px 0 rgba(0, 0, 0, 0.35); }
:root[data-theme] main .btn-primary:not(.site-head .btn):hover, :root[data-theme] .consent .btn-primary:hover { background: var(--ink); border-color: var(--ink); color: var(--canvas); box-shadow: inset 0 -3px 0 rgba(0, 0, 0, 0.2); }
:root[data-theme] main .btn:not(.site-head .btn):active, :root[data-theme] .consent .btn:active { transform: translateY(1px); }
:root[data-theme] main .btn-primary:not(.site-head .btn):active { box-shadow: none; }
:root[data-theme] main .btn-help, :root[data-theme] main .btn-help:hover { background: transparent; color: var(--ink); border-color: var(--line-2); }
:root[data-theme] main .btn-small { min-height: 40px; padding: 8px 16px; font-size: 0.875rem; }
:root[data-theme] :focus-visible { outline: 2px solid var(--mark); outline-offset: 3px; }
:root[data-theme] main .tlink { color: var(--ink); text-decoration: underline; text-decoration-color: var(--mark); text-decoration-thickness: 2px; text-underline-offset: 6px; }
:root[data-theme] main .tlink:hover { color: var(--ink); text-decoration-color: var(--ink); }
:root[data-theme] main a:not(.btn):not(.tlink):not(.mrow):not(.brand) { color: var(--link); }

.help-fab, :root[data-theme] .help-fab { min-height: 40px; padding: 0 14px; border-radius: var(--edge); border: 1px solid var(--line-2); background: var(--surface); color: var(--ink); box-shadow: none; font: 800 0.875rem/1 var(--font); }
.help-fab:hover, :root[data-theme] .help-fab:hover { background: var(--accent); border-color: var(--accent); color: #fff; transform: none; filter: none; }

.hero.has-frame, :root[data-theme="light"] .hero.has-frame { background-image: none; }
main .hero::before, #view-home > .sec::before { content: none; }
:root[data-theme] main .hero { padding-block: clamp(40px, 6vw, 80px) clamp(48px, 7vw, 96px); }
:root[data-theme] main .hero-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 5vw, 72px); align-items: end; }
:root[data-theme] main .hero h1 { font-family: var(--display); font-weight: 900; font-size: clamp(3rem, 6.6vw, 5.75rem); line-height: 0.9; letter-spacing: -0.05em; margin: var(--sp-5) 0 var(--sp-5); }
:root[data-theme] main .hero .lead { max-width: 34ch; font-size: 1.125rem; color: var(--ink); }
:root[data-theme] main .byline { font-family: var(--mono); font-size: 0.8125rem; color: var(--muted); gap: 10px; }
:root[data-theme] main .byline b { font-family: var(--font); font-size: 0.9375rem; color: var(--ink); }
:root[data-theme] main .byline img { border-radius: var(--edge); }
:root[data-theme] main .hero-work .sec-head { border-bottom: 1px solid var(--line-2); padding-bottom: var(--sp-3); margin-bottom: var(--sp-4); }
:root[data-theme] main .hero-work .sec-head .title { font-size: 1.125rem; letter-spacing: -0.01em; }
:root[data-theme] main .hero-work .vgrid { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1fr); align-items: end; gap: var(--sp-4); }

.vgrid { counter-reset: clip; }
.vgrid .vcard { counter-increment: clip; position: relative; border: 0; background: none; padding: 0; box-shadow: none; }
:root[data-theme] main .vframe { border: 0; border-radius: 0; background: var(--surface-2); overflow: visible; box-shadow: none; }
:root[data-theme] main .vframe .vthumb, :root[data-theme] main .vframe iframe { border-radius: 0; overflow: hidden; }
:root[data-theme] main .vthumb img { transition: transform 0.35s cubic-bezier(0.2, 0.7, 0.2, 1), filter 0.35s; }
:root[data-theme] main .vcard:hover .vthumb img { transform: scale(1.03); }
.vframe::before, .vframe::after { content: ""; position: absolute; z-index: 3; width: 18px; height: 18px; pointer-events: none; border: 0 solid var(--accent); opacity: 0; transition: opacity 0.15s, inset 0.2s; }
.vframe::before { top: -7px; left: -7px; border-top-width: 3px; border-left-width: 3px; }
.vframe::after { bottom: -7px; right: -7px; border-bottom-width: 3px; border-right-width: 3px; }
.vcard:hover .vframe::before, .vcard:hover .vframe::after, .vcard:focus-within .vframe::before, .vcard:focus-within .vframe::after,
.vgrid .vcard:first-child .vframe::before, .vgrid .vcard:first-child .vframe::after { opacity: 1; }
.vcard.is-playing .vframe::before, .vcard.is-playing .vframe::after { opacity: 1; }
:root[data-theme] main .vtag { top: 10px; left: 10px; border-radius: var(--edge); background: rgba(17, 16, 20, 0.86); color: #ece8e1; font: 700 0.75rem/1 var(--mono); padding: 5px 7px; border: 0; }
:root[data-theme] main .vlen { border-radius: var(--edge); background: rgba(17, 16, 20, 0.86); }
:root[data-theme] main .vcard:hover .vlen { background: var(--accent); }
:root[data-theme] main .vcard h3 { display: flex; gap: 10px; align-items: baseline; margin: var(--sp-3) 0 var(--sp-1); font: 800 1rem/1.3 var(--font); letter-spacing: -0.005em; }
:root[data-theme] main .vcard h3::before { content: counter(clip, decimal-leading-zero); flex: none; font: 700 0.75rem/1 var(--mono); color: var(--mark); }
:root[data-theme] main .vcard .vnote { color: var(--muted); }
:root[data-theme] main .vcard .where { margin-top: var(--sp-2); }
:root[data-theme] main .vcard .where .tlink { min-height: 36px; font-size: 0.875rem; }

:root[data-theme] main #video-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--sp-7) var(--sp-5); align-items: end; }
:root[data-theme] main #video-grid > .vcard:first-child { grid-column: span 2; }
:root[data-theme] main #video-grid > .vcard:first-child h3 { font-size: 1.375rem; }
:root[data-theme] main #video-grid > .vcard:first-child .vframe.is-short { max-width: 420px; }
:root[data-theme] main #video-grid > .vcard[hidden] { display: none; }
:root[data-theme] main .vfilter { border-bottom: 1px solid var(--line); margin-bottom: var(--sp-6); box-shadow: none; }
:root[data-theme] main .vfilter button { color: var(--muted); border-bottom-color: transparent; }
:root[data-theme] main .vfilter button[aria-pressed="true"] { color: var(--ink); border-bottom-color: var(--accent); }
:root[data-theme] main .channels { display: block; border-top: 1px solid var(--line-2); }
:root[data-theme] main .channel { display: grid; grid-template-columns: 28px minmax(0, 160px) minmax(0, 1fr) auto; align-items: center; gap: var(--sp-4); padding: var(--sp-4) 0; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: none; box-shadow: none; }
:root[data-theme] main .channel .ch-ic { width: 24px; height: 24px; background: none; border: 0; padding: 0; color: var(--ink); }
:root[data-theme] main .channel .ch-ic svg { width: 22px; height: 22px; fill: currentColor; }
:root[data-theme] main .channel h3 { margin: 0; font-size: 1.0625rem; }
:root[data-theme] main .channel .handle { margin: 0; color: var(--muted); font-size: 0.875rem; }
:root[data-theme] main .channel .btn-row { margin: 0; }
:root[data-theme] main .soon { border: 0; background: none; padding: var(--sp-4) 0 0; border-radius: 0; color: var(--muted); }

:root[data-theme] main .say { font-family: var(--display); font-weight: 900; font-size: clamp(2.25rem, 5vw, 4.25rem); line-height: 0.98; letter-spacing: -0.04em; max-width: 16ch; color: var(--ink); }
:root[data-theme] main .say::before { content: "\201C"; display: block; height: 0.5em; color: var(--accent); font-size: 1.4em; line-height: 0.8; }
:root[data-theme] main .say-by { margin-top: var(--sp-5); color: var(--muted); font-size: 0.875rem; }
:root[data-theme] main .say-by img { border-radius: var(--edge); }

:root[data-theme] main .menu, :root[data-theme] main .faq { background: none; border: 0; border-top: 1px solid var(--line-2); border-radius: 0; box-shadow: none; overflow: visible; }
:root[data-theme] main .menu .mrow { grid-template-columns: max-content minmax(24px, 1fr) max-content minmax(64px, max-content); align-items: start; gap: var(--sp-1) var(--sp-4); padding: var(--sp-5) 0; border-bottom: 1px solid var(--line); background: none; overflow: visible; }
:root[data-theme] main .menu .mrow::before { content: ""; position: static; inset: auto; grid-column: 2; grid-row: 1; align-self: start; height: 0; margin-top: 1.05em; border-bottom: 2px dotted var(--line-2); background: none; transform: none; opacity: 1; transition: border-color 0.12s; }
:root[data-theme] main .menu .mrow:hover::before { border-bottom-color: var(--accent); }
:root[data-theme] main .menu .minfo { display: contents; }
:root[data-theme] main .menu .minfo b { grid-column: 1; grid-row: 1; font: 800 1.25rem/1.2 var(--font); color: var(--ink); }
:root[data-theme] main .menu .minfo small { grid-column: 1 / -1; grid-row: 2; margin: 0; color: var(--muted); font-size: 0.8125rem; }
:root[data-theme] main .menu .mprice { grid-column: 3; grid-row: 1; font: 900 1.75rem/1 var(--display); letter-spacing: -0.03em; color: var(--ink); font-variant-numeric: tabular-nums; }
:root[data-theme] main .menu .mgo { grid-column: 4; grid-row: 1; justify-self: end; margin-top: 0.3em; color: var(--muted); background: none; }
:root[data-theme] main .menu .mrow:hover .mgo { color: var(--ink); text-decoration-color: var(--accent); }
:root[data-theme] main .menu-note { margin: var(--sp-4) 0 0; color: var(--muted); font-size: 0.8125rem; line-height: 1.6; }

:root[data-theme] main .table-wrap.ratecard { border: 0; border-top: 1px solid var(--line-2); border-radius: 0; background: none; box-shadow: none; }
:root[data-theme] main .ratecard table { border-collapse: collapse; width: 100%; }
:root[data-theme] main .ratecard th { font: 700 0.75rem/1.2 var(--mono); color: var(--muted); text-align: left; padding: var(--sp-3) var(--sp-3) var(--sp-3) 0; border-bottom: 1px solid var(--line); background: none; }
:root[data-theme] main .ratecard td { padding: var(--sp-5) var(--sp-3) var(--sp-5) 0; border-bottom: 1px solid var(--line); background: none; }
:root[data-theme] main .ratecard td.rc-n { font: 900 1.75rem/1 var(--display); color: var(--mark); }
:root[data-theme] main .ratecard td.rc-total { font: 900 1.5rem/1 var(--display); letter-spacing: -0.02em; }
:root[data-theme] main .ratecard td:nth-child(3) { font-family: var(--mono); color: var(--muted); }
:root[data-theme] main .ratecard tbody tr:hover td { background: var(--accent-soft); }
:root[data-theme] main .free-strip { border: 1px dashed var(--line-2); border-radius: 0; background: none; padding: var(--sp-4) var(--sp-5); }

:root[data-theme] main .anvil-feature { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--sp-6); align-items: start; border: 0; background: none; padding: 0; box-shadow: none; }
:root[data-theme] main .anvil-feature .anvil-art { width: 112px; height: auto; transform: rotate(-8deg); filter: none; }
:root[data-theme] main .anvil-shine i { display: none; }
:root[data-theme] main .free { display: inline-block; margin-left: 10px; padding: 4px 9px 3px; background: var(--tape); color: #141217; font: 800 0.4em/1 var(--mono); letter-spacing: 0.04em; text-transform: uppercase; vertical-align: 0.55em; transform: rotate(-3deg); border-radius: 0; box-shadow: none; }
.anvil-clips { list-style: none; margin: var(--sp-6) 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 168px)); gap: var(--sp-5); counter-reset: none; }
.anvil-clips li { margin: 0; padding: 0; border: 0; background: none; display: grid; gap: var(--sp-1); }
.anvil-clips .clip-frame { position: relative; display: grid; place-items: end center; aspect-ratio: 4 / 3; margin-bottom: var(--sp-2); border: 1px dashed var(--line-2); background: repeating-linear-gradient(0deg, transparent 0 11px, var(--line) 11px 12px); overflow: hidden; }
.anvil-clips .clip-frame img { width: 44%; height: auto; margin-bottom: 8%; image-rendering: auto; }
.anvil-clips .clip-out .clip-frame { border: 1px solid var(--tape); }
.anvil-clips .clip-out .clip-frame .clip-anvil { position: absolute; left: 50%; top: 4%; width: 46%; margin: 0; transform: translateX(-50%) rotate(-10deg); }
.anvil-clips b { font-size: 0.75rem; font-weight: 700; color: var(--mark); }
.anvil-clips .clip-out b { color: var(--ink); }
.anvil-clips small { font-size: 0.9375rem; line-height: 1.35; color: var(--ink); }
:root[data-theme] main .incl.pick { border-top: 1px solid var(--line); }

:root[data-theme] main .about-home { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(32px, 6vw, 96px); align-items: end; }
:root[data-theme] main .about-home .title { font-size: clamp(3rem, 8vw, 6.5rem); line-height: 0.88; letter-spacing: -0.05em; }
:root[data-theme] main .about-home .lead { max-width: 38ch; margin-top: var(--sp-4); color: var(--ink); font-size: 1.1875rem; }
:root[data-theme] main .avatar-frame { border: 0; border-radius: 0; background: var(--accent); padding: 0; box-shadow: none; overflow: hidden; }
:root[data-theme] main .avatar-frame img { border-radius: 0; display: block; }

:root[data-theme] main .about-grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(32px, 6vw, 96px); align-items: start; padding-block: clamp(48px, 8vw, 104px); }
:root[data-theme] main .about-grid > .avatar-frame { position: sticky; top: 104px; }
:root[data-theme] main .about-text .title { font-size: clamp(2.75rem, 7vw, 5.5rem); letter-spacing: -0.045em; margin-bottom: var(--sp-5); }
:root[data-theme] main .about-text .lead { color: var(--ink); font-size: clamp(1.1875rem, 1.8vw, 1.4375rem); line-height: 1.45; max-width: 36ch; }
:root[data-theme] main .about-story { max-width: 60ch; margin-top: var(--sp-6); padding-top: var(--sp-5); border-top: 1px solid var(--line); }
:root[data-theme] main .about-story p { font-size: 1.0625rem; line-height: 1.7; }
:root[data-theme] main .about-story p:last-child { font-family: var(--mono); color: var(--mark); }
:root[data-theme] main .about-sub { margin-top: var(--sp-7); font: 800 0.8125rem/1 var(--mono); color: var(--muted); letter-spacing: 0; }
:root[data-theme] main .stack { display: block; border-top: 1px solid var(--line); margin-top: var(--sp-3); }
:root[data-theme] main .stack li { display: flex; align-items: center; gap: var(--sp-4); padding: var(--sp-4) 0; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: none; box-shadow: none; }
:root[data-theme] main .stack small { font-family: var(--mono); color: var(--muted); }
:root[data-theme] main .facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--sp-5); margin-top: var(--sp-6); border: 0; background: none; border-radius: 0; padding: 0; }
:root[data-theme] main .facts > div { border-top: 1px solid var(--line); padding: var(--sp-3) 0; }
:root[data-theme] main .facts dt { font-size: 0.75rem; color: var(--muted); }
:root[data-theme] main .facts dd { margin: var(--sp-1) 0 0; font-weight: 700; }

:root[data-theme] main .reach { border-top: 1px solid var(--line-2); }
:root[data-theme] main .reach > li { border-bottom: 1px solid var(--line); }
:root[data-theme] .neon-time { font-family: var(--mono); color: var(--ink); }

:root[data-theme] main .faq details { border-bottom: 1px solid var(--line); padding-inline: 0; }
:root[data-theme] main .faq summary { font-weight: 800; font-size: 1.0625rem; }
:root[data-theme] main .faq details[open] summary { color: var(--ink); }
:root[data-theme] main .faq details p { color: var(--muted); max-width: 60ch; }

:root[data-theme] main .cta, :root[data-theme="light"] main .cta { background: var(--surface); color: var(--ink); border: 1px solid var(--line); border-left: 6px solid var(--accent); border-radius: 0; padding: clamp(32px, 5vw, 56px); box-shadow: none; }
:root[data-theme] main .cta h2 { color: var(--ink); font: 900 clamp(2rem, 4.4vw, 3.5rem)/0.95 var(--display); letter-spacing: -0.04em; max-width: 14ch; }
:root[data-theme] main .cta .help p, :root[data-theme] main .cta .help b, :root[data-theme] main .cta p { color: var(--muted); }
:root[data-theme] main .cta .btn:not(.btn-primary):not(.site-head .btn), :root[data-theme="light"] main .cta .btn:not(.btn-primary):not(.site-head .btn) { color: var(--ink); border-color: var(--line-2); background: transparent; }
:root[data-theme] main .cta .btn-primary:not(.site-head .btn), :root[data-theme="light"] main .cta .btn-primary:not(.site-head .btn) { background: var(--accent); border-color: var(--accent); color: #fff; }
:root[data-theme] main .cta .btn-primary:not(.site-head .btn):hover, :root[data-theme="light"] main .cta .btn-primary:not(.site-head .btn):hover { background: var(--ink); border-color: var(--ink); color: var(--canvas); }
:root[data-theme] main .cta .help a.discord-me b { color: var(--link); }
:root[data-theme] main .cta :focus-visible { outline-color: var(--mark); }

:root[data-theme] main .opt, :root[data-theme] main .qty-opt, :root[data-theme] main .addon-opt, :root[data-theme] main .co-side, :root[data-theme] main .pay-box, :root[data-theme] main .paid-box,
:root[data-theme] main .drop, :root[data-theme] main .free-box, :root[data-theme] main .remember, :root[data-theme] main .draft-note, :root[data-theme] main .done-id, :root[data-theme] main .upsell,
:root[data-theme] main .stripe-embed, :root[data-theme] main .chat-box, :root[data-theme] main .my-orders > li, :root[data-theme] main .hist, :root[data-theme] main .card, :root[data-theme] main .stepper {
  border-radius: 0; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; background: var(--surface); border: 1px solid var(--line);
}
:root[data-theme] main .qty-opt:hover, :root[data-theme] main .opt:hover, :root[data-theme] main .addon-opt:hover { border-color: var(--line-2); }
:root[data-theme] main .qty-opt:has(input:checked), :root[data-theme] main .opt:has(input:checked), :root[data-theme] main .addon-opt:has(input:checked),
:root[data-theme] main .qty-opt.is-on, :root[data-theme] main .opt.is-on { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); background: var(--accent-soft); }
:root[data-theme] main .qty-opt b { font-family: var(--display); font-weight: 900; letter-spacing: -0.03em; }
:root[data-theme] main .co-side { position: sticky; top: 96px; border-top: 3px solid var(--accent); }
:root[data-theme] main input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), :root[data-theme] main textarea, :root[data-theme] main select {
  border-radius: 0; border: 1px solid var(--line-2); background: var(--canvas); color: var(--ink); box-shadow: none;
}
:root[data-theme] main input:not([type="checkbox"]):not([type="radio"]):focus, :root[data-theme] main textarea:focus, :root[data-theme] main select:focus { border-color: var(--mark); outline: 2px solid var(--mark); outline-offset: 0; }
:root[data-theme] main input[aria-invalid="true"], :root[data-theme] main textarea[aria-invalid="true"] { border-color: var(--bad); }
:root[data-theme] main .stepper a, :root[data-theme] main .stepper button, :root[data-theme] main .stepper li { border-radius: 0; }

:root[data-theme] .consent { background: rgba(8, 7, 10, 0.6); }
:root[data-theme] .consent-card { border-radius: 0; border: 1px solid var(--line-2); border-top: 3px solid var(--accent); background: var(--surface); box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
:root[data-theme] .consent-card h2 { font: 900 1.5rem/1.05 var(--display); letter-spacing: -0.02em; }
:root[data-theme] .consent-list li { border-radius: 0; }
:root[data-theme] .sticky-cta { border-radius: 0; background: var(--surface); border: 1px solid var(--line-2); -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: none; }
:root[data-theme] .toast, :root[data-theme] .nt { border-radius: 0; background: var(--surface); -webkit-backdrop-filter: none; backdrop-filter: none; }

.site-foot, :root[data-theme="light"] .site-foot { background: var(--foot); border-top: 1px solid var(--line); }
.site-foot .foot-h { font-family: var(--mono); }

@media (prefers-reduced-motion: reduce) {
  :root[data-theme] main .vcard:hover .vthumb img { transform: none; }
  .vframe::before, .vframe::after { transition: none; }
}
:root[data-motion="reduce"] main .vcard:hover .vthumb img { transform: none; }

@media (max-width: 1023.98px) {
  :root[data-theme] main .hero-grid { grid-template-columns: minmax(0, 1fr); align-items: start; }
  :root[data-theme] main #video-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  :root[data-theme] main #video-grid > .vcard:first-child { grid-column: 1 / -1; }
  :root[data-theme] main .about-home, :root[data-theme] main .about-grid { grid-template-columns: minmax(0, 1fr); }
  :root[data-theme] main .about-grid > .avatar-frame { position: static; max-width: 320px; }
  :root[data-theme] main .about-home .avatar-frame { max-width: 280px; }
}
@media (max-width: 767.98px) {
  :root[data-theme] main .hero h1 { font-size: clamp(2.75rem, 13vw, 3.75rem); margin: var(--sp-4) 0; }
  :root[data-theme] main .hero .btn-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-3); }
  :root[data-theme] main .hero .btn-row .btn { width: 100%; }
  :root[data-theme] main .hero-work .vgrid { display: grid; grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 46%; overflow-x: auto; scroll-snap-type: x mandatory; padding: 8px 8px 8px; margin-inline: -8px; align-items: end; }
  :root[data-theme] main .hero-work .vgrid > .vcard:first-child { grid-column: auto; }
  :root[data-theme] main .hero-work .vgrid { grid-auto-columns: 46%; }
  :root[data-theme] main .hero-work .vgrid > .vcard { scroll-snap-align: start; }
  :root[data-theme] main .hero-work .vgrid > .vcard:first-child { min-width: 62vw; }
  :root[data-theme] main .menu .mrow { grid-template-columns: max-content minmax(12px, 1fr) max-content 14px; gap: var(--sp-1) var(--sp-3); padding: var(--sp-4) 0; }
  :root[data-theme] main .menu .minfo b { font-size: 1.0625rem; }
  :root[data-theme] main .menu .mprice { font-size: 1.375rem; }
  :root[data-theme] main .channel { grid-template-columns: 24px minmax(0, 1fr) auto; }
  :root[data-theme] main .channel .handle { grid-column: 2; grid-row: 2; }
  :root[data-theme] main .channel .btn-row { grid-column: 3; grid-row: 1 / span 2; }
  :root[data-theme] main #video-grid { grid-template-columns: minmax(0, 1fr); gap: var(--sp-7); }
  :root[data-theme] main #video-grid .vframe.is-short { max-width: 340px; }
  :root[data-theme] main .anvil-feature { grid-template-columns: minmax(0, 1fr); gap: var(--sp-4); }
  :root[data-theme] main .anvil-feature .anvil-art { width: 80px; }
  .anvil-clips { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-3); }
  .anvil-clips small { font-size: 0.8125rem; }
  :root[data-theme] main .cta { border-left-width: 4px; }
  :root[data-theme] main .facts { grid-template-columns: minmax(0, 1fr); }
  :root[data-theme] .consent-card { padding: 20px; }
  :root[data-theme] main .co-side { position: static; }
}
:root[data-theme] main .menu .mrow::before { border-bottom-color: var(--faint); }
@media (min-width: 1024px) {
  :root[data-theme] main .band:has(> .menu) { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); column-gap: clamp(32px, 6vw, 96px); }
  :root[data-theme] main .band:has(> .menu) > .sec-head { grid-column: 1; grid-row: 1 / span 2; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: var(--sp-4); }
  :root[data-theme] main .band:has(> .menu) > .menu, :root[data-theme] main .band:has(> .menu) > .menu-note { grid-column: 2; }
}
:root[data-theme] main .order-check, :root[data-theme] main .sum, :root[data-theme] main .tt-card, :root[data-theme] main .facts, :root[data-theme] main .help.big { border-radius: 0; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
:root[data-theme] main .order-check { border: 1px solid var(--line); background: var(--surface); }
@media (max-width: 767.98px) {
  :root[data-theme] main .hero-work .vgrid { display: flex; gap: var(--sp-4); overflow-x: auto; scroll-snap-type: x mandatory; padding: 10px 10px 8px; margin-inline: -10px; align-items: flex-end; }
  :root[data-theme] main .hero-work .vgrid > .vcard { flex: 0 0 42%; min-width: 0; scroll-snap-align: start; }
  :root[data-theme] main .hero-work .vgrid > .vcard:first-child { flex-basis: 58%; min-width: 0; }
}
@media (min-width: 1024px) {
  :root[data-theme] main .say-sec .band > * { margin-left: min(25%, 320px); }
  :root[data-theme] main .sec-head.row { align-items: end; }
}
@media (max-width: 767.98px) { :root[data-theme] main .sec-head.row { align-items: flex-start; } }
