.dice-root{--mint:#d0e8e8;--pink:#fdb9c8;--yellow:#ffd13b;--purple:#b28dff;--black:#1a1a1a;--white:#fff;--bg-color:var(--mint);background-color:var(--bg-color);color:var(--black);z-index:9999;background-image:radial-gradient(#1a1a1a 1px,#0000 1px);background-position:-10px -10px;background-size:20px 20px;flex-direction:column;min-height:100vh;display:flex;position:fixed;inset:0;overflow-y:auto}.dice-root *{box-sizing:border-box;-webkit-tap-highlight-color:transparent;font-family:Helvetica Neue,Arial,sans-serif}.impact-font{text-transform:uppercase;letter-spacing:1px;font-family:Arial Black,Impact,sans-serif}.game-header{background-color:var(--white);border-bottom:4px solid var(--black);z-index:100;justify-content:space-between;align-items:center;padding:1rem 1.5rem;display:flex;position:sticky;top:0}.back-btn{background-color:var(--yellow);color:var(--black);border:3px solid var(--black);cursor:pointer;box-shadow:3px 3px 0px var(--black);border-radius:8px;padding:.5rem 1rem;font-size:1.2rem;text-decoration:none;transition:all .1s;display:inline-block}.back-btn:active{box-shadow:0px 0px 0px var(--black);transform:translate(3px,3px)}.game-title{color:var(--black);font-size:2.2rem}.game-container{flex-direction:column;flex:1;justify-content:space-between;align-items:center;gap:1.5rem;width:100%;max-width:600px;margin:0 auto;padding:1rem 1.5rem 2rem;display:flex}.controls-card{background-color:var(--white);border:4px solid var(--black);box-shadow:6px 6px 0px var(--black);border-radius:16px;flex-direction:column;gap:1rem;width:100%;padding:1rem;display:flex}.mode-btn{background-color:var(--purple);color:var(--black);border:3px solid var(--black);cursor:pointer;box-shadow:3px 3px 0px var(--black);text-align:center;border-radius:8px;width:100%;padding:.5rem 1rem;font-size:1.2rem;transition:all .1s}.mode-btn:active{box-shadow:0px 0px 0px var(--black);transform:translate(3px,3px)}.control-group{background-color:var(--pink);border:2px solid var(--black);border-radius:8px;justify-content:center;align-items:center;gap:1rem;padding:.5rem;display:flex}.control-btn{background-color:var(--white);border:3px solid var(--black);cursor:pointer;width:40px;height:40px;box-shadow:3px 3px 0px var(--black);border-radius:8px;justify-content:center;align-items:center;font-size:1.5rem;transition:all .1s;display:flex}.control-btn:active{box-shadow:0px 0px 0px var(--black);transform:translate(3px,3px)}.control-btn:disabled{opacity:.5;cursor:not-allowed;box-shadow:3px 3px 0px var(--black)!important;transform:none!important}.dice-count-label{text-align:center;width:20px;font-size:1.5rem}.custom-inputs-area{background-color:var(--mint);border:2px solid var(--black);border-radius:8px;flex-direction:column;gap:.5rem;padding:1rem;display:flex}.custom-input-row{align-items:center;gap:.5rem;display:flex}.custom-input-row span{width:20px;font-weight:700}.custom-input{border:2px solid var(--black);text-transform:uppercase;border-radius:6px;flex:1;padding:.5rem;font-size:1rem;font-weight:700}.custom-input:focus{background-color:var(--yellow);outline:none}.dice-stage{perspective:1000px;flex-wrap:wrap;flex:1;place-content:center;gap:1.5rem;width:100%;min-height:180px;padding:1rem 0;display:flex}.die{background-color:var(--white);border:5px solid var(--black);box-shadow:8px 8px 0px var(--black),inset -5px -5px 15px #0000001a;border-radius:20px;transition:transform .1s}.die.standard-die{grid-template-areas:"a.c""e g f""d.b";width:100px;height:100px;padding:12px;display:grid}.die.text-die{text-align:center;word-wrap:break-word;background-color:var(--pink);justify-content:center;align-items:center;width:140px;height:140px;padding:1rem;font-size:1.5rem;line-height:1.1;display:flex}.dot{background-color:var(--black);border-radius:50%;place-self:center;width:18px;height:18px;display:block}.dot-invisible{visibility:hidden}[data-value="1"] .dot:first-child{grid-area:g}[data-value="2"] .dot:first-child{grid-area:a}[data-value="2"] .dot:nth-child(2){grid-area:b}[data-value="3"] .dot:first-child{grid-area:a}[data-value="3"] .dot:nth-child(2){grid-area:g}[data-value="3"] .dot:nth-child(3){grid-area:b}[data-value="4"] .dot:first-child{grid-area:a}[data-value="4"] .dot:nth-child(2){grid-area:c}[data-value="4"] .dot:nth-child(3){grid-area:d}[data-value="4"] .dot:nth-child(4){grid-area:b}[data-value="5"] .dot:first-child{grid-area:a}[data-value="5"] .dot:nth-child(2){grid-area:c}[data-value="5"] .dot:nth-child(3){grid-area:g}[data-value="5"] .dot:nth-child(4){grid-area:d}[data-value="5"] .dot:nth-child(5){grid-area:b}[data-value="6"] .dot:first-child{grid-area:a}[data-value="6"] .dot:nth-child(2){grid-area:c}[data-value="6"] .dot:nth-child(3){grid-area:e}[data-value="6"] .dot:nth-child(4){grid-area:f}[data-value="6"] .dot:nth-child(5){grid-area:d}[data-value="6"] .dot:nth-child(6){grid-area:b}.rolling{animation:.5s cubic-bezier(.36,.07,.19,.97) both roll-shake}@keyframes roll-shake{0%{transform:translate(0,0)rotate(0)}15%{transform:translate(-15px,-20px)rotate(-15deg)scale(1.1)}30%{transform:translate(20px,15px)rotate(15deg)scale(1.1)}45%{transform:translate(-15px,20px)rotate(-25deg)scale(1.1)}60%{transform:translate(20px,-15px)rotate(25deg)scale(1.1)}75%{transform:translate(-10px,-10px)rotate(-10deg)scale(1.1)}to{transform:translate(0,0)rotate(0)scale(1)}}.result-badge{background-color:var(--black);color:var(--white);border:3px solid var(--white);opacity:1;border-radius:24px;margin-bottom:.5rem;padding:.5rem 1.5rem;font-size:1.5rem;transition:all .3s;box-shadow:4px 4px #00000080}.result-badge.hidden-temp{opacity:0;transform:translateY(10px)}.action-btn{background-color:var(--yellow);color:var(--black);border:4px solid var(--black);width:100%;box-shadow:8px 8px 0px var(--black);cursor:pointer;border-radius:16px;padding:1.5rem;font-size:2.5rem;transition:all .1s;position:relative;overflow:hidden}.action-btn:active{box-shadow:0px 0px 0px var(--black);background-color:var(--mint);transform:translate(8px,8px)}.action-btn:disabled{opacity:.8;cursor:not-allowed;box-shadow:8px 8px 0px var(--black);transform:none}.party-prompt{background-color:var(--pink);border:3px solid var(--black);text-align:center;width:100%;box-shadow:4px 4px 0px var(--black);border-radius:12px;margin-bottom:.5rem;padding:1rem;font-size:1.2rem;font-weight:700;animation:.3s cubic-bezier(.175,.885,.32,1.275) popIn}@keyframes popIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.modal-overlay{z-index:200;background-color:#000c;justify-content:center;align-items:center;width:100vw;height:100vh;padding:1rem;display:flex;position:fixed;top:0;left:0}.modal-card{background-color:var(--white);border:4px solid var(--black);box-shadow:12px 12px 0px var(--black);border-radius:16px;flex-direction:column;gap:1rem;width:100%;max-width:450px;max-height:90vh;padding:1.5rem;display:flex;overflow-y:auto}.modal-header{border-bottom:3px solid var(--black);justify-content:space-between;align-items:center;margin-bottom:.5rem;padding-bottom:1rem;display:flex}.close-modal-btn{cursor:pointer;color:var(--black);background:0 0;border:none;font-size:2rem}.mode-option{border:3px solid var(--black);cursor:pointer;box-shadow:4px 4px 0px var(--black);background-color:var(--white);text-align:left;border-radius:12px;padding:1rem;transition:all .1s}.mode-option:active{box-shadow:0px 0px 0px var(--black);transform:translate(3px,3px)}.mode-option h3{margin-bottom:.25rem;font-size:1.5rem}.mode-option p{opacity:.8;font-size:1rem;font-weight:700}@media (max-width:400px){.action-btn{padding:1.2rem;font-size:2rem}.die.standard-die{border-width:4px;border-radius:16px;width:80px;height:80px;padding:8px}.die.text-die{width:110px;height:110px;font-size:1.2rem}.dot{width:14px;height:14px}.game-container{padding:1rem 1rem 2rem}}
