*{box-sizing:border-box}body{text-align:center;background-color:#0b2434;width:100vw;height:100vh;margin:0;font-family:Karla,sans-serif;display:flex}h1,p,section{margin:0}.title{color:#2b283a;font-size:1.5rem;font-weight:700}.desc{color:#4a4e74;width:100%;max-width:233px;margin-bottom:20px;font-size:.875rem;font-weight:400}#root{margin:auto}.main{background-color:#f5f5f5;border-radius:10px;flex-direction:column;justify-content:space-between;align-items:center;width:100%;max-width:360px;height:379px;padding:30px 20px;display:flex}.dice-container{grid-gap:18px;grid-template-columns:repeat(5,1fr);display:grid}.dice-btn{color:#4a4e74;cursor:pointer;background-color:#0000;background-position:50%;background-repeat:no-repeat;background-size:cover;border:none;border-radius:4px;width:36px;height:36px;font-family:Karla,sans-serif;font-size:1.25rem;font-weight:700;box-shadow:0 2px 2px #00000026}.dice-btn:hover{transform:translateY(-2px)}.roll-btn{color:#fff;cursor:pointer;background-color:#5035ff;border:none;border-radius:4px;margin-top:20px;padding:6px 22px;font-family:Karla,sans-serif;font-size:1rem;font-weight:700}.status{flex-grow:3;gap:12px;width:100%;margin-top:18px;display:flex}.card{border:1px solid #e7e7e7;border-radius:8px;flex-direction:column;flex:1;justify-content:center;align-items:center;padding:4px 0;display:flex}.label-container{justify-content:center;align-items:center;gap:10px;display:flex}.stat-icon{width:20px}.stat-label{color:#4a4e74;font-size:.75rem}.stat-value{font-size:1.75rem;font-weight:700}