:root{color-scheme:dark;--ink:#17130e;--gold:#d7a83f;--gold2:#f1d47b;--ivory:#f3ead6;--night:#28324b;--terracotta:#9f4c32;--paper:#dfc994;--muted:#b9aa8a;--line:#5e4729}
*{box-sizing:border-box}html{min-height:100%;background:#17130e}body{margin:0;min-height:100vh;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ivory);background:radial-gradient(circle at 50% -10%,#4c3520 0,transparent 40%),linear-gradient(135deg,#18120d,#24190f 50%,#130f0b);letter-spacing:.01em}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.15;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='90'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E")}
button{font:inherit}.shell{width:min(1180px,calc(100% - 32px));margin:auto;padding:42px 0 24px}.hero{display:flex;align-items:end;justify-content:space-between;gap:32px;margin:0 auto 24px;max-width:1040px}.eyebrow{margin:0 0 10px;color:var(--gold2);font-size:.72rem;font-weight:800;letter-spacing:.2em}.hero h1{font-family:Georgia,serif;font-size:clamp(2.5rem,7vw,5.2rem);font-weight:500;letter-spacing:-.055em;line-height:.86;margin:0}.hero h1 span{color:var(--gold);font-style:italic}.lede{max-width:640px;margin:16px 0 0;color:#ccbfa6;line-height:1.55}.text-button{color:var(--gold2);background:transparent;border:1px solid #73572e;border-radius:999px;padding:11px 17px;cursor:pointer;white-space:nowrap}.text-button:hover,.text-button:focus-visible{background:#3b2c19;outline:none;border-color:var(--gold)}
.game-card{position:relative;overflow:hidden;border:1px solid #74572f;border-radius:28px;background:linear-gradient(145deg,rgba(53,40,24,.96),rgba(24,18,13,.98));box-shadow:0 30px 90px #0009,inset 0 1px #ffffff12}.game-card:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 46%,#d4a64912,transparent 45%)}.topbar{position:relative;display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid #644c2c}.mode-switch{display:flex;padding:4px;border:1px solid #644c2c;border-radius:12px;background:#17120d}.mode{border:0;border-radius:8px;padding:9px 14px;color:#998b72;background:transparent;cursor:pointer}.mode.active{background:#46351f;color:var(--ivory);box-shadow:inset 0 0 0 1px #795b30}.new-game{border:0;background:transparent;color:#cfbd99;cursor:pointer;padding:9px}.new-game:hover{color:white}
.table{position:relative;display:grid;grid-template-columns:170px minmax(340px,1fr) 170px;gap:24px;align-items:center;max-width:960px;margin:auto;padding:30px 20px 24px}.player{align-self:stretch;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;opacity:.48;transition:.3s}.player.active{opacity:1}.player-heading{font-family:Georgia,serif;font-size:1.2rem;display:flex;align-items:center;gap:9px}.turn-dot{width:7px;height:7px;border-radius:50%;background:transparent;box-shadow:0 0 0 1px #8c7854}.player.active .turn-dot{background:var(--gold2);box-shadow:0 0 15px var(--gold)}.piece-tray{display:flex;flex-wrap:wrap;justify-content:center;gap:7px;width:96px;min-height:74px}.tray-piece{width:24px;height:24px;border-radius:50%;border:2px solid #fff4;box-shadow:inset 0 0 0 4px #0002,0 3px 7px #0008}.player-light .tray-piece{background:var(--ivory)}.player-dark .tray-piece{background:var(--night)}.score{display:flex;align-items:baseline;gap:6px;color:#a89778}.score strong{font-family:Georgia,serif;font-size:2rem;color:var(--gold2)}.score span{text-transform:uppercase;font-size:.62rem;letter-spacing:.16em}
.center{min-width:0}.status{text-align:center;min-height:24px;margin:0 0 16px;color:#d8c8a8;font-size:.92rem}.board{width:min(100%,440px);aspect-ratio:3/8;margin:auto;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(8,1fr);gap:6px;padding:9px;border:1px solid #947043;border-radius:11px;background:#37291b;box-shadow:0 14px 40px #0008,inset 0 0 40px #0004;transform:rotate(90deg);transform-origin:center}.cell{position:relative;border:1px solid #7b5f38;border-radius:5px;background:linear-gradient(145deg,#cfb777,#a88d53);box-shadow:inset 0 0 0 2px #e8d69a29;display:grid;place-items:center;cursor:default;overflow:hidden}.cell.missing{visibility:hidden}.cell:after{content:"";position:absolute;inset:13%;border:1px solid #59452245;transform:rotate(45deg)}.cell.shared{background:linear-gradient(145deg,#b26041,#843823)}.cell.rosette:before{content:"✦";position:absolute;color:#3f2b16;font-size:clamp(19px,3vw,32px);text-shadow:0 1px #f3d98d}.cell.shared.rosette:before{color:#f1ca68}.piece{position:relative;z-index:2;width:66%;aspect-ratio:1;border-radius:50%;border:3px solid #fff5;box-shadow:inset 0 0 0 6px #0002,0 5px 11px #0009;transform:rotate(-90deg);transition:transform .18s,filter .18s}.piece.light{background:radial-gradient(circle at 35% 28%,#fffdf5,var(--ivory) 55%,#ac9d81)}.piece.dark{background:radial-gradient(circle at 35% 28%,#53617f,var(--night) 55%,#11172a)}.piece.valid{cursor:pointer;animation:pulse 1.15s ease-in-out infinite;filter:drop-shadow(0 0 7px #ffe38e)}.cell.destination{outline:3px solid #f4d26b;outline-offset:-4px}.cell.capture .piece.valid{filter:drop-shadow(0 0 8px #ff896b)}@keyframes pulse{50%{transform:rotate(-90deg) scale(1.1)}}
.controls{display:grid;grid-template-columns:1fr auto 48px;gap:14px;align-items:center;margin:22px auto 0;max-width:440px}.dice{display:flex;gap:7px}.dice span{width:37px;height:37px;position:relative;border:1px solid #8b6c3f;border-radius:7px;background:#251c12;transform:rotate(45deg);transition:.2s}.dice span.on{background:var(--gold2);box-shadow:0 0 16px #d7a83f66}.dice span.on:after{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:#5b431f;left:14px;top:14px}.dice.rolling span{animation:toss .28s ease-in-out infinite alternate}.dice.rolling span:nth-child(2){animation-delay:.08s}.dice.rolling span:nth-child(3){animation-delay:.14s}@keyframes toss{to{transform:rotate(135deg) translateY(-4px)}}.roll{border:1px solid #f0ce70;border-radius:12px;padding:12px 20px;background:linear-gradient(#ebca6b,#bd8f35);color:#241809;font-weight:900;cursor:pointer;box-shadow:0 6px 18px #0008}.roll:hover:not(:disabled){filter:brightness(1.12)}.roll:disabled{opacity:.4;cursor:not-allowed}.roll-total{text-align:center}.roll-total span{display:block;color:#8f8067;font-size:.56rem;font-weight:800;letter-spacing:.15em}.roll-total strong{font-family:Georgia,serif;color:var(--gold2);font-size:1.7rem}.legend{position:relative;display:flex;justify-content:center;gap:26px;padding:0 20px 20px;color:#93866f;font-size:.72rem}.legend i{font-style:normal;margin-right:5px}.rosette-mark{color:var(--gold2)}.safe-mark{color:#c86948}footer{text-align:center;color:#776c5b;font-size:.72rem;margin-top:16px}footer a{color:#a99773}
dialog{width:min(520px,calc(100% - 28px));color:var(--ivory);border:1px solid #846339;border-radius:24px;background:linear-gradient(145deg,#3b2c1b,#18120d);box-shadow:0 30px 100px #000;padding:32px}dialog::backdrop{background:#0a0705d9;backdrop-filter:blur(8px)}dialog h2{font:500 2rem/1.1 Georgia,serif;margin:0 0 18px}dialog ol{padding-left:22px;color:#cbbda1;line-height:1.55}dialog li{padding:5px 0}.dialog-close{position:absolute;right:16px;top:12px;border:0;background:transparent;color:#bdaa87;font-size:2rem;cursor:pointer}dialog .roll{display:block;margin:22px auto 0}
@media(max-width:790px){.shell{padding-top:24px}.hero{align-items:start}.hero .lede{font-size:.9rem}.table{grid-template-columns:82px minmax(240px,1fr) 82px;gap:8px;padding-inline:8px}.player-heading{font-size:.9rem}.piece-tray{width:68px}.tray-piece{width:19px;height:19px}.board{max-width:330px}.controls{grid-template-columns:1fr;justify-items:center}.roll-total{position:absolute;margin-left:240px}.legend{flex-wrap:wrap;gap:8px 20px}}
@media(max-width:560px){.hero{display:block}.hero .text-button{margin-top:16px}.topbar{padding:11px}.mode{padding:8px;font-size:.76rem}.new-game{font-size:.78rem}.table{grid-template-columns:52px minmax(0,1fr) 52px;gap:3px}.player-heading{writing-mode:vertical-rl}.piece-tray{width:42px}.tray-piece{width:16px;height:16px}.score{display:block;text-align:center}.score strong{font-size:1.5rem}.score span{display:block}.board{width:min(100%,290px);gap:4px;padding:6px}.dice span{width:30px;height:30px}.dice span.on:after{left:11px;top:11px}.roll-total{position:static;margin:0}.legend{font-size:.64rem}.status{font-size:.8rem}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}