
html[data-rv-theme="pastel"] { --ed-band: #efbcae; --ed-d: #1e1e1e; --ed-d2: #252524; --rv-emd: #efbcae; --rv-sky: #a999c4; --rv-nav: #1e1e1e; --rv-go: #f08257; --rv-go-ink: #1e1e1e; }
html[data-rv-theme="pastel"][data-rv-mode="dark"] { --rv-sky: #8f80b0; }
html[data-rv-theme="pastel"] .ed.rv-gh { --ed-band: #cfc3de; --rv-ground: #cfc3de; background: #cfc3de; --ed-i: 40, 26, 64; --ed-rail: rgba(40, 26, 64, .24); --rv-em: #5a3f8a; }
html[data-rv-theme="pastel"] .ed.rv-gh .ed-rule i { --ed-plus: rgba(40, 26, 64, .6); }
html[data-rv-theme="pastel"] .ed.rv-gh .ed-panel { --dot: rgba(40, 26, 64, .7); }
html[data-rv-theme="pastel"] .ed.rv-gh .ed-panel::before { background: rgba(40, 26, 64, .9); }
html[data-rv-theme="pastel"] .ed.rv-g1 { --ed-band: #efbcae; --rv-ground: #efbcae; background: #efbcae; --ed-i: 60, 24, 16; --ed-rail: rgba(60, 24, 16, .24); --rv-em: #9b3a26; }
html[data-rv-theme="pastel"] .ed.rv-g1 .ed-rule i { --ed-plus: rgba(60, 24, 16, .6); }
html[data-rv-theme="pastel"] .ed.rv-g1 .ed-panel { --dot: rgba(60, 24, 16, .7); }
html[data-rv-theme="pastel"] .ed.rv-g1 .ed-panel::before { background: rgba(60, 24, 16, .9); }
html[data-rv-theme="pastel"][data-rv-mode="dark"] .ed.rv-g1 { --ed-band: #d89a8b; --rv-ground: #d89a8b; background: #d89a8b; --ed-i: 56, 20, 12; --ed-rail: rgba(56, 20, 12, .24); --rv-em: rgb(56, 20, 12); }
html[data-rv-theme="pastel"][data-rv-mode="dark"] .ed.rv-g1 .ed-rule i { --ed-plus: rgba(56, 20, 12, .6); }
html[data-rv-theme="pastel"][data-rv-mode="dark"] .ed.rv-g1 .ed-panel { --dot: rgba(56, 20, 12, .7); }
html[data-rv-theme="pastel"][data-rv-mode="dark"] .ed.rv-g1 .ed-panel::before { background: rgba(56, 20, 12, .9); }
html[data-rv-theme="pastel"] .ed.rv-g2 { --ed-band: #b7c6b8; --rv-ground: #b7c6b8; background: #b7c6b8; --ed-i: 22, 36, 26; --ed-rail: rgba(22, 36, 26, .24); --rv-em: #2f5a3c; }
html[data-rv-theme="pastel"] .ed.rv-g2 .ed-rule i { --ed-plus: rgba(22, 36, 26, .6); }
html[data-rv-theme="pastel"] .ed.rv-g2 .ed-panel { --dot: rgba(22, 36, 26, .7); }
html[data-rv-theme="pastel"] .ed.rv-g2 .ed-panel::before { background: rgba(22, 36, 26, .9); }
html[data-rv-theme="pastel"][data-rv-mode="dark"] .ed.rv-g2 { --ed-band: #8fa896; --rv-ground: #8fa896; background: #8fa896; --ed-i: 18, 32, 22; --ed-rail: rgba(18, 32, 22, .24); --rv-em: rgb(18, 32, 22); }
html[data-rv-theme="pastel"][data-rv-mode="dark"] .ed.rv-g2 .ed-rule i { --ed-plus: rgba(18, 32, 22, .6); }
html[data-rv-theme="pastel"][data-rv-mode="dark"] .ed.rv-g2 .ed-panel { --dot: rgba(18, 32, 22, .7); }
html[data-rv-theme="pastel"][data-rv-mode="dark"] .ed.rv-g2 .ed-panel::before { background: rgba(18, 32, 22, .9); }
html[data-rv-theme="pastel"] .ed.rv-g3 { --ed-band: #ecdfa6; --rv-ground: #ecdfa6; background: #ecdfa6; --ed-i: 48, 38, 6; --ed-rail: rgba(48, 38, 6, .24); --rv-em: #7a5c07; }
html[data-rv-theme="pastel"] .ed.rv-g3 .ed-rule i { --ed-plus: rgba(48, 38, 6, .6); }
html[data-rv-theme="pastel"] .ed.rv-g3 .ed-panel { --dot: rgba(48, 38, 6, .7); }
html[data-rv-theme="pastel"] .ed.rv-g3 .ed-panel::before { background: rgba(48, 38, 6, .9); }
html[data-rv-theme="pastel"][data-rv-mode="dark"] .ed.rv-g3 { --ed-band: #cdbb72; --rv-ground: #cdbb72; background: #cdbb72; --ed-i: 46, 36, 4; --ed-rail: rgba(46, 36, 4, .24); --rv-em: rgb(46, 36, 4); }
html[data-rv-theme="pastel"][data-rv-mode="dark"] .ed.rv-g3 .ed-rule i { --ed-plus: rgba(46, 36, 4, .6); }
html[data-rv-theme="pastel"][data-rv-mode="dark"] .ed.rv-g3 .ed-panel { --dot: rgba(46, 36, 4, .7); }
html[data-rv-theme="pastel"][data-rv-mode="dark"] .ed.rv-g3 .ed-panel::before { background: rgba(46, 36, 4, .9); }
html[data-rv-theme="pastel"] .ed.rv-g4 { --ed-band: #bccbdb; --rv-ground: #bccbdb; background: #bccbdb; --ed-i: 18, 34, 58; --ed-rail: rgba(18, 34, 58, .24); --rv-em: #2a4f7a; }
html[data-rv-theme="pastel"] .ed.rv-g4 .ed-rule i { --ed-plus: rgba(18, 34, 58, .6); }
html[data-rv-theme="pastel"] .ed.rv-g4 .ed-panel { --dot: rgba(18, 34, 58, .7); }
html[data-rv-theme="pastel"] .ed.rv-g4 .ed-panel::before { background: rgba(18, 34, 58, .9); }
html[data-rv-theme="pastel"][data-rv-mode="dark"] .ed.rv-g4 { --ed-band: #8ea6c0; --rv-ground: #8ea6c0; background: #8ea6c0; --ed-i: 14, 28, 48; --ed-rail: rgba(14, 28, 48, .24); --rv-em: rgb(14, 28, 48); }
html[data-rv-theme="pastel"][data-rv-mode="dark"] .ed.rv-g4 .ed-rule i { --ed-plus: rgba(14, 28, 48, .6); }
html[data-rv-theme="pastel"][data-rv-mode="dark"] .ed.rv-g4 .ed-panel { --dot: rgba(14, 28, 48, .7); }
html[data-rv-theme="pastel"][data-rv-mode="dark"] .ed.rv-g4 .ed-panel::before { background: rgba(14, 28, 48, .9); }


:root {
  --rv-ch: min(1240px, calc(100vw - 60px));        
  --rv-nav-h: 72px;
  --rv-ink: #ecebe8;
  --rv-dim: rgba(236, 235, 232, .66);
  --rv-rule: rgba(236, 235, 232, .12);
  --rv-go: #f08257;                                  
  --rv-go-ink: #1e1e1e;
  --rv-black: #151414;                               
  --rv-geist: "Geist", "Geist Variable", ui-sans-serif, system-ui, sans-serif;
  --rv-pixel: "LisaTerminal Paper 2X3Y Medium", "LisaTerminal Paper 2X3Y", ui-monospace, monospace;
  --rv-code: "JetBrains Mono", ui-monospace, monospace;
}
html { scroll-padding-top: calc(var(--rv-nav-h) + 16px); }



.rv-nav { position: fixed; top: 0; left: 0; right: 0; z-index: 100; height: var(--rv-nav-h);
  background: var(--rv-black); border-bottom: 1px solid var(--rv-rule); box-sizing: content-box;
  transition: box-shadow .2s ease; -webkit-font-smoothing: antialiased; }
.rv-nav.is-scrolled { box-shadow: 0 12px 32px rgba(0, 0, 0, .38); }
.rv-nav-bar { display: flex; align-items: center; gap: 4px; height: 100%; width: var(--rv-ch); margin: 0 auto; padding: 0 16px; box-sizing: border-box;
  box-shadow: inset 1px 0 0 var(--rv-rule), inset -1px 0 0 var(--rv-rule); }
.rv-brand { display: inline-flex; align-items: center; gap: 10px; margin-right: 28px; color: var(--rv-ink); text-decoration: none;
  font: 500 24px/1 var(--rv-pixel); letter-spacing: .2px; -webkit-font-smoothing: none; }
.rv-mark { width: 22px; height: 22px; background: var(--rv-go); image-rendering: pixelated;
  -webkit-mask: url(/lp/v34-editorial/img/mark.png) center / contain no-repeat; mask: url(/lp/v34-editorial/img/mark.png) center / contain no-repeat; }
.rv-menu { display: flex; align-items: center; gap: 2px; }
.rv-link { display: inline-flex; align-items: center; height: 36px; padding: 0 12px; color: var(--rv-dim); text-decoration: none;
  font: 450 14px/1 var(--rv-geist); border-radius: 6px; transition: background .15s, color .15s; }
.rv-link:hover { color: var(--rv-ink); background: rgba(236, 235, 232, .07); }
.rv-link.is-on { color: var(--rv-ink); background: rgba(236, 235, 232, .09); }
.rv-sp { flex: 1; }
.rv-signin { display: inline-flex; align-items: center; height: 36px; padding: 0 14px; margin-right: 12px; color: var(--rv-ink); text-decoration: none;
  font: 450 14px/1 var(--rv-geist); border-radius: 6px; box-shadow: inset 0 0 0 1px rgba(236, 235, 232, .22); transition: background .15s; }
.rv-signin:hover { background: rgba(236, 235, 232, .07); }
.rv-go { display: inline-flex; align-items: center; gap: 10px; white-space: nowrap; height: 40px; padding: 0 14px 1px; color: var(--rv-go-ink); background: var(--rv-go); text-decoration: none;
  font: 500 18px/1 var(--rv-pixel); letter-spacing: .18px; -webkit-font-smoothing: none;
  box-shadow: inset 0 0 0 2px #1e1e1e, 3px 3px 0 #000; transition: transform .08s, box-shadow .08s; }
.rv-go:hover { transform: translate(-1px, -1px); box-shadow: inset 0 0 0 2px #1e1e1e, 4px 4px 0 #000; }
.rv-go:active { transform: translate(2px, 2px); box-shadow: inset 0 0 0 2px #1e1e1e, 1px 1px 0 #000; }
.rv-link:focus-visible, .rv-signin:focus-visible, .rv-go:focus-visible, .rv-brand:focus-visible, .rv-btn:focus-visible, .rv-big:focus-visible, .rv-chaps button:focus-visible, .rv-unmute:focus-visible {
  outline: 2px solid var(--rv-go); outline-offset: 2px; }
.rv-burger { display: none; width: 40px; height: 40px; margin-left: 8px; padding: 0; border: 0; background: transparent; box-shadow: inset 0 0 0 1px rgba(236, 235, 232, .22); cursor: pointer;
  flex-direction: column; align-items: center; justify-content: center; gap: 4px; }
.rv-burger i { display: block; width: 16px; height: 2px; background: var(--rv-ink); }


.rv-hero { padding-top: calc(var(--rv-nav-h) + 1px); }
.rv-hero .ed-cloud { top: calc(var(--rv-nav-h) + 1px); }


@media (max-width: 960px) {
  .rv-menu, .rv-signin { display: none; }
  .rv-burger { display: inline-flex; }
  .rv-nav.is-open .rv-menu { display: flex; flex-direction: column; align-items: stretch; position: absolute; top: calc(var(--rv-nav-h) + 1px); left: 0; right: 0;
    padding: 8px 14px 14px; background: var(--rv-black); border-bottom: 1px solid var(--rv-rule); }
  .rv-nav.is-open .rv-link { height: 44px; }
}



html[data-rv-theme] .ed--band .sx-em2 { color: var(--rv-em); -webkit-text-stroke-color: var(--rv-em); }
html[data-rv-theme] .ed--dark .sx-em2, html[data-rv-theme] .ed--dark2 .sx-em2 { color: var(--rv-emd); -webkit-text-stroke-color: var(--rv-emd); }

html[data-rv-theme] .ed--band .sx-btn { background: var(--rv-go); color: var(--rv-go-ink); box-shadow: inset 0 0 0 2px #1e1e1e; }
html[data-rv-theme] .ed--band .ed-sub { color: rgba(var(--ed-i), .8); }

html[data-rv-theme] .ed--band .sx-card-d, html[data-rv-theme] .ed--band .sx-hero-d { color: rgba(var(--ed-i), .84); }
html[data-rv-theme] .rv-nav { background: var(--rv-nav, #151414); }

html[data-rv-theme] .ed--dark, html[data-rv-theme] .ed--dark2 { --ed-band: var(--rv-go); }

html[data-rv-theme] .ed--dark :is(.sx-btn, .sx-tab, .ed-pill, .sx-pill.is-em), html[data-rv-theme] .ed--dark2 :is(.sx-btn, .sx-tab, .ed-pill, .sx-pill.is-em) { color: var(--rv-go-ink); }
html[data-rv-theme] .ed--dark .sx-gl svg, html[data-rv-theme] .ed--dark2 .sx-gl svg { fill: var(--rv-emd); }
html[data-rv-theme] .ed--dark .ed-panel--feat::before, html[data-rv-theme] .ed--dark2 .ed-panel--feat::before { background: var(--rv-emd); }

html[data-rv-mode="dark"] .ed--dark.sx-hero .ed-sky, html[data-rv-mode="dark"] .ed--dark2.sx-hero .ed-sky { background: var(--rv-sky); opacity: .9; }

html[data-rv-theme] .ed--band .ed-word { color: rgb(var(--ed-i)); }
.ed.rv-gh .ed-sky { background: var(--rv-sky); opacity: .5; }



.rv-curs { position: fixed; inset: 0; z-index: 90; overflow: hidden; pointer-events: none; }
.rv-cur { position: absolute; left: 0; top: 0; transform-origin: 2px 2px; will-change: transform; }
.rv-cur svg { display: block; width: 20px; height: 24px; fill: var(--c); stroke: #fff; stroke-width: 1.3px; stroke-linejoin: round; filter: drop-shadow(0 2px 3px rgba(0, 0, 0, .35)); }
.rv-cur span { position: absolute; left: 16px; top: 20px; padding: 3px 8px 4px; border-radius: 6px 999px 999px 999px; background: var(--c); color: #1e1e1e;
  font: 600 12px/1 "Geist", ui-sans-serif, system-ui, sans-serif; letter-spacing: 0; white-space: nowrap; box-shadow: 0 3px 10px rgba(0, 0, 0, .28); -webkit-font-smoothing: antialiased; }
.rv-cur-ring { position: absolute; left: 0; top: 0; width: 0; height: 0; opacity: 0; will-change: transform, opacity; }
.rv-cur-ring::before { content: ""; position: absolute; left: -18px; top: -18px; width: 36px; height: 36px; border-radius: 50%; border: 2px solid var(--c); transform: scale(var(--s, .3)); }


.ed .tw.rv-win { position: relative; overflow: hidden; }
.ed .rv-win .rv-body { padding: 0; background: #0e0e0e; }
.rv-stage { position: relative; aspect-ratio: 16 / 9; background: #000; overflow: hidden; }
.rv-v { display: block; width: 100%; height: 100%; object-fit: cover; }
.rv-scan { position: absolute; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(0deg, rgba(0, 0, 0, .16) 0 1px, transparent 1px 3px); opacity: .45; }

.rv-ctl { display: flex; align-items: center; gap: 12px; height: 52px; padding: 0 14px; background: var(--rv-black);
  border-top: 1px solid rgba(255, 255, 255, .07); color: #dadad8; font: 400 13px/1 var(--rv-geist); }
.rv-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-width: 32px; height: 32px; padding: 0 8px;
  border: 0; border-radius: 6px; background: transparent; color: inherit; font: inherit; cursor: pointer; transition: background .15s; }
.rv-btn:hover { background: rgba(255, 255, 255, .08); }
.rv-btn svg { width: 14px; height: 14px; fill: currentColor; flex: none; }
.rv-pp { background: var(--rv-go); color: var(--rv-go-ink); width: 36px; box-shadow: 2px 2px 0 #000; }
.rv-pp:hover { filter: brightness(1.08); }

.rv-btn svg:nth-of-type(2), .is-playing .rv-pp svg:nth-of-type(1), .is-sound .rv-snd svg:nth-of-type(1) { display: none; }
.is-playing .rv-pp svg:nth-of-type(2), .is-sound .rv-snd svg:nth-of-type(2) { display: block; }
.rv-snd span { color: #a9a9a2; }
.rv-time { font: 400 12.5px/1 var(--rv-code); color: #a9a9a2; font-variant-numeric: tabular-nums; white-space: nowrap; min-width: 92px; }
.rv-time b { color: #f4f4f2; font-weight: 500; }
.rv-scrub { position: relative; flex: 1; height: 6px; border-radius: 999px; background: rgba(255, 255, 255, .13); cursor: pointer; transition: height .12s; }
.rv-scrub::before { content: ""; position: absolute; inset: -10px 0; }      
.rv-scrub:hover { height: 8px; }
.rv-fill { position: absolute; left: 0; top: 0; bottom: 0; width: var(--p, 0%); border-radius: inherit; background: #ecebe8; }
.rv-tick { position: absolute; top: -3px; bottom: -3px; width: 3px; margin-left: -1px; left: var(--at, 0%); background: var(--rv-black); }


.rv-a { position: relative; z-index: 2; width: min(1392px, calc(100% - 48px)); margin: 64px auto 0; }
.ed .rv-a-field.ed-panel { position: relative; inset: auto; padding: 60px 88px 64px; overflow: visible; }
.rv-a-field::after, .rv-b-field::after { content: ""; position: absolute; inset: 0; pointer-events: none; --c: rgba(236, 235, 232, .86);
  background:
    linear-gradient(var(--c), var(--c)) 0 0 / 14px 1.5px no-repeat, linear-gradient(var(--c), var(--c)) 0 0 / 1.5px 14px no-repeat,
    linear-gradient(var(--c), var(--c)) 100% 0 / 14px 1.5px no-repeat, linear-gradient(var(--c), var(--c)) 100% 0 / 1.5px 14px no-repeat,
    linear-gradient(var(--c), var(--c)) 0 100% / 14px 1.5px no-repeat, linear-gradient(var(--c), var(--c)) 0 100% / 1.5px 14px no-repeat,
    linear-gradient(var(--c), var(--c)) 100% 100% / 14px 1.5px no-repeat, linear-gradient(var(--c), var(--c)) 100% 100% / 1.5px 14px no-repeat; }
.ed .rv-a-tab { font-size: 18px; padding: 4px 8px 5px; }
.ed .rv-win--a { width: 100%; }

.rv-live, .rv-win--b .tw-bar-r > span { display: inline-block; padding: 0 2px; }
.rv-live { font: 500 16px/1 var(--rv-pixel); color: #a9a9a2; }

.rv-unmute { position: absolute; top: 16px; right: 16px; display: inline-flex; align-items: center; gap: 10px; padding: 8px 12px 9px;
  border: 0; background: rgba(21, 20, 20, .88); color: var(--rv-ink); cursor: pointer; font: 500 18px/1 var(--rv-pixel); -webkit-font-smoothing: none;
  box-shadow: inset 0 0 0 1px rgba(236, 235, 232, .28), 3px 3px 0 #000; }
.rv-unmute svg { width: 16px; height: 14px; fill: currentColor; }
.rv-unmute:hover { background: var(--rv-black); }
.is-sound .rv-unmute { display: none; }

.rv-chaps { display: grid; grid-template-columns: repeat(5, 1fr); margin: 0; padding: 0; list-style: none; background: var(--rv-black); border-top: 1px solid rgba(255, 255, 255, .07); }
.rv-chaps li + li { box-shadow: inset 1px 0 0 rgba(255, 255, 255, .07); }
.rv-chaps button { position: relative; display: flex; align-items: center; gap: 10px; width: 100%; height: 46px; padding: 0 16px; border: 0; background: transparent;
  color: #a9a9a2; font: 450 13.5px/1 var(--rv-geist); text-align: left; cursor: pointer; transition: background .15s, color .15s; }
.rv-chaps button:hover { background: rgba(255, 255, 255, .05); color: #f4f4f2; }
.rv-chaps b { font: 500 11.5px/1 var(--rv-code); color: #77776f; }
.rv-chaps .is-on button { color: #f4f4f2; background: rgba(255, 255, 255, .04); }
.rv-chaps .is-on b { color: #f4f4f2; }
.rv-cfill { position: absolute; left: 0; bottom: 0; height: 2px; width: var(--cp, 0%); background: #ecebe8; }

