:root{--guide-primary:#6c5ce7;--guide-primary-dark:#5142c9;--guide-dark:#242039;--guide-muted:#716b86;--guide-border:#e8e5f2;--guide-bg:#f6f5fb;--guide-success:#00b894}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:18px}body.instruction-page{margin:0;padding:28px;background:radial-gradient(circle at 14% 2%,rgba(108,92,231,.08),transparent 28%),var(--guide-bg);color:var(--guide-dark);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.instruction-shell{width:min(1460px,100%);margin:0 auto;padding:26px;background:rgba(255,255,255,.93);border:1px solid rgba(108,92,231,.08);border-radius:26px;box-shadow:0 24px 70px rgba(39,31,83,.09)}
.instruction-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:4px 4px 22px;border-bottom:1px solid var(--guide-border)}.instruction-brand{display:flex;align-items:center;gap:13px;color:var(--guide-dark);text-decoration:none;font-weight:850}.instruction-brand img{width:148px;height:48px;object-fit:contain;object-position:left center}.instruction-brand span{padding-left:13px;border-left:1px solid var(--guide-border);color:var(--guide-muted);font-size:13px}.instruction-header__actions{display:flex;gap:9px}.instruction-header__actions a{display:inline-flex;align-items:center;gap:7px;min-height:42px;padding:10px 14px;border:1px solid var(--guide-border);border-radius:12px;background:#fff;color:#49435e;text-decoration:none;font-size:13px;font-weight:800;transition:.2s}.instruction-header__actions a:hover{border-color:#cfc8fa;color:var(--guide-primary);transform:translateY(-1px)}
.instruction-hero{position:relative;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);gap:36px;align-items:center;margin:24px 0;padding:48px;border:1px solid rgba(108,92,231,.12);border-radius:24px;background:linear-gradient(135deg,#f8f6ff 0%,#fff 56%,#f2fffb 100%);overflow:hidden}.instruction-hero:after{content:"";position:absolute;right:-120px;top:-170px;width:390px;height:390px;border-radius:50%;background:rgba(108,92,231,.07)}.instruction-hero__copy,.instruction-hero__visual{position:relative;z-index:1}.instruction-kicker{display:inline-flex;align-items:center;gap:8px;color:var(--guide-primary);font-size:12px;font-weight:900;letter-spacing:.06em;text-transform:uppercase}.instruction-hero h1{max-width:760px;margin:13px 0 16px;font-size:clamp(34px,4.4vw,58px);line-height:1.02;letter-spacing:-.045em}.instruction-hero p{max-width:710px;margin:0;color:var(--guide-muted);font-size:16px;line-height:1.7}.instruction-hero__actions{display:flex;gap:10px;margin-top:24px}.instruction-primary,.instruction-secondary{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:46px;padding:11px 17px;border-radius:13px;text-decoration:none;font-size:13px;font-weight:850}.instruction-primary{background:linear-gradient(135deg,var(--guide-primary),#8476ef);color:#fff;box-shadow:0 10px 24px rgba(108,92,231,.24)}.instruction-secondary{border:1px solid #ddd8f7;background:#fff;color:var(--guide-primary)}.instruction-hero__visual{display:grid;gap:13px}.instruction-hero__badge{justify-self:end;display:inline-flex;align-items:center;gap:7px;padding:8px 12px;border-radius:999px;background:#e8faf5;color:#008a6f;font-size:12px;font-weight:850}.instruction-hero__card{display:flex;align-items:center;gap:14px;padding:17px;border:1px solid rgba(108,92,231,.13);border-radius:17px;background:rgba(255,255,255,.92);box-shadow:0 12px 30px rgba(43,35,94,.08)}.instruction-hero__card>i{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:13px;background:#eeeaff;color:var(--guide-primary);font-size:18px}.instruction-hero__card strong,.instruction-hero__card small{display:block}.instruction-hero__card strong{font-size:15px}.instruction-hero__card small{margin-top:4px;color:var(--guide-muted);font-size:12px}
.instruction-layout{display:grid;grid-template-columns:245px minmax(0,1fr);gap:22px}.instruction-nav-wrap{position:relative}.instruction-nav{position:sticky;top:18px;display:grid;gap:3px;padding:14px;border:1px solid var(--guide-border);border-radius:18px;background:#fff;box-shadow:0 8px 25px rgba(37,30,80,.055)}.instruction-nav__title{display:flex;align-items:center;gap:9px;margin:2px 5px 9px;padding-bottom:11px;border-bottom:1px solid var(--guide-border);font-size:13px;font-weight:900}.instruction-nav a{display:flex;align-items:center;gap:10px;padding:8px 9px;border-radius:10px;color:#5c566f;text-decoration:none;font-size:12px;font-weight:720;transition:.18s}.instruction-nav a span{width:25px;height:25px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 25px;border-radius:8px;background:#f2f0f8;color:#756d8c;font-size:10px;font-weight:900}.instruction-nav a:hover{background:#f4f1ff;color:var(--guide-primary)}.instruction-nav a:hover span{background:var(--guide-primary);color:#fff}.instruction-content{display:grid;gap:20px;min-width:0}
.guide-step{scroll-margin-top:18px;padding:25px;border:1px solid var(--guide-border);border-radius:21px;background:#fff;box-shadow:0 9px 28px rgba(39,32,82,.055)}.guide-step>header{display:flex;align-items:flex-start;gap:15px;margin-bottom:18px}.guide-step__number{width:48px;height:48px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 48px;border-radius:15px;background:linear-gradient(135deg,var(--guide-primary),#8b7df1);color:#fff;font-size:16px;font-weight:900;box-shadow:0 8px 18px rgba(108,92,231,.2)}.guide-step__eyebrow{color:var(--guide-primary);font-size:10px;font-weight:900;letter-spacing:.07em;text-transform:uppercase}.guide-step h2{margin:3px 0 5px;font-size:23px;letter-spacing:-.02em}.guide-step header p{margin:0;color:var(--guide-muted);font-size:13px;line-height:1.5}.guide-step figure{margin:0;border:1px solid #e3e0ee;border-radius:17px;background:#f7f6fb;overflow:hidden}.guide-step figure img{display:block;width:100%;height:auto;aspect-ratio:16/8.4;object-fit:cover;object-position:top center;background:#f4f2fa}.guide-step figcaption{padding:10px 13px;border-top:1px solid #e8e5f1;background:#fff;color:#827d98;font-size:11px}.guide-step__body{display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,.7fr);gap:18px;margin-top:18px}.guide-step__body ol{display:grid;gap:9px;margin:0;padding:0;list-style:none;counter-reset:guide-action}.guide-step__body li{position:relative;min-height:30px;padding:5px 0 5px 38px;color:#4f4963;font-size:13px;line-height:1.5;counter-increment:guide-action}.guide-step__body li:before{content:counter(guide-action);position:absolute;left:0;top:2px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:9px;background:#f1eeff;color:var(--guide-primary);font-size:11px;font-weight:900}.guide-tip,.guide-warning{display:flex;align-items:flex-start;gap:10px;margin:0;padding:14px;border-radius:13px;font-size:12px;line-height:1.55}.guide-tip{background:#f2fffb;color:#376e62;border:1px solid rgba(0,184,148,.13)}.guide-tip>i{color:var(--guide-success);margin-top:2px}.guide-warning{background:#f5f2ff;color:#5c537d;border:1px solid rgba(108,92,231,.13)}.guide-warning>i{color:var(--guide-primary);margin-top:2px}
.instruction-faq{scroll-margin-top:18px;padding:29px;border:1px solid var(--guide-border);border-radius:21px;background:linear-gradient(145deg,#fff,#faf9ff);box-shadow:0 9px 28px rgba(39,32,82,.055)}.instruction-faq h2{margin:8px 0 18px;font-size:25px}.instruction-faq__list{display:grid;gap:9px}.instruction-faq details{border:1px solid #e7e4f0;border-radius:13px;background:#fff}.instruction-faq summary{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:15px 16px;cursor:pointer;list-style:none;color:#39334e;font-size:13px;font-weight:850}.instruction-faq summary::-webkit-details-marker{display:none}.instruction-faq details[open] summary i{transform:rotate(45deg)}.instruction-faq summary i{color:var(--guide-primary);transition:.2s}.instruction-faq details p{margin:0;padding:0 16px 16px;color:var(--guide-muted);font-size:13px;line-height:1.6}.instruction-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:24px;padding:23px 26px;border-radius:18px;background:#29243e;color:#fff}.instruction-footer strong,.instruction-footer span{display:block}.instruction-footer strong{font-size:17px}.instruction-footer span{margin-top:4px;color:#c9c4d8;font-size:12px}.instruction-footer a{display:inline-flex;align-items:center;gap:8px;color:#fff;text-decoration:none;font-size:13px;font-weight:850}
@media(max-width:980px){body.instruction-page{padding:16px}.instruction-shell{padding:18px}.instruction-hero{grid-template-columns:1fr;padding:34px}.instruction-hero__visual{grid-template-columns:1fr 1fr}.instruction-hero__badge{grid-column:1/-1;justify-self:start}.instruction-layout{grid-template-columns:1fr}.instruction-nav-wrap{overflow:hidden}.instruction-nav{position:static;display:flex;overflow:auto;scrollbar-width:none;padding:11px}.instruction-nav::-webkit-scrollbar{display:none}.instruction-nav__title{display:none}.instruction-nav a{flex:0 0 auto;white-space:nowrap;border:1px solid #ece9f3}.guide-step__body{grid-template-columns:1fr}}
@media(max-width:680px){body.instruction-page{padding:0}.instruction-shell{padding:14px;border:0;border-radius:0}.instruction-header{align-items:flex-start;padding-bottom:14px}.instruction-brand img{width:118px;height:40px}.instruction-brand span{display:none}.instruction-header__actions{display:grid;grid-template-columns:1fr}.instruction-header__actions a{min-height:37px;padding:8px 10px;font-size:11px}.instruction-hero{margin:14px 0;padding:25px 19px;border-radius:19px}.instruction-hero h1{font-size:34px}.instruction-hero p{font-size:14px}.instruction-hero__actions{display:grid}.instruction-hero__visual{grid-template-columns:1fr}.instruction-hero__badge{grid-column:auto}.instruction-layout{gap:14px}.guide-step{padding:17px;border-radius:18px}.guide-step>header{gap:11px}.guide-step__number{width:42px;height:42px;flex-basis:42px;border-radius:13px}.guide-step h2{font-size:19px}.guide-step figure{border-radius:14px}.guide-step figure img{aspect-ratio:4/3}.guide-step__body{margin-top:15px}.instruction-faq{padding:20px}.instruction-footer{align-items:flex-start;flex-direction:column;padding:20px}}