:root{--red:#f20d16;--red2:#a6070d;--ink:#080808;--panel:#131313;--paper:#f4f1eb;--muted:#9a9a9a;--green:#35d07f;--line:rgba(255,255,255,.12)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--ink);color:#fff;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}body{overflow:hidden}.ambient{position:fixed;inset:0;overflow:hidden;pointer-events:none}.ambient:before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:60px 60px;mask-image:linear-gradient(to bottom,black,transparent 70%)}.ambient i{position:absolute;border-radius:50%;filter:blur(2px);background:radial-gradient(circle,var(--red),transparent 68%);opacity:.15}.ambient i:nth-child(1){width:45vw;height:45vw;right:-15vw;top:-20vw}.ambient i:nth-child(2){width:30vw;height:30vw;left:-15vw;bottom:-10vw}.ambient i:nth-child(3){width:10rem;height:10rem;left:45%;top:45%;opacity:.06}
.topbar{position:fixed;z-index:10;top:0;left:0;right:0;height:78px;display:flex;align-items:center;gap:18px;padding:10px clamp(18px,4vw,64px);border-bottom:1px solid var(--line);background:rgba(8,8,8,.72);backdrop-filter:blur(18px)}.topbar img{width:62px;height:55px;object-fit:contain;background:#fff;border-radius:10px}.topbar-title{display:flex;flex-direction:column;gap:2px;margin-right:auto}.topbar-title b{font-size:12px;letter-spacing:.16em}.topbar-title span{font-size:11px;color:var(--muted)}.icon-btn{width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:rgba(255,255,255,.04);color:#fff;cursor:pointer}.icon-btn:hover{border-color:var(--red);color:var(--red)}
#deck{position:fixed;inset:78px 0 86px}.slide{position:absolute;inset:0;display:grid;opacity:0;visibility:hidden;transform:translateX(35px) scale(.985);transition:.55s cubic-bezier(.2,.8,.2,1);padding:clamp(28px,5vw,72px) clamp(22px,7vw,110px);overflow:auto}.slide.active{opacity:1;visibility:visible;transform:none}.hero{grid-template-columns:1.1fr .9fr;align-items:center;gap:6vw}.hero-logo{display:grid;place-items:center}.hero-logo img{width:min(420px,40vw);max-height:52vh;object-fit:contain;filter:drop-shadow(0 30px 45px rgba(242,13,22,.2))}.kicker{display:flex;align-items:center;gap:12px;color:var(--red);font-size:12px;font-weight:800;letter-spacing:.2em;text-transform:uppercase}.kicker:before{content:"";width:34px;height:2px;background:var(--red)}h1{font-size:clamp(44px,7.8vw,112px);line-height:.88;letter-spacing:-.065em;margin:22px 0}.hero h1 span,.rule-copy h1 span{color:var(--red)}.lead{max-width:650px;font-size:clamp(16px,1.7vw,22px);line-height:1.65;color:#b8b8b8}.start-btn,.nav,.action{border:0;border-radius:999px;font-weight:800;cursor:pointer}.start-btn{margin-top:28px;padding:17px 28px;background:var(--red);color:#fff;box-shadow:0 14px 40px rgba(242,13,22,.25)}
.rule-slide{grid-template-columns:minmax(80px,.18fr) 1.3fr .65fr;align-items:center;gap:clamp(28px,5vw,80px)}.rule-index{font-size:clamp(70px,12vw,190px);font-weight:900;line-height:1;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.18);writing-mode:vertical-rl}.rule-copy h1{font-size:clamp(40px,5.8vw,86px);max-width:13ch}.rule-items{display:grid;gap:12px;max-width:820px}.rule-item{display:grid;grid-template-columns:28px 1fr;gap:13px;padding:12px 0;border-bottom:1px solid var(--line);color:#c7c7c7;font-size:clamp(14px,1.25vw,18px);line-height:1.48}.rule-item b{color:#fff}.check{color:var(--red);font-weight:900}.visual-card{align-self:stretch;min-height:280px;display:flex;flex-direction:column;justify-content:flex-end;padding:30px;border:1px solid var(--line);border-radius:28px;background:linear-gradient(155deg,rgba(242,13,22,.16),rgba(255,255,255,.025));overflow:hidden}.visual-icon{font-size:clamp(60px,8vw,120px);filter:grayscale(1);opacity:.9;margin:auto}.visual-card p{color:#bbb;line-height:1.55;font-size:14px}.danger-tag{display:inline-flex;width:max-content;padding:7px 11px;border-radius:99px;background:rgba(242,13,22,.16);color:#ff6168;font-size:11px;font-weight:900;letter-spacing:.1em}
.quiz-slide,.sign-slide,.done-slide{align-content:start;max-width:1050px;margin:auto;width:100%;padding-top:clamp(30px,6vw,72px)}.quiz-head{display:flex;justify-content:space-between;gap:20px;align-items:end}.quiz-head h1,.sign-slide h1,.done-slide h1{font-size:clamp(38px,6vw,75px);margin:12px 0 26px}.score-pill{border:1px solid var(--line);border-radius:99px;padding:10px 16px;color:#bbb}.question-card,.sign-card{padding:clamp(22px,4vw,42px);border:1px solid var(--line);border-radius:28px;background:rgba(255,255,255,.045)}.question-card h2{font-size:clamp(21px,3vw,32px);margin:0 0 24px;line-height:1.3}.options{display:grid;grid-template-columns:1fr 1fr;gap:12px}.option{display:flex;align-items:center;text-align:left;gap:12px;padding:16px;border:1px solid var(--line);border-radius:16px;background:#161616;color:#ddd;cursor:pointer;font-size:15px}.option:hover{border-color:#666}.option.correct{border-color:var(--green);background:rgba(53,208,127,.1)}.option.wrong{border-color:var(--red);background:rgba(242,13,22,.1)}.letter{display:grid;place-items:center;min-width:30px;height:30px;border-radius:50%;background:#292929;font-weight:800}.feedback{min-height:24px;margin:16px 0;color:#bbb}.action{padding:14px 22px;background:var(--red);color:#fff}.action.secondary{background:transparent;border:1px solid var(--line)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.field{display:flex;flex-direction:column;gap:7px}.field label{font-size:12px;color:#aaa}.field input,.field select{width:100%;padding:14px;border:1px solid var(--line);border-radius:12px;background:#0c0c0c;color:#fff;font:inherit;outline:none}.field input:focus,.field select:focus{border-color:var(--red)}.canvas-wrap{margin-top:18px}.canvas-wrap label{display:block;font-size:12px;color:#aaa;margin-bottom:7px}#signature{width:100%;height:160px;background:#f6f4ef;border-radius:14px;touch-action:none;cursor:crosshair}.sign-actions{display:flex;gap:12px;justify-content:space-between;margin-top:12px}.accept{display:flex;gap:10px;align-items:flex-start;margin:20px 0;color:#bbb;font-size:14px;line-height:1.5}.accept input{accent-color:var(--red);margin-top:3px}.done-slide{text-align:center;justify-items:center;align-content:center}.done-mark{display:grid;place-items:center;width:100px;height:100px;border-radius:50%;background:rgba(53,208,127,.12);border:1px solid var(--green);color:var(--green);font-size:50px}.done-slide p{max-width:620px;color:#aaa;line-height:1.6}.done-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:22px}
.controls{position:fixed;z-index:10;left:0;right:0;bottom:0;height:86px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:15px clamp(18px,4vw,64px);background:rgba(8,8,8,.88);backdrop-filter:blur(18px);border-top:1px solid var(--line)}.progress{position:absolute;left:0;right:0;top:0;height:3px;background:#222}.progress span{display:block;height:100%;width:8%;background:linear-gradient(90deg,var(--red2),var(--red));transition:.45s}.nav{padding:13px 20px;color:#fff}.nav span{display:inline}.nav.ghost{justify-self:start;background:transparent;border:1px solid var(--line)}.nav.primary{justify-self:end;background:var(--red)}.nav:disabled{opacity:.25;cursor:not-allowed}.counter{display:flex;align-items:baseline;gap:7px;color:#777}.counter b{font-size:24px;color:#fff}
@media(max-width:800px){.hero{grid-template-columns:1fr}.hero-logo{display:none}.rule-slide{grid-template-columns:1fr;align-content:start}.rule-index{position:absolute;right:20px;top:20px;writing-mode:initial;font-size:90px}.rule-copy{position:relative;z-index:1}.visual-card{min-height:140px}.visual-icon{font-size:60px}.options,.form-grid{grid-template-columns:1fr}.topbar{height:68px}.topbar img{width:52px;height:46px}#deck{inset:68px 0 82px}.slide{padding:28px 20px}.rule-copy h1{font-size:42px;margin-top:14px}.controls{height:82px}.nav span{display:none}.nav{width:46px;height:46px;padding:0}.quiz-head{align-items:start;flex-direction:column}.score-pill{align-self:flex-end}.question-card,.sign-card{padding:18px}.visual-card p{margin-bottom:0}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media print{body{background:#fff;color:#111;overflow:visible}.topbar,.controls,.ambient,#deck>.slide{display:none!important}#deck{position:static}.done-slide.active{display:grid!important;position:static;opacity:1;visibility:visible;transform:none;color:#111}.done-mark{color:#15824b}.done-actions{display:none}.done-slide p{color:#333}}
 .visual-card{position:relative;min-height:360px;padding:0;background:#111;isolation:isolate}.visual-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}.visual-card:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to bottom,transparent 35%,rgba(5,5,5,.38) 56%,rgba(5,5,5,.96) 100%)}.visual-icon{position:absolute;top:18px;right:20px;display:grid;place-items:center;width:58px;height:58px;margin:0;border-radius:50%;background:rgba(0,0,0,.65);backdrop-filter:blur(12px);font-size:30px}.visual-card p{margin-top:auto;padding:28px;color:#f1f1f1;font-weight:650;text-shadow:0 2px 8px #000}
.rule-slide:nth-of-type(3) .visual-image{object-position:right center}
.rule-slide:nth-of-type(6) .visual-image{object-fit:contain;object-position:center 30%;background:#0b0b0b}
.responsibility-slide{align-content:start;max-width:1200px;margin:auto;width:100%;padding-top:clamp(28px,5vw,62px)}
.responsibility-slide h1{font-size:clamp(38px,5.6vw,76px);line-height:.95;letter-spacing:-.055em;margin:14px 0 16px;max-width:14ch}
.responsibility-intro{margin:0 0 24px}
.responsibility-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.responsibility-card{padding:clamp(20px,3vw,30px);border:1px solid var(--line);border-radius:24px;background:rgba(255,255,255,.045)}
.role-label{display:inline-block;margin-bottom:14px;color:var(--red);font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.responsibility-card ul{display:grid;gap:10px;margin:0;padding-left:20px;color:#ccc;font-size:14px;line-height:1.45}
.responsibility-card li::marker{color:var(--red)}
.responsibility-notice{margin:16px 0;padding:15px 18px;border-left:3px solid var(--red);background:rgba(242,13,22,.08);color:#bbb;font-size:13px;line-height:1.5}
.responsibility-accept{display:flex;gap:12px;align-items:flex-start;margin:16px 0;color:#eee;font-size:14px;line-height:1.5;cursor:pointer}
.responsibility-accept input{width:20px;height:20px;flex:0 0 auto;margin-top:1px;accent-color:var(--red)}
@media(max-width:800px){.responsibility-grid{grid-template-columns:1fr}.responsibility-slide h1{font-size:40px}.responsibility-card{padding:18px}}