/* Velumio reading guides: lamplit parchment, ink-teal and ember. No external assets. */
:root{--rg-paper:#f6efe0;--rg-card:#fbf6ea;--rg-ink:#2b2622;--rg-soft:#6a5f55;--rg-teal:#1f4a4d;--rg-teal2:#2f6568;--rg-ember:#b8541f;--rg-rose:#c98d97;--rg-line:#e2d6bd;}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--rg-paper);}
.rg-page{min-height:100dvh;color:var(--rg-ink);background:
radial-gradient(60rem 28rem at 85% -5%,rgba(184,84,31,.13),transparent 70%),
radial-gradient(50rem 30rem at 0% 20%,rgba(31,74,77,.09),transparent 70%),var(--rg-paper);
font-family:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Noto Serif",serif;font-size:1.0625rem;line-height:1.7;-webkit-font-smoothing:antialiased}
.rg-page a{color:inherit}
.rg-page :focus-visible{outline:3px solid var(--rg-ember);outline-offset:3px;border-radius:4px}
.rg-header{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between;max-width:72rem;margin:0 auto;padding:1.1rem 1.25rem}
.rg-brand img{display:block;height:2.8rem;width:auto}
.rg-nav{display:flex;gap:1.25rem;align-items:center;font-size:.95rem}
.rg-nav>a{text-decoration:none;border-bottom:1px solid transparent;transition:border-color .2s}
.rg-nav>a:hover{border-color:var(--rg-ember)}
.rg-lang{position:relative}
.rg-lang summary{list-style:none;cursor:pointer;display:flex;gap:.5rem;align-items:baseline;padding:.45rem .9rem;border:1px solid var(--rg-line);border-radius:999px;background:var(--rg-card);transition:transform .2s,box-shadow .2s}
.rg-lang summary::-webkit-details-marker{display:none}
.rg-lang summary:hover{transform:translateY(-1px);box-shadow:0 4px 14px rgba(43,38,34,.1)}
.rg-lang summary span{color:var(--rg-soft);font-size:.8rem}
.rg-lang summary::after{content:"";width:.45rem;height:.45rem;border-inline-end:2px solid var(--rg-ember);border-bottom:2px solid var(--rg-ember);transform:rotate(45deg) translateY(-2px);transition:transform .2s}
.rg-lang[open] summary::after{transform:rotate(225deg)}
.rg-lang ul{position:absolute;inset-inline-end:0;top:calc(100% + .5rem);z-index:20;margin:0;padding:.6rem;list-style:none;width:min(36rem,calc(100vw - 2.5rem));display:grid;grid-template-columns:repeat(auto-fill,minmax(8.5rem,1fr));gap:.1rem;background:var(--rg-card);border:1px solid var(--rg-line);border-radius:1rem;box-shadow:0 18px 40px rgba(43,38,34,.18);max-height:70vh;overflow:auto}
.rg-lang li a{display:block;padding:.35rem .6rem;border-radius:.5rem;text-decoration:none;font-size:.92rem}
.rg-lang li a:hover{background:rgba(184,84,31,.12)}
.rg-lang li a[aria-current]{background:var(--rg-teal);color:#f6efe0}
.rg-main{max-width:72rem;margin:0 auto;padding:0 1.25rem 3rem}
.rg-hero{padding:3rem 0 2.5rem;max-width:50rem}
.rg-kicker{display:inline-block;margin:0 0 1rem;padding:.2rem .8rem;border-radius:999px;background:var(--rg-teal);color:#f6efe0;font-size:.78rem;letter-spacing:.06em}
.rg-page h1{font-size:clamp(2.1rem,5.5vw,3.9rem);line-height:1.1;margin:0 0 1.2rem;font-weight:700;color:var(--rg-teal);letter-spacing:-.01em;text-wrap:balance}
.rg-intro{font-size:1.28rem;line-height:1.6;margin:0 0 1.8rem;color:#3d352e;border-inline-start:4px solid var(--rg-ember);padding-inline-start:1.1rem}
.rg-actions{display:flex;flex-wrap:wrap;gap:.8rem}
.rg-btn{display:inline-block;text-decoration:none!important;padding:.85rem 1.5rem;border-radius:.9rem;font-weight:700;font-size:1rem;line-height:1.3;transition:transform .2s,box-shadow .2s,background-color .2s}
.rg-btn:hover{transform:translateY(-2px)}
.rg-btn-main{background:var(--rg-ember);color:#fff8ef!important;box-shadow:0 6px 18px rgba(184,84,31,.32)}
.rg-btn-main:hover{background:#a24615;box-shadow:0 10px 22px rgba(184,84,31,.38)}
.rg-btn-quiet{border:1.5px solid var(--rg-teal);color:var(--rg-teal)!important;background:transparent}
.rg-btn-quiet:hover{background:rgba(31,74,77,.08)}
.rg-note{margin:1.4rem 0 0;font-size:.92rem;color:var(--rg-soft);font-style:italic}
.rg-sections{display:grid;gap:1.25rem;grid-template-columns:repeat(12,1fr);margin:1rem 0 3rem}
.rg-section{grid-column:span 12;display:flex;gap:1.1rem;padding:1.6rem;background:var(--rg-card);border:1px solid var(--rg-line);border-radius:1.4rem;transition:transform .25s,box-shadow .25s}
.rg-section:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(43,38,34,.1)}
.rg-section h2{margin:0 0 .5rem;font-size:1.35rem;line-height:1.25;color:var(--rg-teal)}
.rg-section p{margin:0}
.rg-num{flex:none;width:2.6rem;height:2.6rem;border-radius:50%;display:grid;place-items:center;background:var(--rg-rose);color:#fff;font-weight:700;font-size:1.1rem}
.rg-section:nth-child(2) .rg-num{background:var(--rg-ember)}
.rg-section:nth-child(3) .rg-num{background:var(--rg-teal2)}
@media(min-width:60rem){.rg-section:nth-child(1){grid-column:span 7}.rg-section:nth-child(2){grid-column:span 5;margin-top:2rem}.rg-section:nth-child(3){grid-column:3/span 8}}
.rg-try{background:var(--rg-teal);color:#f6efe0;border-radius:1.8rem;padding:2.2rem clamp(1.2rem,4vw,3rem);margin-bottom:2rem}
.rg-page .rg-try h2{color:#f6efe0;margin:0 0 1.4rem;font-size:1.7rem}
.rg-steps{list-style:none;margin:0;padding:0;display:grid;gap:1rem;counter-reset:s;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}
.rg-steps li{counter-increment:s;position:relative;padding:3.2rem 1.1rem 1.1rem;background:rgba(246,239,224,.09);border-radius:1.1rem;border:1px solid rgba(246,239,224,.18)}
.rg-steps li::before{content:counter(s);position:absolute;top:.8rem;inset-inline-start:1.1rem;width:1.9rem;height:1.9rem;border-radius:50%;background:var(--rg-ember);color:#fff;display:grid;place-items:center;font-weight:700;font-size:.95rem}
.rg-example{margin:0 0 2.5rem;padding:1.8rem 1.6rem 1.8rem 2rem;background:#efe0bd;border-radius:1.4rem;position:relative;overflow:hidden}
.rg-example::before{content:"";position:absolute;inset-block:0;inset-inline-start:0;width:.5rem;background:linear-gradient(var(--rg-ember),var(--rg-rose))}
.rg-page .rg-example h2{margin:0 0 .6rem;font-size:1.1rem;text-transform:uppercase;letter-spacing:.08em;color:var(--rg-ember)}
.rg-example p{margin:0;font-size:1.2rem;font-style:italic}
.rg-faq{max-width:50rem;margin-bottom:2.5rem}
.rg-page .rg-faq h2,.rg-page .rg-related h2{font-size:1.7rem;margin:0 0 1rem;color:var(--rg-teal)}
.rg-faq dl{margin:0}
.rg-qa{padding:1.1rem 0;border-top:1px solid var(--rg-line)}
.rg-qa:last-child{border-bottom:1px solid var(--rg-line)}
.rg-qa dt{font-weight:700;font-size:1.1rem;margin-bottom:.3rem}
.rg-qa dd{margin:0;color:#4a4036}
.rg-cta{text-align:center;padding:2.5rem 1.2rem;border:2px dashed var(--rg-ember);border-radius:1.8rem;margin-bottom:2.5rem;background:rgba(251,246,234,.7)}
.rg-cta p{margin:0 auto 1.3rem;max-width:36rem;color:var(--rg-soft)}
.rg-cta .rg-actions{justify-content:center}
.rg-related ul{list-style:none;margin:0;padding:0;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr))}
.rg-related a{display:block;height:100%;padding:1.2rem 1.3rem;border:1px solid var(--rg-line);border-radius:1.2rem;background:var(--rg-card);text-decoration:none;transition:transform .2s,border-color .2s}
.rg-related a:hover{transform:translateY(-3px);border-color:var(--rg-ember)}
.rg-rel-k{display:block;font-size:.78rem;color:var(--rg-ember);letter-spacing:.05em;margin-bottom:.3rem}
.rg-rel-t{display:block;font-weight:700;color:var(--rg-teal);font-size:1.12rem;line-height:1.35}
.rg-footer{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;max-width:72rem;margin:0 auto;padding:1.5rem 1.25rem 2.5rem;border-top:1px solid var(--rg-line);font-size:.92rem;color:var(--rg-soft)}
.rg-footer a{text-decoration:none}.rg-footer a:hover{text-decoration:underline}
@media(prefers-reduced-motion:no-preference){
.rg-hero>*{animation:rg-rise .7s both}.rg-hero>*:nth-child(2){animation-delay:.08s}.rg-hero>*:nth-child(3){animation-delay:.16s}.rg-hero>*:nth-child(4){animation-delay:.24s}.rg-hero>*:nth-child(5){animation-delay:.32s}
.rg-section{animation:rg-rise .7s both;animation-delay:calc(.2s + var(--i)*.1s)}
}
@keyframes rg-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.rg-page *{transition:none!important;animation:none!important}}
@media(max-width:40rem){.rg-section{flex-direction:column}.rg-lang ul{inset-inline-end:auto;inset-inline-start:0}}
