/* roulang page: index */
:root{
      --ink:#17111d;
      --night:#211425;
      --berry:#3a1d3d;
      --coral:#ed665e;
      --pink:#f59ab0;
      --lime:#d7ef70;
      --paper:#fff8e9;
      --muted:#b7a6b8;
      --line:#604765;
      --shadow:5px 6px 0 rgba(8,5,12,.46);
      --radius:6px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      color:var(--paper);
      background:
        linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px),
        var(--ink);
      background-size:22px 22px;
      font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",Arial,sans-serif;
      line-height:1.7;
      padding-bottom:88px;
    }
    a{color:inherit;text-decoration:none}
    button,input,select{font:inherit}
    button{cursor:pointer}
    .container{width:min(1180px,calc(100% - 40px));margin:auto}
    .pixel{font-family:"Courier New",monospace;letter-spacing:.04em}
    .site-header{
      position:sticky;top:0;z-index:40;
      background:rgba(23,17,29,.94);
      border-bottom:1px solid var(--line);
      backdrop-filter:blur(8px);
    }
    .nav-row{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}
    .brand{font-weight:900;font-size:19px;line-height:1.15;max-width:320px;color:var(--paper)}
    .brand-mark{color:var(--coral);margin-right:8px}
    .nav-links{display:flex;align-items:center;gap:8px}
    .nav-links a,.step-link{
      color:var(--muted);padding:9px 12px;border:1px solid transparent;
      transition:.2s ease;
    }
    .nav-links a:hover,.nav-links a:focus-visible,.step-link:hover,.step-link:focus-visible{
      color:var(--lime);border-color:var(--line);transform:translateY(-2px);
    }
    .nav-links a.active{color:var(--paper);border-color:var(--coral);background:#321c35}
    .menu-btn{display:none;background:transparent;color:var(--paper);border:1px solid var(--line);padding:8px 12px}
    .progress{display:flex;gap:10px;overflow-x:auto;padding:10px 0 12px;border-top:1px solid rgba(255,255,255,.04)}
    .progress::-webkit-scrollbar{height:3px}.progress::-webkit-scrollbar-thumb{background:var(--coral)}
    .step-link{white-space:nowrap;font-size:13px;display:flex;gap:8px;align-items:center}
    .step-no{display:inline-grid;place-items:center;width:22px;height:22px;background:#493149;color:var(--lime);font-size:12px}
    .step-link.current{background:var(--coral);color:var(--ink);border-color:var(--coral);font-weight:800}
    .step-link.current .step-no{background:var(--ink);color:var(--lime)}
    .hero{padding:92px 0 72px}
    .hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:58px;align-items:center}
    .eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--lime);font-size:13px;margin-bottom:18px}
    .dot{width:8px;height:8px;background:var(--coral);display:inline-block;box-shadow:3px 3px 0 #7c3946}
    h1,h2,h3{margin:0;line-height:1.18;letter-spacing:-.03em}
    h1{font-size:clamp(35px,5vw,62px);max-width:720px}
    h2{font-size:clamp(28px,3.5vw,42px)}
    h3{font-size:21px}
    .hero-copy{color:#d6c8d4;font-size:17px;max-width:650px;margin:24px 0 28px}
    .actions{display:flex;gap:12px;flex-wrap:wrap}
    .btn{
      min-height:46px;padding:10px 18px;border:1px solid var(--coral);border-radius:var(--radius);
      display:inline-flex;align-items:center;justify-content:center;font-weight:800;
      transition:.2s ease;box-shadow:4px 4px 0 rgba(0,0,0,.28)
    }
    .btn-primary{background:var(--coral);color:var(--ink)}
    .btn-secondary{background:transparent;color:var(--paper);border-color:var(--line)}
    .btn:hover,.btn:focus-visible{transform:translate(2px,2px);box-shadow:2px 2px 0 rgba(0,0,0,.25);outline:none}
    .btn:active{transform:translate(4px,4px);box-shadow:none}
    .btn.disabled{opacity:.42;cursor:not-allowed}
    .notice{display:flex;gap:10px;align-items:flex-start;color:var(--muted);font-size:13px;margin-top:24px;padding:13px;border-left:3px solid var(--lime);background:rgba(255,255,255,.035)}
    .stage{
      background:#2d1930;border:1px solid var(--line);box-shadow:var(--shadow);padding:18px;
      transform:rotate(1.2deg)
    }
    .stage-bar{display:flex;gap:7px;align-items:center;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:16px}
    .stage-dot{width:10px;height:10px;background:var(--coral)}
    .stage-dot:nth-child(2){background:var(--pink)}.stage-dot:nth-child(3){background:var(--lime)}
    .stage-title{margin-left:auto;color:var(--muted);font-size:12px}
    .index-panel{display:grid;grid-template-columns:1fr 1fr;gap:10px}
    .index-card{min-height:116px;padding:14px;background:#40203e;border:1px solid #754d6f;position:relative}
    .index-card.large{grid-row:span 2;min-height:242px;background:#51283f}
    .index-card strong{display:block;font-size:18px;margin:8px 0}
    .index-card small{color:#d6bfd0}
    .bar{height:7px;background:#211425;margin-top:18px}.bar i{display:block;height:100%;background:var(--lime)}
    .section{padding:82px 0}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:30px}
    .section-head p{max-width:520px;color:var(--muted);margin:0}
    .triple{display:grid;grid-template-columns:1.15fr 1fr .85fr;gap:14px}
    .panel{background:var(--night);border:1px solid var(--line);border-radius:var(--radius);padding:25px;transition:.2s ease}
    .panel:hover{border-color:var(--pink);transform:translateY(-4px);box-shadow:var(--shadow)}
    .number{font-size:54px;color:var(--coral);font-weight:900;line-height:1}
    .panel p{color:var(--muted);font-size:15px}
    .tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
    .tag,.badge{display:inline-block;padding:4px 9px;border:1px solid #79536f;color:var(--pink);font-size:12px}
    .badge{color:var(--lime);border-color:#68744a}
    .scene{display:grid;grid-template-columns:250px 1fr;gap:18px}
    .scene-tabs{display:flex;flex-direction:column;gap:8px}
    .scene-tab{text-align:left;padding:15px;background:#251629;border:1px solid var(--line);color:var(--muted);transition:.2s}
    .scene-tab:hover{color:var(--paper);border-color:var(--pink)}
    .scene-tab.active{background:var(--coral);color:var(--ink);font-weight:800}
    .browser{background:#f3e4cf;color:var(--ink);border:4px solid #60364f;box-shadow:var(--shadow);padding:18px;min-height:310px}
    .browser-top{display:flex;justify-content:space-between;border-bottom:2px solid #d0bda9;padding-bottom:10px;font-size:13px}
    .search{margin:18px 0;display:flex;gap:8px}.search input,.search select{width:100%;background:#fffaf0;border:1px solid #c8ad9e;padding:10px;color:var(--ink);outline:none}
    .search input:focus,.search select:focus{border-color:#a94558;box-shadow:0 0 0 3px rgba(169,69,88,.18)}
    .result-list{display:grid;grid-template-columns:1.3fr .8fr .8fr;gap:8px}
    .result{padding:12px;background:#fff8e9;border-left:4px solid #e65d61;font-size:14px}
    .result:nth-child(2){border-color:#a46a9e}.result:nth-child(3){border-color:#9bb449}
    .category-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:16px}
    .category-card{padding:28px;background:#321b36;border:1px solid var(--line);min-height:205px;position:relative;overflow:hidden}
    .category-card:nth-child(2){background:#42203a;transform:translateY(24px)}
    .category-card:after{content:"INDEX";position:absolute;right:-8px;bottom:2px;color:rgba(255,255,255,.06);font:bold 58px monospace}
    .category-card p{color:var(--muted);max-width:440px}
    .link-arrow{color:var(--lime);font-weight:800}
    .trust-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;align-items:start}
    .note{padding:20px;background:#2d1930;border:1px solid var(--line);color:#dfd0dc}
    .note:nth-child(2){margin-top:28px}.note:nth-child(3){margin-top:10px}
    .note em{display:block;color:var(--lime);font-style:normal;font-size:13px;margin-bottom:8px}
    .updates{display:grid;grid-template-columns:1.3fr .7fr;gap:24px}
    .update-list{border-top:1px solid var(--line)}
    .update-item{display:flex;justify-content:space-between;gap:20px;padding:17px 0;border-bottom:1px solid var(--line);color:#e8dae4}
    .update-item span{color:var(--muted);font-size:13px;white-space:nowrap}
    .stat-box{background:var(--lime);color:var(--ink);padding:25px;box-shadow:var(--shadow)}
    .stat-box b{display:block;font-size:42px;line-height:1;margin-bottom:10px}
    .faq{max-width:850px}
    details{border-top:1px solid var(--line);padding:18px 0}
    summary{cursor:pointer;font-weight:800;color:var(--paper);list-style:none;display:flex;justify-content:space-between}
    summary::-webkit-details-marker{display:none}
    summary:after{content:"＋";color:var(--lime)}details[open] summary:after{content:"－"}
    details p{color:var(--muted);margin:12px 0 0;max-width:720px}
    .cta{background:var(--coral);color:var(--ink);padding:38px;display:flex;justify-content:space-between;align-items:center;gap:25px;box-shadow:var(--shadow)}
    .cta p{max-width:610px;margin:10px 0 0}
    .footer{border-top:1px solid var(--line);padding:42px 0 112px;color:var(--muted)}
    .footer-grid{display:flex;justify-content:space-between;gap:30px}.footer-brand{color:var(--paper);font-weight:900}
    .footer a:hover{color:var(--lime)}.footer-links{display:flex;gap:18px;flex-wrap:wrap}
    .bottom-bar{position:fixed;z-index:50;bottom:16px;left:50%;transform:translateX(-50%);width:min(940px,calc(100% - 32px));background:#351c38;border:1px solid var(--pink);box-shadow:var(--shadow);padding:12px 15px;display:flex;align-items:center;justify-content:space-between;gap:16px}
    .bottom-bar small{color:#dbc9d8}.close-bar{background:transparent;border:0;color:var(--muted);font-size:20px}
    @media(max-width:900px){.hero-grid,.updates{grid-template-columns:1fr}.triple{grid-template-columns:1fr 1fr}.hero{padding-top:65px}.stage{max-width:680px}}
    @media(max-width:680px){
      .container{width:min(100% - 28px,560px)}.nav-row{min-height:68px}.brand{font-size:16px;max-width:250px}
      .menu-btn{display:block}.nav-links{display:none;position:absolute;left:14px;right:14px;top:68px;background:var(--night);border:1px solid var(--line);padding:10px;flex-direction:column;align-items:stretch}
      .nav-links.open{display:flex}.nav-links a{text-align:center}.progress{padding-bottom:9px}
      .hero{padding:52px 0 42px}.hero-copy{font-size:16px}.triple,.category-grid,.scene,.trust-grid{grid-template-columns:1fr}
      .category-card:nth-child(2),.note:nth-child(2),.note:nth-child(3){transform:none;margin-top:0}
      .index-panel{grid-template-columns:1fr 1fr}.result-list{grid-template-columns:1fr}
      .section{padding:58px 0}.section-head{display:block}.section-head p{margin-top:14px}.cta{display:block;padding:26px}.cta .btn{margin-top:18px}
      .footer-grid{display:block}.footer-links{margin-top:18px}.bottom-bar{bottom:10px;padding:10px}.bottom-bar small{font-size:12px}.bottom-bar .btn{min-height:40px;padding:8px 11px;font-size:13px}
    }
    @media(max-width:390px){h1{font-size:32px}.index-panel{grid-template-columns:1fr}.index-card.large{min-height:180px}.bottom-bar small{max-width:150px}}

/* roulang page: category1 */
:root{
      --ink:#17111d;
      --night:#211425;
      --berry:#3a1d3d;
      --coral:#ed665e;
      --pink:#f59ab0;
      --lime:#d7ef70;
      --paper:#fff8e9;
      --muted:#b7a6b8;
      --line:#604765;
      --panel:#2d1930;
      --panel-2:#42203a;
      --shadow:5px 6px 0 rgba(8,5,12,.46);
      --radius:6px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      color:var(--paper);
      background:
        linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px),
        var(--ink);
      background-size:22px 22px;
      font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",Arial,sans-serif;
      line-height:1.7;
      padding-bottom:92px;
    }
    a{color:inherit;text-decoration:none}
    button,input,select{font:inherit}
    button{cursor:pointer}
    .container{width:min(1180px,calc(100% - 40px));margin:auto}
    .pixel{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.04em}
    .site-header{
      position:sticky;top:0;z-index:40;
      background:rgba(23,17,29,.95);
      border-bottom:1px solid var(--line);
      backdrop-filter:blur(8px)
    }
    .nav-row{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}
    .brand{font-weight:900;font-size:19px;line-height:1.15;max-width:340px;color:var(--paper)}
    .brand-mark{color:var(--coral);margin-right:8px}
    .nav-links{display:flex;align-items:center;gap:8px}
    .nav-links a,.step-link{
      color:var(--muted);padding:9px 12px;border:1px solid transparent;
      transition:.2s ease
    }
    .nav-links a:hover,.nav-links a:focus-visible,.step-link:hover,.step-link:focus-visible{
      color:var(--lime);border-color:var(--line);transform:translateY(-2px)
    }
    .nav-links a.active{color:var(--paper);border-color:var(--coral);background:#321c35}
    .menu-btn{
      display:none;background:transparent;color:var(--paper);
      border:1px solid var(--line);padding:8px 12px
    }
    .progress{
      display:flex;gap:8px;align-items:center;
      border-top:1px solid rgba(96,71,101,.55);padding:10px 0 12px;
      overflow-x:auto
    }
    .step-link{font-size:13px;white-space:nowrap}
    .step-link.current{color:var(--lime);border-color:var(--lime);background:#2d2630}
    .step-no{margin-right:7px;color:var(--coral);font-size:12px}
    .page-intro{padding:76px 0 46px}
    .eyebrow{
      display:inline-flex;align-items:center;gap:8px;color:var(--lime);
      font-size:13px;margin-bottom:18px
    }
    .eyebrow:before{content:"";width:8px;height:8px;background:var(--coral);display:inline-block}
    h1,h2,h3,p{margin-top:0}
    h1{font-size:clamp(34px,5vw,58px);line-height:1.13;letter-spacing:-.04em;margin-bottom:20px}
    h2{font-size:clamp(26px,3vw,36px);line-height:1.2;margin-bottom:14px}
    h3{font-size:20px;line-height:1.3;margin-bottom:10px}
    .lead{max-width:730px;color:#d6c8d4;font-size:17px}
    .crumbs{color:var(--muted);font-size:13px;margin-bottom:22px}
    .crumbs a:hover{color:var(--lime)}
    .index-layout{display:grid;grid-template-columns:280px 1fr;gap:22px;align-items:start}
    .filter-panel,.content-panel,.faq-item,.trust-note{
      background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow)
    }
    .filter-panel{padding:22px;position:sticky;top:142px}
    .panel-label{
      color:var(--pink);font-size:12px;letter-spacing:.12em;
      text-transform:uppercase;margin-bottom:18px
    }
    .filter-list{display:grid;gap:8px}
    .filter-list button{
      width:100%;text-align:left;color:#eadce7;background:transparent;
      border:1px solid transparent;padding:11px 12px;transition:.2s
    }
    .filter-list button:hover,.filter-list button:focus-visible{
      color:var(--lime);border-color:var(--line);transform:translateX(3px);outline:none
    }
    .filter-list button.active{color:var(--ink);background:var(--lime);border-color:var(--lime)}
    .rule-box{margin-top:25px;padding-top:18px;border-top:1px solid var(--line);color:var(--muted);font-size:13px}
    .content-panel{padding:24px}
    .toolbar{display:flex;gap:10px;align-items:center;margin:16px 0 22px}
    .toolbar input,.toolbar select{
      min-height:44px;background:#fff8e9;color:var(--ink);
      border:1px solid #c8ad9e;padding:9px 12px;outline:none
    }
    .toolbar input{flex:1}
    .toolbar input:focus,.toolbar select:focus{border-color:var(--coral);box-shadow:0 0 0 3px rgba(237,102,94,.2)}
    .status-line{
      display:flex;justify-content:space-between;gap:15px;
      color:var(--muted);font-size:13px;border-bottom:1px solid var(--line);padding-bottom:15px
    }
    .content-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:13px;margin-top:16px}
    .entry-card{
      min-height:190px;background:#321b36;border:1px solid #754d6f;padding:20px;
      position:relative;transition:.2s;overflow:hidden
    }
    .entry-card:hover{transform:translateY(-4px);border-color:var(--pink);box-shadow:4px 5px 0 rgba(0,0,0,.25)}
    .entry-card.featured{grid-row:span 2;min-height:395px;background:#51283f}
    .entry-card:after{
      content:"INDEX";position:absolute;right:-10px;bottom:-4px;
      color:rgba(255,255,255,.06);font:bold 58px monospace
    }
    .tag,.badge{
      display:inline-block;padding:4px 9px;border:1px solid #79536f;
      color:var(--pink);font-size:12px;position:relative;z-index:1
    }
    .badge{color:var(--lime);border-color:#68744a}
    .entry-card strong{display:block;font-size:21px;margin:22px 0 10px;position:relative;z-index:1}
    .entry-card p{color:#d6bfd0;font-size:14px;max-width:390px;position:relative;z-index:1}
    .entry-meta{display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:12px;position:absolute;bottom:18px;left:20px;right:20px;z-index:1}
    .link-arrow{color:var(--lime);font-weight:800;position:relative;z-index:1}
    .section{padding:76px 0}
    .section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:28px}
    .section-head p{max-width:550px;color:var(--muted);margin-bottom:0}
    .feature-strip{display:grid;grid-template-columns:1fr 1.35fr 1fr;gap:12px}
    .strip-item{padding:22px;background:#321b36;border:1px solid var(--line);min-height:145px}
    .strip-item:nth-child(2){background:#42203a;transform:translateY(16px)}
    .strip-item:nth-child(3){background:#2b2432}
    .strip-no{color:var(--coral);font-size:28px;font-weight:900}
    .strip-item p{color:var(--muted);font-size:14px}
    .trust-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:16px}
    .update-list{border-top:1px solid var(--line)}
    .update-item{display:flex;justify-content:space-between;gap:20px;padding:16px 0;border-bottom:1px solid var(--line);color:#e8dae4}
    .update-item span{color:var(--muted);font-size:13px;white-space:nowrap}
    .trust-note{padding:25px;background:#42203a}
    .trust-note p{color:#d6bfd0;font-size:14px}
    .faq{max-width:850px}
    .faq-item{margin-bottom:10px;box-shadow:none}
    .faq-item summary{cursor:pointer;padding:17px 20px;font-weight:800;list-style:none}
    .faq-item summary::-webkit-details-marker{display:none}
    .faq-item summary:after{content:"＋";float:right;color:var(--lime)}
    .faq-item[open] summary:after{content:"－"}
    .faq-answer{padding:0 20px 18px;color:var(--muted);font-size:14px}
    .cta{
      background:var(--coral);color:var(--ink);padding:36px;
      display:flex;justify-content:space-between;align-items:center;gap:25px;box-shadow:var(--shadow)
    }
    .cta p{max-width:640px;margin:10px 0 0}
    .btn{
      min-height:46px;padding:10px 18px;border:1px solid var(--coral);
      border-radius:var(--radius);display:inline-flex;align-items:center;
      justify-content:center;font-weight:800;transition:.2s;box-shadow:4px 4px 0 rgba(0,0,0,.28)
    }
    .btn-primary{background:var(--coral);color:var(--ink)}
    .btn-secondary{background:transparent;color:var(--paper);border-color:var(--line)}
    .cta .btn-secondary{color:var(--ink);border-color:var(--ink);box-shadow:4px 4px 0 rgba(23,17,29,.25)}
    .btn:hover,.btn:focus-visible{transform:translate(2px,2px);box-shadow:2px 2px 0 rgba(0,0,0,.25);outline:none}
    .btn:active{transform:translate(4px,4px);box-shadow:none}
    .footer{border-top:1px solid var(--line);padding:42px 0 112px;color:var(--muted)}
    .footer-grid{display:flex;justify-content:space-between;gap:30px}
    .footer-brand{color:var(--paper);font-weight:900}
    .footer-links{display:flex;gap:18px;flex-wrap:wrap}
    .footer a:hover{color:var(--lime)}
    .bottom-bar{
      position:fixed;bottom:16px;left:50%;transform:translateX(-50%);
      width:min(900px,calc(100% - 32px));z-index:50;
      background:#2d1930;border:1px solid var(--coral);box-shadow:var(--shadow);
      padding:12px 15px;display:flex;align-items:center;justify-content:space-between;gap:15px
    }
    .bottom-bar small{color:#e4cddc}
    .close-bar{background:transparent;border:0;color:var(--muted);font-size:18px;padding:5px}
    .is-hidden{display:none}
    @media(max-width:1024px){
      .index-layout{grid-template-columns:230px 1fr}
      .feature-strip{grid-template-columns:1fr 1fr}
      .strip-item:nth-child(3){grid-column:span 2;transform:none}
    }
    @media(max-width:768px){
      .container{width:min(100% - 28px,620px)}
      .nav-row{min-height:68px}
      .brand{font-size:16px;max-width:250px}
      .menu-btn{display:block}
      .nav-links{display:none;position:absolute;left:14px;right:14px;top:68px;background:var(--night);border:1px solid var(--line);padding:10px;flex-direction:column;align-items:stretch}
      .nav-links.open{display:flex}
      .nav-links a{text-align:center}
      .progress{padding-bottom:10px}
      .page-intro{padding:52px 0 35px}
      .index-layout,.content-grid,.trust-grid{grid-template-columns:1fr}
      .filter-panel{position:static}
      .content-grid .entry-card.featured{grid-row:auto;min-height:240px}
      .feature-strip{grid-template-columns:1fr}
      .strip-item:nth-child(2),.strip-item:nth-child(3){grid-column:auto;transform:none}
      .section{padding:58px 0}
      .section-head{display:block}
      .section-head p{margin-top:12px}
      .cta{display:block;padding:26px}
      .cta .btn{margin-top:20px}
      .bottom-bar{bottom:8px;padding:10px 11px}
      .bottom-bar small{font-size:12px}
    }
    @media(max-width:520px){
      h1{font-size:34px}
      .toolbar{display:grid;grid-template-columns:1fr}
      .content-panel{padding:17px}
      .status-line{display:block}
      .status-line span{display:block;margin-top:5px}
      .footer-grid{display:block}
      .footer-links{margin-top:22px;gap:12px}
      .bottom-bar{width:calc(100% - 18px)}
      .bottom-bar .btn{min-height:40px;padding:7px 11px;font-size:13px}
    }

/* roulang page: category2 */
:root{
      --ink:#17111d;
      --night:#211425;
      --berry:#3a1d3d;
      --coral:#ed665e;
      --pink:#f59ab0;
      --lime:#d7ef70;
      --paper:#fff8e9;
      --muted:#b7a6b8;
      --line:#604765;
      --soft:#321b36;
      --shadow:5px 6px 0 rgba(8,5,12,.46);
      --radius:6px;
      --ease:.22s ease;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      color:var(--paper);
      background:
        linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px),
        var(--ink);
      background-size:22px 22px;
      font-family:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",Arial,sans-serif;
      line-height:1.7;
      padding-bottom:100px;
    }
    a{color:inherit;text-decoration:none}
    img{max-width:100%;display:block}
    button,input,select,textarea{font:inherit}
    button{cursor:pointer}
    :focus-visible{outline:3px solid var(--lime);outline-offset:3px}
    .container{width:min(1180px,calc(100% - 40px));margin:0 auto}
    .pixel{font-family:"Courier New",monospace;letter-spacing:.04em}
    .site-header{
      position:sticky;top:0;z-index:40;
      background:rgba(23,17,29,.95);
      border-bottom:1px solid var(--line);
      backdrop-filter:blur(8px)
    }
    .nav-row{
      min-height:76px;display:flex;align-items:center;
      justify-content:space-between;gap:24px
    }
    .brand{
      font-weight:900;font-size:19px;line-height:1.2;
      max-width:340px;color:var(--paper)
    }
    .brand-mark{color:var(--coral);margin-right:8px}
    .nav-links{display:flex;align-items:center;gap:8px}
    .nav-links a,.step-link{
      color:var(--muted);padding:9px 12px;
      border:1px solid transparent;transition:var(--ease)
    }
    .nav-links a:hover,.nav-links a:focus-visible,
    .step-link:hover,.step-link:focus-visible{
      color:var(--lime);border-color:var(--line);
      transform:translateY(-2px)
    }
    .nav-links a.active{
      color:var(--paper);border-color:var(--coral);
      background:#321c35
    }
    .menu-btn{
      display:none;background:transparent;color:var(--paper);
      border:1px solid var(--line);padding:8px 12px
    }
    .progress{
      display:flex;gap:8px;overflow-x:auto;
      border-top:1px solid rgba(96,71,101,.55);
      padding:10px 0 11px
    }
    .step-link{
      white-space:nowrap;font-size:13px;padding:5px 12px
    }
    .step-link.current{
      color:var(--lime);border-color:#68744a;
      background:rgba(215,239,112,.06)
    }
    .step-no{color:var(--coral);margin-right:7px;font-weight:700}
    .page-hero{padding:76px 0 54px}
    .hero-layout{
      display:grid;grid-template-columns:1.05fr .95fr;
      gap:58px;align-items:center
    }
    .eyebrow{
      display:inline-flex;align-items:center;gap:8px;
      color:var(--lime);font-size:13px;margin-bottom:17px
    }
    .eyebrow:before{
      content:"";width:9px;height:9px;background:var(--coral);
      box-shadow:4px 4px 0 var(--pink)
    }
    h1,h2,h3,p{margin-top:0}
    h1{
      margin-bottom:0;font-size:clamp(36px,5vw,58px);
      line-height:1.12;letter-spacing:-.045em
    }
    h2{font-size:clamp(27px,3vw,38px);line-height:1.2;letter-spacing:-.025em}
    h3{font-size:20px;line-height:1.35}
    .hero-copy{
      color:#d6c8d4;font-size:17px;max-width:640px;
      margin:23px 0 28px
    }
    .button-row{display:flex;flex-wrap:wrap;gap:12px}
    .btn{
      min-height:46px;padding:10px 18px;
      border:1px solid var(--coral);border-radius:var(--radius);
      display:inline-flex;align-items:center;justify-content:center;
      font-weight:800;transition:var(--ease);
      box-shadow:4px 4px 0 rgba(0,0,0,.28)
    }
    .btn-primary{background:var(--coral);color:var(--ink)}
    .btn-secondary{background:transparent;color:var(--paper);border-color:var(--line)}
    .btn:hover,.btn:focus-visible{
      transform:translate(2px,2px);
      box-shadow:2px 2px 0 rgba(0,0,0,.25);outline:none
    }
    .btn:active{transform:translate(4px,4px);box-shadow:none}
    .btn.disabled{opacity:.42;cursor:not-allowed}
    .notice-line{
      display:flex;align-items:center;gap:9px;color:var(--muted);
      font-size:13px;margin-top:22px
    }
    .notice-line strong{color:var(--lime);font-weight:700}
    .stage{
      background:#2d1930;border:1px solid var(--line);
      box-shadow:var(--shadow);padding:18px;
      transform:rotate(1.2deg)
    }
    .stage-bar{
      display:flex;gap:7px;align-items:center;
      border-bottom:1px solid var(--line);
      padding-bottom:14px;margin-bottom:16px
    }
    .stage-dot{width:10px;height:10px;background:var(--coral)}
    .stage-dot:nth-child(2){background:var(--pink)}
    .stage-dot:nth-child(3){background:var(--lime)}
    .stage-title{margin-left:auto;color:var(--muted);font-size:12px}
    .access-board{
      background:#f3e4cf;color:var(--ink);padding:20px;
      min-height:285px;border:3px solid #60364f
    }
    .board-top{
      display:flex;justify-content:space-between;gap:12px;
      padding-bottom:12px;border-bottom:2px solid #d0bda9;
      font-size:13px
    }
    .board-status{
      display:flex;gap:8px;align-items:center;color:#49621d;
      font-weight:800
    }
    .board-status i{width:9px;height:9px;background:#7ca52b;display:block}
    .board-block{
      margin-top:18px;padding:16px;background:#fffaf0;
      border:1px solid #c8ad9e
    }
    .board-block strong{display:block;font-size:19px;margin:7px 0}
    .board-block p{font-size:14px;color:#614b58;margin-bottom:0}
    .board-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:17px}
    .board-tags span{
      padding:4px 8px;background:#42203a;color:#f8d5de;
      font-size:12px
    }
    .section{padding:78px 0}
    .section-head{
      display:flex;justify-content:space-between;align-items:end;
      gap:30px;margin-bottom:30px
    }
    .section-head p{max-width:540px;color:var(--muted);margin-bottom:0}
    .section-kicker{
      color:var(--coral);font-size:13px;font-weight:800;
      letter-spacing:.08em;margin-bottom:10px
    }
    .rule{height:1px;background:var(--line);margin:22px 0}
    .policy-grid{
      display:grid;grid-template-columns:1.1fr .9fr;gap:18px;
      align-items:start
    }
    .policy-main{
      padding:28px;background:#321b36;border:1px solid var(--line);
      box-shadow:var(--shadow)
    }
    .policy-list{display:grid;gap:0;margin:20px 0 0}
    .policy-item{
      display:grid;grid-template-columns:48px 1fr;gap:16px;
      padding:18px 0;border-top:1px solid var(--line)
    }
    .policy-item:first-child{border-top:0;padding-top:0}
    .policy-no{
      color:var(--coral);font-size:18px;font-weight:900;
      padding-top:2px
    }
    .policy-item h3{margin-bottom:5px}
    .policy-item p{color:var(--muted);font-size:15px;margin-bottom:0}
    .side-stack{display:grid;gap:16px}
    .side-card{
      padding:23px;background:#42203a;border:1px solid #754d6f;
      position:relative
    }
    .side-card:nth-child(2){background:#2d1930;transform:translateX(18px)}
    .side-card p{color:#d6bfd0;font-size:15px;margin:8px 0 0}
    .tag,.badge{
      display:inline-block;padding:4px 9px;border:1px solid #79536f;
      color:var(--pink);font-size:12px
    }
    .badge{color:var(--lime);border-color:#68744a}
    .access-flow{
      display:grid;grid-template-columns:repeat(4,1fr);
      gap:10px
    }
    .flow-item{
      min-height:155px;padding:20px 17px;background:#2d1930;
      border:1px solid var(--line);transition:var(--ease)
    }
    .flow-item:hover{transform:translateY(-4px);border-color:var(--pink);box-shadow:var(--shadow)}
    .flow-item.current{background:#51283f;border-color:var(--coral)}
    .flow-number{color:var(--lime);font-weight:900;font-size:13px}
    .flow-item h3{margin:18px 0 7px}
    .flow-item p{color:var(--muted);font-size:14px;margin-bottom:0}
    .privacy-panel{
      display:grid;grid-template-columns:.82fr 1.18fr;gap:18px;
      align-items:stretch
    }
    .privacy-note{
      padding:28px;background:var(--coral);color:var(--ink);
      box-shadow:var(--shadow)
    }
    .privacy-note h2{margin-bottom:12px}
    .privacy-note p{margin-bottom:0}
    .privacy-details{
      border:1px solid var(--line);background:#321b36;padding:25px
    }
    .detail-row{
      display:flex;justify-content:space-between;gap:20px;
      padding:14px 0;border-bottom:1px solid var(--line)
    }
    .detail-row:last-child{border-bottom:0}
    .detail-row span{color:var(--muted);font-size:14px}
    .detail-row strong{color:var(--paper);font-size:14px;text-align:right}
    .feedback-grid{
      display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;
      align-items:start
    }
    .feedback-card{
      padding:23px;background:#321b36;border:1px solid var(--line)
    }
    .feedback-card:nth-child(2){transform:translateY(24px);background:#42203a}
    .feedback-card:nth-child(3){background:#2d1930}
    .feedback-card p{color:#d6c8d4;font-size:15px;margin:13px 0 0}
    .faq{max-width:900px}
    details{
      border-top:1px solid var(--line);padding:19px 0
    }
    details:last-child{border-bottom:1px solid var(--line)}
    summary{
      cursor:pointer;list-style:none;font-weight:800;
      display:flex;justify-content:space-between;gap:20px
    }
    summary::-webkit-details-marker{display:none}
    summary:after{content:"+";color:var(--lime);font-size:22px;line-height:1}
    details[open] summary:after{content:"—";color:var(--coral)}
    details p{color:var(--muted);max-width:760px;margin:12px 32px 0 0}
    .cta{
      background:var(--coral);color:var(--ink);padding:38px;
      display:flex;justify-content:space-between;align-items:center;
      gap:25px;box-shadow:var(--shadow)
    }
    .cta h2{margin-bottom:0}
    .cta p{max-width:620px;margin:10px 0 0}
    .cta .btn-secondary{color:var(--ink);border-color:var(--ink)}
    .footer{
      border-top:1px solid var(--line);padding:42px 0 112px;
      color:var(--muted)
    }
    .footer-grid{
      display:flex;justify-content:space-between;gap:30px
    }
    .footer-brand{color:var(--paper);font-weight:900}
    .footer-links{display:flex;gap:18px;flex-wrap:wrap}
    .footer a{transition:var(--ease)}
    .footer a:hover{color:var(--lime)}
    .fixed-cta{
      position:fixed;z-index:50;bottom:18px;left:50%;
      transform:translateX(-50%);width:min(920px,calc(100% - 40px));
      display:flex;justify-content:space-between;align-items:center;
      gap:18px;padding:12px 14px 12px 18px;
      background:#2d1930;border:1px solid var(--coral);
      box-shadow:var(--shadow)
    }
    .fixed-cta p{margin:0;color:#ead9e5;font-size:14px}
    .fixed-cta p strong{color:var(--lime)}
    .close-cta{
      border:0;background:transparent;color:var(--muted);
      font-size:20px;padding:4px 8px
    }
    .fixed-cta.hidden{display:none}
    @media(max-width:1024px){
      .hero-layout,.policy-panel{grid-template-columns:1fr}
      .stage{max-width:720px;margin:0 auto}
      .access-flow{grid-template-columns:repeat(2,1fr)}
    }
    @media(max-width:768px){
      body{padding-bottom:120px}
      .container{width:min(100% - 28px,620px)}
      .nav-row{min-height:68px}
      .brand{font-size:16px;max-width:270px}
      .menu-btn{display:block}
      .nav-links{
        display:none;position:absolute;left:14px;right:14px;top:68px;
        background:var(--night);border:1px solid var(--line);
        padding:10px;flex-direction:column;align-items:stretch
      }
      .nav-links.open{display:flex}
      .nav-links a{text-align:center}
      .progress{margin:0 -14px;padding-left:14px;padding-right:14px}
      .page-hero{padding:56px 0 35px}
      .section{padding:58px 0}
      .section-head{display:block}
      .section-head p{margin-top:14px}
      .feedback-grid,.privacy-panel{grid-template-columns:1fr}
      .feedback-card:nth-child(2),.side-card:nth-child(2){transform:none}
      .cta{display:block;padding:27px}
      .cta .button-row{margin-top:20px}
      .footer-grid{display:block}
      .footer-links{margin-top:22px}
      .fixed-cta{bottom:env(safe-area-inset-bottom,12px);width:calc(100% - 24px)}
    }
    @media(max-width:520px){
      h1{font-size:34px}
      h2{font-size:28px}
      .hero-copy{font-size:16px}
      .button-row .btn{width:100%}
      .access-flow{grid-template-columns:1fr}
      .policy-main,.privacy-details,.privacy-note{padding:21px}
      .detail-row{display:block}
      .detail-row strong{display:block;text-align:left;margin-top:4px}
      .fixed-cta{align-items:flex-start}
      .fixed-cta .btn{min-height:42px;padding:8px 11px;font-size:13px}
      .fixed-cta p{font-size:13px;line-height:1.45}
    }
