:root{--surface:#11161f;--surface-2:#171f2c;--text-secondary:#aeb8c7;--code:#e4ca8f}
:root[data-theme=light]{color-scheme:light;--paper:#f6f7fa;--ink:#171d27;--muted:#505d70;--line:#cbd1dc;--gold:#79520a;--forest:#79520a;--surface:#fff;--surface-2:#edf0f6;--text-secondary:#505d70;--code:#754e04}
html{scroll-padding-block-start:100px}body{background:var(--paper);color:var(--ink)}.theme-control select{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:5px;min-block-size:36px;font-size:11px;max-inline-size:90px;padding:5px;cursor:pointer}.header-actions{gap:12px}.header-inner{gap:20px}
.hero-v2{isolation:isolate;overflow:hidden}.hero-product{transform:none;position:relative;will-change:translate;align-self:center;margin-block-end:60px;inline-size:90%}.hero-step{display:block;inline-size:clamp(125px,12vw,185px);position:absolute;inset-inline-end:-8%;inset-block-start:52%;inset-block-end:auto;padding:12px;box-shadow:0 25px 60px #0008;transform:rotate(3deg);z-index:3}.hero-step img{inline-size:100%;max-block-size:none!important;block-size:auto;object-fit:contain}.hero-step .eyebrow{font-size:8px;margin-block-end:8px}.hero-composition{padding-block-end:100px}.hero-copy{position:relative;z-index:4}.hero-art{will-change:transform}.hero-actions{flex-wrap:wrap}.wago-download{font-size:13px;padding:12px 0;font-weight:600}.hero-foot{position:relative;z-index:4}.download-platforms{display:flex;align-items:center;flex-wrap:wrap;gap:20px;border-block-end:1px solid var(--line);padding-block-end:24px;font-size:12px}.download-platforms>span{inline-size:100%;font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}
.kpi-item strong{letter-spacing:-.025em;word-spacing:.18em;white-space:nowrap;font-size:clamp(30px,3.5vw,46px)}.kpi-item>span{color:var(--ink)}.kpi-item a,.kpi-item small{color:var(--muted)}.metrics-detail{font-size:11px;color:var(--muted);margin-block-start:16px}.metrics-detail summary{cursor:pointer;padding-block:5px}.metrics-detail[open]{position:relative;z-index:2}.metrics-detail p{font-size:10px;margin-block:10px;line-height:1.6}.metrics-detail a{padding-block:4px}.metrics-detail .source-state{display:block;font-size:10px;color:var(--muted)}
.route-controls{grid-template-columns:repeat(4,minmax(0,1fr));background:var(--surface);gap:16px}.route-controls>div:first-child{grid-column:span 2}.route-controls input,.route-controls select{background:var(--paper);color:var(--ink);border-color:var(--line);min-block-size:42px}.route-controls label{color:var(--muted)}.route-tools{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 24px;border-block-end:1px solid var(--line);font-size:11px}.route-tools label{display:flex;gap:8px;align-items:center}.route-tools input{accent-color:var(--gold);inline-size:16px;block-size:16px}.route-tools button{background:none;color:var(--ink);border:1px solid var(--line);padding:7px 12px;border-radius:4px}.route-table-scroll{max-block-size:640px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--muted) var(--paper)}.route-table{border-collapse:separate;border-spacing:0;inline-size:100%;min-inline-size:880px;table-layout:fixed;font-size:11px}.route-table thead{position:sticky;inset-block-start:0;z-index:3}.route-table th,.route-table td{padding:15px 16px;text-align:start;border-block-end:1px solid var(--line);color:var(--text-secondary);vertical-align:top}.route-table thead th{background:var(--surface-2);font-weight:500}.route-table th:first-child{inline-size:41%}.route-table th:nth-child(2){inline-size:13%}.route-table th:nth-child(3){inline-size:12%}.route-table th:nth-child(4){inline-size:12%}.route-table th:nth-child(5){inline-size:10%}.route-table th:last-child{inline-size:12%}.route-table thead button{display:flex;gap:8px;justify-content:space-between;border:0;background:none;color:var(--ink);font:inherit;inline-size:100%;padding:3px 0;min-block-size:24px}.route-table th[aria-sort]:not([aria-sort=none]){color:var(--gold)}.route-table td:first-child{color:var(--ink);font-size:12px;font-weight:500}.route-table tr:hover td{background:var(--surface-2)}.route-table summary{cursor:pointer;list-style:none;line-height:1.65}.route-table summary::before{content:'+';color:var(--gold);display:inline-block;inline-size:20px}.route-table details[open]>summary::before{content:'−'}.route-detail{padding-block:16px;font-size:10px;font-weight:400;overflow-wrap:anywhere}.route-detail pre{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--paper);color:var(--muted);font-size:10px;line-height:1.7;padding:12px}.route-detail>a{display:inline-block;margin-block-start:8px;color:var(--gold)}.route-group th{background:var(--surface);color:var(--ink);font-size:13px;letter-spacing:-.02em;padding-block:20px}.route-group span{font-size:10px;color:var(--muted);margin-inline-start:12px}.route-browser,.route-browser-top,.route-browser-footer{background:var(--surface);border-color:var(--line)}.catalog-note{padding:16px 24px;color:var(--muted);font-size:11px}.route-tools[hidden],.route-controls[hidden]{display:none}.route-table-scroll #route-empty{padding:30px}
.theme-gallery{padding:25px;min-inline-size:0;background:var(--surface)}.addon-theme-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 18px}.addon-theme h4{font-size:11px;font-weight:500;margin:9px 0 0;color:var(--ink)}.addon-preview{padding:12px;background:var(--preview-background);color:var(--preview-text);border:1px solid var(--preview-border);border-radius:5px;font:9px/1.5 Arial,sans-serif;box-shadow:0 8px 20px #0002}.addon-preview>div:first-child{display:flex;align-items:center;gap:6px;color:var(--preview-accent);font-size:9px;font-weight:bold}.addon-preview img{inline-size:18px;block-size:18px}.preview-progress{position:relative;background:var(--preview-panel);border:1px solid var(--preview-border);margin-block:12px 8px;block-size:13px;text-align:center;line-height:11px}.preview-progress::before{content:'';position:absolute;inset-inline-start:0;inset-block:0;inline-size:78%;background:var(--preview-accent);opacity:.45}.preview-progress span{position:relative}.addon-preview>p{margin-block:8px 12px}.preview-button{display:block;background:var(--preview-panel);color:var(--preview-accent);text-align:center;border:1px solid var(--preview-border);padding:4px;border-radius:3px}.theme-gallery>p,.theme-integrations p{color:var(--muted);font-size:11px;line-height:1.8;margin-block:20px}.theme-integrations{padding-block-start:20px;border-block-start:1px solid var(--line);display:flex;flex-wrap:wrap;gap:12px}.theme-integrations strong{font-size:12px;padding:6px 12px;border:1px solid var(--line);border-radius:4px}.theme-integrations p{inline-size:100%;margin:0}.intro-paths{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-block:30px}.intro-paths>a{display:block;padding:28px;border:1px solid var(--line);background:var(--surface);text-decoration:none}.intro-paths h2{font-size:22px;margin-block:18px}.intro-paths p{font-size:13px;color:var(--muted)}.intro-paths>a>span{font:12px monospace;color:var(--gold)}.docs-overview[aria-current=page]{background:var(--surface-2);color:var(--gold);border-radius:5px}.docs-source-state{font-size:10px;color:var(--muted);margin-block:14px}
/* A complete light palette, including documentation, controls and dialogs. */
[data-theme=light] .site-header{background:#f6f7faf5;border-color:var(--line)}
[data-theme=light] :is(.locale-menu,.mobile-links,.tour-panel,.tour-description,.tour-visual,.wiki-v2,.command,.quick-result,.guide-card,.code-example,.syntax-note,.syntax-card,.syntax-content table,.syntax-essentials a,.syntax-related a,.source-warning,dialog,.search-form input,.docs-menu input,.syntax-search input){background:var(--surface);color:var(--ink);border-color:var(--line)}
[data-theme=light] :is(.locale-menu a:hover,.locale-menu a[aria-current=true],.quick-result:hover,.docs-menu>summary,.syntax-group a:hover,.syntax-group a[aria-current=page],.code-example>div,.syntax-content th,.code-example button){background:var(--surface-2);color:var(--ink);border-color:var(--line)}
[data-theme=light] :is(.hero-lead,.hero-meta,.hero-foot,.chapter-heading>p,.tour-description p,.capture-note,.install-steps p,.wiki-v2 p,.community-v2>p,.footer-top p,.footer-bottom,.syntax-lead,.syntax-meta,.syntax-properties dt,.language-note,.docs-toc a,.docs-toc p,.syntax-results,.syntax-essentials>p,.syntax-card p,.code-note,.syntax-note>div,.syntax-source,.article-body p,.article-body li,.article-meta,.breadcrumbs,.syntax-group a,.syntax-category h2 span,.code-example>div,.syntax-content th,.syntax-content td,.quick-status){color:var(--muted)}
[data-theme=light] :is(.syntax-card code,.syntax-content th code,.article-body code,.command code){color:var(--code)}
[data-theme=light] :is(.code-example pre,.syntax-note pre,.article-body pre){background:#eef1f6;color:#223047;border-color:var(--line)}
[data-theme=light] .lua-string{color:#765005}[data-theme=light] .lua-value{color:#593bad}[data-theme=light] .lua-comment{color:#536174}
[data-theme=light] .hero-art{opacity:.27;background-image:linear-gradient(90deg,#f6f7fa 8%,#f6f7fa20 65%),linear-gradient(0deg,#f6f7fa,transparent 55%),url('/assets/midnight.webp')}
[data-theme=light] .hero-v2::after{background:linear-gradient(0deg,#f6f7fa,transparent)}
[data-theme=light] .button{background:#e9bf65;color:#211b10;border-color:#b99a5c}[data-theme=light] .button:hover{background:#f0cc80}[data-theme=light] .button.outline{background:transparent;color:var(--ink);border-color:var(--line)}[data-theme=light] .button.outline:hover{background:var(--surface-2)}
[data-theme=light] :is(.hero-product,.hero-step){color:#f2f2ec;background:#141821;border-color:#3b404b}[data-theme=light] .hero-step .eyebrow{color:#e9bf65}[data-theme=light] .product-label{color:#f2f2ec;background:#141821}[data-theme=light] .product-chip{color:#e9bf65}
[data-theme=light] .tour-tabs button{color:var(--muted)}[data-theme=light] .tour-tabs button[aria-selected=true]{color:var(--ink)}[data-theme=light] .pane-toolbar{background:#eff1f5;color:var(--ink);border-color:var(--line)}[data-theme=light] .large-step{color:#697587}[data-theme=light] .quick-trigger{color:var(--ink);border-color:var(--line)}[data-theme=light] .search-form input{color:var(--ink)}[data-theme=light] .site-footer{background:var(--paper)}[data-theme=light] .toast{background:var(--ink);color:var(--paper)}[data-theme=light] .play-link>span{border-color:var(--muted)}
@media(max-width:1100px){.header-actions>.button{display:none}.hero-product{inline-size:92%}.hero-step{inline-size:140px}.route-controls{grid-template-columns:repeat(3,minmax(0,1fr))}.route-controls>div:first-child{grid-column:span 2}}
@media(max-width:800px){.hero-composition{padding-block-end:95px}.hero-product{inline-size:88%;margin-inline:0 auto;margin-block-end:40px}.hero-step{inline-size:30%;min-inline-size:100px;inset-block-start:40%;inset-inline-end:-11%}.theme-control select{font-size:10px;max-inline-size:75px}.header-inner{gap:12px}.header-actions{gap:8px}.route-controls{grid-template-columns:repeat(2,minmax(0,1fr))}.tour-description{min-block-size:0}.hero-art{background-position:center}.kpi-item strong{font-size:32px}.theme-gallery{padding:20px}}
@media(max-width:550px){.theme-control select{inline-size:65px;font-size:9px}.header-inner .brand span{display:none}.header-actions{margin-inline-start:auto}.hero-product{margin-block-end:20px}.hero-composition{padding-block-end:70px}.hero-step{padding:8px}.hero-step .eyebrow{font-size:6px}.route-controls{padding:16px;gap:12px}.route-tools{padding:12px 16px}.route-table-scroll{max-block-size:520px}.kpi-item strong{font-size:42px}.theme-gallery{padding:15px}.addon-theme-grid{gap:18px 12px}.addon-preview{padding:8px;font-size:8px}.addon-preview>div:first-child{font-size:8px}.intro-paths{grid-template-columns:1fr}.hero-actions .wago-download{font-size:12px}.theme-control select:focus-visible{outline:3px solid var(--gold);outline-offset:3px}}
@media(prefers-reduced-motion:reduce){.hero-art,.hero-product,.hero-step{will-change:auto;transform:none!important;translate:none!important}}
[data-theme=light] .hero-v2{background:var(--paper)}
[data-theme=light] .routes-v2{background:var(--paper)}
[data-theme=light] :is(.quick-trigger kbd,.hero-copy>.eyebrow,.tour-index,.pane-toolbar span:last-child,.route-count,.route-browser-footer p,.site-footer a){color:var(--muted)}
[data-theme=light] :is(.route-browser-footer a,.teaser-links code){color:var(--code)}
[data-theme=light] .article-body .command code{background:transparent;color:var(--code)}
[data-theme=light] .skip{background:#171d27;color:#fff}
[data-theme=light] .hero-art{opacity:.42;background-size:cover;background-position:center}
[data-theme=light] :is(.desktop-nav>a,.locale summary,.mobile-nav summary,.art-credit){color:var(--muted)}



.addon-theme-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}.addon-preview{font-size:10px;padding:16px}.addon-preview>div:first-child{font-size:10px}.addon-theme h4{font-size:12px}.syntax-group>summary{justify-content:flex-start}
@media(max-width:950px){.addon-theme-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:550px){.addon-theme-grid{gap:18px 12px}.addon-preview{padding:10px;font-size:8px}.addon-preview>div:first-child{font-size:8px}.addon-theme h4{font-size:10px}}
/* Shared integrations and route faction labels. */
.theme-integrations{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.integration-card{display:grid;grid-template-columns:48px minmax(0,1fr) 12px;align-items:center;gap:12px;min-inline-size:0;padding:16px 12px;border:1px solid var(--line);border-radius:6px;text-decoration:none;background:var(--paper);transition:border-color .2s,background .2s}
.integration-card:hover{border-color:var(--gold);background:var(--surface-2)}
.integration-logo{display:grid;place-items:center;inline-size:48px;block-size:48px;background:#11161f;border-radius:6px;padding:4px}.integration-logo img{inline-size:40px;block-size:40px;object-fit:contain}
.theme-integrations .integration-card strong{display:block;border:0;padding:0;border-radius:0;font-size:12px;line-height:1.4;color:var(--ink);overflow-wrap:anywhere}
.integration-card small{display:block;color:var(--muted);font-size:10px;line-height:1.5;margin-block-start:4px}.integration-arrow{color:var(--muted);font-size:14px}
.route-table th:first-child{inline-size:37%}.route-table th:nth-child(4){inline-size:16%}
.faction-chips{display:flex;flex-wrap:wrap;gap:6px}.faction-chip{display:inline-flex;align-items:center;border:1px solid;border-radius:20px;padding:3px 8px;font-size:10px;font-weight:600;line-height:1.5;white-space:nowrap}
.faction-alliance{color:#a7d4ff;background:#162b43;border-color:#365f85}.faction-horde{color:#ffb3ae;background:#3a2025;border-color:#864047}.faction-neutral{color:#e0d3a7;background:#302c20;border-color:#726745}
[data-theme=light] .faction-alliance{color:#185186;background:#e6f1ff;border-color:#91b6db}[data-theme=light] .faction-horde{color:#912d35;background:#ffebeb;border-color:#d5a2a6}[data-theme=light] .faction-neutral{color:#62501b;background:#f3eedc;border-color:#bdae79}
/* Header controls share one size and keep their accessible names. */
.header-inner{gap:24px}.header-inner>.quick-trigger{display:flex;align-items:center;gap:8px;flex-shrink:0;min-block-size:40px;padding:8px 10px;color:var(--muted);font-size:12px}.header-inner>.quick-trigger[hidden]{display:none}.quick-trigger .ui-icon{inline-size:17px;block-size:17px}.desktop-nav{margin-inline:auto 0;gap:24px}.header-actions{gap:8px}.ui-icon{flex:none;vertical-align:middle}
.theme-control{position:relative}.theme-control summary,.header-actions .locale summary{display:flex;align-items:center;justify-content:center;inline-size:40px;block-size:40px;min-block-size:40px;list-style:none;padding:8px;border:1px solid transparent;border-radius:5px;color:var(--muted);cursor:pointer}.theme-control summary::-webkit-details-marker{display:none}.theme-control summary:hover,.header-actions .locale summary:hover{background:var(--surface-2);color:var(--ink)}
.theme-control summary>.ui-icon{display:none}.theme-control[data-mode=system] .icon-system,.theme-control[data-mode=light] .icon-light,.theme-control[data-mode=dark] .icon-dark{display:block}
.theme-menu{position:absolute;inset-inline-end:0;inset-block-start:calc(100% + 8px);inline-size:190px;z-index:25;padding:6px;background:var(--surface);border:1px solid var(--line);border-radius:6px;box-shadow:0 12px 32px #0003}.theme-menu button{display:flex;align-items:center;gap:12px;inline-size:100%;padding:10px;border:0;border-radius:4px;background:none;color:var(--ink);font:12px inherit;text-align:start;min-block-size:44px}.theme-menu button:hover,.theme-menu button[aria-pressed=true]{background:var(--surface-2)}.theme-check{margin-inline-start:auto;visibility:hidden}.theme-menu button[aria-pressed=true] .theme-check{visibility:visible}.header-actions .get-apr{gap:12px;margin-inline-start:8px}.get-apr .ui-icon{inline-size:16px;block-size:16px}
.hero-copy>.wago-download{display:inline-flex;align-items:center;margin-block-start:8px;padding:4px 0;font-size:12px;min-block-size:28px}.hero-copy>.hero-meta{margin-block-start:18px}
@media(max-width:1200px){.header-inner{gap:16px}.header-inner .search-label{display:none}.desktop-nav{gap:18px}.theme-integrations{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:800px){.header-inner{gap:12px}.header-inner>.quick-trigger{margin-inline-end:auto}.header-actions{margin-inline-start:0}.quick-trigger kbd{display:none}.theme-control summary,.header-actions .locale summary{inline-size:40px;block-size:40px}.header-inner .brand span{display:none}}
@media(max-width:550px){.header-inner{gap:8px}.theme-integrations{grid-template-columns:1fr}.integration-card{padding:12px 16px}.header-inner>.quick-trigger{padding:8px}.header-actions{gap:2px}}
.header-inner .quick-trigger .search-label{font-size:12px;line-height:1.4}.theme-menu button{font-family:inherit;font-size:12px}
[data-theme=light] .syntax-group>summary>span{color:var(--muted)}
.header-inner>.quick-trigger{border:0;background:transparent;padding-inline:0;gap:9px}.header-inner>.quick-trigger:hover{color:var(--ink)}.header-inner>.quick-trigger kbd{border:1px solid var(--line);border-radius:3px;padding:2px 5px;font-size:10px;line-height:1.4;background:var(--surface)}
@media(min-width:801px){.header-inner .quick-trigger .search-label{display:inline}}

/* Light mode uses sunlit Midnight scenery, with a readable text-side fade. */
[data-theme=light] .hero-art{opacity:1;background-image:linear-gradient(90deg,#f6f7fafc 0%,#f6f7faef 28%,#f6f7fa80 52%,#f6f7fa10 100%),linear-gradient(0deg,#f6f7fa 0%,#f6f7fa00 42%),url('/assets/midnight-light.webp');background-size:cover;background-position:center;background-repeat:no-repeat}
.hero-copy>.hero-actions{margin-block-end:0}.hero-copy>.wago-download{margin-block-start:4px;padding-block:0;min-block-size:28px}
/* Intrinsic sizing follows translated text; metadata never wraps or clips. */
.route-table{table-layout:auto;min-inline-size:100%;inline-size:100%}
.route-table thead th:first-child{inline-size:auto;min-inline-size:22rem}
.route-table td:first-child{min-inline-size:22rem}
.route-table thead th:not(:first-child){inline-size:1%;white-space:nowrap;text-align:center}
.route-table td:not(:first-child){white-space:nowrap;text-align:center;vertical-align:middle}
.route-table thead th:not(:first-child)>button{white-space:nowrap;justify-content:center;gap:12px}
.route-table .faction-chips{justify-content:center;flex-wrap:nowrap}
.route-table .route-group th{inline-size:auto;text-align:start}
@media(max-width:800px){[data-theme=light] .hero-art{background-image:linear-gradient(180deg,#f6f7faeb 0%,#f6f7fad9 36%,#f6f7fa22 70%,#f6f7fa 100%),url('/assets/midnight-light.webp');background-position:center,60% center}.route-table thead th:first-child,.route-table td:first-child{min-inline-size:19rem}}
/* The site frame follows the theme; the authentic addon captures stay untouched. */
[data-theme=light] :is(.hero-product,.hero-step){background:#fffdf8;color:#252a32;border-color:#c9c2b2;box-shadow:0 24px 60px #3f34252b}
[data-theme=light] .product-label{background:#fffdf8;color:#252a32;border-color:#ddd6c7}
[data-theme=light] :is(.product-chip,.hero-step .eyebrow){color:#795913}
[data-theme=light] .hero-window{background:#fffdf8;border-color:#c9c2b2}
.route-table td{vertical-align:top}.route-table td:not(:first-child){vertical-align:top;padding-block-start:22px}
.route-info{padding:18px 0 4px;max-inline-size:40rem;white-space:normal;overflow-wrap:anywhere;color:var(--ink)}
.route-info-section{padding:15px;border:1px solid var(--line);border-radius:6px;background:var(--surface);margin-block-end:10px}
.route-info-section h4{margin:0 0 12px;font-size:12px;color:var(--ink);font-weight:650}.route-info-section p{font-size:12px;line-height:1.65;margin:0;color:var(--muted)}
.route-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 20px;margin:0}.route-facts dt{font-size:10px;color:var(--muted);margin:0 0 4px}.route-facts dd{margin:0;font-size:12px;line-height:1.6;color:var(--ink)}
.route-fact:only-child{grid-column:1/-1}.route-alternatives{grid-column:1/-1}.route-alternatives ul{padding-inline-start:18px;margin:10px 0 0}.route-alternatives li+li{margin-block-start:16px;padding-block-start:12px;border-block-start:1px solid var(--line)}
.route-connections{padding:0;list-style:none;margin:12px 0 0}.route-connections li+li{border-block-start:1px solid var(--line);margin-block-start:10px;padding-block-start:10px}.route-connections a{display:flex;gap:10px;justify-content:space-between;line-height:1.6}.route-connections .route-facts{margin-block-start:10px}.route-source-link{display:inline-flex;font-size:11px;margin-block-start:8px}
.recorder-page{padding-block-end:90px}.recorder-hero{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,1fr);gap:80px;align-items:center;padding-block:70px 90px}.recorder-back{font-size:12px;color:var(--muted);display:inline-block;margin-block-end:44px}.recorder-hero h1{font-size:clamp(38px,4.8vw,68px);line-height:1.07;letter-spacing:-.045em;margin:18px 0 24px;max-inline-size:14ch}.recorder-lead{font-size:17px;line-height:1.8;color:var(--muted);max-inline-size:54ch}.recorder-actions{display:flex;flex-wrap:wrap;gap:24px;align-items:center;margin-block:30px 16px}.recorder-actions .button{gap:20px}.recorder-requirement{max-inline-size:58ch;font-size:12px;line-height:1.8;color:var(--muted)}
.recorder-flow{border:1px solid var(--line);background:var(--surface);border-radius:12px;padding:28px;box-shadow:0 28px 70px #0002}.recorder-flow-label{display:flex;align-items:center;gap:12px;font-size:13px;padding-block-end:24px;border-block-end:1px solid var(--line)}.recorder-flow ol{list-style:none;padding:12px 0;margin:0}.recorder-flow li{display:flex;gap:20px;align-items:center;position:relative;padding-block:24px}.recorder-flow li+li:before{content:'';position:absolute;block-size:24px;inline-size:1px;background:var(--line);inset-inline-start:23px;inset-block-start:-12px}.recorder-node{display:grid;place-items:center;inline-size:48px;block-size:48px;flex-shrink:0;border:1px solid var(--gold);border-radius:50%;color:var(--gold);font-family:monospace;font-size:15px}.recorder-flow li strong{display:block;font-size:17px;margin-block-end:6px}.recorder-flow li div>span{font-size:9px;letter-spacing:.15em;color:var(--muted)}.recorder-flow-command{border-block-start:1px solid var(--line);padding-block-start:20px;display:flex;justify-content:space-between;color:var(--gold)}
.recorder-page h2{font-size:clamp(26px,3vw,40px);letter-spacing:-.03em;line-height:1.2;margin:15px 0 36px}.recorder-start,.recorder-tools,.recorder-commands{border-block-start:1px solid var(--line);padding-block:56px}.recorder-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:30px;list-style:none;padding:0;margin:0}.recorder-steps>li>span{color:var(--gold);font-size:12px;font-family:monospace}.recorder-page h3{font-size:19px;margin:18px 0 12px;letter-spacing:-.025em;line-height:1.4}.recorder-steps p,.recorder-features p,.recorder-finish p{font-size:14px;line-height:1.85;color:var(--muted);margin:0}.recorder-steps .command{margin-block-start:20px;inline-size:max-content;max-inline-size:100%}.recorder-features{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 64px}.recorder-features article{padding:30px 0;border-block-start:1px solid var(--line)}.recorder-feature-number{font-size:12px;color:var(--gold)}.recorder-features h3{margin-block-start:12px}.recorder-commands>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}.recorder-commands h3{font-size:14px}.recorder-commands .command{justify-content:space-between;max-inline-size:100%}.recorder-finish{display:grid;grid-template-columns:1.6fr 1fr;gap:64px;border:1px solid var(--line);padding:36px;background:var(--surface);border-radius:8px}.recorder-finish h2{font-size:26px;margin:0 0 18px}.recorder-finish nav{display:flex;flex-direction:column;justify-content:center;align-items:start;gap:24px}
@media(max-width:1100px){.desktop-nav{gap:16px}.recorder-hero{gap:40px}.recorder-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 40px}}
@media(max-width:800px){.recorder-hero{grid-template-columns:1fr;gap:36px;padding-block:36px 50px}.recorder-back{margin-block-end:30px}.recorder-hero h1{max-inline-size:18ch}.recorder-flow{max-inline-size:500px;inline-size:100%;padding:22px}.recorder-features{gap:0 30px}.recorder-commands>div{grid-template-columns:1fr}.recorder-finish{grid-template-columns:1fr;gap:30px}.recorder-start,.recorder-tools,.recorder-commands{padding-block:40px}}
@media(max-width:500px){.recorder-steps,.recorder-features{grid-template-columns:1fr}.recorder-steps{gap:30px}.recorder-finish{padding:24px}.recorder-hero h1{font-size:42px}.recorder-lead{font-size:15px}.route-facts{grid-template-columns:1fr}}
.recorder-review{border:1px solid var(--line);border-inline-start:3px solid var(--gold);padding:32px;background:var(--surface);border-radius:6px;margin-block-end:52px}.recorder-review h2{margin-block-start:0;font-size:28px}.recorder-review>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 48px}.recorder-review h3{font-size:16px;margin-block-start:0}.recorder-review p{font-size:13px;line-height:1.8;color:var(--muted);margin:0}.recorder-review .text-link{font-size:12px;margin-block-start:12px;display:inline-flex}.recorder-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 56px}
@media(max-width:600px){.recorder-review{padding:24px}.recorder-review>div,.recorder-steps{grid-template-columns:1fr}}

/* Shared corner sizes keep controls, cards and media consistent in both themes. */
:root{--radius-control:10px;--radius-card:16px;--radius-panel:22px}
.button,.button.gold,.command,.route-controls input,.route-controls select,.route-tools button,
.theme-control summary,.header-actions .locale summary,.search-form input,.syntax-search input,
.docs-menu input,.code-example button{border-radius:var(--radius-control)}
.tour-panels,.route-browser,.wiki-v2,.recorder-flow,.recorder-review,.recorder-finish,
#image-dialog,#quick-search{border-radius:var(--radius-panel)}
.tour-panel,.route-browser{overflow:hidden}
.hero-product,.hero-step,.hero-window,.screenshot-button,
.integration-card,.intro-paths>a,.guide-card,.syntax-card,.code-example,.syntax-note,
.route-info-section,.locale-menu,.theme-menu,.mobile-links{border-radius:var(--radius-card)}
.theme-menu button,.locale-menu a,.quick-result,.syntax-essentials a,.syntax-related a{border-radius:8px}
.tour-tabs{gap:8px;border:0;margin-block-end:14px}
.tour-tabs button{padding:14px 16px;border:1px solid transparent;border-radius:var(--radius-control);min-inline-size:0}
.tour-tabs button[aria-selected=true]{background:var(--surface-2);border-color:var(--line);color:var(--ink)}
.tour-tabs button:focus-visible{outline:2px solid var(--gold);outline-offset:-4px}
.tour-tabs button:hover{background:var(--surface-2)}
.tour-panels{border:1px solid var(--line);background:var(--surface)}
.tour-panel,.tour-visual{border-radius:0}
.tour-visual,.tour-visual.step{align-self:stretch}
@media(max-width:550px){.tour-tabs{gap:6px}.tour-tabs button{padding:12px 10px;gap:6px}}
.hero-window .screenshot-button{border-radius:0 0 var(--radius-card) var(--radius-card)}
.theme-gallery{padding:28px}
.capture-button{display:block;position:relative;inline-size:100%;padding:0;border:1px solid var(--line);border-radius:var(--radius-card);background:var(--paper);color:var(--ink);cursor:zoom-in;overflow:hidden;text-align:start}
.capture-button img{display:block;inline-size:100%;block-size:auto;object-fit:contain}
.capture-enlarge{display:flex;align-items:center;justify-content:flex-end;gap:12px;padding:12px 18px;border-block-start:1px solid var(--line);font:500 12px/1.5 var(--sans);background:var(--surface);color:var(--muted)}
.capture-button:hover{border-color:var(--gold)}
.capture-button:hover .capture-enlarge{color:var(--gold)}
.customization-visual{max-inline-size:1080px;margin-inline:auto}
.customization-visual .customization-capture{display:block;inline-size:100%;padding:0;background:transparent;border:1px solid #66573966;border-block-start:0;border-radius:0 0 3px 3px;box-shadow:0 20px 40px #0005;overflow:hidden;cursor:zoom-in}
.customization-capture img{display:block;inline-size:100%;block-size:auto;object-fit:contain}
.theme-gallery>p{max-inline-size:80ch;margin-block:20px 28px}
.recorder-features{gap:24px;align-items:start}
.recorder-features .recorder-tool{padding:0;border:1px solid var(--line);border-radius:var(--radius-panel);background:var(--surface);min-inline-size:0;overflow:hidden}
.recorder-tool-copy{padding:28px}
.recorder-features .recorder-tool h3{margin-block:12px}
.recorder-tool .capture-button{border-inline:0;border-block-end:0;border-radius:0;background:var(--surface)}
.recorder-tool-visual{grid-column:1/-1;display:grid;grid-template-columns:minmax(240px,.7fr) minmax(0,1.7fr);align-items:center}
.recorder-tool-visual .capture-button{border-block-start:0;border-inline-start:1px solid var(--line)}
.recorder-tools .recorder-tool p{max-inline-size:65ch}
#image-dialog{padding:18px;max-inline-size:min(96vw,1600px)}
#image-dialog>img{display:block;max-inline-size:100%;max-block-size:calc(90dvh - 90px);inline-size:auto;block-size:auto;object-fit:contain;margin-inline:auto;border-radius:10px}
.dialog-top button{border-radius:var(--radius-control)}
@media(max-width:800px){.recorder-tool-visual{grid-template-columns:1fr}.recorder-tool-visual .capture-button{border-inline-start:0;border-block-start:1px solid var(--line)}.recorder-features{grid-template-columns:1fr}.recorder-tool-copy{padding:24px}.theme-gallery{padding:18px}}
@media(max-width:500px){:root{--radius-panel:16px;--radius-card:12px}.theme-gallery{padding:12px}.recorder-tool-copy{padding:20px}#image-dialog{padding:12px}.capture-enlarge{padding:10px 14px}}

/* Integration links sit below the shared image-and-description layout. */
#panel-appearance>.theme-gallery{grid-column:1/-1;border-block-start:1px solid var(--line)}
#panel-appearance>.theme-gallery>p{margin-block:0 20px}

/* Lead with APR's free routes before the commercial guide comparison. */
.comparison-offer{display:grid;grid-template-columns:auto minmax(0,1fr);gap:28px;align-items:start;padding:28px;margin-block:28px;border:1px solid var(--gold);border-radius:var(--radius-panel);background:var(--surface)}
.comparison-offer .comparison-price{font-size:48px;line-height:1.1;font-weight:700;letter-spacing:-.06em;color:var(--gold);white-space:nowrap}
.comparison-offer h2{font-size:24px;margin-block:0 16px}.comparison-offer ul{padding-inline-start:20px;margin-block:0 22px;font-size:14px;line-height:1.8;color:var(--muted)}
.comparison-download{display:inline-flex;align-items:center;gap:10px;padding:12px 18px;border-radius:var(--radius-control);background:var(--gold);color:var(--paper)!important;font-size:13px;font-weight:700;text-decoration:none}
.comparison-download:focus-visible{outline:3px solid var(--ink);outline-offset:4px}.comparison-table .comparison-apr>*{background:var(--surface-2);color:var(--ink)}.comparison-table .comparison-apr th{border-inline-start:3px solid var(--gold)}
@media(max-width:550px){.comparison-offer{grid-template-columns:1fr;gap:16px;padding:22px}.comparison-offer .comparison-price{font-size:42px}}