:root{--ink:#192b39;--muted:#64717d;--accent:#5842c3;--border:#dfe3e8;--soft:#f4f2fc;--paper:#fff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f7f8fa;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:14px;line-height:1.5}button,input,textarea,select{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:wait;opacity:.48}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #9a87ee;outline-offset:4px}.skip{position:absolute;top:-60px;left:16px;z-index:10;background:white;padding:12px}.skip:focus{top:8px}.topbar{max-width:1280px;margin:auto;min-height:96px;display:flex;align-items:center;justify-content:space-between;padding:0 40px;border-bottom:1px solid var(--border)}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;font-size:29px;font-weight:750;letter-spacing:-1px}.brand svg{width:29px;height:29px;color:var(--accent)}.brand span{font-size:13px;font-weight:400;letter-spacing:0;color:var(--muted);margin-left:16px;padding-left:22px;border-left:1px solid var(--border)}.quiet-link{text-decoration:none;font-size:13px}.quiet-link span{margin-left:12px;color:var(--accent)}main{max-width:1200px;margin:auto;padding:0 0 50px}.intro{display:flex;align-items:center;justify-content:space-between;padding:40px 0 30px}h1{font-size:36px;line-height:1.2;letter-spacing:-1.2px;margin:0 0 10px;font-weight:720}.intro p,.examples p{margin:0;color:var(--muted)}.local-note{display:flex;gap:8px;align-items:center;font-size:12px}.local-note i{width:7px;height:7px;border-radius:50%;background:#36836e}.workspace{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(0,1fr);gap:24px;align-items:start}#qr-form{background:white;border:1px solid var(--border);border-radius:12px;overflow:hidden}#qr-form section{padding:24px 28px;border-bottom:1px solid var(--border)}#qr-form .last-section{border-bottom:0}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.section-heading>span{font-size:11px;color:var(--muted)}h2{font-size:18px;letter-spacing:-.4px;margin:0;font-weight:650}label[for=data]{display:block;font-size:13px;margin-bottom:8px}textarea{width:100%;resize:vertical;min-height:74px;border:1px solid #cbd2db;border-radius:6px;padding:12px;color:var(--ink);background:#fff}textarea:focus{border-color:var(--accent)}.hint{font-size:11px;color:var(--muted);margin:9px 0 0;line-height:1.65}.text-button{padding:0;border:0;background:none;font-size:12px;color:var(--accent)}fieldset{min-width:0;margin:0;padding:0;border:0}legend{font-size:13px;font-weight:600;padding:0;margin-bottom:12px}legend span{display:inline-block;font-size:10px;font-weight:400;color:var(--muted);margin-left:8px}.style-options{display:flex;gap:8px}.choice{position:relative;cursor:pointer;display:flex;flex:1;align-items:center;justify-content:center;flex-direction:column;gap:6px;border:1px solid var(--border);border-radius:6px;padding:10px 5px;min-width:0;color:#465664;background:#fff}.choice input{position:absolute;width:1px;height:1px;opacity:0}.choice:has(input:checked){border-color:var(--accent);background:var(--soft);color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.choice:has(input:focus-visible){outline:3px solid #9a87ee;outline-offset:3px}.choice:has(input:disabled){opacity:.5;cursor:default}.choice svg{width:34px;height:34px}.choice span{font-size:10px;white-space:nowrap}.eye-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:24px}.eye-grid legend span{display:block;margin-left:0;margin-top:2px}.color-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:24px}.color-field{display:flex;gap:9px;align-items:center;font-size:11px}.color-field small{display:block;font-size:9px;color:var(--muted)}input[type=color]{width:34px;height:34px;border:1px solid #d1d6de;border-radius:5px;padding:3px;background:white;cursor:pointer}input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:0;border-radius:2px}.logo-options,.level-options{display:flex;gap:8px}.logo-choice b{font-size:24px;line-height:1.2;font-weight:500}.logo-choice{padding:8px}.upload-box{padding:15px;border:1px dashed #cbd2dc;border-radius:6px;margin-top:14px;background:#fafbfd}.upload-box label{cursor:pointer;display:block;font-size:12px}.upload-box label strong{color:var(--accent);font-weight:600}.upload-box label span{color:var(--muted);margin-left:5px}.upload-box input{font-size:11px;max-width:100%;margin-top:10px}.upload-box.dragover{border-color:var(--accent);background:var(--soft)}.level-choice{flex-direction:row;gap:14px;padding:10px}.level-choice strong{font-size:17px}.preview-panel{position:sticky;top:24px;background:white;border:1px solid var(--border);border-radius:12px;overflow:hidden}.preview-top{display:flex;justify-content:space-between;align-items:center;padding:22px 24px}.preview-top>span{color:var(--muted);font-size:11px}.preview-stage{background-color:#efedf8;background-image:radial-gradient(#c8c1e4 .8px,transparent .8px);background-size:16px 16px;padding:36px;display:flex;justify-content:center}.preview-paper{width:100%;max-width:320px;aspect-ratio:1;background:white;box-shadow:0 8px 22px #35264f14;display:grid;place-items:center}.preview-paper img{width:100%;height:100%;object-fit:contain}#placeholder{font-size:12px;color:var(--muted)}.preview-details{display:flex;justify-content:space-between;gap:10px;font-size:10px;color:var(--muted);padding:14px 24px;border-bottom:1px solid var(--border)}.export-controls{padding:20px 24px}.export-controls>label{display:block;font-size:12px;font-weight:600;margin-bottom:7px}select{width:100%;padding:10px 12px;border:1px solid #cbd2db;border-radius:6px;background:white;color:var(--ink)}.download-buttons{display:flex;gap:10px;margin-top:14px}.download-buttons button{padding:13px;border-radius:6px;font-size:13px;font-weight:600}.primary{flex:1;background:var(--accent);color:white;border:1px solid var(--accent)}.secondary{width:110px;background:white;color:var(--accent);border:1px solid #c8c0e8}.primary:hover{background:#4934ac}.secondary:hover{background:var(--soft)}.scan-note{display:flex;gap:14px;align-items:start;background:#f5f7fa;margin:0 24px;padding:14px;border-radius:6px}.scan-note>span{font-size:26px;line-height:1;color:var(--accent)}.scan-note p{margin:0;font-size:11px;color:var(--muted);line-height:1.7}.scan-note strong{display:block;font-size:12px;color:var(--ink);margin-bottom:3px}.privacy-note{margin:16px 24px 24px;font-size:10px;color:var(--muted);line-height:1.7}.error{margin:16px 24px 0;border-left:3px solid #bc3943;padding:10px 12px;background:#fff0f0;color:#932c36;font-size:12px}.examples{margin-top:44px}.examples h2{font-size:23px;margin-bottom:6px}.examples p{font-size:13px}.preset-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px}.preset{display:flex;align-items:center;gap:16px;padding:15px;text-align:left;border:1px solid var(--border);border-radius:8px;background:white;color:var(--ink)}.preset:hover{border-color:var(--accent)}.preset img{width:72px;height:72px}.preset strong{display:block;font-size:15px}.preset small{color:var(--muted);font-size:11px}.preset b{margin-left:auto;font-size:20px;color:var(--accent);font-weight:400}footer{max-width:1200px;margin:auto;padding:22px 0 30px;border-top:1px solid var(--border);display:flex;justify-content:space-between;color:var(--muted);font-size:11px}[hidden]{display:none!important}@media(min-width:1600px){main{padding-top:16px}}@media(max-width:1280px){main,footer{margin-left:32px;margin-right:32px}.topbar{padding:0 32px}.workspace{grid-template-columns:1.15fr 1fr}.preview-stage{padding:28px}}@media(max-width:960px){.eye-grid{gap:14px}.workspace{gap:16px}#qr-form section{padding:22px 20px}.preview-top{padding:20px 18px}.preview-top h2{font-size:16px}.preview-stage{padding:22px}.color-grid{gap:6px}.color-field{gap:5px}.level-choice{gap:5px}.preset{gap:8px;padding:10px}.preset img{width:55px;height:55px}.preset b{display:none}}@media(max-width:760px){.brand span,.local-note{display:none}.topbar{min-height:76px;padding:0 20px}main,footer{margin-left:16px;margin-right:16px}.intro{padding:30px 4px 24px}h1{font-size:29px}.intro p{font-size:13px;max-width:320px}.workspace{grid-template-columns:1fr}.preview-panel{position:static}.preview-stage{padding:26px}.preview-paper{max-width:300px}.eye-grid{gap:16px}.preset-grid{grid-template-columns:1fr}.preset{padding:12px 16px;gap:16px}.preset img{width:64px;height:64px}.preset b{display:block}.examples{margin-top:32px}footer{gap:12px;font-size:10px}.upload-box label span{display:block;margin:3px 0 0}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.shape-options{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.shape-options .choice{padding:8px 3px;gap:4px}.shape-options .choice svg{width:48px;height:48px}.shape-options .choice span{font-size:9px;white-space:normal;text-align:center;line-height:1.25;min-height:23px;display:flex;align-items:center}.shape-options .choice:has(input:checked){background:#efebff}@media(max-width:960px){.shape-options{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:360px){.shape-options{grid-template-columns:repeat(3,minmax(0,1fr))}}
.expanded-eyes{display:block}.expanded-eyes>fieldset+fieldset{margin-top:22px;max-width:300px}.expanded-eyes legend span{display:inline-block;margin-left:8px}.border-options{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.border-options .choice{padding:9px 2px}.border-options .choice svg{width:32px;height:32px}.border-options .choice span{font-size:9px;white-space:normal;line-height:1.2;text-align:center;min-height:22px;display:flex;align-items:center}@media(max-width:400px){.border-options{grid-template-columns:repeat(4,minmax(0,1fr))}}
.expanded-eyes>fieldset+fieldset{max-width:none}.center-options{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.center-options .choice{padding:9px 2px}.center-options .choice svg{width:32px;height:32px}.center-options .choice span{font-size:9px;white-space:normal;line-height:1.2;text-align:center;min-height:22px;display:flex;align-items:center}@media(max-width:400px){.center-options{grid-template-columns:repeat(4,minmax(0,1fr))}}
.logo-options{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.logo-choice svg{width:32px;height:32px}.logo-choice span{font-size:9px}.logo-choice b{height:32px;display:grid;place-items:center}.logo-choice{min-height:68px}
.logo-size-control{margin-top:18px}.logo-size-control>label{display:flex;align-items:center;justify-content:space-between;font-size:12px;font-weight:600}.logo-size-control output{color:var(--accent)}input[type=range]{width:100%;margin:12px 0 0;accent-color:var(--accent)}input[type=range]:disabled{opacity:.45}
.scan-result{margin:16px 24px 0;padding:10px 12px;background:#edf7f1;border-radius:5px;color:#215d3e;font-size:11px}.scan-result p{margin:0}.scan-result.unverified{background:#fff5e5;color:#795011}.scan-result button{margin-top:8px;font-size:11px;text-align:left}
.header-tools{display:flex;align-items:center;gap:24px}.language-control select{font-size:12px;padding:7px 10px;width:125px;background:transparent}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:760px){.header-tools{gap:8px}.header-tools .quiet-link{display:none}.language-control select{width:115px}}
.range-control>label{display:flex;justify-content:space-between;font-size:12px;font-weight:600}.range-control output{color:var(--accent)}
.quiet-control{margin-top:18px;margin-bottom:18px}.margin-warning{font-size:11px;line-height:1.55;color:#795011;background:#fff5e5;border-radius:5px;padding:9px 10px;margin:8px 0 0}

.scan-result.pending{background:#f5f7fa;color:#64717d}
#download-anyway{display:block}

/* Compact editor groups retain native keyboard-accessible disclosure controls. */
#qr-form section{padding:18px 22px}.section-heading{margin-bottom:12px}
.style-group summary{cursor:pointer;font-size:13px;font-weight:600;padding:9px 0;list-style-position:inside;line-height:1.5}
.style-group summary:focus-visible{outline:3px solid #9a87ee;outline-offset:3px}
.style-group summary [data-selected]{font-size:11px;font-weight:400;color:var(--muted);margin-left:8px}
.style-group[open]>summary{margin-bottom:7px}
.style-group .style-options,.style-group .logo-options{display:grid;grid-template-columns:repeat(auto-fill,minmax(42px,1fr));gap:6px}
.style-group .choice{min-width:0;min-height:42px;padding:5px;border-radius:5px}
.style-group .choice svg{width:27px;height:27px}
.style-group .choice span{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.style-group .choice b{font-size:22px}.expanded-eyes{margin-top:12px;gap:16px}.color-grid{margin-top:16px}
.style-group .upload-box{margin-top:12px;padding:12px}.style-group .logo-size-control{margin-top:12px}
.content-section>label,.content-fields>label{display:block;font-size:12px;font-weight:600;margin:12px 0 6px}
.content-section>label:first-of-type{margin-top:0}.content-fields{margin-top:12px}
.content-fields input:not([type=checkbox]),.content-fields textarea,.content-fields select{width:100%;min-width:0;padding:9px 10px;border:1px solid #cbd2db;border-radius:6px;background:#fff;color:var(--ink)}
.content-fields input:focus{border-color:var(--accent)}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.field-grid>label{margin:0;font-size:12px;font-weight:600}.field-grid input{display:block;margin-top:6px}.full-width{grid-column:1/-1}
#wifi-password-field>label{display:block;font-size:12px;font-weight:600;margin:12px 0 6px}#show-password{margin-top:6px}
.content-fields .checkbox-field{display:flex;align-items:center;gap:8px;font-weight:400}.checkbox-field input{width:16px;height:16px}
footer a{font-weight:650;text-underline-offset:3px}
@media(max-width:480px){.expanded-eyes{grid-template-columns:1fr;gap:4px}.style-group .style-options,.style-group .logo-options{grid-template-columns:repeat(auto-fill,minmax(40px,1fr))}.field-grid{gap:10px}footer{flex-wrap:wrap}#qr-form section{padding:16px}}
/* Style drawers: a live swatch anchors the selected design, with readable tiles. */
.style-group{border:1px solid #e3e4ed;border-radius:10px;background:#fff;overflow:hidden;transition:border-color .16s ease}
.style-group:hover{border-color:#c5bce7}.style-group[open]{border-color:#c5bce7}
.style-group summary{list-style:none;display:flex;align-items:center;gap:12px;padding:12px 14px;min-height:66px;margin:0;line-height:1.3}
.style-group summary::-webkit-details-marker{display:none}.style-group summary::marker{content:''}
.style-group[open]>summary{margin:0;background:#f8f6ff;border-bottom:1px solid #ebe6f7}
.group-thumb{display:grid;place-items:center;flex:none;width:38px;height:38px;border:1px solid #e5e1f1;background:white;border-radius:8px;color:var(--accent)}
.group-thumb svg{width:25px;height:25px}.group-thumb b{font-size:23px;font-weight:400}
.group-heading{min-width:0;flex:1;display:flex;flex-direction:column;gap:4px}
.group-name{font-size:13px;font-weight:650;letter-spacing:-.15px}
.style-group summary [data-selected]{margin:0;color:#717583;font-size:11px;font-weight:400}
.group-chevron{width:22px;height:22px;flex:none;color:#858292;transition:transform .18s ease}
.style-group[open] .group-chevron{transform:rotate(180deg);color:var(--accent)}
.style-group>fieldset{padding:14px;min-width:0}
.expanded-eyes{grid-template-columns:1fr;gap:10px;margin-top:10px}
.style-group .style-options,.style-group .logo-options{grid-template-columns:repeat(auto-fill,minmax(68px,1fr));gap:8px}
.style-group .choice{padding:9px 3px 7px;min-height:76px;gap:6px;border-color:#e6e7ee;border-radius:7px;transition:background .12s,border-color .12s}
.style-group .choice:hover{border-color:#b6a7e5;background:#faf8ff}
.style-group .choice:has(input:checked){border-color:var(--accent);background:#f1edfd;color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.style-group .choice svg{width:35px;height:35px}
.style-group .choice span{position:static;width:auto;height:auto;margin:0;overflow:visible;clip:auto;white-space:normal;font-size:10px;line-height:1.25;text-align:center;max-width:100%;overflow-wrap:anywhere}
.style-group .choice b{height:35px;display:grid;place-items:center;font-size:27px}
@media(max-width:480px){.style-group summary{gap:10px;padding:11px 12px}.style-group>fieldset{padding:10px}.style-group .style-options,.style-group .logo-options{grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:6px}.style-group .choice svg{width:34px;height:34px}}
@media(prefers-reduced-motion:reduce){.style-group,.group-chevron,.style-group .choice{transition:none}}
/* Searchable selects with an anchored popover; no external UI library. */
.smart-select{position:relative;min-width:0}.smart-trigger{display:flex;align-items:center;gap:11px;width:100%;min-height:46px;padding:9px 12px;border:1px solid #d7d8e4;border-radius:8px;background:#fff;text-align:left;color:var(--ink);box-shadow:0 1px 2px #192b3905}
.smart-trigger:hover{border-color:#b7a9e3}.smart-trigger[aria-expanded=true]{border-color:var(--accent);box-shadow:0 0 0 3px #5842c314}
.smart-icon{display:grid;place-items:center;width:27px;height:27px;flex:none;border-radius:6px;background:#f1edfc;color:var(--accent);font-size:13px;font-weight:650}
.smart-caption{flex:1;font-size:13px;font-weight:500}.smart-chevron{width:7px;height:7px;flex:none;border-right:1.5px solid #777586;border-bottom:1.5px solid #777586;transform:rotate(45deg);margin:0 4px 4px;transition:transform .15s}
.smart-trigger[aria-expanded=true] .smart-chevron{transform:rotate(225deg);margin-bottom:0}
.smart-popup{position:absolute;top:calc(100% + 7px);left:0;right:0;z-index:30;padding:7px;border:1px solid #e2deed;border-radius:10px;background:#fff;box-shadow:0 12px 34px #24203820,0 2px 5px #24203808}
.smart-search{display:block;width:100%;padding:10px 11px;margin-bottom:7px;border:1px solid #e3dfed;border-radius:6px;font-size:12px;background:#faf9fd;color:var(--ink);outline-offset:0}
.smart-search:focus{outline:2px solid #a898e6;outline-offset:-1px}.smart-options{max-height:280px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.smart-option{display:flex;align-items:center;gap:10px;min-height:38px;padding:7px 9px;border-radius:6px;font-size:12px;cursor:pointer}.smart-option:hover,.smart-option.active{background:#f5f2fc}.smart-option[aria-selected=true]{color:var(--accent);font-weight:600}
.smart-option-icon{width:23px;text-align:center;color:#777083;font-size:12px}.smart-check{margin-left:auto;color:var(--accent)}.smart-empty{padding:12px 8px;margin:0;font-size:12px;color:var(--muted)}
.language-select{min-width:160px}.language-select .smart-trigger{min-height:38px;padding:6px 10px;background:transparent}.language-select .smart-icon{width:23px;height:23px;font-size:9px;letter-spacing:.3px}.language-select .smart-caption{font-size:12px}.language-select .smart-popup{left:auto;min-width:180px}
#qr-form{overflow:visible}.content-section{border-radius:12px 12px 0 0}#qr-form .last-section{border-radius:0 0 12px 12px}
@media(max-width:600px){.language-select{min-width:132px}.language-select .smart-trigger{gap:7px}.header-tools{gap:12px}.language-select .smart-popup{min-width:170px}}
@media(prefers-reduced-motion:reduce){.smart-chevron{transition:none}}
.expanded-eyes{display:grid;grid-template-columns:1fr;gap:12px;margin-top:12px}
.smart-icon svg{width:19px;height:19px}.smart-option-icon{display:grid;place-items:center;width:29px;height:29px;border-radius:7px;background:#f4f4f8;color:#656477;flex:none}.smart-option-icon svg{width:19px;height:19px}.smart-option[aria-selected=true] .smart-option-icon{background:#eae4fb;color:var(--accent)}.smart-option{padding:7px 9px;gap:11px}.language-select .smart-icon svg{width:16px;height:16px}
.seo-section{margin-top:38px;padding-top:26px;border-top:1px solid var(--border)}.seo-intro{max-width:850px}.seo-intro h2{font-size:23px;line-height:1.3;margin-bottom:10px}.seo-intro p{font-size:13px;line-height:1.8;color:var(--muted);margin:0 0 16px}.seo-details{border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.seo-details summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 0;font-size:13px;font-weight:600;cursor:pointer}.seo-details summary::-webkit-details-marker{display:none}.seo-details summary::marker{content:''}.seo-details summary svg{width:20px;height:20px;flex:none;color:var(--accent);transition:transform .18s ease}.seo-details[open] summary svg{transform:rotate(180deg)}.seo-details summary:focus-visible{outline:3px solid #9a87ee;outline-offset:3px}.seo-copy{max-width:850px;padding:0 0 22px;font-size:13px;line-height:1.85;color:#53616e}.seo-copy h3{font-size:15px;color:var(--ink);margin:20px 0 8px}.seo-copy p{margin:8px 0}.seo-copy ol{padding-left:22px}.seo-copy li{margin:5px 0}.seo-copy a{color:var(--accent);text-underline-offset:3px}.seo-languages{display:flex;gap:18px;margin-top:16px;font-size:12px;color:var(--muted)}.seo-languages a{text-underline-offset:3px}@media(prefers-reduced-motion:reduce){.seo-details summary svg{transition:none}}@media(max-width:600px){.seo-intro h2{font-size:20px}.seo-section{margin-top:28px}}

/* Keep explanatory copy early in the HTML and below the editor visually. */
main{display:flex;flex-direction:column}main>.intro{order:0}main>.workspace{order:1}main>.examples{order:2}main>.seo-section{order:3}
/* Reading guides share the editor palette, with comfortable article typography. */
main>.reading-section{order:3}main>.seo-section{order:4}
.reading-section{margin-top:44px}.reading-heading{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:20px}.reading-heading h2,.guide-related>h2{font-size:23px}.reading-heading>a{font-size:13px;color:var(--accent);text-underline-offset:4px;flex-shrink:0}
.reading-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.reading-card{position:relative;display:flex;flex-direction:column;padding:24px 24px 50px;background:white;border:1px solid var(--border);border-radius:12px;text-decoration:none;transition:border-color .15s,background .15s}.reading-card:hover{border-color:#aa9adb;background:#fcfbff}.reading-card>span{font-size:18px;line-height:1.35;font-weight:650;letter-spacing:-.3px}.reading-card>p{font-size:13px;line-height:1.75;color:var(--muted);margin:12px 0 0}.reading-card>b{position:absolute;bottom:18px;right:24px;font-size:22px;font-weight:400;color:var(--accent)}
.knowledge-main{display:block}.breadcrumbs{display:flex;flex-wrap:wrap;gap:8px 12px;padding-top:26px;color:var(--muted);font-size:12px}.breadcrumbs a{text-decoration:none}.breadcrumbs a:hover{color:var(--accent);text-decoration:underline}.breadcrumbs [aria-current]{overflow-wrap:anywhere}
.guide-hero{max-width:850px;padding:52px 0 42px}.guide-label{font-size:11px;text-transform:uppercase;letter-spacing:1.5px;font-weight:650;color:var(--accent);margin:0 0 16px}.guide-hero h1{font-size:clamp(30px,3.6vw,46px);letter-spacing:-1.4px;line-height:1.14;max-width:840px}.guide-lead{font-size:17px;line-height:1.8;color:var(--muted);max-width:760px;margin:22px 0 0}
.guide-layout{display:grid;grid-template-columns:245px minmax(0,1fr);gap:60px;align-items:start}.guide-contents{position:sticky;top:24px;border-top:2px solid var(--accent);padding-top:18px}.guide-contents>p{font-size:11px;font-weight:650;text-transform:uppercase;letter-spacing:1px;margin:0 0 14px;color:var(--muted)}.guide-contents nav{display:flex;flex-direction:column;gap:12px}.guide-contents nav>a{font-size:13px;line-height:1.6;text-decoration:none}.guide-contents nav>a:hover{color:var(--accent)}.guide-editor-link{display:inline-block;margin-top:24px;font-size:13px;color:var(--accent);text-underline-offset:4px}
.guide-body{min-width:0;max-width:800px;font-size:16px;line-height:1.85}.guide-takeaway{margin:0 0 38px;padding:22px 26px;background:#eeebfa;border-left:3px solid var(--accent);border-radius:0 10px 10px 0;font-size:16px;line-height:1.8}.guide-body section{scroll-margin-top:30px;margin:0 0 38px}.guide-body h2{font-size:25px;line-height:1.3;letter-spacing:-.5px;margin:0 0 16px}.guide-body p{margin:0 0 18px}.guide-body ul{padding-left:22px;margin:16px 0 0}.guide-body li{padding-left:4px;margin:10px 0}.guide-table{overflow-x:auto;margin-top:24px;border:1px solid var(--border);border-radius:10px;background:#fff}.guide-table table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.6}.guide-table th,.guide-table td{padding:15px 18px;text-align:left;vertical-align:top;border-bottom:1px solid var(--border)}.guide-table th{background:#f0edf8;font-weight:650}.guide-table tr:last-child td{border-bottom:0}.guide-table td:first-child{font-weight:650;white-space:nowrap}.guide-sources{padding-top:26px;border-top:1px solid var(--border);font-size:13px;color:var(--muted)}.guide-sources h2{font-size:16px;color:var(--ink)}.guide-sources a{text-underline-offset:3px}.guide-sources p{margin-top:20px}.guide-related{margin-top:50px}.guide-related>h2{margin-bottom:20px}
.guide-cta{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:30px;margin:36px 0 24px;background:#eeebfa;border-radius:12px}.guide-cta h2{font-size:22px}.guide-cta p{margin:8px 0 0;color:var(--muted);font-size:14px}.guide-cta>a{flex-shrink:0;padding:12px 20px;background:var(--accent);color:white;border-radius:7px;text-decoration:none;font-weight:600;font-size:13px}.guide-cta>a:hover{background:#4934ac}
@media(max-width:960px){.guide-layout{grid-template-columns:200px minmax(0,1fr);gap:30px}.reading-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.guide-body{font-size:15px}.guide-table th,.guide-table td{padding:12px}}
@media(max-width:760px){.guide-hero{padding:32px 0}.guide-hero h1{letter-spacing:-.8px}.guide-lead{font-size:16px;margin-top:18px}.guide-layout{grid-template-columns:1fr;gap:28px}.guide-contents{position:static;padding:18px 20px;background:#fff;border:1px solid var(--border);border-radius:10px}.guide-contents nav{gap:10px}.guide-editor-link{margin-top:16px}.guide-body h2{font-size:22px}.guide-takeaway{padding:18px 20px}.guide-related{margin-top:34px}.guide-cta{align-items:flex-start;flex-direction:column;padding:24px}.reading-heading{align-items:flex-start;flex-direction:column;gap:8px}.reading-section{margin-top:32px}.breadcrumbs{font-size:11px}.guide-body{line-height:1.8}.guide-table table{min-width:500px}}
@media(max-width:540px){.reading-grid{grid-template-columns:1fr}.reading-card{padding:22px 22px 48px}.reading-card>span{font-size:18px}}
@media(prefers-reduced-motion:reduce){.reading-card{transition:none}}