:root{--char-green: #17531c;--char-gold: #fcd34c;--char-yellow: #f5af18;--char-black: #1a1a1a;--char-light-grey: #C8C8C8;--char-red: #D32F2F;--char-pink: #ee83be;--char-brown: #382b1f;--char-purple: #8b2fb3;--char-charcoal: #37474F;--char-orange: #E65100;--char-white: #F0F0F0;--char-blue: #1565C0}.dice-tray{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap;padding:1.5rem 0}.dice-tray-mini{display:flex;flex-direction:row;justify-content:flex-start;gap:1rem}.die{--die-size: 4rem;width:var(--die-size);height:var(--die-size);display:grid;grid-template-columns:repeat(3, 1fr);align-items:center;justify-items:center;padding:calc(var(--die-size)*.1);gap:calc(var(--die-size)*.025);border-radius:calc(var(--die-size)*.19);box-shadow:0 calc(var(--die-size)*.06) 0 rgba(0,0,0,.2);border:2px solid hsla(0,0%,100%,.1);transition:transform .1s ease}.die:active{transform:scale(0.95);filter:brightness(0.9)}.character-portrait{height:90px;width:auto;object-fit:contain;display:block}.character-portrait-mini{height:60px;width:60px;object-fit:contain;border-radius:4px}.pip{width:100%;aspect-ratio:1;border-radius:50%}.pip.active{background-color:var(--pip-color, rgba(0, 0, 0, 0.75))}.pip.inactive{background-color:rgba(0,0,0,0)}.dice-tray-mini .die{--die-size: 1.8rem}.color-circuit{background-color:var(--char-green)}.color-happy{background-color:var(--char-yellow)}.color-lawsuit{background-color:var(--char-light-grey)}.color-pepperoni{background-color:var(--char-yellow)}.color-princess{background-color:var(--char-pink)}.color-pup{background-color:var(--char-brown)}.color-rebel{background-color:var(--char-red)}.color-scout{background-color:var(--char-purple)}.color-shadow{background-color:var(--char-charcoal)}.color-sparkles{background-color:var(--char-gold)}.color-tiedye{background-color:var(--char-orange)}.color-watson{background-color:var(--char-blue)}.color-wiki{background-color:var(--char-white)}.player-result{margin-bottom:.1rem;padding:.25rem}.player-result h6{margin-bottom:.1rem;display:flex;align-items:center;gap:.3rem}article:has(.player-result){padding:.4rem}.player-tag{padding:.5rem;border-radius:8px;border-left:5px solid var(--primary);background:var(--card-background-color);margin-bottom:.5rem}body.game-page{height:100dvh;display:flex;flex-direction:column;overflow:hidden}body.game-page main{display:contents}.game-nav{flex-shrink:0}.game-head{flex-shrink:0}.game-head:has(.player-chip){padding:.25rem .75rem;border-bottom:1px solid var(--muted-border-color)}.game-middle{flex:1;overflow-y:auto;padding:.5rem .75rem}.game-footer{flex-shrink:0;border-top:1px solid var(--muted-border-color);padding:.4rem .75rem}.setup-status{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem}.setup-status p{margin:0}.spinner{display:inline-block;width:1.25rem;height:1.25rem;border:2px solid var(--muted-border-color);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite;flex-shrink:0}@keyframes spin{to{transform:rotate(360deg)}}.btn-row{display:flex;gap:var(--spacing, 1rem)}.btn-row form.button_to{flex:1}.btn-row form.button_to button{width:100%}.player-chip{display:inline-flex;align-items:center;gap:.25rem;padding:.2rem .4rem;border-radius:6px;font-size:.75rem;background:var(--card-background-color)}.chip-color{width:14px;height:14px;border-radius:3px;flex-shrink:0}
