.how-layout{position:relative;overflow:hidden}.how-layout:before{content:"";position:absolute;z-index:-1;width:44rem;height:44rem;inset-inline-start:-20rem;inset-block-start:11rem;border:1px solid rgba(133,97,232,.16);border-radius:50%;box-shadow:0 0 0 3rem #8561e805,0 0 0 8rem #ff684f03}.how-hero{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(16rem,.65fr);gap:clamp(1rem,4vw,4rem);align-items:end;max-width:none;margin-block:2.2rem 2.4rem;padding:clamp(1.15rem,3vw,2.4rem);overflow:hidden;border:1px solid rgba(133,97,232,.2);border-radius:8px 26px;background:linear-gradient(125deg,#082445d4,#04142bf5)}.how-hero:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.55;background:linear-gradient(118deg,transparent 0 61%,rgba(133,97,232,.2) 61.1% 61.25%,transparent 61.35%),radial-gradient(circle at 15% 80%,rgba(255,104,79,.1),transparent 24%)}.how-hero-copy,.how-mission-dossier{position:relative;z-index:1}.how-hero-copy{display:grid;gap:1rem;max-width:48rem}.how-hero .signal-rail{margin-block-end:.1rem}.how-title-lockup{display:flex;align-items:flex-start;gap:.85rem}.how-signal-stamp{flex:none;width:1rem;height:1rem;margin-block-start:.65rem;background:var(--color-gold);box-shadow:0 0 0 4px #ff684f1a,12px 11px 0 -5px var(--color-primary)}.how-hero h1{margin:0;max-width:11ch;font-size:clamp(2.2rem,5vw,4.3rem);line-height:1.14}.how-hero-copy>p:not(.eyebrow){max-width:42rem;margin:0;color:var(--color-text-muted);line-height:2}.how-mission-dossier{display:grid;gap:.9rem;min-height:17.5rem;padding:1rem;border:1px solid rgba(255,104,79,.38);background:linear-gradient(145deg,#ff684f1a,#061d38c7);box-shadow:inset 0 0 0 1px #8561e821,12px 14px #8561e812}.dossier-head{display:flex;align-items:center;gap:.55rem;padding-bottom:.75rem;border-bottom:1px solid rgba(208,232,230,.14);color:var(--color-text);font-family:var(--font-display);font-size:.78rem}.dossier-head small{margin-inline-start:auto;color:var(--color-gold);font:700 .62rem ui-monospace,monospace;letter-spacing:.12em}.dossier-mark{width:.65rem;height:.65rem;background:var(--color-primary);box-shadow:0 0 0 4px #8561e821}.dossier-item{display:grid;gap:.28rem}.dossier-item span{color:var(--color-primary-bright);font-size:.62rem;font-weight:800;letter-spacing:.05em}.dossier-item strong{color:#f8f2e7;font-size:.82rem;line-height:1.7}.dossier-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:.3rem;margin-top:auto}.dossier-grid i{display:block;aspect-ratio:1;border:1px solid rgba(207,222,219,.22);background:#ffffff09}.dossier-grid i:nth-child(2),.dossier-grid i:nth-child(4){background:var(--color-primary);border-color:var(--color-primary)}.dossier-grid i:nth-child(5){background:var(--color-gold);border-color:var(--color-gold)}.how-path-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-block:0 1rem;padding-inline:.4rem}.how-path-heading .eyebrow{margin:0}.how-path-heading>span{color:var(--color-gold);font:700 .68rem var(--font-display)}.how-steps{position:relative;display:grid;gap:1rem;margin:0;padding:0;list-style:none}.how-steps:before{content:"";position:absolute;inset-inline-start:2.35rem;inset-block:1.4rem;width:1px;background:linear-gradient(var(--color-gold),var(--color-primary),transparent)}.how-step{position:relative;display:grid;grid-template-columns:4.7rem minmax(0,1fr);gap:1.15rem;min-height:10.5rem;padding:1.25rem 1.35rem;overflow:hidden;border:1px solid rgba(133,97,232,.23);border-radius:6px 18px;background:linear-gradient(100deg,#8561e824,#071b33e8 44%,#051327f7);box-shadow:0 14px 28px #0000001f}.how-step:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--color-primary);box-shadow:0 0 18px #8561e88c}.how-step:nth-child(2):before{background:var(--color-gold);box-shadow:0 0 18px #ff684f61}.how-step:nth-child(3):before{background:var(--color-coral)}.how-step-signal{position:relative;z-index:1;display:grid;align-content:start;justify-items:center;gap:.7rem}.how-step-number{display:grid;place-items:center;width:2.65rem;height:2.65rem;border:1px solid var(--color-primary);border-radius:50%;background:#082849;color:var(--color-gold);font:800 .69rem ui-monospace,monospace;box-shadow:0 0 0 5px #08213e}.how-step:nth-child(2) .how-step-number{border-color:var(--color-gold)}.how-step-signal svg{width:1.55rem;height:1.55rem;fill:none;stroke:var(--color-primary-bright);stroke-width:1.7}.how-step:nth-child(2) .how-step-signal svg{stroke:var(--color-gold)}.how-step:nth-child(3) .how-step-signal svg{stroke:var(--color-coral)}.how-step-copy{position:relative;z-index:1}.how-step-kicker{margin:0 0 .35rem;color:var(--color-primary-bright)!important;font:800 .66rem var(--font-display);letter-spacing:.04em}.how-step h2{margin:0 0 .45rem;color:#fffdf7;font-size:clamp(1.2rem,2vw,1.65rem)}.how-step p:not(.how-step-kicker){max-width:50rem;margin:0;color:var(--color-text-muted);line-height:1.9}.how-step-action{display:inline-flex;margin-top:.8rem;color:var(--color-gold);font-size:.69rem;font-weight:800}@media (max-width:720px){.how-layout{padding-inline:.75rem}.how-hero{grid-template-columns:1fr;padding:1rem;gap:1.25rem}.how-hero h1{font-size:clamp(2rem,10vw,3.35rem)}.how-mission-dossier{min-height:0}.how-steps:before{inset-inline-start:1.95rem}.how-step{grid-template-columns:3.9rem minmax(0,1fr);padding:1rem;gap:.8rem}.how-step-number{width:2.3rem;height:2.3rem}.how-step-signal svg{width:1.25rem;height:1.25rem}.how-path-heading{padding-inline:0}}.how-guide{width:min(980px,100%);min-height:min(760px,calc(100dvh - 7rem));margin:clamp(1rem,4vw,3.5rem) auto 4rem;padding:clamp(1rem,3vw,2.2rem);border:2px solid rgba(255,104,79,.42);border-radius:22px 7px;background:linear-gradient(145deg,#ffffff0a,#07102aeb);box-shadow:14px 14px #ff684f1f,0 24px 60px #00000038}.how-guide-top{display:flex;align-items:center;justify-content:space-between;gap:1rem}.how-guide-back{display:inline-flex;align-items:center;gap:.35rem;color:var(--color-text-muted);font-size:.72rem;font-weight:800;transition:color .16s var(--ease-out),transform .16s var(--ease-out)}.how-guide-back:hover{color:var(--coral);transform:translate(-3px)}.how-guide-back svg{width:1.15rem;height:1.15rem;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.how-guide-progress{display:inline-flex;align-items:center;gap:.28rem;direction:ltr;color:#ffffff52;font-family:Alexandria,sans-serif;font-size:.8rem;letter-spacing:.08em}.how-guide-dot{line-height:1}.how-guide-dot.is-active{color:var(--coral);text-shadow:0 0 14px rgba(255,104,79,.7)}.how-guide-stage{display:grid;grid-template-columns:minmax(0,.9fr) minmax(18rem,1.1fr);align-items:center;gap:clamp(1rem,5vw,4.5rem);margin-block:clamp(2rem,7vh,5.5rem)}.how-guide-copy{order:1}.how-guide-copy .eyebrow{margin-block-end:1.1rem}.how-guide-copy h1{max-width:10ch;margin:0 0 .75rem;color:#fffaf0;font-family:Alexandria,sans-serif;font-size:clamp(2rem,5vw,4rem);font-weight:900;letter-spacing:-.06em;line-height:1.14}.how-guide-body{max-width:25rem;margin:0;color:var(--color-text-muted);font-size:clamp(.95rem,1.6vw,1.15rem);line-height:2}.how-guide-art{position:relative;order:2;margin:0;overflow:hidden;border:2px solid rgba(255,255,255,.18);border-radius:18px 5px;background:#171d44;box-shadow:10px 10px #8561e838}.how-guide-art:after{content:"";position:absolute;inset:0;pointer-events:none;border:1px solid rgba(255,255,255,.16);border-radius:inherit;box-shadow:inset 0 -80px 100px #080c232e}.how-guide-art img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover}.how-guide-actions{display:flex;justify-content:space-between;gap:.7rem}.how-guide-actions .button{min-width:8.5rem}.how-guide-next{margin-inline-start:auto}@media (max-width: 700px){.how-guide{min-height:calc(100dvh - 5.5rem);margin-block:.5rem 2rem;padding:1rem;border-radius:16px 5px;box-shadow:7px 7px #ff684f1f,0 18px 42px #0000002e}.how-guide-stage{grid-template-columns:1fr;gap:1.4rem;margin-block:2.3rem 2rem}.how-guide-art{order:1;max-width:100%}.how-guide-copy{order:2}.how-guide-copy h1{max-width:12ch;font-size:clamp(1.8rem,9vw,2.8rem)}.how-guide-body{font-size:.9rem;line-height:1.9}.how-guide-actions .button{min-width:0;flex:1}.how-guide-back span{display:none}}@media (prefers-reduced-motion: no-preference){.how-guide-art{animation:guide-art-in .24s var(--ease-out)}.how-guide-copy{animation:guide-copy-in .24s var(--ease-out)}@keyframes guide-art-in{0%{opacity:.4;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}@keyframes guide-copy-in{0%{opacity:.4;transform:translate(8px)}to{opacity:1;transform:none}}}body[data-page=how-to-play]{background:var(--arcade-cream);color:var(--arcade-ink)}body[data-page=how-to-play]:before{opacity:.18;background-image:radial-gradient(circle,rgba(113,74,33,.12) 1px,transparent 1.2px)}body[data-page=how-to-play] .site-header{background:var(--arcade-cream)}body[data-page=how-to-play] .site-header:after{background:linear-gradient(90deg,transparent,rgba(133,97,232,.35),transparent)}body[data-page=how-to-play] .site-header:before{border-inline-end-color:var(--arcade-coral);border-block-start-color:var(--arcade-violet)}body[data-page=how-to-play] .menu-toggle{border-color:var(--arcade-ink);background:var(--arcade-coral);color:var(--arcade-ink);box-shadow:0 4px 0 var(--arcade-ink)}body[data-page=how-to-play] .how-guide{border-color:var(--arcade-ink);background:linear-gradient(145deg,#fff8e8,#ffe5c9);box-shadow:9px 10px #24234221,0 24px 60px #2423421f}body[data-page=how-to-play] .how-guide-top{color:var(--arcade-ink)}body[data-page=how-to-play] .how-guide-back{color:#675d6d}.how-guide-back:hover{color:var(--arcade-violet-dark)}body[data-page=how-to-play] .how-guide-progress{color:#24234247}.how-guide-progress .how-guide-dot.is-active{color:var(--arcade-coral);text-shadow:0 0 12px rgba(255,104,79,.4)}body[data-page=how-to-play] .how-guide-copy h1{color:var(--arcade-ink)}.how-guide-body{color:#675d6d}body[data-page=how-to-play] .how-guide-art{border-color:var(--arcade-ink);background:#eee5ff;box-shadow:10px 10px #8561e847}body[data-page=how-to-play] .how-guide-actions .button-secondary{border-color:var(--arcade-violet);background:#eee5ff;color:var(--arcade-violet-dark)}body[data-page=how-to-play] .how-guide-actions .button-primary{border-color:var(--arcade-ink);background:var(--arcade-coral);color:var(--arcade-ink);box-shadow:0 4px 0 var(--arcade-ink)}body[data-page=how-to-play] .how-guide-actions .button:disabled{color:#aa9ea5;border-color:#d6c9c5;background:#f1e8df}body[data-page=how-to-play]{min-height:100svh;background:#18132f url(/assets/shifra-home-desktop_99d29893.webp) center / cover fixed;color:#fff7e8}body[data-page=how-to-play]:before{opacity:1;background:linear-gradient(180deg,#0d0a2585,#110b22d1)}body[data-page=how-to-play] .site-header{position:relative;z-index:2;background:transparent}body[data-page=how-to-play] .brand{display:none}.how-layout{width:min(900px,100%);min-height:calc(100svh - 5rem);margin-inline:auto;padding:clamp(.5rem,2vw,1.2rem) clamp(.8rem,3vw,1.4rem) 1.4rem}.how-card-playbook{display:grid;align-content:center;gap:1rem;min-height:calc(100svh - 6.2rem)}.how-playbook-bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.6rem;color:#fff7e8}.how-playbook-bar .how-guide-back{color:#fff7e8}.how-playbook-bar .how-guide-back:hover{color:#ffd25a}.how-card-progress{display:flex;gap:.3rem;direction:ltr}.how-card-progress i{display:block;width:.52rem;height:.52rem;border:1px solid rgba(255,255,255,.58);border-radius:50%}.how-card-progress i.is-seen{background:#8561e8;border-color:#8561e8}.how-card-progress i.is-active{background:#ff684f;border-color:#ff684f;box-shadow:0 0 0 4px #ff684f33}.how-card-count{direction:ltr;justify-self:end;color:#fff8e8b8;font:800 .62rem ui-monospace,monospace;letter-spacing:.08em}.how-card-stage{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(17rem,.92fr);overflow:hidden;border:2px solid rgba(255,255,255,.23);border-radius:22px 46px;background:linear-gradient(135deg,#281c4bed,#120d2bf7);box-shadow:0 12px #0a071ba8,0 26px 60px #00000059}.how-card-art{position:relative;min-height:clamp(23rem,56vh,34rem);margin:0;overflow:hidden;background:#29204e}.how-card-art:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 45%,rgba(14,9,34,.44))}.how-card-art img{display:block;width:100%;height:100%;object-fit:cover}.how-card-art-label{position:absolute;z-index:1;inset-inline-start:1rem;inset-block-start:1rem;padding:.38rem .58rem;border:1px solid rgba(255,255,255,.5);border-radius:5px 10px;background:#171037b3;color:#fff7e8;font:800 .6rem var(--font-display)}.how-card-copy{display:grid;align-content:center;gap:.9rem;padding:clamp(1.2rem,4vw,3rem);background:linear-gradient(145deg,rgba(255,104,79,.13),transparent 36%),linear-gradient(145deg,#8561e82b,#130d2ef5)}.how-card-index{margin:0;color:#ffd25a;font:800 .68rem var(--font-display);letter-spacing:.08em}.how-card-copy h1{max-width:11ch;margin:0;color:#fff8eb;font-family:var(--font-display);font-size:clamp(2rem,4.5vw,4rem);line-height:1.17}.how-card-copy .how-guide-body{max-width:27rem;margin:0;color:#fff8e8cc;font-size:clamp(.92rem,1.6vw,1.1rem);line-height:2}.how-card-rule{display:flex;align-items:center;gap:.52rem;margin-top:.5rem;color:#ffb39f;font-size:.73rem}.how-card-rule span{width:.7rem;height:.7rem;border-radius:2px;background:#ff684f;box-shadow:.72rem .4rem 0 -.26rem #8561e8}.how-card-actions{display:flex;justify-content:space-between;gap:.7rem}.how-card-nav{min-width:8rem;min-height:3rem;border:2px solid #211a40;border-radius:8px 16px;background:#fff5e1;color:#211a40;box-shadow:0 4px #0a071b;font-family:var(--font-display);font-size:.9rem;font-weight:900;transition:transform .16s cubic-bezier(.23,1,.32,1),box-shadow .16s cubic-bezier(.23,1,.32,1)}.how-card-nav:active{transform:translateY(3px);box-shadow:0 1px #0a071b}.how-card-next{margin-inline-start:auto;background:#ff684f}.how-card-nav:disabled{opacity:.4;box-shadow:none}.how-card-nav:focus-visible,.how-guide-back:focus-visible{outline:3px solid #fff7e8;outline-offset:3px}@media (max-width:700px){body[data-page=how-to-play]{background-image:url(/assets/shifra-home-mobile_2a882439.webp);background-position:center top;background-attachment:scroll}.how-layout{min-height:calc(100svh - 4.2rem);padding:.38rem .75rem 1rem}.how-card-playbook{min-height:calc(100svh - 4.6rem);gap:.68rem}.how-card-stage{grid-template-columns:1fr;border-radius:17px 32px}.how-card-art{min-height:0;aspect-ratio:1.13}.how-card-copy{gap:.65rem;padding:1.15rem}.how-card-copy h1{font-size:clamp(1.75rem,8.5vw,2.55rem)}.how-card-copy .how-guide-body{font-size:.86rem;line-height:1.82}.how-card-actions{gap:.5rem}.how-card-nav{flex:1;min-width:0;min-height:2.85rem}.how-playbook-bar .how-guide-back span{display:none}}@media (prefers-reduced-motion: no-preference){.how-card-stage{animation:how-card-enter .24s cubic-bezier(.23,1,.32,1)}@keyframes how-card-enter{0%{opacity:.35;transform:translateY(10px) scale(.987)}to{opacity:1;transform:none}}}
