:root{color-scheme:dark;--bg:#0a0b10;--card:#13141d;--line:#2b2c37;--ink:#f0eee8;--muted:#a7a6b2;--accent:#b7a5f6}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.8 -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif}a{color:var(--accent);text-decoration:none}button,.btn,.guide-start{display:inline-block;background:#ede9e2;color:#14141b;border:0;border-radius:999px;padding:12px 22px;font:inherit;font-weight:600;font-size:15px;line-height:1.5;cursor:pointer}button:hover,.btn:hover{background:#d9cff1}button:focus-visible,a:focus-visible{outline:3px solid var(--accent);outline-offset:4px}.guide-nav{display:flex;justify-content:space-between;gap:20px;padding:24px 5vw;border-bottom:1px solid var(--line)}.guide-wrap{max-width:1240px;margin:auto;padding:56px 48px 80px}.guide-hero{max-width:820px;margin-bottom:48px}.guide-kicker{color:var(--accent);font-size:13px;letter-spacing:.2em}.guide-hero h1{font:500 clamp(36px,5vw,64px)/1.2 "Songti SC",serif;margin:20px 0}.guide-hero p{font-size:19px;color:var(--muted)}.guide-buttons{display:flex;gap:12px;flex-wrap:wrap}.guide-buttons button+button{background:#21202d;color:var(--ink);border:1px solid #4d455f}.guide-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.guide-section{padding:28px 32px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(150deg,#161722,#101118)}h2{font:500 27px/1.4 "Songti SC",serif;margin:0 0 18px}h3{font-size:21px;line-height:1.5}.guide-section p{margin:12px 0;color:#ccc8d4}.guide-manual,.guide-tutorial,.guide-contact{margin-top:32px;padding:32px;border:1px solid var(--line);border-radius:24px;background:var(--card)}.guide-manual a{margin-left:16px}.guide-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.guide-steps article{padding:20px;background:#0e0f15;border-radius:16px}.guide-steps img{width:100%;height:auto;border-radius:12px;border:1px solid var(--line)}.step-num{color:var(--accent);font-size:13px;letter-spacing:.2em}.guide-contact img{display:block;max-width:100%;object-fit:contain;background:white;border-radius:16px;padding:8px}.guide-start{margin-top:32px}textarea{width:100%;min-height:120px;background:#090a10;color:var(--ink);border:1px solid var(--line);padding:16px}
@media(max-width:600px){.guide-nav{padding:18px 20px}.guide-nav>a{font-size:19px;font-weight:600;padding:6px 0;min-height:44px}.guide-nav>span{display:none}.guide-wrap{padding:28px 20px 48px}.guide-hero{margin-bottom:28px}.guide-hero h1{font-size:34px}.guide-hero p{font-size:17px}.guide-columns{display:block}.guide-section{background:none;border:0;border-radius:0;padding:12px 0;margin-bottom:16px}.guide-manual,.guide-tutorial,.guide-contact{padding:22px 18px}.guide-steps{display:block}.guide-steps article{margin-top:18px}.guide-manual a{display:block;margin:18px 0 0}.guide-buttons{flex-direction:column}h2{font-size:24px}}

/* Scoped to the introduction hero; all other guide sections keep their styles. */
.guide-intro{max-width:960px}
.guide-intro .guide-buttons{align-items:stretch;gap:12px}
.guide-intro .guide-buttons>button,.guide-intro .guide-buttons>.guide-start,.guide-intro .guide-connect>.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 20px;border:1px solid #504858;font-size:15px;line-height:1.5;text-align:center;white-space:normal}
.guide-intro .guide-buttons>button{background:#17161f;color:#d1cad9}
.guide-intro .guide-buttons>button:hover{background:#25212e}
.guide-intro .guide-buttons>.guide-start{margin:0 0 0 8px;background:#d5a2a6;border-color:#d5a2a6;color:#27161c;min-width:142px}
.guide-intro .guide-buttons>.guide-start:hover{background:#e1b6b9;border-color:#e1b6b9}
.guide-intro .guide-connect{display:flex;align-items:center;gap:24px;margin-top:22px;padding:20px 22px;border:1px solid #443a50;border-radius:18px;background:#17141f}
.guide-intro .guide-connect>p{margin:0;flex:1;min-width:0;font-size:15px;line-height:1.8;color:#c3bdcd;overflow-wrap:anywhere}
.guide-intro .guide-connect>.btn{flex-shrink:0;background:#bcaed9;border-color:#bcaed9;color:#21192e}
.guide-intro .guide-connect>.btn:hover{background:#d0c4e7}
.guide-intro #copy-result:empty{display:none}
@media(max-width:600px){.guide-intro .guide-buttons{flex-direction:row;flex-wrap:wrap}.guide-intro .guide-buttons>button{flex:1 1 auto;padding:12px 16px}.guide-intro .guide-buttons>.guide-start{flex:1 1 100%;margin:0}.guide-intro .guide-connect{flex-direction:column;align-items:stretch;gap:14px;padding:16px 18px;margin-top:18px}.guide-intro .guide-connect>.btn{align-self:flex-start;max-width:100%}}

/* Copy actions are distinct; feedback wraps beside the activated button. */
.guide-page .guide-intro .guide-buttons button[data-copy="intro"]{background:#c1b3df;color:#17131f;border-color:#c1b3df}.guide-page .guide-steps img{width:100%;height:260px;object-fit:contain;background:#fff}.copy-feedback{font-size:14px;line-height:1.6;color:inherit}

/* Public introduction: one copy action, then registration, then the verbatim introduction. */
.guide-public-about .guide-start{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:min(100%,320px);min-height:54px;margin:24px 0 14px;padding:14px 24px;font-size:20px;font-weight:700}.guide-public-about .guide-login-note{font-size:14px;color:#b9b3c5;margin:0}.guide-public-about .guide-buttons{margin-top:20px}
