:root{color-scheme:light;--ink:#101a34;--muted:#606b80;--blue:#193dff;--line:#dfe4ee;--paper:#fff;--bg:#f7f9fc}
*{box-sizing:border-box}html{scroll-padding-top:24px}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.65 "Nunito","Segoe UI",Arial,sans-serif}main{max-width:920px;margin:auto;padding:52px 24px 32px}a{color:#294fca;text-underline-offset:4px}a:hover{text-decoration-thickness:2px}a:focus-visible{outline:3px solid var(--blue);outline-offset:5px;border-radius:3px}.skip{position:absolute;left:16px;top:-80px;padding:10px;background:white}.skip:focus{top:12px}header{padding:0 0 30px;border-bottom:1px solid var(--line)}.eyebrow{font-size:13px;letter-spacing:.1em;font-weight:700;color:var(--blue);text-transform:uppercase;margin:0 0 12px}h1{font-size:clamp(34px,6vw,48px);line-height:1.12;letter-spacing:-.035em;margin:0 0 16px}header p{max-width:630px;font-size:18px;color:var(--muted);margin:0 0 18px}.version{display:inline-block;background:#e9eefc;color:#294fca;font-size:13px;font-weight:650;border-radius:6px;padding:5px 10px}h2{font-size:25px;line-height:1.3;letter-spacing:-.02em;margin:0 0 16px}h3{font-size:19px;line-height:1.4;margin:0 0 6px}p{margin:0 0 10px}p:last-child{margin-bottom:0}section,nav{margin-top:38px}nav{padding:24px;background:var(--paper);border:1px solid var(--line);border-radius:12px}nav h2{font-size:18px}nav .links{display:flex;flex-wrap:wrap;gap:10px 22px}nav a{font-size:15px;padding:3px 0}.intro{display:grid;grid-template-columns:1fr 1fr;gap:22px}.intro h3{font-size:17px}.intro p{color:var(--muted)}.section-heading{display:flex;justify-content:space-between;gap:16px;align-items:baseline}.section-heading a{font-size:13px;white-space:nowrap}.generator{display:grid;grid-template-columns:44px minmax(0,1fr);gap:18px;padding:24px;background:var(--paper);border:1px solid var(--line);border-radius:12px;margin-bottom:12px;scroll-margin-top:24px}.generator img{object-fit:contain;margin-top:3px}.generator p{color:var(--muted)}.generator .purpose{color:var(--ink)}.premium{display:inline-block;vertical-align:middle;font-size:11px;font-weight:650;letter-spacing:.02em;color:#71510b;background:#fff3cf;border-radius:4px;padding:2px 7px;margin-left:6px}.help{padding:24px;background:var(--paper);border:1px solid var(--line);border-radius:12px}.help h3{margin-top:22px;font-size:17px}.help p{color:var(--muted)}footer{border-top:1px solid var(--line);margin-top:38px;padding-top:20px;color:var(--muted);font-size:13px;display:flex;justify-content:space-between;gap:16px}strong{font-weight:650}
@media(max-width:560px){main{padding:32px 18px 24px}.intro{grid-template-columns:1fr;gap:18px}.generator{padding:18px 16px;gap:12px;grid-template-columns:36px minmax(0,1fr)}.generator img{width:36px;height:36px}nav,.help{padding:20px}h2{font-size:23px}.section-heading{align-items:center}.section-heading a{font-size:12px}footer{display:block}footer a{display:inline-block;margin-top:8px}}
@media print{body{background:white;font-size:11pt}main{max-width:none;padding:0}nav,.section-heading a,.skip{display:none}.generator{break-inside:avoid;border:0;border-bottom:1px solid #ddd;border-radius:0;padding:16px 0}section{margin-top:24px}a{color:inherit}footer a{display:none}}

.faq-item{border-top:1px solid var(--line)}
.faq-item summary{cursor:pointer;padding:18px 0;font-size:17px;font-weight:700;line-height:1.5;min-height:48px}
.faq-item summary::marker{color:var(--blue)}
.faq-item summary:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:3px}
.faq-item[open] summary{padding-bottom:10px}
.faq-item p{padding:0 0 18px;margin:0}

/* Contents: quick help first, then a consistent two-column category grid. */
#contents{padding:24px}
#contents h2{font-size:20px;margin-bottom:16px}
#contents a{text-decoration:none;font-weight:700;line-height:1.4;transition:background-color .15s,border-color .15s}
#contents .guide-shortcuts{display:flex;flex-wrap:wrap;gap:8px}
#contents .guide-shortcuts a{display:flex;align-items:center;min-height:44px;padding:10px 14px;border-radius:9px;background:#edf1ff;color:#2d4ec4;font-size:14px}
#contents .contents-label{margin:22px 0 10px;font-size:12px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
#contents .links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
#contents .links a{display:flex;align-items:center;min-height:52px;padding:13px 15px;border:1px solid var(--line);border-radius:9px;background:#f8f9fc;color:var(--ink);font-size:15px}
#contents .guide-shortcuts a:hover{background:#dfe7ff}
#contents .links a:hover{background:#edf1ff;border-color:#b9c8f6;color:#294fca}
@media(max-width:560px){#contents{padding:20px}#contents .links a{padding:12px;font-size:14px}#contents .guide-shortcuts a{font-size:13px;padding:10px 12px}}
@media(max-width:340px){#contents .links{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){#contents a{transition:none}}

/* Return navigation stays distinct from guide content. */
.section-heading{align-items:center;gap:16px;margin-bottom:16px}
.section-heading h2{margin:0}
.section-heading a,footer>a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 15px;border:1px solid #dce3f4;border-radius:10px;background:#edf1fc;color:#3655b5;font-size:13px;font-weight:700;line-height:1.4;text-decoration:none;white-space:nowrap}
.section-heading a:hover,footer>a:hover{background:#e0e8fc;border-color:#bdccf0}
footer{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:18px 24px;margin-top:40px;padding:24px 0 8px}
.footer-info{display:flex;flex-direction:column;gap:4px;line-height:1.5}
.footer-info strong{font-size:15px;color:var(--ink);font-weight:800}
.footer-info span{font-size:13px;color:var(--muted)}
footer>a{margin:0}
@media(max-width:560px){.section-heading{gap:12px}.section-heading a{font-size:12px;padding:10px 12px}.section-heading h2{font-size:22px}footer{gap:18px}}
@media(max-width:380px){.section-heading{align-items:flex-start;flex-direction:column;gap:10px}}
@media print{.section-heading a,footer>a{display:none}}

/* Match the Apptonishing shell while keeping guide-specific navigation. */
.site-header{padding:20px max(24px,calc((100% - 1040px)/2));display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;border-bottom:1px solid var(--line)}
.site-brand{display:flex;align-items:center;color:var(--ink);font-weight:750;text-decoration:none}
.site-header nav{margin:0;padding:0;border:0;background:none;display:flex;gap:18px;flex-wrap:wrap}
.site-header nav a{font-size:14px;color:var(--muted);font-weight:650;text-decoration:none}
.site-header nav a[aria-current=page]{color:var(--blue)}
main{max-width:1040px;padding-top:64px;padding-bottom:64px}
h1{font-size:clamp(2.8rem,6vw,4.7rem);letter-spacing:-.055em;line-height:1.05}
.generator,.help,#contents{border-radius:16px}
.version{border-radius:99px;background:#e8edff;color:var(--blue);padding:7px 12px}
.skip:focus{z-index:10}
@media(max-width:560px){main{padding:36px 16px}.site-header{padding:20px 16px;gap:14px}.site-header nav{gap:14px}.site-header nav a{font-size:13px}}
@media print{.site-header{display:none}main{padding:0}}