*{box-sizing:border-box}body{margin:0;background:#172a27;color:#20342f;font-family:ui-rounded,system-ui,-apple-system,sans-serif}main{max-width:930px;margin:auto;padding:40px 24px}header{color:#fff5dd;margin-bottom:30px}h1{font-size:clamp(46px,8vw,76px);letter-spacing:-4px;line-height:1.05;margin:14px 0 12px}h1 i{color:#ffbf88;font-family:Georgia,serif;font-weight:400}header p{color:#c6d5cb;font-size:18px}.eyebrow{font-size:11px;font-weight:800;letter-spacing:2px}.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px;color:#dbe5dd}.toolbar label{margin-right:auto;font-size:12px}select,button{font:inherit;font-weight:750;border:1px solid #bdd0c3;border-radius:12px;padding:12px 16px;min-height:46px;background:#f7f6e9;color:#20342f;cursor:pointer}select{margin-left:8px;font-size:13px}button:hover:not(:disabled){filter:brightness(1.08);transform:translateY(-1px)}button:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #f5b873;outline-offset:4px}button:disabled{opacity:.45;cursor:default}.table{display:grid;grid-template-columns:1fr 1fr;gap:16px}.player{border-radius:22px;padding:25px;border:3px solid transparent;transition:border-color .2s;background:#f4a38e}.sage{background:#b8cfad}.player.active{border-color:#fff5dd;box-shadow:0 0 0 2px #172a27 inset}.playerline{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:45px}h2{font-family:Georgia,serif;font-size:28px;margin:0}h2 small{display:block;font-family:system-ui;font-size:10px;letter-spacing:1px;margin-top:7px}.badge{font-size:9px;font-weight:900;background:#20342f;color:#fff5dd;padding:7px;border-radius:20px}.score{font-size:80px;font-weight:800;letter-spacing:-4px;margin:12px 0;line-height:1.1}.track{height:8px;background:#20342f24;border-radius:9px;overflow:hidden}.track span{display:block;background:#20342f;height:100%;width:0;transition:width .3s}.player p{font-size:10px;font-weight:750;letter-spacing:1px}.player p b{float:right}.play{background:#fff7e8;border-radius:22px;padding:28px;margin:18px 0}.dicearea{display:flex;align-items:center;justify-content:center;gap:30px}.dicearea>div:last-child{display:flex;flex-direction:column}.dicearea strong{font-size:60px;line-height:1.15;letter-spacing:-3px}#turn{font-size:10px;letter-spacing:1px;color:#607268}.die{height:100px;width:100px;border-radius:22px;background:white;border:2px solid #20342f;box-shadow:0 7px 0 #d9d4c2;display:grid;grid-template:repeat(3,1fr)/repeat(3,1fr);gap:6px;padding:17px}.die span{grid-area:1/1/4/4;place-self:center;font-size:45px;font-family:Georgia}.pip{border-radius:50%;background:#20342f}.die.bust{background:#f4a38e}.die.rolling{animation:roll .25s ease}#status{text-align:center;min-height:48px;line-height:1.5;margin:26px 0 18px}.actions{display:flex;gap:12px;max-width:530px;margin:auto}.actions button{flex:1;padding:18px;font-size:16px;background:#e4eddb;border-color:#20342f}.actions .primary{background:#20342f;color:#fff7e8}kbd{font:11px system-ui;border:1px solid currentColor;border-radius:4px;padding:1px 4px;margin-left:8px;opacity:.6}.save{font-size:11px;color:#657468;text-align:center;margin-bottom:0}details{padding:18px 20px;border:1px solid #698276;border-radius:14px;color:#e0e9de;margin:12px 0;line-height:1.7;font-size:14px}summary{cursor:pointer;font-weight:750}details p{margin-bottom:0}ol{padding-left:24px}footer{text-align:center;color:#b4c7b9;line-height:1.8;font-size:11px;margin-top:28px}a{color:inherit}a:hover{color:#ffbf88}[hidden]{display:none!important}@keyframes roll{50%{transform:rotate(12deg) scale(.9)}}@media(max-width:550px){main{padding:28px 16px}.toolbar{gap:8px}.toolbar label{flex:1 0 100%;margin-bottom:5px}.toolbar select{float:right}.toolbar>button{flex:1;font-size:12px}.table{gap:10px}.player{padding:16px}.playerline{flex-direction:column;align-items:flex-start;min-height:78px}h2{font-size:25px}.score{font-size:64px}.player p{font-size:8px;letter-spacing:0}.play{padding:24px 16px}.dicearea{gap:22px}.actions button{padding:17px 10px;font-size:14px}kbd{display:none}header{margin-bottom:24px}header p{font-size:15px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
