.guide-page{--accent:#385b43;--tint:#dce6cc}.guide-page.gem-guide{--accent:#785581;--tint:#e9dfed}.guide-page.music-guide{--accent:#315e64;--tint:#d5e3df}
.guide-top{padding:30px 7% 0}.guide-top a{display:inline-block;padding:8px 0;text-decoration:underline;font-size:12px}
.guide-hero{display:grid;grid-template-columns:1.2fr .8fr;gap:6%;padding:34px 7% 50px;align-items:center}.guide-hero .eyebrow{margin-bottom:20px}.guide-hero h1{font-size:clamp(54px,6.8vw,94px);letter-spacing:-3px;line-height:1.02}.guide-hero h1 em{color:var(--accent)}.guide-lead{font-size:19px;line-height:1.55;margin:25px 0 23px;max-width:620px}.guide-action{display:inline-flex;align-items:center;gap:28px;background:var(--ink);color:var(--paper);padding:15px 21px;font-size:14px;min-height:48px}.guide-action span{font-size:21px}.guide-caption{font-family:Georgia,serif;font-style:italic;font-size:18px;margin-top:14px;color:var(--accent)}
.guide-art{margin:0;background:var(--tint);padding:28px;min-height:280px;display:flex;flex-direction:column;justify-content:center;position:relative;transform:rotate(1.3deg);border:1px solid #22251f25;box-shadow:8px 9px 0 #22251f08}.guide-art .mono{color:var(--accent);font-size:10px}.guide-art img.app-icon{width:72px;height:72px;border-radius:19px;margin-bottom:22px}.nested-paper{border:1px solid #74846b;background:#f3f4e9;padding:17px;margin-top:14px;font-family:Georgia,serif;font-size:19px}.nested-paper .nested-paper{margin-left:20px;background:#e7eddb}.nested-paper .nested-paper .nested-paper{background:#f5f6ed}.paper-note{font-size:12px;line-height:1.6;margin-top:20px;color:#3d5039}
.gem-guide .guide-art{transform:rotate(-1.2deg)}.notation{margin:20px 0 6px;border:1px solid #a997b3;background:#f5f0f6;padding:22px 14px;display:flex;justify-content:space-around;gap:6px}.notation i{display:block;width:21px;height:21px;transform:rotate(45deg);border:1px solid #68506f;background:#bba5c9}.notation i:nth-child(2n){background:#a1c8b0;border-color:#51745f}.notation i:nth-child(3n){background:#ddbc89;border-color:#8c6d40}.piano-strip{height:69px;display:flex;background:#f6f6ef;border:1px solid #7c7480}.piano-strip span{flex:1;border-right:1px solid #9c949d;position:relative}.piano-strip span:last-child{border:0}.piano-strip span:not(:nth-child(3)):not(:last-child)::after{content:'';position:absolute;right:-6px;top:0;width:11px;height:39px;background:#34333a;z-index:1}.music-guide .guide-art{padding:18px;min-height:0;background:#273738;transform:rotate(1deg)}.guide-art .screen{display:block;width:100%;height:auto}.music-guide .guide-art .mono{color:#ceded7;margin:14px 4px 0}
.guide-facts{margin:0 7%;padding:21px 0;display:grid;grid-template-columns:repeat(3,1fr);gap:25px;border-block:1px solid var(--line)}.guide-facts dt{font:10px/1.6 'Courier New',monospace;color:var(--muted);text-transform:uppercase;letter-spacing:.5px}.guide-facts dd{font-size:15px;line-height:1.5;margin:6px 0 0}
.guide-layout{display:grid;grid-template-columns:190px minmax(0,1fr);gap:8%;padding:48px 7% 64px}.guide-toc{align-self:start;position:sticky;top:24px;font-size:12px;line-height:1.5}.guide-toc p{color:var(--muted);margin-bottom:14px}.guide-toc a{display:block;padding:9px 0;text-decoration:underline;text-decoration-color:#b9bfae}.guide-body{max-width:760px;font-size:16px;line-height:1.65}.guide-body section{scroll-margin-top:25px;margin-bottom:46px}.guide-body h2{font:400 36px/1.15 Georgia,serif;letter-spacing:-.7px;margin:0 0 22px}.guide-body h3{font-size:19px;line-height:1.4;font-weight:500;margin:25px 0 9px}.guide-body p+p{margin-top:14px}.guide-body a{text-decoration:underline;text-decoration-color:var(--accent)}.guide-body ul,.guide-body ol{padding-left:23px;margin:18px 0}.guide-body li{padding-left:4px;margin:12px 0}.guide-body strong{font-weight:600}.guide-body .margin-note{background:var(--tint);border-left:3px solid var(--accent);padding:20px 24px;margin:26px 0;font-family:Georgia,serif;font-size:19px;line-height:1.5}.guide-body .faq{border-top:1px solid var(--line);padding-top:2px}.guide-end{border-top:1px solid var(--line);padding-top:30px}.guide-end .guide-action{text-decoration:none}.guide-end .mono{display:block;margin-top:20px;color:var(--muted)}.guide-related{border-top:1px solid var(--line);padding:28px 7%;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.guide-related a{text-decoration:underline;font-size:14px;padding:8px 0}
@media(max-width:900px){.guide-hero{gap:5%;padding-inline:5%}.guide-top{padding-inline:5%}.guide-art{padding:20px}.guide-facts{margin-inline:5%}.guide-layout{padding-inline:5%;gap:5%;grid-template-columns:145px minmax(0,1fr)}.guide-body h2{font-size:32px}}
@media(max-width:650px){.guide-top{padding:22px 24px 0}.guide-hero{grid-template-columns:1fr;gap:32px;padding:24px 24px 35px}.guide-hero h1{font-size:58px;letter-spacing:-2.3px}.guide-lead{font-size:17px;margin-top:21px}.guide-art{max-width:450px;width:100%;min-height:0;padding:22px}.guide-art img.app-icon{width:56px;height:56px;margin-bottom:10px}.nested-paper{padding:12px;font-size:17px;margin-top:10px}.paper-note{margin-top:14px}.guide-facts{margin:0 24px;gap:17px;grid-template-columns:1fr}.guide-facts>div{display:grid;grid-template-columns:85px 1fr;gap:15px}.guide-facts dd{margin:0;font-size:14px}.guide-facts dt{padding-top:3px}.guide-layout{display:block;padding:27px 24px 35px}.guide-toc{position:static;border-bottom:1px solid var(--line);padding-bottom:22px;margin-bottom:32px;display:flex;gap:4px 22px;flex-wrap:wrap}.guide-toc p{flex-basis:100%;margin-bottom:3px}.guide-toc a{padding:6px 0}.guide-body{font-size:16px}.guide-body h2{font-size:31px}.guide-body section{margin-bottom:34px}.guide-body .margin-note{padding:17px 20px}.guide-related{padding:22px 24px;gap:4px 25px}.guide-caption{font-size:17px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}