:root { --bg:#f5f1f7; --surface:#fffdfd; --text:#292330; --muted:#645d6c; --line:#ded7e2; --accent:#853969; --yellow:#f6e2a4; --pink:#efc5de; --blue:#d3e5f4; --purple:#eee3f5; --notice:#fff2cf; --notice-line:#d7bf85; --notice-text:#483a24; --primary:#302733; --primary-text:#fff; --primary-hover:#594254; color-scheme:light; font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; font-synthesis:none; }
* { box-sizing:border-box; }
body { margin:0; min-width:0; background:var(--bg); color:var(--text); line-height:1.7; }
a { color:inherit; }
main,section,article,div { min-width:0; }
main:focus { outline:none; }
:is(a,button,summary):focus-visible { outline:3px solid var(--accent); outline-offset:4px; }
.skip-link { position:fixed; inset-block-start:.75rem; inset-inline-start:1rem; z-index:100; padding:.7rem 1rem; border:2px solid #3b2940; border-radius:10px; background:#f6e2a4; color:#292330; font-weight:700; transform:translateY(-180%); }
.skip-link:focus { transform:translateY(0); }
.wiki-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; }
.site-header { background:#211b26; color:#faf5fb; }
.site-header :is(a,button):focus-visible { outline-color:#f6e2a4; }
.header-inner { display:grid; grid-template-columns:auto 1fr auto auto; align-items:center; gap:1rem 1.5rem; width:min(1180px,calc(100% - 3rem)); min-height:88px; margin-inline:auto; padding-block:.7rem; }
.brand { display:inline-flex; min-width:0; align-items:center; text-decoration:none; }
.brand picture { min-width:0; display:block; }
.wiki-logo { display:block; width:190px; max-width:100%; height:auto; object-fit:contain; }
.header-nav { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:.5rem 1.25rem; }
.header-nav a { display:inline-flex; align-items:center; min-height:44px; color:#eee5ef; font-size:.9375rem; font-weight:650; text-decoration:none; }
.header-nav a:hover { color:#ffd7ed; text-decoration:underline; text-underline-offset:.25em; }
.public-theme-toggle { display:inline-grid; place-items:center; width:44px; height:44px; padding:0; flex:none; border:1px solid #8f7b93; border-radius:50%; background:#342b3a; color:#fff; font:inherit; cursor:pointer; }
.public-theme-toggle:hover { background:#4a3550; }
.header-cta { display:inline-flex; align-items:center; justify-content:center; gap:.6rem; min-height:44px; padding:.65rem 1rem; border:1px solid #fff; border-radius:11px; background:#fff; color:#302733; font-size:.9375rem; font-weight:700; text-decoration:none; white-space:nowrap; }
.header-cta:hover { background:#f6dced; border-color:#f6dced; }
.hero { border-block-end:1px solid var(--line); }
.hero-inner { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(240px,1fr); gap:clamp(2rem,5vw,5rem); align-items:center; width:min(1180px,calc(100% - 3rem)); margin-inline:auto; padding-block:4rem; }
.hero h1 { margin:0 0 1.25rem; max-width:17ch; font-size:clamp(2.5rem,4.8vw,4rem); line-height:1.1; letter-spacing:-.045em; text-wrap:balance; }
.hero h1 em { color:var(--accent); font-style:normal; }
.hero-lede,.section-lede { max-width:68ch; margin:0; color:var(--muted); font-size:1.0625rem; line-height:1.75; }
.hero-actions { display:flex; flex-wrap:wrap; gap:.75rem; margin-block-start:1.5rem; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:.7rem; min-height:48px; padding:.75rem 1rem; border:1px solid var(--line); border-radius:12px; font-size:.9375rem; font-weight:700; line-height:1.4; text-decoration:none; }
.button-primary { background:var(--primary); color:var(--primary-text); border-color:var(--primary); }
.button-primary:hover { background:var(--primary-hover); border-color:var(--primary-hover); }
.button-secondary { background:var(--surface); color:var(--text); border-color:var(--line); }
.button-secondary:hover { background:var(--purple); }
.hero-checklist { padding:1.5rem; border:1px solid var(--line); border-radius:18px; background:var(--surface); }
.hero-checklist h2 { margin:0 0 1rem; font-size:1.125rem; line-height:1.4; letter-spacing:-.015em; }
.hero-checklist ul { display:grid; gap:1rem; margin:0; padding:0; list-style:none; }
.hero-checklist li { display:flex; gap:.75rem; align-items:flex-start; font-size:.9375rem; line-height:1.6; }
.hero-checklist i { width:20px; padding-block-start:.25rem; flex:none; color:var(--accent); text-align:center; }
.content-layout { display:grid; grid-template-columns:205px minmax(0,1fr); gap:clamp(2rem,5vw,5rem); width:min(1180px,calc(100% - 3rem)); margin-inline:auto; }
.side-nav { position:sticky; inset-block-start:1.5rem; align-self:start; display:flex; flex-direction:column; gap:.2rem; padding-block-start:3.5rem; }
.side-nav p { margin:0 0 .6rem; color:var(--muted); font-size:.875rem; font-weight:650; }
.side-nav a { display:flex; align-items:center; min-height:44px; gap:.7rem; padding:.5rem .25rem; border-radius:8px; color:var(--muted); font-size:.9375rem; text-decoration:none; }
.side-nav a:hover { color:var(--accent); background:var(--purple); }
.side-nav a span { display:inline-grid; place-items:center; width:19px; color:var(--accent); flex:none; }
.intro-section,.guide-section { padding-block:3.5rem; border-block-end:1px solid var(--line); scroll-margin-top:1.5rem; }
.guide-content h2 { margin:0 0 1rem; font-size:clamp(1.8rem,3.2vw,2.5rem); line-height:1.2; letter-spacing:-.035em; text-wrap:balance; }
.notice { display:flex; align-items:flex-start; gap:.8rem; padding:1rem 1.25rem; margin-block:1.5rem; border:1px solid var(--notice-line); border-radius:12px; background:var(--notice); color:var(--notice-text); font-size:.9375rem; }
.notice p { margin:0; }
.notice > i { flex:none; padding-block-start:.3rem; }
.steps-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; margin:1.75rem 0 0; padding:0; list-style:none; }
.step-card,.security-grid article { display:flex; flex-direction:column; min-width:0; padding:1.4rem; border-radius:16px; color:#302730; }
.step-card:nth-child(1) { background:var(--yellow); }
.step-card:nth-child(2) { background:var(--pink); }
.step-card:nth-child(3) { background:var(--blue); }
.step-number { font-size:1.3rem; color:#714055; }
.step-card h3,.instruction-list h3,.security-grid h3,.callout h3 { margin:.9rem 0 .5rem; font-size:1.0625rem; line-height:1.4; letter-spacing:-.015em; }
.step-card p,.security-grid p { margin:0; color:#4e414c; font-size:.9375rem; line-height:1.75; }
.step-card a { display:inline-flex; align-items:center; gap:.5rem; min-height:44px; margin-block-start:auto; padding-block-start:.8rem; font-size:.9375rem; color:#503043; font-weight:700; text-underline-offset:.2em; }
.instruction-list { margin:1.75rem 0; padding:0; list-style:none; }
.instruction-list li { display:grid; grid-template-columns:28px minmax(0,1fr); gap:1rem; padding-block:1.5rem; border-block-start:1px solid var(--line); }
.instruction-list li > span { color:var(--accent); font-size:1.2rem; padding-block-start:.1rem; }
.instruction-list h3 { margin-block-start:0; }
.instruction-list p,.role-list p,.faq-section details p,.callout p { margin:0; color:var(--muted); font-size:1rem; line-height:1.75; }
.text-link { display:inline-flex; align-items:center; gap:.5rem; min-height:44px; margin-block-start:.5rem; color:var(--accent); font-size:.9375rem; font-weight:700; text-decoration:underline; text-underline-offset:.2em; }
code { color:var(--accent); font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:.92em; overflow-wrap:anywhere; }
.step-card code,.security-grid code { color:#603047; }
.callout { display:flex; align-items:center; justify-content:space-between; gap:1.5rem; padding:1.5rem; border:1px solid var(--line); border-radius:16px; background:var(--purple); }
.callout h3 { margin-block-start:0; }
.callout .button { flex:none; }
.security-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-block-start:1.75rem; }
.security-grid article:first-child { background:var(--blue); }
.security-grid article:last-child { background:var(--pink); }
.security-grid article > span { color:#714055; font-size:1.4rem; }
.role-list { margin-block-start:1.75rem; }
.role-list > div { display:grid; grid-template-columns:24px 145px minmax(0,1fr); gap:.8rem; align-items:baseline; padding-block:1.2rem; border-block-start:1px solid var(--line); }
.role-list span { color:var(--accent); }
.role-list strong { font-size:1rem; line-height:1.5; }
.fine-print { color:var(--muted); font-size:.9375rem; margin:1.5rem 0 0; }
.faq-section details { border-block-start:1px solid var(--line); }
.faq-section details:last-child { border-block-end:1px solid var(--line); }
.faq-section summary { display:flex; align-items:center; justify-content:space-between; gap:1rem; min-height:64px; padding-block:1.1rem; cursor:pointer; list-style:none; font-size:1rem; font-weight:700; line-height:1.6; }
.faq-section summary::-webkit-details-marker { display:none; }
.faq-section summary > span { color:var(--accent); flex:none; }
.faq-section details[open] summary > span { transform:rotate(45deg); }
.faq-section details p { max-width:70ch; margin:0 0 1.25rem; }
.footer { display:flex; align-items:center; flex-wrap:wrap; gap:.5rem 1.5rem; padding-block:2rem; color:var(--muted); font-size:.875rem; }
.footer-brand { display:inline-flex; }
.wiki-footer-logo { display:block; width:150px; height:auto; }
.footer p { margin:0; }
.footer > a:last-child { display:inline-flex; align-items:center; min-height:44px; gap:.5rem; margin-inline-start:auto; color:var(--accent); text-underline-offset:.2em; }
html[data-dashboard-theme="dark"] { --bg:#18151e; --surface:#27222e; --text:#f7f2f7; --muted:#cfc2d0; --line:#4d4255; --accent:#efb4d8; --purple:#392d42; --notice:#453822; --notice-line:#a88c4d; --notice-text:#ffefc6; --primary:#efbcd9; --primary-text:#30212d; --primary-hover:#ffdaee; color-scheme:dark; }
@media(prefers-color-scheme:dark) { html:not([data-dashboard-theme]) { --bg:#18151e; --surface:#27222e; --text:#f7f2f7; --muted:#cfc2d0; --line:#4d4255; --accent:#efb4d8; --purple:#392d42; --notice:#453822; --notice-line:#a88c4d; --notice-text:#ffefc6; --primary:#efbcd9; --primary-text:#30212d; --primary-hover:#ffdaee; color-scheme:dark; } }
@media(max-width:980px) { .header-inner { grid-template-columns:minmax(0,1fr) auto auto; gap:.4rem 1rem; } .header-nav { grid-column:1/-1; grid-row:2; justify-content:flex-start; gap:.5rem 1.5rem; } .public-theme-toggle { grid-column:2; grid-row:1; } .header-cta { grid-column:3; grid-row:1; } .hero-inner { grid-template-columns:minmax(0,1.3fr) minmax(220px,1fr); gap:2rem; padding-block:3rem; } .content-layout { grid-template-columns:1fr; gap:0; } .side-nav { position:static; padding-block:1.5rem 0; flex-direction:row; flex-wrap:wrap; gap:.25rem 1rem; } .side-nav p { flex-basis:100%; margin:0; } .side-nav a { min-height:44px; } .intro-section { padding-block-start:2rem; } .steps-grid { gap:.75rem; } }
@media(max-width:700px) { .header-inner,.hero-inner,.content-layout { width:calc(100% - 2rem); } .hero-inner { grid-template-columns:1fr; padding-block:2.5rem; gap:1.5rem; } .hero h1 { max-width:18ch; font-size:clamp(2.5rem,9vw,3.2rem); } .hero-checklist { padding:1.25rem; } .hero-checklist ul { gap:.7rem; } .steps-grid,.security-grid { grid-template-columns:1fr; } .step-card { padding:1.4rem; } .intro-section,.guide-section { padding-block:2.5rem; } .guide-content h2 { font-size:clamp(1.8rem,7vw,2.2rem); } .callout { align-items:flex-start; flex-direction:column; gap:1rem; } .role-list > div { grid-template-columns:24px 1fr; gap:.4rem .8rem; } .role-list p { grid-column:2; } .footer { align-items:flex-start; } .footer > a:last-child { margin-inline-start:0; } }
@media(max-width:420px) { .header-inner { gap:.4rem .6rem; } .wiki-logo { width:150px; } .header-cta { padding:.6rem .7rem; font-size:.8125rem; } .header-nav { gap:.25rem 1rem; } .header-nav a { font-size:.875rem; } .hero-actions .button { flex:1 1 180px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }

.availability-note{max-width:1180px;margin:0 auto;padding:16px 24px;border-bottom:1px solid var(--line,#ded7e2);font:400 1rem/1.6 system-ui,sans-serif;color:inherit;}