:root{--void:#02050c;--panel:#071426dd;--panel2:#0a1d35dd;--blue:#81D742;--cyan:#81D742;--green-soft:#B8FF78;--white:#f5fbff;--muted:#8FAE7A;--red:#ff385c}
*{box-sizing:border-box}html,body{min-height:100%}body{margin:0;color:var(--white);font-family:Inter,Segoe UI,Arial,sans-serif;background:radial-gradient(circle at 50% 12%,#1d3510 0,#0c1907 24%,#050904 58%,#010308 100%);padding:24px;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.25;background-image:linear-gradient(#31591d0f 1px,transparent 1px),linear-gradient(90deg,#31591d0f 1px,transparent 1px);background-size:34px 34px}
.scanlines{position:fixed;inset:0;pointer-events:none;z-index:20;opacity:.07;background:repeating-linear-gradient(0deg,transparent 0 3px,#fff 4px)}
.game-shell{width:min(1180px,100%);margin:auto;position:relative;z-index:2}.topbar{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:10px 0 18px}
.eyebrow,.tagline,.micro-label,.panel-title,footer,.stats-strip{font-family:Consolas,Monaco,monospace;letter-spacing:.14em}.eyebrow{font-size:.68rem;color:var(--cyan);opacity:.8}
h1{font-size:clamp(3rem,8vw,6.2rem);line-height:.82;margin:.2rem 0 .7rem;letter-spacing:.04em;font-weight:900}.eye-word{color:var(--cyan);text-shadow:0 0 22px #81D74299}.brand-icon{font-size:.55em;vertical-align:.12em;margin-left:.08em;filter:drop-shadow(0 0 9px #9cf260);animation:targetPulse 2.4s ease-in-out infinite}
@keyframes targetPulse{50%{transform:scale(1.12) rotate(12deg);filter:drop-shadow(0 0 17px #B8FF78)}}.tagline{margin:0;color:var(--muted);font-size:.72rem}
.hud-panel{position:relative;border:1px solid #5f9e38;background:linear-gradient(145deg,var(--panel2),var(--panel));box-shadow:inset 0 0 35px #4f8f281c,0 18px 60px #0009;clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,22px 100%,0 calc(100% - 22px))}
.stats-strip{display:grid;grid-template-columns:repeat(5,1fr) auto;align-items:center;margin-bottom:18px;padding:10px 14px;gap:8px}.stats-strip>div{text-align:center;border-right:1px solid #47762f55}.stats-strip b{display:block;font-size:1.2rem;color:#efffe6}.stats-strip span{font-size:.52rem;color:var(--muted)}
.mini-btn{border:0;background:transparent;color:#7ea66a;font:700 .58rem Consolas,monospace;letter-spacing:.08em;cursor:pointer}.mini-btn:hover{color:var(--cyan)}
.arena{display:grid;grid-template-columns:310px 1fr;gap:18px;min-height:580px}.panel-title{padding:17px 19px;border-bottom:1px solid #4f853066;color:#c9ff9d;font-size:.72rem;background:#09130688}.panel-title span{color:var(--cyan);margin-right:9px}
.target-panel{text-align:center}.die-wrap{display:grid;place-items:center;min-height:320px}.d20{position:relative;width:220px;height:220px;border:0;background:transparent;color:white;cursor:pointer;display:grid;place-items:center;font-size:4.8rem;font-weight:900;text-shadow:0 0 18px var(--cyan);isolation:isolate}
.die-shape{position:absolute;inset:22px;z-index:-1;clip-path:polygon(50% 0,88% 20%,100% 61%,72% 100%,28% 100%,0 61%,12% 20%);background:linear-gradient(145deg,#4f9027aa,#0b1607 62%);border:1px solid var(--cyan);filter:drop-shadow(0 0 13px #81D742)}
.die-shape:after{content:"";position:absolute;inset:18%;clip-path:polygon(50% 0,100% 80%,0 80%);border:1px solid #d9ffba88;background:#81D7420d}.die-ring{position:absolute;border:1px solid #9df35d88;border-radius:50%;box-shadow:0 0 15px #69b83c55}.ring-a{inset:0}.ring-b{inset:12px;border-style:dashed;animation:orbit 10s linear infinite}.d20.rolling{animation:tumble .8s cubic-bezier(.2,.8,.2,1)}
@keyframes orbit{to{transform:rotate(360deg)}}@keyframes tumble{0%{transform:rotate(0) scale(1)}30%{transform:rotate(90deg) scale(.82)}65%{transform:rotate(-70deg) scale(1.08)}100%{transform:rotate(0) scale(1)}}
.readout{font:700 .7rem Consolas,monospace;letter-spacing:.16em;color:var(--muted);margin:-25px 0 20px}.hud-btn{border:1px solid #5c9639;background:#0b1608;color:#efffe5;padding:12px 20px;font:800 .75rem Consolas,monospace;letter-spacing:.1em;cursor:pointer;clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);transition:.16s ease}
.hud-btn:hover:not(:disabled){background:#18350e;border-color:var(--cyan);box-shadow:0 0 16px #81D74255;transform:translateY(-1px)}.hud-btn:disabled{opacity:.28;cursor:not-allowed}.primary{background:linear-gradient(90deg,#427f20,#6fbe38);border-color:#b8ff78}.ghost{background:#0a1207cc}.target-panel>.hud-btn{width:calc(100% - 38px);margin:0 19px 20px}
.hand-panel{padding-bottom:24px}.hand-heading{display:flex;justify-content:space-between;align-items:flex-start;padding:28px 30px 0;gap:30px}.micro-label{font-size:.63rem;color:var(--muted)}.score{font-size:4.8rem;line-height:1;font-weight:900;text-shadow:0 0 18px #81D74266}.telemetry{text-align:right;max-width:390px}.status{margin-top:8px;color:#c8dbbe;line-height:1.45;font-size:.9rem}
.cards{min-height:310px;display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:15px;padding:24px 30px}.empty-slot{width:100%;height:190px;border:1px dashed #47762f;display:grid;place-items:center;color:#6d8b5e;font:700 .72rem Consolas,monospace;letter-spacing:.16em}
.card{width:122px;height:176px;position:relative;padding:10px;border:1px solid #a5ef6e;background:linear-gradient(155deg,#f9fff4,#e6f7dc);color:#0a1207;box-shadow:0 8px 22px #0009,0 0 13px #81D74244;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px));font:900 1.35rem Consolas,monospace;display:flex;flex-direction:column;justify-content:space-between;animation:deal .28s ease}.card.red{color:#b9163b}.card .suit{text-align:center;font-size:3.5rem}.card .bottom{text-align:right}@keyframes deal{from{transform:translateY(-22px) scale(.94);opacity:0}to{transform:none;opacity:1}}
.controls{display:flex;gap:12px;padding:0 30px}.controls .hud-btn{min-width:105px}footer{display:flex;justify-content:space-between;gap:20px;padding:15px 4px;color:#748968;font-size:.63rem}#result{color:var(--cyan);text-align:right}
.outcome-overlay{position:fixed;inset:0;z-index:50;display:grid;place-items:center;pointer-events:none;opacity:0;visibility:hidden;background:radial-gradient(circle,#101e0acc,#01030aee);transition:opacity .28s,visibility .28s}.outcome-overlay.show{opacity:1;visibility:visible}.outcome-overlay.lose{background:radial-gradient(circle,#310817d9,#030208f2)}.outcome-grid{position:absolute;inset:0;background-image:linear-gradient(#81D74210 1px,transparent 1px),linear-gradient(90deg,#81D74210 1px,transparent 1px);background-size:45px 45px;transform:perspective(500px) rotateX(55deg) scale(1.7);opacity:.6}
.outcome-copy{position:relative;text-align:center;text-shadow:0 0 30px #81D742}.outcome-overlay.lose .outcome-copy{text-shadow:0 0 30px #ff3159}#outcomeKicker{font:700 .75rem Consolas,monospace;letter-spacing:.35em;color:#c9ff9d}#outcomeTitle{font-size:clamp(5rem,18vw,12rem);font-weight:1000;letter-spacing:.03em;line-height:.9;margin:.15em 0}.lose #outcomeTitle{color:#ff6b82}#outcomeDetail{font:700 .85rem Consolas,monospace;letter-spacing:.18em;color:#c8dbbe}
@media(max-width:780px){body{padding:12px}.arena{grid-template-columns:1fr}.stats-strip{grid-template-columns:repeat(5,1fr)}.stats-strip .mini-btn{grid-column:1/-1}.die-wrap{min-height:245px}.d20{width:170px;height:170px;font-size:3.7rem}.cards{padding:20px}.card{width:92px;height:136px}.card .suit{font-size:2.5rem}}
@media(max-width:520px){.topbar{display:block}.topbar .ghost{margin-top:16px}.hand-heading{display:block}.telemetry{text-align:left;margin-top:16px}.controls{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.controls .hud-btn{min-width:0;padding:11px 7px}.stats-strip b{font-size:.95rem}.stats-strip span{font-size:.43rem}}
/* V4 viewport-fit pass: preserve V3 identity while bringing controls above the fold. */
@media (min-width:781px) and (min-height:650px){
  body{padding:12px 20px}
  .topbar{margin:2px 0 8px;align-items:center}
  .eyebrow{font-size:.6rem}
  h1{font-size:clamp(2.5rem,6.5vh,4.6rem);line-height:.78;margin:.08rem 0 .35rem}
  .tagline{font-size:.62rem}
  .stats-strip{margin-bottom:9px;padding:6px 12px}
  .stats-strip b{font-size:1rem}.stats-strip span{font-size:.48rem}
  .arena{min-height:0;height:calc(100vh - 190px);gap:12px}
  .panel-title{padding:10px 15px}
  .die-wrap{min-height:0;height:calc(100% - 112px)}
  .d20{width:min(190px,28vh);height:min(190px,28vh);font-size:min(4rem,8vh)}
  .readout{margin:-8px 0 10px}
  .target-panel>.hud-btn{margin:0 19px 12px;padding:10px 18px}
  .hand-heading{padding:14px 24px 0}
  .score{font-size:min(4rem,8vh)}
  .cards{min-height:0;height:calc(100% - 158px);padding:10px 24px;align-content:center}
  .empty-slot{height:min(150px,24vh)}
  .card{width:min(112px,15vh);height:min(160px,22vh)}
  .card .suit{font-size:min(3.2rem,6vh)}
  .controls{padding:0 24px 12px}
  footer{padding:6px 4px 0}
}
@media (min-width:781px) and (max-height:760px){
  .tagline{display:none}
  .stats-strip{padding:4px 10px}
  .arena{height:calc(100vh - 145px)}
  footer{display:none}
}

/* V5 guided-flow treatment */
.run-action{display:flex;flex-direction:column;align-items:stretch;gap:5px}
.next-step-cue{
  text-align:center;font:700 .56rem Consolas,monospace;letter-spacing:.13em;
  color:#7d966f;opacity:.75;min-height:.8rem;transition:.2s ease
}
#newGameBtn.next-action{
  border-color:var(--cyan);
  animation:nextActionPulse 1.15s ease-in-out infinite;
}
#newGameBtn.next-action + .next-step-cue{
  color:var(--cyan);opacity:1;text-shadow:0 0 9px #9cf260
}
@keyframes nextActionPulse{
  0%,100%{box-shadow:0 0 0 #81D74200,inset 0 0 8px #81D74212;transform:translateY(0)}
  50%{box-shadow:0 0 22px #81D74288,inset 0 0 18px #81D74228;transform:translateY(-1px)}
}
@media (prefers-reduced-motion:reduce){#newGameBtn.next-action{animation:none;box-shadow:0 0 16px #81D74288}}

/* V6 opening-hand choice + rules */
.top-actions{display:flex;gap:7px}.icon-btn{white-space:nowrap}
.opening-choice{display:none;align-items:center;gap:10px;padding:0 30px 12px;font:700 .62rem Consolas,monospace;letter-spacing:.12em;color:var(--muted)}
.opening-choice.show{display:flex}.choice-btn b{font-size:1.1rem;color:var(--cyan)}
.choice-btn.ready{border-color:var(--cyan);animation:choicePulse 1.3s ease-in-out infinite}
@keyframes choicePulse{50%{box-shadow:0 0 18px #81D74277;background:#18350e}}
.modal{position:fixed;inset:0;z-index:80;display:none;place-items:center;padding:20px}.modal.open{display:grid}
.modal-backdrop{position:absolute;inset:0;background:#030603e8;backdrop-filter:blur(6px)}
.modal-card{position:relative;width:min(680px,96vw);max-height:88vh;overflow:auto;z-index:1;clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,22px 100%,0 calc(100% - 22px))}
.modal-close{position:absolute;right:14px;top:12px;z-index:3;border:0;background:transparent;color:var(--cyan);font-size:1.2rem;cursor:pointer}
.rules-body{padding:22px 28px 28px;color:#c8dbbe;line-height:1.55}.rules-body h2{margin:0 0 18px;color:white;font-size:2rem}.rules-body h3{color:var(--cyan);font:800 .72rem Consolas,monospace;letter-spacing:.16em;margin-top:24px}
.rule-step{display:grid;grid-template-columns:42px 1fr;gap:12px;padding:11px 0;border-bottom:1px solid #47762f44}.rule-step>b{color:var(--cyan);font-family:Consolas,monospace}.rules-note{font-size:.8rem;color:#7d966f;border-left:2px solid var(--cyan);padding-left:12px;margin-top:22px}
@media(max-width:520px){.top-actions{flex-wrap:wrap}.opening-choice{padding:0 20px 10px;display:none;grid-template-columns:1fr 1fr}.opening-choice.show{display:grid}.opening-choice>span{grid-column:1/-1}.choice-btn{padding:10px 7px}}

/* V7 final cosmetic pass: illuminated 45-degree HUD cuts */
.hud-panel{
  overflow:visible;
  filter:drop-shadow(0 0 4px #81D74218);
}
.hud-panel .panel-title{position:relative}
.hud-panel:before,.hud-panel:after{
  content:"";position:absolute;z-index:4;pointer-events:none;
  width:31px;height:1px;background:linear-gradient(90deg,transparent,var(--cyan));
  box-shadow:0 0 7px #a5ef6e,0 0 13px #69b83c88;
  transform-origin:center;
}
.hud-panel:before{right:-5px;top:10px;left:auto;transform:rotate(45deg)}
.hud-panel:after{left:-5px;bottom:10px;right:auto;transform:rotate(45deg)}
.hud-btn{position:relative;filter:drop-shadow(0 0 2px #81D74222)}
.hud-btn:not(:disabled):after{
  content:"";position:absolute;width:12px;height:1px;right:-1px;bottom:3px;
  background:var(--cyan);box-shadow:0 0 6px #a5ef6e;transform:rotate(-45deg);pointer-events:none
}
.sound-off{opacity:.65}


/* V12 neon-green site match + custom second-chance modal */
.decision-modal{z-index:95}
.decision-card{width:min(560px,94vw);overflow:visible;border-color:#81D742;box-shadow:inset 0 0 42px #81D74218,0 0 44px #81D7422e,0 24px 80px #000c}
.decision-body{padding:28px;text-align:center}
.decision-icon{width:64px;height:64px;margin:0 auto 14px;display:grid;place-items:center;border:1px solid #81D742;border-radius:50%;color:#81D742;font-size:1.65rem;box-shadow:0 0 24px #81D74255,inset 0 0 20px #81D74220;animation:targetPulse 2.4s ease-in-out infinite}
.decision-body h2{margin:4px 0 8px;font-size:clamp(2.2rem,8vw,3.8rem);line-height:1;color:#fff;text-shadow:0 0 22px #81D74277}
.decision-body>p{color:#c8dbbe;line-height:1.5}
.decision-readout{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:22px 0 12px}
.decision-readout>div{padding:13px 8px;border:1px solid #47762f;background:#071005cc}
.decision-readout span{display:block;color:#7d966f;font:700 .55rem Consolas,monospace;letter-spacing:.12em}
.decision-readout b{display:block;margin-top:4px;color:#81D742;font:900 1.65rem Consolas,monospace;text-shadow:0 0 12px #81D74266}
.decision-note{font-size:.78rem;margin:12px auto 20px;max-width:410px}
.decision-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.decision-actions .hud-btn{min-height:48px}
@media(max-width:520px){.decision-body{padding:22px 18px}.decision-actions{grid-template-columns:1fr}.decision-readout b{font-size:1.35rem}}


/* V14 polished below-game SEO section + Bootstrap-style FAQ accordion */
.seo-content{
  margin:72px 18px 56px;
  padding:0;
  overflow:visible;
  border:1px solid #47762f;
  background:linear-gradient(155deg,#091307f2,#050b04f5);
  box-shadow:inset 0 0 38px #81D7420b,0 18px 50px #0008,0 0 26px #81D74212;
}
.seo-content>.panel-title{padding-left:18px;padding-right:18px}
.seo-inner{padding:48px 52px 54px;max-width:1100px;margin:0 auto}
.seo-kicker{margin:0 0 10px;color:var(--cyan);font:700 .62rem Consolas,monospace;letter-spacing:.16em}
.seo-content h2{margin:0 0 18px;font-size:clamp(1.8rem,4vw,2.75rem);line-height:1.08;color:#f5fbff}
.seo-content h3{margin:0 0 9px;color:var(--green-soft);font-size:1.08rem}
.seo-content p{color:#c8dbbe;line-height:1.75}
.seo-inner>p:not(.seo-kicker){max-width:860px;margin-bottom:0}
.seo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:34px 0 54px}
.seo-grid article{padding:24px;border:1px solid #3e6c28;background:linear-gradient(145deg,#0b1908d9,#061004d9);box-shadow:inset 0 0 24px #81D7420d,0 8px 20px #0005}
.seo-grid article p{margin-bottom:0}

.faq-section{margin-top:8px;padding-top:42px;border-top:1px solid #365a265c}
.faq-heading{margin-bottom:24px}
.faq-heading h2{margin-bottom:8px}
.faq-intro{margin:0;max-width:720px;color:#8fae7a!important}
.accordion{display:grid;gap:12px}
.accordion-item{overflow:hidden;border:1px solid #3f6f2b;background:#071005;box-shadow:0 8px 22px #0005,inset 0 0 18px #81D74208;transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}
.accordion-item:hover{border-color:#5f9e38;box-shadow:0 10px 26px #0006,0 0 16px #81D74212}
.accordion-header{margin:0!important;font-size:inherit!important}
.accordion-button{width:100%;min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 22px;border:0;background:linear-gradient(90deg,#0b1808,#081106);color:#f0ffe7;text-align:left;font:800 1rem/1.35 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;cursor:pointer;transition:background .2s ease,color .2s ease,box-shadow .2s ease}
.accordion-button:hover{background:linear-gradient(90deg,#10230b,#0b1808);color:#dfffd0}
.accordion-button:focus-visible{outline:2px solid #81D742;outline-offset:-3px;box-shadow:inset 0 0 0 1px #b7ff8d}
.accordion-button[aria-expanded="true"]{background:linear-gradient(90deg,#12280c,#0b1808);color:#fff;box-shadow:inset 4px 0 0 #81D742}
.accordion-plus{position:relative;flex:0 0 34px;width:34px;height:34px;border:1px solid #5f9e38;background:#0b1808;box-shadow:0 0 12px #81D74220;transition:transform .25s ease,background .25s ease,border-color .25s ease}
.accordion-plus:before,.accordion-plus:after{content:"";position:absolute;left:50%;top:50%;width:14px;height:2px;background:#81D742;transform:translate(-50%,-50%);box-shadow:0 0 8px #81D74288}
.accordion-plus:after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .25s ease}
.accordion-button[aria-expanded="true"] .accordion-plus{background:#17350e;border-color:#81D742;transform:rotate(180deg)}
.accordion-button[aria-expanded="true"] .accordion-plus:after{transform:translate(-50%,-50%) rotate(0)}
.accordion-collapse{border-top:1px solid #2f54224f;background:#050d04}
.accordion-body{padding:20px 24px 24px;color:#c8dbbe;line-height:1.75}

@media(max-width:780px){
  .seo-content{margin:54px 10px 38px}
  .seo-inner{padding:34px 24px 40px}
  .seo-grid{grid-template-columns:1fr;gap:14px;margin:28px 0 42px}
  .faq-section{padding-top:34px}
  .accordion{gap:10px}
  .accordion-button{min-height:62px;padding:16px 16px;font-size:.96rem}
  .accordion-body{padding:17px 18px 20px}
}
@media(max-width:460px){
  .seo-content{margin-left:6px;margin-right:6px}
  .seo-inner{padding:30px 18px 34px}
  .seo-grid article{padding:19px}
  .accordion-button{padding:15px 14px;gap:12px}
  .accordion-plus{flex-basis:30px;width:30px;height:30px}
}
