:root{
  --night:#140A2E;
  --deep:#0C0620;
  --panel:#1E1145;
  --panel2:#2A1860;
  --linec:#4A3196;
  --white:#ffffff;
  --purple:#843CF0;
  --magenta:#FC30A8;
  --line:2px solid var(--linec);
}
*{box-sizing:border-box}
html{scroll-behavior:auto}
body{margin:0;font-family:"Microsoft YaHei","PingFang SC",Arial,sans-serif;color:var(--white);background:var(--night);line-height:1.7;font-size:16px}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
.wrap{width:1100px;max-width:calc(100% - 40px);margin:0 auto}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

.sbtn{display:inline-block;border:2px solid var(--white);padding:11px 22px;font-weight:700;font-size:15px;cursor:pointer;text-align:center;background:var(--panel);transition:transform .12s ease}
.sbtn:hover{transform:translate(-2px,-2px)}
.sbtn-lg{padding:14px 30px;font-size:16px}
.sbtn-purple{background:var(--purple);color:var(--white)}
.sbtn-purple:hover{box-shadow:5px 5px 0 var(--white)}
.sbtn-magenta{background:var(--magenta);color:var(--white)}
.sbtn-magenta:hover{box-shadow:4px 4px 0 var(--white)}
.sbtn-outline{background:transparent;color:var(--white);border-color:var(--magenta)}
.sbtn-outline:hover{background:var(--magenta)}

