body.rule-video-open{overflow:hidden!important}.rule-video-layer{position:fixed;z-index:2000;inset:0;display:grid;place-items:center;padding:clamp(12px,3vw,40px);font-family:"Microsoft YaHei","PingFang SC",Arial,sans-serif;color:#fff;isolation:isolate}
.rule-video-narration,.rule-video-demo-audio{display:none}
.rule-video-backdrop{position:absolute;inset:0;background:linear-gradient(135deg,#021c41eF,#043c68ef 46%,#087c62ef);backdrop-filter:blur(10px)}
.rule-video-player{position:relative;z-index:1;display:grid;grid-template-rows:auto minmax(410px,1fr) auto;width:min(1200px,100%);min-height:min(720px,calc(100vh - 32px));overflow:hidden;border:1px solid #b9f7e0a6;border-radius:30px;background:linear-gradient(145deg,#083461,#075e91 55%,#099173);box-shadow:0 32px 110px #00152b9c}
.rule-video-player::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,#ffffff0f,transparent 30%,#b6ff7314 70%,#ffffff0d)}
.rule-video-header,.rule-video-footer{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:clamp(18px,2.4vw,30px) clamp(22px,3.4vw,44px)}
.rule-video-header{border-bottom:1px solid #b7f5e62e;background:#001f481f}.rule-video-kicker{margin:0 0 5px;color:#baffcc;font-size:clamp(12px,1.25vw,16px);font-weight:900;letter-spacing:.16em}.rule-video-header h2{margin:0;color:#fff;font-size:clamp(22px,2.5vw,34px);letter-spacing:.02em}.rule-video-close{display:grid;place-items:center;flex:0 0 auto;width:48px;height:48px;padding:0;border:1px solid #d8fff782;border-radius:50%;background:#ffffff1c;color:#fff;font:400 38px/1 Arial;cursor:pointer}.rule-video-close:hover{background:#fff;color:#07516f}
.rule-video-stage{position:relative;z-index:1;display:grid;align-content:center;justify-items:center;min-height:410px;padding:clamp(34px,6vw,82px);overflow:hidden;text-align:center;background:radial-gradient(circle at 50% 45%,#64e8c220 0 11%,transparent 35%),linear-gradient(145deg,#062e5c0c,#067e7924)}
.rule-video-stage::before,.rule-video-stage::after{content:"";position:absolute;pointer-events:none;border-radius:50%}.rule-video-stage::before{width:clamp(360px,52vw,690px);height:clamp(360px,52vw,690px);border:1px solid #baffcf35;box-shadow:0 0 0 28px #9fffb60a,0 0 0 58px #9fffb607}.rule-video-stage::after{inset:0;background:linear-gradient(110deg,transparent 0 35%,#b4ff8510 53%,transparent 70%);transform:translateX(-60%);animation:rule-video-sweep 6s ease-in-out infinite}
.rule-video-orbit{position:absolute;border:1px solid #a9ffca44;border-radius:50%;pointer-events:none}.orbit-one{width:82%;height:145%;transform:rotate(-18deg)}.orbit-two{width:54%;height:118%;transform:rotate(32deg);border-color:#9dfd8954}
.rule-video-step,.rule-video-stage h1,.rule-video-lead,.rule-video-detail-list,.rule-video-demo{position:relative;z-index:1}.rule-video-step{margin:0 0 17px;color:#bdffd6;font-size:clamp(13px,1.35vw,17px);font-weight:900;letter-spacing:.15em}.rule-video-stage h1{max-width:1000px;margin:0;color:#fff;font-size:clamp(46px,7.2vw,100px);font-weight:950;line-height:1.06;letter-spacing:-.035em;text-shadow:0 7px 0 #001d4457}.rule-video-lead{max-width:850px;margin:25px 0 24px;color:#e5fff3;font-size:clamp(21px,2.4vw,34px);font-weight:750;line-height:1.45}.rule-video-detail-list{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}.rule-video-detail-list span{padding:10px 17px;border:1px solid #c8ffe37d;border-radius:999px;background:#ffffff18;color:#fff;font-size:clamp(15px,1.55vw,20px);font-weight:800;box-shadow:0 8px 20px #001f4121}.rule-video-stage[data-scene="2"] h1{color:#b9ff91}.rule-video-stage[data-scene="3"] h1,.rule-video-stage[data-scene="4"] h1{font-size:clamp(40px,6.2vw,82px)}
.rule-video-demo{width:min(860px,100%);margin-top:22px}.rule-demo-question{padding:18px 22px;border:1px solid #c8ffe36e;border-radius:20px;background:#041e3d9e;box-shadow:0 15px 35px #00152b55;text-align:left}.rule-demo-question-top{display:flex;justify-content:space-between;gap:16px;color:#c9ffe0;font-size:13px;font-weight:900}.rule-demo-clock{color:#b6ff78;font-variant-numeric:tabular-nums}.rule-demo-word{margin:12px 0 4px;color:#fff;font:900 clamp(42px,6vw,72px)/1 Arial,sans-serif;letter-spacing:.01em;text-align:center}.rule-demo-prompt{margin:0 0 13px;color:#dfffee;text-align:center;font-size:15px;font-weight:800}.rule-demo-controls{display:flex;justify-content:center;flex-wrap:wrap;gap:9px}.rule-demo-controls button{min-height:44px;padding:0 15px;border:1px solid #b8ffd77c;border-radius:11px;background:linear-gradient(135deg,#076b91,#088a81);color:#fff;font:800 14px/1 "Microsoft YaHei","PingFang SC",Arial,sans-serif;cursor:pointer}.rule-demo-controls button:hover{filter:brightness(1.12);transform:translateY(-1px)}.rule-demo-controls .rule-demo-assist{background:linear-gradient(135deg,#4e8d32,#64bd45);border-color:#a4ff7b}.rule-demo-clue{margin:13px 0 0;padding-top:11px;border-top:1px solid #bfffe32b;color:#ccefe0;font-size:13px;text-align:center}
.rule-video-footer{display:grid;grid-template-columns:1fr auto;column-gap:24px;row-gap:11px;border-top:1px solid #c7fff330;background:#001f4524}.rule-video-progress-wrap{width:100%;height:9px;overflow:hidden;border:1px solid #ccfff767;border-radius:999px;background:#00183355}.rule-video-progress{width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#42d8ff,#a9ff76);box-shadow:0 0 18px #9eff8a;transition:width .12s linear}.rule-video-status{grid-column:1;margin:0;color:#d8fff0;font-size:clamp(13px,1.2vw,16px);font-weight:700}.rule-video-actions{grid-column:2;grid-row:1 / span 2;display:flex;align-items:center;justify-content:flex-end;gap:10px}.rule-video-actions button{min-height:52px;padding:0 18px;border-radius:13px;font:800 clamp(14px,1.25vw,17px)/1.2 "Microsoft YaHei","PingFang SC",Arial,sans-serif;cursor:pointer}.rule-video-secondary{border:1px solid #cefff980;background:#ffffff17;color:#fff}.rule-video-secondary:hover{background:#ffffff2e}.rule-video-secondary:disabled{opacity:.5;cursor:default}.rule-video-primary{border:1px solid #a8fa75;background:linear-gradient(135deg,#a5f95f,#59d977);color:#063d42;box-shadow:0 4px 0 #2c9870}.rule-video-primary:hover{filter:brightness(1.06);transform:translateY(-1px)}
@keyframes rule-video-sweep{50%{transform:translateX(60%)}}
.rule-demo-judge{display:flex;justify-content:center;flex-wrap:wrap;gap:9px;margin-top:10px}.rule-demo-judge button{min-height:40px;padding:0 14px;border-radius:10px;color:#fff;font:800 13px/1 "Microsoft YaHei","PingFang SC",Arial,sans-serif;cursor:pointer}.rule-demo-correct{border:1px solid #79f2bb;background:linear-gradient(135deg,#07895b,#14ae77)}.rule-demo-wrong{border:1px solid #ff9b90;background:linear-gradient(135deg,#cf4451,#ef6a58)}.rule-demo-feedback{min-height:18px;margin:8px 0 0;color:#baffcf;font-size:12px;font-weight:800;text-align:center}
.rule-demo-controls button.is-demo-active{outline:3px solid #b9ff74;box-shadow:0 0 0 6px #b9ff7438,0 0 22px #b9ff74b8;transform:translateY(-2px)}
.rule-demo-controls button.is-demo-clicked{animation:rule-demo-click .62s ease-out}
@keyframes rule-demo-click{0%{transform:translateY(-2px) scale(1)}22%{transform:translateY(2px) scale(.94);filter:brightness(.9)}54%{transform:translateY(-3px) scale(1.04)}100%{transform:translateY(-2px) scale(1)}}
@media(max-width:760px){.rule-video-layer{padding:0}.rule-video-player{width:100%;min-height:100vh;border-radius:0}.rule-video-header,.rule-video-footer{padding:17px 20px}.rule-video-stage{min-height:0;padding:35px 22px}.rule-video-footer{grid-template-columns:1fr}.rule-video-status{grid-column:1}.rule-video-actions{grid-column:1;grid-row:auto;display:grid;grid-template-columns:1fr 1fr}.rule-video-primary{grid-column:1/-1}.rule-video-actions button{min-height:48px;padding:0 10px}.rule-video-close{width:42px;height:42px;font-size:32px}.rule-video-detail-list{gap:8px}.rule-video-detail-list span{padding:8px 12px}}
