.guide-hero{background:linear-gradient(135deg,#1e3a5f 0%,#1e40af 50%,#2563eb 100%);color:#fff;text-align:center;padding:64px 0 80px;position:relative;overflow:hidden}.guide-hero:before{content:'';position:absolute;top:-80px;right:-60px;width:350px;height:350px;background:rgba(255,255,255,.04);border-radius:50%;pointer-events:none}.guide-hero:after{content:'';position:absolute;bottom:-40px;left:-30px;width:200px;height:200px;background:rgba(255,255,255,.03);border-radius:50%;pointer-events:none}.guide-hero__badge{display:inline-flex;align-items:center;gap:6px;padding:6px 16px;background:rgba(255,255,255,.12);backdrop-filter:blur(8px);color:#fff;border-radius:var(--radius-full);font-size:var(--xs);font-weight:600;margin-bottom:20px;border:1px solid rgba(255,255,255,.15)}.guide-hero__title{font-size:var(--h1);margin:0 auto 16px;max-width:760px;letter-spacing:-.04em;color:#fff;line-height:1.1}.guide-hero__desc{font-size:1.1rem;color:rgba(255,255,255,.8);max-width:600px;margin:0 auto;line-height:1.65}.guide-hero__wave{position:absolute;bottom:-1px;left:0;width:100%;line-height:0}.guide-hero__wave svg{display:block;width:100%;height:auto}.guide-toc-wrap{background:var(--bg);border-bottom:1px solid var(--border);position:sticky;top:64px;z-index:50;transition:box-shadow var(--transition)}.guide-toc-wrap.is-stuck{box-shadow:0 2px 8px rgba(0,0,0,.06)}.guide-toc{display:flex;align-items:stretch;padding:0;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none}.guide-toc::-webkit-scrollbar{display:none}.guide-toc__item{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 4px;text-decoration:none;position:relative;transition:all var(--transition)}.guide-toc__item:not(:last-child):after{content:'';position:absolute;top:22px;right:-1px;width:calc(100% - 28px);height:2px;background:var(--border);transform:translateX(50%);z-index:0}.guide-toc__num{width:28px;height:28px;border-radius:50%;background:var(--bg-alt);border:2px solid var(--border);color:var(--text-muted);font-size:.7rem;font-weight:800;display:flex;align-items:center;justify-content:center;transition:all var(--transition);position:relative;z-index:1;flex-shrink:0}.guide-toc__label{font-size:.65rem;font-weight:600;color:var(--text-muted);text-align:center;line-height:1.2;transition:color var(--transition);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}.guide-toc__item:hover .guide-toc__num,.guide-toc__item.is-active .guide-toc__num{background:var(--primary);border-color:var(--primary);color:#fff;box-shadow:0 2px 8px rgba(37,99,235,.25)}.guide-toc__item:hover .guide-toc__label,.guide-toc__item.is-active .guide-toc__label{color:var(--primary)}.guide-toc__item.is-active:not(:last-child):after{background:var(--primary)}.guide-modes{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.guide-mode-card{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-xl);padding:32px 28px;transition:all var(--transition)}.guide-mode-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-3px)}.guide-mode-card__icon{font-size:2rem;margin-bottom:12px}.guide-mode-card__title{font-size:var(--body);font-weight:700;color:var(--navy);margin:0 0 8px}.guide-mode-card__desc{font-size:var(--small);color:var(--text-light);line-height:1.65;margin:0}.guide-callout{border-radius:var(--radius-lg);padding:16px 20px;margin:24px 0;font-size:var(--small);line-height:1.65}.guide-callout p{margin:0}.guide-callout a{font-weight:600}.guide-callout--blue{background:var(--primary-light);border:1px solid var(--primary-50);color:var(--text-secondary)}.guide-callout--tip{background:#fffbeb;border:1px solid #fef3c7;color:var(--text-secondary)}.guide-pattern-list{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:24px}.guide-pattern-item{display:flex;align-items:baseline;gap:8px;padding:12px 16px;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);font-size:var(--small);transition:all var(--transition)}.guide-pattern-item:hover{border-color:var(--primary);background:var(--primary-light)}.guide-pattern-item a{font-weight:600}.guide-pattern-item span{color:var(--text-muted);font-size:var(--xs)}.guide-features-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.guide-features-grid--3col{grid-template-columns:repeat(3,1fr)}.guide-feature{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-xl);padding:24px 20px;transition:all var(--transition)}.guide-feature:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.guide-feature__icon{font-size:1.5rem;margin-bottom:10px}.guide-feature__title{font-size:var(--small);font-weight:700;color:var(--navy);margin:0 0 6px}.guide-feature__desc{font-size:var(--small);color:var(--text-light);line-height:1.6;margin:0}.guide-steps-list{display:flex;flex-direction:column;gap:16px;margin:24px 0}.guide-step{display:flex;gap:16px;align-items:flex-start}.guide-step__num{width:36px;height:36px;min-width:36px;border-radius:50%;background:var(--primary);color:#fff;font-weight:800;font-size:var(--small);display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(37,99,235,.2);margin-top:2px}.guide-step__content h3{font-size:var(--body);font-weight:700;color:var(--navy);margin:0 0 4px}.guide-step__content p{font-size:var(--small);color:var(--text-secondary);line-height:1.65;margin:0}.guide-legend{display:flex;flex-wrap:wrap;gap:16px;margin:16px 0 24px}.guide-legend__item{display:flex;align-items:center;gap:8px;font-size:var(--small);color:var(--text-secondary)}.guide-legend__swatch{width:20px;height:20px;border-radius:4px;flex-shrink:0}.guide-tips{display:flex;flex-direction:column;gap:16px}.guide-tip{display:flex;gap:16px;align-items:flex-start;padding:20px;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-xl);transition:all var(--transition)}.guide-tip:hover{box-shadow:var(--shadow-md)}.guide-tip__icon{font-size:1.5rem;flex-shrink:0;margin-top:2px}.guide-tip__title{font-size:var(--small);font-weight:700;color:var(--navy);margin:0 0 4px}.guide-tip p{font-size:var(--small);color:var(--text-light);line-height:1.65;margin:0}.guide-cta{text-align:center;padding:48px 0}.guide-cta__title{font-size:var(--h2);color:var(--navy);margin:0 0 12px}.guide-cta__desc{font-size:1.05rem;color:var(--text-light);max-width:480px;margin:0 auto 24px}@media (max-width:1023px){.guide-features-grid--3col{grid-template-columns:repeat(2,1fr)}.guide-toc__label{font-size:.6rem}}@media (max-width:768px){.guide-hero{padding:48px 0 64px}.guide-modes{grid-template-columns:1fr}.guide-pattern-list{grid-template-columns:1fr}.guide-features-grid{grid-template-columns:1fr}.guide-features-grid--3col{grid-template-columns:1fr}.guide-toc__item{min-width:70px;flex:0 0 auto;padding:10px 6px}.guide-toc__item:not(:last-child):after{display:none}.guide-toc__label{font-size:.6rem}.guide-toc__num{width:24px;height:24px;font-size:.65rem}}@media (max-width:639px){.guide-hero{padding:32px 0 48px}.guide-hero__title{font-size:clamp(1.5rem, 7vw, 2.25rem)}.guide-hero__desc{font-size:.95rem}.guide-toc-wrap{top:64px}.guide-toc__item{min-width:60px;padding:8px 4px}.guide-toc__num{width:22px;height:22px;font-size:.6rem;border-width:1.5px}.guide-toc__label{font-size:.55rem}.guide-mode-card{padding:24px 20px}.guide-feature{padding:20px 16px}.guide-tip{padding:16px;flex-direction:column;gap:8px}}@media (max-width:400px){.guide-hero{padding:24px 0 40px}.guide-toc__item{min-width:52px}.guide-toc__label{display:none}.guide-toc__num{width:26px;height:26px;font-size:.65rem}}