.sbar{position:sticky;top:0;z-index:60;background:var(--night);border-bottom:3px solid var(--magenta)}
.sbar-in{display:flex;align-items:center;gap:22px;height:68px}
.slogo{display:flex;align-items:center;gap:10px;flex-shrink:0}
.slogo img{border:2px solid var(--white)}
.slogo-t{display:flex;flex-direction:column;line-height:1.25}
.slogo-t strong{font-size:19px;letter-spacing:.5px}
.slogo-t small{font-size:11px;color:#B4A6E8}
.snav{display:flex;gap:4px;margin-left:auto}
.snav a{padding:7px 12px;font-size:14.5px;font-weight:700;border:2px solid transparent;white-space:nowrap}
.snav a:hover,.snav a.on{border-color:var(--magenta);background:var(--panel)}
.sbar-r{display:flex;align-items:center;gap:12px;flex-shrink:0}
.sbar-cta{padding:9px 16px;font-size:14px}
.burger{display:none;width:42px;height:42px;border:2px solid var(--white);background:var(--panel);cursor:pointer;padding:8px;flex-direction:column;justify-content:space-between}
.burger span{display:block;height:3px;background:var(--white)}

.she{background:var(--night);border-bottom:3px solid var(--magenta);padding:64px 0 72px;position:relative;overflow:hidden}
.she::before{content:"";position:absolute;top:40px;left:-16px;width:120px;height:120px;border:3px solid rgba(132,60,240,.5)}
.she::after{content:"";position:absolute;bottom:30px;right:-16px;width:90px;height:90px;border:3px solid rgba(252,48,168,.45)}
.she-in{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;position:relative;z-index:1}
.skick{display:inline-flex;align-items:center;gap:9px;font-size:12.5px;font-weight:700;letter-spacing:1.5px;border:2px solid var(--magenta);padding:6px 12px;background:var(--panel);margin:0 0 18px}
.skick i{display:inline-block;width:10px;height:10px;background:var(--magenta)}
h1{font-size:60px;line-height:1;margin:0 0 16px;letter-spacing:2px}
.lead{font-size:16px;margin:0 0 26px;color:#E4DCFF}
.she-acts{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.stags{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0 0 20px}
.stags li{font-size:13px;border:var(--line);background:var(--panel);padding:4px 11px}
.stags li:nth-child(even){background:var(--purple)}
.snote{display:flex;align-items:center;gap:9px;font-size:13px;font-weight:700;color:#CFC5FA}
.spark{width:12px;height:12px;background:var(--magenta);flex-shrink:0;transform:rotate(45deg)}

.lhouse{position:relative;width:340px;max-width:100%;margin:0 auto;padding-top:10px}
.beam{position:absolute;top:34px;right:-66px;width:130px;height:130px;border:3px solid var(--magenta);background:rgba(252,48,168,.16);transform:rotate(45deg);z-index:0}
.lh-cap{position:relative;z-index:1;width:150px;margin:0 auto;height:18px;background:var(--purple);border:3px solid var(--white);border-bottom:0}
.lh-cap span{display:block;width:22px;height:10px;margin:-14px auto 0;background:var(--magenta);border:2px solid var(--white)}
.lh-room{position:relative;z-index:1;width:270px;max-width:92%;margin:0 auto;background:var(--panel);border:3px solid var(--white);padding:12px;box-shadow:14px 14px 0 var(--purple)}
.lh-morse{display:flex;gap:6px;margin-bottom:10px}
.lh-morse i{width:8px;height:8px;background:var(--purple)}
.lh-morse i:nth-child(odd){background:var(--magenta);width:16px}
.lh-fig{margin:0;position:relative;overflow:hidden}
.lh-fig img{width:100%;border:2px solid var(--white)}
.lh-fig figcaption{font-size:11.5px;text-align:center;padding-top:8px;color:#CFC5FA;letter-spacing:1px}
.lh-scan{position:absolute;left:0;right:0;top:0;height:3px;background:var(--magenta);animation:lhscan 3.2s linear infinite}
@keyframes lhscan{0%{top:6%}50%{top:92%}100%{top:6%}}
.lh-shaft{position:relative;z-index:1;width:190px;max-width:66%;margin:0 auto;background:var(--panel2);border-left:3px solid var(--white);border-right:3px solid var(--white);padding:14px 12px 0;min-height:104px}
.lh-band{display:block;height:10px;margin-bottom:10px}
.lh-band.b1{background:var(--purple)}
.lh-band.b2{background:var(--magenta)}
.lh-door{display:inline-block;font-size:11px;letter-spacing:2px;border:2px solid var(--white);padding:2px 10px;margin-left:50%;transform:translateX(-50%)}
.lh-base{position:relative;z-index:1;width:280px;max-width:94%;margin:0 auto;background:var(--purple);border:3px solid var(--white);text-align:center;font-size:12px;letter-spacing:3px;padding:9px 0}
.lh-tag{position:absolute;z-index:2;background:var(--white);color:var(--night);border:2px solid var(--night);padding:8px 12px;line-height:1.35;box-shadow:5px 5px 0 var(--purple)}
.lh-tag b{display:block;font-size:13px}
.lh-tag span{font-size:11.5px}
.lt1{right:-12px;top:150px}
.lt2{left:-12px;bottom:120px;box-shadow:-5px 5px 0 var(--magenta)}

.spb{padding:40px 0;background:var(--night)}
.spb-in{display:grid;grid-template-columns:repeat(4,1fr);border:3px solid var(--white);background:var(--magenta);box-shadow:-12px 12px 0 var(--purple)}
.sp{background:var(--panel);padding:24px 16px;text-align:center;border-right:2px solid var(--white);min-width:0}
.sp:last-child{border-right:0}
.sp b{display:block;font-size:30px;line-height:1.2;color:#FF8CD2}
.sp span{font-size:13.5px;font-weight:700;color:#E4DCFF}

.sec-h{text-align:center;max-width:720px;margin:0 auto 42px}
.sec-h .skick{margin-bottom:16px}
.sec-h h2{font-size:30px;margin:0 0 12px;line-height:1.35}
.sec-sub{margin:0;font-size:15px;color:#B4A6E8}

.slog{padding:72px 0;background:var(--night);border-top:3px solid var(--magenta)}
.scards{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.scard{background:var(--panel);border:var(--line);padding:26px 22px;box-shadow:-14px 10px 0 var(--purple)}
.scard.alt{box-shadow:-14px 10px 0 var(--magenta)}
.sc-no{display:inline-block;background:var(--purple);font-weight:700;font-size:12px;letter-spacing:1.5px;padding:3px 11px;margin-bottom:14px}
.scard.alt .sc-no{background:var(--magenta)}
.scard h3{margin:0 0 10px;font-size:18px}
.scard p{margin:0;font-size:14.5px;color:#D8CFFA}

.sdeck{padding:72px 0;background:var(--deep);border-top:3px solid var(--magenta)}
.srail{display:flex;justify-content:center;align-items:flex-start;gap:18px;margin-bottom:34px}
.sv{position:relative;width:150px;margin:0;background:var(--panel);border:var(--line);padding:16px 9px 9px;box-shadow:16px 8px 0 var(--magenta)}
.v2,.v4{margin-top:26px}
.sv img{width:100%;border:1.5px solid var(--white)}
.sv figcaption{font-size:11px;text-align:center;padding-top:8px;color:#CFC5FA;letter-spacing:.5px}
.bolt{position:absolute;top:6px;left:50%;transform:translateX(-50%) rotate(45deg);width:10px;height:10px;background:var(--purple)}
.bolt.hor{background:var(--magenta)}
.schart{display:flex;align-items:stretch;justify-content:center;gap:0;max-width:760px;margin:0 auto;border:var(--line)}
.scp{position:relative;width:46%;margin:0;background:var(--panel);border-right:var(--line);padding:20px 20px 12px;box-shadow:-10px -8px 0 var(--purple)}
.scp img{width:100%;border:1.5px solid var(--white)}
.scp figcaption{font-size:12px;text-align:center;padding-top:8px;color:#CFC5FA}
.scp-note{width:54%;background:var(--panel2);padding:26px 24px;display:flex;flex-direction:column;justify-content:center;gap:12px}
.scp-note h3{margin:0;font-size:19px}
.scp-note p{margin:0;font-size:14px;color:#D8CFFA}
.scp-note .sbtn{align-self:flex-start;margin-top:4px}

.ssig{padding:72px 0;background:var(--night);border-top:3px solid var(--magenta)}
.ssteps{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.sst{background:var(--panel);border:var(--line);padding:28px 24px;box-shadow:10px 16px 0 var(--magenta)}
.sst.alt{background:var(--purple);border-color:var(--white);box-shadow:10px 16px 0 var(--purple)}
.sst.alt p{color:#EADFFF}
.sst-no{display:inline-block;border:2px solid var(--magenta);font-weight:700;font-size:12px;letter-spacing:2px;padding:4px 12px;margin-bottom:16px;color:#FFB0DF}
.sst.alt .sst-no{border-color:var(--white);color:var(--white)}
.sst h3{margin:0 0 10px;font-size:18.5px}
.sst p{margin:0;font-size:14.5px;color:#D8CFFA}

.sask{padding:72px 0;background:var(--deep);border-top:3px solid var(--magenta)}
.sbook{max-width:880px;margin:0 auto;border:var(--line);background:var(--panel);box-shadow:0 14px 0 var(--purple)}
.sq{border-bottom:var(--line)}
.sq:last-child{border-bottom:0}
.sq summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:14px;padding:18px 22px}
.sq summary::-webkit-details-marker{display:none}
.sq-no{background:var(--purple);font-size:12px;font-weight:700;padding:3px 9px;flex-shrink:0;letter-spacing:1px}
.sq-t{font-weight:700;font-size:15.5px;flex:1}
.sq-x{width:14px;height:14px;position:relative;flex-shrink:0}
.sq-x::before,.sq-x::after{content:"";position:absolute;background:var(--white);top:6px;left:0;width:14px;height:2px}
.sq-x::after{transform:rotate(90deg)}
.sq[open] .sq-x::after{display:none}
.sq-a{padding:0 22px 18px 22px}
.sq-a p{margin:0;font-size:14.5px;color:#D8CFFA;border-left:4px solid var(--magenta);padding:2px 0 2px 14px}

.svo{padding:72px 0;background:var(--night);border-top:3px solid var(--magenta)}
.sreceipts{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:start}
.sre{background:var(--panel);border:var(--line);box-shadow:-16px 8px 0 var(--magenta)}
.sre.alt{border-color:var(--purple);box-shadow:-16px 8px 0 var(--purple)}
.sre-h{display:flex;justify-content:space-between;gap:10px;font-size:12px;letter-spacing:1px;border-bottom:2px dashed var(--linec);padding:11px 18px;color:#B4A6E8}
.sre-h b{color:var(--magenta)}
.sre.alt .sre-h b{color:#B98CFF}
.sre p{margin:0;padding:16px 18px;font-size:14px;color:#E4DCFF}
.sre footer{display:flex;justify-content:space-between;gap:10px;padding:0 18px 14px;font-size:12px}
.sre footer b{font-size:13px}
.sre time{color:#8F82C8}

.sct{padding:76px 0;background:var(--deep);border-top:3px solid var(--magenta)}
.sct-box{max-width:760px;margin:0 auto;text-align:center;background:var(--panel);border:3px solid var(--white);padding:46px 36px;box-shadow:12px -14px 0 var(--purple)}
.sct-sign{display:inline-flex;align-items:center;gap:9px;margin:0 0 16px;font-size:12px;font-weight:700;letter-spacing:2px;color:#FFB0DF}
.lit{color:var(--magenta)}
.sct-box h2{font-size:30px;margin:0 0 14px}
.sct-p{margin:0 0 26px;font-size:15.5px;color:#D8CFFA}
.sct-note{margin:18px 0 0;font-size:12.5px;color:#9889D0}

.sfoot{background:var(--deep);color:var(--white);border-top:3px solid var(--magenta);padding:34px 0 30px;text-align:center}
.sfoot-brand{display:flex;align-items:center;justify-content:center;gap:10px;font-weight:700;font-size:15px;margin-bottom:16px}
.sfoot-brand img{border:2px solid var(--white)}
.sfoot-nav{display:flex;justify-content:center;flex-wrap:wrap;gap:6px 18px;font-size:13.5px;margin-bottom:14px}
.sfoot-nav a:hover{color:#FF8CD2}
.sfoot-icp{margin:0 0 4px;font-size:13px;color:#B4A6E8}
.sfoot-c{margin:0;font-size:12.5px;color:#8173B8}

.backtop{position:fixed;right:22px;bottom:40px;width:46px;height:46px;border:2px solid var(--white);background:var(--purple);color:var(--white);font-size:20px;font-weight:700;cursor:pointer;z-index:70;opacity:0;pointer-events:none;transition:opacity .2s}
.backtop.show{opacity:1;pointer-events:auto}

.rv{opacity:0;transform:translateY(18px);transition:opacity .5s ease,transform .5s ease}
.rv.in{opacity:1;transform:none}

@media (max-width:900px){
  .snav{position:absolute;top:68px;left:0;right:0;background:var(--night);border-bottom:3px solid var(--magenta);flex-direction:column;padding:10px 20px 16px;display:none;gap:2px}
  .snav.open{display:flex}
  .snav a{border-bottom:1.5px dashed var(--linec)}
  .burger{display:flex}
  .sbar-cta{display:none}
  .she{padding:42px 0 52px}
  .she-in{grid-template-columns:1fr;gap:38px}
  h1{font-size:46px}
  .beam{right:-70px;opacity:.7}
  .lh-room{box-shadow:9px 9px 0 var(--purple)}
  .lh-tag{position:static;display:block;width:calc(100% - 32px);max-width:340px;margin:0 auto 10px;box-shadow:4px 4px 0 var(--purple)}
  .lt2{box-shadow:-4px 4px 0 var(--magenta)}
  .spb-in{grid-template-columns:repeat(2,1fr);box-shadow:8px 8px 0 var(--magenta)}
  .sp{border-bottom:2px solid var(--white)}
  .sp:nth-child(2){border-right:0}
  .sp:nth-child(3),.sp:nth-child(4){border-bottom:0}
  .sp:nth-child(3){border-right:2px solid var(--white)}
  .scards{grid-template-columns:1fr;gap:22px}
  .scard{box-shadow:-8px 10px 0 var(--purple)!important}
  .srail{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;padding:6px 4px 18px;-webkit-overflow-scrolling:touch}
  .sv{flex:0 0 150px;margin-top:0!important;box-shadow:10px 6px 0 var(--magenta)}
  .schart{flex-direction:column}
  .scp{width:100%;border-right:0;border-bottom:var(--line);box-shadow:8px -10px 0 var(--purple)}
  .scp-note{width:100%}
  .ssteps{grid-template-columns:1fr;gap:22px}
  .sst{box-shadow:8px 10px 0 var(--magenta)!important}
  .sbook{box-shadow:0 10px 0 var(--purple)}
  .sreceipts{grid-template-columns:1fr;gap:22px}
  .sre{box-shadow:-8px -10px 0 var(--magenta)!important}
  .sct-box{box-shadow:8px 10px 0 var(--purple)}
  .sec-h h2{font-size:24px}
  .sct-box h2{font-size:24px}
  .backtop{bottom:142px}
}
@media (max-width:480px){
  .wrap{max-width:calc(100% - 28px)}
  h1{font-size:38px}
  .lead{font-size:15px}
  .sbtn-lg{width:100%}
  .she-acts{flex-direction:column}
  .sp b{font-size:24px}
  .sq summary{padding:15px 16px;gap:10px}
  .sq-a{padding:0 16px 16px}
  .sq-t{font-size:14.5px}
  .sct-box{padding:36px 22px}
}
