:root{color-scheme:dark;--ink:#fff1ce;--muted:#c8c6a7;--wood:#442e25;--teal:#18332f;--copper:#bd7e46;--cream:#f5dfb1;--gold:#e5b958;font-family:'Baloo 2','Nunito',system-ui,sans-serif}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top,#315750,#102723);color:var(--ink);min-height:100dvh}button,select,summary{font:inherit;color:inherit}button,select{border:1px solid #9eb4a0;background:#254b41;border-radius:12px;padding:8px 13px;min-height:44px;cursor:pointer}button:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:3px}button:hover:not(:disabled){filter:brightness(1.15)}button:disabled{opacity:.5;cursor:default}.primary{background:var(--copper);color:#fff7df;border-color:#e6b98b;font-weight:700}button[hidden]{display:none!important}#app{max-width:1160px;margin:auto;padding:10px;display:flex;flex-direction:column;gap:7px;height:100dvh}header{display:flex;align-items:center;gap:9px}#cat{width:64px;height:66px;object-fit:contain;transform-origin:bottom center;transition:transform .15s}.brand{flex:1}h1{font-size:1.75rem;line-height:1.05;margin:3px 0}header small{letter-spacing:.15em;font-size:.65rem;color:var(--gold)}nav{display:flex;gap:5px}nav button{font-size:.85rem;padding:6px 10px}#hud{display:flex;justify-content:center;gap:14px;align-items:center;flex-wrap:wrap;font-size:.9rem}#matchScore{font-size:1.3rem;color:var(--gold)}#status{text-align:center;min-height:22px;font-size:.94rem}#diceRow{display:flex;align-items:center;justify-content:center;gap:12px;min-height:40px}#dice{display:flex;gap:7px}.die{width:34px;height:34px;border-radius:7px;background:var(--cream);color:#3f2b22;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);padding:5px;gap:2px;box-shadow:0 3px 0 #a78864}.die i{border-radius:50%;background:currentColor}.die.used{opacity:.27;box-shadow:none}#diceHint{font-size:.8rem;max-width:360px}#table{position:relative;min-height:220px;flex:1;background:linear-gradient(125deg,#563d2d,#302b25);padding:9px;border:3px solid #8c6b43;border-radius:16px;box-shadow:0 4px 0 #091b18,inset 0 0 0 1px #d7b87f;overflow:hidden}#board{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));height:calc(100% - 38px);gap:5px;padding:5px 4px}#trays{display:flex;justify-content:space-between;align-items:center;gap:5px;height:34px}#trays button{min-height:30px;font-size:.8rem;padding:2px 8px}#offLabel{font-size:.8rem}.point{min-height:44px;min-width:0;border-radius:5px;background:transparent;border:1px solid transparent;padding:2px 0;display:flex;align-items:center;flex-direction:column;position:relative;isolation:isolate;color:var(--ink)}.point::before{content:'';position:absolute;inset:15px 1px 3px;background:var(--cream);clip-path:polygon(0 0,100% 0,50% 100%);z-index:-1;opacity:.7}.point:nth-child(2n)::before{background:var(--copper)}.point:nth-child(n+13){flex-direction:column-reverse}.point:nth-child(n+13)::before{clip-path:polygon(50% 0,100% 100%,0 100%);inset:3px 1px 15px}.point:nth-child(6),.point:nth-child(18){border-right:3px solid #231e19}.point .num{font-size:.72rem;color:#fbefcf;font-weight:700}.stack{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;gap:1px;width:100%}.checker{display:block;width:min(78%,35px);aspect-ratio:1;min-height:12px;max-height:35px;border-radius:50%;background:radial-gradient(circle at 35% 25%,#fff0c8,#d8b581);border:2px solid #fff4cf;box-shadow:0 2px 0 #7a5a38;flex-shrink:1}.checker.copper{background:radial-gradient(circle at 35% 25%,#e6ad69,#955622);border-color:#ddae76}.count{font-size:.78rem;font-weight:800;background:#16312a;padding:0 6px;border-radius:7px;line-height:1.3}.point.available{border-color:#d8bb5e;background:#3a51406b}.point.selected{outline:3px solid #efc665;outline-offset:-3px}.point.target{background:#5c937488;border-color:#d9edc6}#fx{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}#choices{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;min-height:0;max-height:104px;overflow:auto}#choices:empty{display:none}#choices button{font-size:.87rem;min-height:44px;padding:6px 10px}#actions{display:flex;justify-content:center;gap:6px;flex-wrap:wrap}#actions button{min-width:80px}#notice{font-size:.78rem;text-align:center;margin:0;color:#edd18e;min-height:0}#notice:empty{display:none}dialog{border:1px solid #b7b799;border-radius:20px;background:#203e36;color:var(--ink);max-width:550px;width:calc(100% - 24px);padding:20px;max-height:92dvh;overflow:auto;text-align:center}dialog::backdrop{background:#061b18bd;backdrop-filter:blur(3px)}dialog h2{margin:8px 0;font-size:1.55rem}dialog p{font-size:.96rem;line-height:1.4}dialog button{margin:4px}dialog label{display:flex;align-items:center;justify-content:center;gap:10px;margin:9px 0}dialog select{max-width:100%;min-width:140px}.cover{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:13px}.medal{height:105px;width:110px;object-fit:contain}details{margin:12px 0;border-top:1px solid #587d67;padding:8px 0}summary{cursor:pointer}#recapList{text-align:left;font-size:.9rem}#recapList li{margin-bottom:9px}input[type=checkbox]{width:20px;height:20px;accent-color:var(--gold)}@media(max-width:650px){#app{padding:7px;gap:5px}#cat{width:44px;height:48px}h1{font-size:1.12rem;max-width:140px}header small{font-size:.51rem}nav{flex-wrap:wrap;justify-content:flex-end;max-width:135px}nav button{font-size:.72rem;min-height:32px;padding:4px 7px}#hud{gap:7px;font-size:.73rem}#matchScore{font-size:1.05rem}#status{font-size:.8rem;min-height:20px}#diceHint{max-width:180px;font-size:.69rem}.die{width:28px;height:28px;padding:4px}#diceRow{min-height:32px;gap:7px}#table{padding:5px;min-height:244px}#board{grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));gap:3px;padding:4px 1px}.point:nth-child(n){flex-direction:column}.point:nth-child(n)::before{clip-path:polygon(0 0,100% 0,50% 100%);inset:14px 1px 2px}.point:nth-child(n+7):nth-child(-n+12),.point:nth-child(n+19){flex-direction:column-reverse}.point:nth-child(n+7):nth-child(-n+12)::before,.point:nth-child(n+19)::before{clip-path:polygon(50% 0,100% 100%,0 100%);inset:2px 1px 14px}.point .num{font-size:.63rem}.checker{width:21px;max-height:21px;border-width:1px;min-height:8px}.stack{gap:0}.count{font-size:.68rem}.point:nth-child(6),.point:nth-child(18){border-right:1px solid transparent}#actions{gap:5px}#actions button{min-width:70px;font-size:.85rem;padding:6px 9px}#choices{max-height:44px;flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto}#choices button{flex-shrink:0;white-space:nowrap}#choices button{font-size:.75rem;padding:5px 8px}#trays button,#offLabel{font-size:.67rem}dialog{padding:14px}.cover{max-height:170px}dialog p{font-size:.9rem}}@media(orientation:landscape) and (max-height:520px){#app{padding:5px;gap:3px}header{height:38px}#cat{width:38px;height:38px}h1{font-size:1.12rem;max-width:none}nav{max-width:none}nav button{min-height:30px;font-size:.72rem}#hud{font-size:.7rem;gap:10px}#matchScore{font-size:1rem}#status{font-size:.72rem;min-height:17px}#diceRow{min-height:24px}.die{width:24px;height:24px;padding:3px}#diceHint{max-width:500px;font-size:.68rem}#table{min-height:130px;padding:4px}#board{grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:3px;height:calc(100% - 26px)}#trays{height:24px}#trays button{min-height:22px;font-size:.65rem}.point:nth-child(n){flex-direction:column}.point:nth-child(n)::before{clip-path:polygon(0 0,100% 0,50% 100%);inset:12px 1px 1px}.point:nth-child(n+13){flex-direction:column-reverse}.point:nth-child(n+13)::before{clip-path:polygon(50% 0,100% 100%,0 100%);inset:1px 1px 12px}.checker{width:17px;max-height:17px;min-height:6px;border-width:1px}.point .num{font-size:.6rem}.count{font-size:.6rem}#choices{max-height:47px}#choices button,#actions button{min-height:34px;padding:3px 10px;font-size:.75rem}#actions{position:relative}.cover{max-height:100px}dialog{max-height:94dvh}.medal{height:70px}}@media(prefers-reduced-motion:reduce){#cat{transition:none}}
/* Bar entry and bearing are real move controls, so they retain finger-sized targets. */
#trays{height:44px}#trays button{min-height:44px}#board{height:calc(100% - 48px)}
@media(max-width:650px){#table{min-height:254px}}
@media(orientation:landscape) and (max-height:520px){#trays{height:44px}#trays button{min-height:44px}#board{height:calc(100% - 48px)}#table{min-height:150px}#choices button,#actions button{min-height:44px}}
