*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:Arial,Helvetica,sans-serif;background:radial-gradient(circle at top left,rgba(255,255,255,.12),transparent 28%),radial-gradient(circle at top right,rgba(160,180,210,.10),transparent 32%),linear-gradient(180deg,#05070b,#090d14 45%,#05070b);color:#f4f6f9;line-height:1.65;min-height:100vh}a{text-decoration:none;color:inherit}.wrap{width:min(calc(100% - 40px),1180px);margin:auto}header{position:sticky;top:0;z-index:50;background:rgba(5,7,11,.88);border-bottom:1px solid rgba(255,255,255,.10);backdrop-filter:blur(18px)}.nav{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:20px}.logo{font-weight:950;letter-spacing:2px;font-size:21px;background:linear-gradient(180deg,#fff,#dfe5ec 50%,#99a4b3);-webkit-background-clip:text;color:transparent}.nav-links{display:flex;gap:18px;align-items:center;color:#cbd3de;font-size:13px}.nav-links a:hover{color:#fff}.hero{padding:84px 0 50px;text-align:center}.badge{display:inline-flex;padding:8px 14px;border:1px solid rgba(255,255,255,.19);border-radius:999px;background:rgba(255,255,255,.055);font-size:12px;font-weight:850;margin-bottom:20px}.hero h1{font-size:clamp(40px,7vw,66px);line-height:1.03;letter-spacing:-2px;margin-bottom:18px;background:linear-gradient(180deg,#fff,#dfe5ec 48%,#929dac);-webkit-background-clip:text;color:transparent}.hero p{max-width:850px;margin:0 auto;color:#bdc6d3;font-size:17px}.guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;padding:24px 0 80px}.guide-card{display:flex;flex-direction:column;min-height:260px;padding:28px;border:1px solid rgba(255,255,255,.14);border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.035));box-shadow:inset 0 1px 0 rgba(255,255,255,.10);transition:.22s}.guide-card:hover{transform:translateY(-5px);border-color:rgba(255,255,255,.28)}.guide-card .number{font-size:13px;color:#8f9baa;font-weight:900;margin-bottom:14px}.guide-card h2{font-size:27px;margin-bottom:10px}.guide-card p{color:#b7c1ce;margin-bottom:22px}.guide-card .button{margin-top:auto}.button{display:inline-flex;width:max-content;padding:12px 18px;border-radius:12px;border:1px solid rgba(255,255,255,.20);background:linear-gradient(180deg,#fff,#dce2e9 52%,#abb5c2);color:#05070b;font-weight:900}.button.secondary{background:rgba(255,255,255,.06);color:#fff}.section{padding:30px 0 82px}.page-head{max-width:900px;margin:0 auto 34px;text-align:center}.page-head h1{font-size:clamp(38px,6vw,60px);line-height:1.05;margin-bottom:15px}.page-head p{color:#b9c3d0}.warning{padding:22px;margin-bottom:28px;border:1px solid rgba(255,200,120,.28);border-radius:20px;background:rgba(255,200,120,.055)}.warning strong{display:block;margin-bottom:8px}.warning p{color:#d3dae3;font-size:14px}.step{display:grid;grid-template-columns:105px 1fr;gap:24px;margin-bottom:24px;padding:26px;border:1px solid rgba(255,255,255,.13);border-radius:23px;background:linear-gradient(180deg,rgba(255,255,255,.085),rgba(255,255,255,.028));box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}.step-no{font-size:44px;font-weight:950;line-height:1;color:#b8c2cf}.step-body h2{font-size:24px;margin-bottom:8px}.step-body>p{color:#b9c3d0;margin-bottom:18px}.image-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.image-slot{min-height:190px;display:grid;place-items:center;padding:18px;border:1px dashed rgba(255,255,255,.20);border-radius:17px;background:rgba(0,0,0,.20);color:#8490a0;text-align:center;font-size:12px}.image-slot img{width:100%;height:auto;display:block;border-radius:13px}.image-grid.one{grid-template-columns:1fr}.image-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.image-grid.four{grid-template-columns:repeat(2,minmax(0,1fr))}.note{margin-top:14px;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.045);color:#9faaba;font-size:12px}.exchange-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;padding:20px 0 80px}.exchange-link{padding:24px;border:1px solid rgba(255,255,255,.13);border-radius:20px;background:rgba(255,255,255,.05)}.exchange-link h2{margin-bottom:7px}.exchange-link p{color:#9facbb;font-size:14px;margin-bottom:16px}.status{display:inline-flex;padding:5px 9px;border:1px solid rgba(255,255,255,.16);border-radius:999px;font-size:11px;font-weight:900}.status.soon{color:#8f99a7}footer{padding:34px 0;border-top:1px solid rgba(255,255,255,.10);text-align:center;color:#8994a4;font-size:12px}@media(max-width:800px){.nav-links{display:none}.guide-grid,.exchange-list{grid-template-columns:1fr}.step{grid-template-columns:1fr}.image-grid,.image-grid.three,.image-grid.four{grid-template-columns:1fr}}

/* AUTOMATIC GUIDE SCREENSHOT LAYOUT
   1 image = full width, 2 images = 2 columns,
   3 images = 3 columns, 4 images = 2 x 2. */
.auto-image-grid[data-image-count="1"]{grid-template-columns:1fr}
.auto-image-grid[data-image-count="2"]{grid-template-columns:repeat(2,minmax(0,1fr))}
.auto-image-grid[data-image-count="3"]{grid-template-columns:repeat(3,minmax(0,1fr))}
.auto-image-grid[data-image-count="4"]{grid-template-columns:repeat(2,minmax(0,1fr))}
.auto-image-grid.is-empty{grid-template-columns:1fr}
.image-loading{grid-column:1/-1}
.image-empty{grid-column:1/-1;min-height:155px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}
.image-empty strong{color:#cbd4df;font-size:13px;letter-spacing:.5px}
.image-empty span{color:#8490a0;line-height:1.55}
.guide-image{margin:0;overflow:hidden;border:1px solid rgba(255,255,255,.16);border-radius:17px;background:rgba(0,0,0,.20)}
.guide-image img{display:block;width:100%;height:auto;object-fit:contain}
@media(max-width:800px){.auto-image-grid[data-image-count="1"],.auto-image-grid[data-image-count="2"],.auto-image-grid[data-image-count="3"],.auto-image-grid[data-image-count="4"]{grid-template-columns:1fr}}
