.hud-button{--hud-edge:var(--panel-edge);height:calc(var(--game-unit) * 2);padding-inline:calc(var(--game-unit) * .75);border-radius:calc(var(--game-unit) * .75);box-shadow:0 calc(var(--game-unit) * .25) 0 var(--hud-edge);white-space:nowrap;font-size:.9375em;position:relative}.hud-button:active:not(:disabled,[aria-disabled=true]){transform:translateY(calc(var(--game-unit) * .1875));box-shadow:0 calc(var(--game-unit) * .0625) 0 var(--hud-edge);transition-duration:0s}.hud-icon{width:1.5rem;height:1.5rem;display:none}.hud-button--icon{width:calc(var(--game-unit) * 2);padding-inline:0}.hud-button--icon .hud-label{display:none}.hud-button--icon .hud-icon{width:1.25em;height:1.25em;display:block}@media (prefers-reduced-motion:no-preference){.hud-button--icon .hud-icon{transition:transform var(--duration-hover) ease}}.hud-button--icon:hover .hud-icon{transform:rotate(45deg)}.score-sheet,.end-overlay{padding:var(--game-unit);background:color-mix(in srgb, var(--table-edge) 60%, transparent);font-size:max(1rem, calc(var(--game-unit) * .8))}.score-sheet{z-index:var(--layer-overlay);grid-template:minmax(0,1fr)/minmax(0,1fr);place-items:center;display:grid;position:absolute;inset:0}.score-sheet__panel,.end-overlay__panel{max-width:min(36em,100%);max-height:100%;color:var(--ink);text-align:center;border-radius:1.125em;flex-direction:column;padding:1.75em;display:flex}.score-sheet__title,.end-overlay__title{margin:0 0 1em;font-size:1.5em}.score-sheet__scroll{scrollbar-width:thin;scrollbar-color:var(--panel-edge) transparent;min-height:0;overflow:auto}.score-sheet__actions,.end-overlay__actions{justify-content:center;gap:.75em;margin-top:1.25em;display:flex}:is(.score-sheet__actions,.end-overlay__actions) .button{border-radius:.7em;height:max(2.75rem,2.6em);padding-inline:1.4em;font-size:1.0625em}.reversi-game{grid-template-columns:auto minmax(0,1fr) auto;grid-template-rows:calc(var(--game-unit) * var(--hud-units,2.75)) minmax(0, 1fr);height:100%;min-height:0;color:var(--cream);font-family:var(--body);grid-template-areas:"stats modes controls""board board board";display:grid}.reversi-hud__stats,.reversi-hud__modes,.reversi-hud__controls{font-size:var(--game-unit);align-self:center}.reversi-hud__stats{margin-left:var(--game-unit);grid-area:stats;justify-self:start;align-items:center;gap:1.25em;display:flex}.reversi-hud__controls{margin-right:var(--game-unit);grid-area:controls;justify-self:end;gap:.5em;display:flex}.reversi-hud__modes{grid-area:modes;justify-self:center;gap:.25em;display:flex}.reversi-hud__mode{border-radius:calc(var(--game-unit) * .75);color:var(--cream);font-family:var(--display);white-space:nowrap;padding:.25em .75em;font-weight:600;text-decoration:none}.reversi-hud__mode:hover{background:#0000001f}.reversi-hud__mode[aria-current=page]{color:var(--cream);background:#00000038}.reversi-hud__stat{align-items:baseline;gap:.25em;display:flex}.reversi-hud__stat-label{color:var(--cream);font-size:.875em}.reversi-hud__stat[data-stat=black] .reversi-hud__stat-label:before,.reversi-hud__stat[data-stat=white] .reversi-hud__stat-label:before{content:"";border:.0625em solid var(--reversi-black-rim);background:var(--reversi-black);vertical-align:-.1em;border-radius:50%;width:.875em;height:.875em;margin-right:.3em;display:inline-block}.reversi-hud__stat[data-stat=white] .reversi-hud__stat-label:before{border-color:var(--reversi-white-rim);background:var(--reversi-white)}.reversi-hud__stat-value{min-width:var(--reading);white-space:nowrap;font-size:1.0625em;font-weight:700;display:inline-grid}.reversi-hud__stat-value>span{grid-area:1/1}.reversi-hud__stat-reserve{visibility:hidden}.reversi-hud__notice{max-width:calc(var(--game-unit) * 14);color:var(--cream);align-self:center;margin:0;font-size:.875em}.reversi-seats{flex-direction:column;align-items:flex-start;gap:.125em;display:flex}.reversi-seats__list{flex-wrap:wrap;align-items:center;gap:.25em 1em;margin:0;padding:0;list-style:none;display:flex}.reversi-seats__seat{border-radius:calc(var(--game-unit) * .5);align-items:center;gap:.25em;padding:.125em .5em;font-size:.9375em;display:flex}.reversi-seats__badge{border-radius:calc(var(--game-unit) * .4);background:color-mix(in srgb, var(--accent) 28%, transparent);color:var(--cream);padding:0 .375em;font-size:.8125em;font-weight:700}.reversi-seats__seat[data-acting]{background:color-mix(in srgb, var(--accent) 22%, transparent)}.reversi-seats__seat[data-out]{opacity:.55}.reversi-seats__seat[data-out] .reversi-seats__name{text-decoration:line-through}.reversi-seats__disc{box-sizing:border-box;border:.0625em solid var(--reversi-black-rim);background:var(--reversi-black);border-radius:50%;width:1.125em;height:1.125em}.reversi-seats__disc[data-colour=white]{border-color:var(--reversi-white-rim);background:var(--reversi-white)}.reversi-seats__who{color:var(--cream-soft)}.reversi-seats__who:empty{display:none}.reversi-seats .trick-tag__clock{text-align:right;min-width:2.75ch;font-weight:700}.reversi-seats__note{color:var(--cream);margin:0;font-size:.875em}.reversi-game{--reversi-black:#464444;--reversi-black-shade:#333232;--reversi-black-rim:#191919;--reversi-white:#f3f3f3;--reversi-white-shade:#e7e7e7;--reversi-white-rim:#b6b6b6}.reversi{width:100%;height:100%;min-height:0;padding:calc(var(--game-unit) * .5);box-sizing:border-box;isolation:isolate;--reversi-field:#17703a;--reversi-line:#0b3b1f;--reversi-edge:#5c3a1e;--reversi-edge-ink:#f1ddbc;--reversi-last:#d3362d;grid-area:board;justify-content:center;align-items:center;display:flex;position:relative;container:reversi/size}.reversi__frame{--frame:calc(var(--game-unit) * 1.125);--board:round(down, min(100cqw - 2 * var(--frame), 100cqh - 2 * var(--frame)), calc(var(--size) * 1px));--square:calc(var(--board) / var(--size));padding:var(--frame);border-radius:calc(var(--frame) * .5);background:var(--reversi-edge);flex:none;position:relative}.reversi__files,.reversi__ranks{color:var(--reversi-edge-ink);font-family:var(--body);font-size:calc(var(--frame) * .6);pointer-events:none;-webkit-user-select:none;user-select:none;font-weight:700;line-height:1;display:grid;position:absolute}.reversi__files{top:0;left:var(--frame);width:var(--board);height:var(--frame);grid-template-columns:repeat(var(--size), 1fr);place-items:center}.reversi__ranks{top:var(--frame);width:var(--frame);height:var(--board);grid-template-rows:repeat(var(--size), 1fr);place-items:center;left:0}@container reversi (width<=320px) or (height<=320px){.reversi__frame[data-size="8"]{--frame:calc(var(--game-unit) * .375)}.reversi__frame[data-size="8"] .reversi__files,.reversi__frame[data-size="8"] .reversi__ranks{display:none}}@container reversi (width<=250px) or (height<=250px){.reversi__frame[data-size="6"]{--frame:calc(var(--game-unit) * .375)}.reversi__frame[data-size="6"] .reversi__files,.reversi__frame[data-size="6"] .reversi__ranks{display:none}}.reversi__board{width:var(--board);height:var(--board);box-sizing:content-box;background-color:var(--reversi-field);background-image:linear-gradient(to right, var(--reversi-line) 1px, transparent 1px), linear-gradient(to bottom, var(--reversi-line) 1px, transparent 1px);background-size:var(--square) var(--square);box-shadow:inset -1px -1px 0 var(--reversi-line);--focus-ring:var(--cream);position:relative}.reversi__square,.reversi__disc{left:calc(var(--column) * var(--square));top:calc(var(--row) * var(--square));width:var(--square);height:var(--square);position:absolute}.reversi__square{z-index:1;color:inherit;cursor:default;background:0 0;border:0;border-radius:0;padding:0}.reversi__square[data-legal]{cursor:pointer}.reversi__square:focus-visible{z-index:4;outline:.1875rem solid var(--focus-ring);outline-offset:-.1875rem}.reversi__square[data-shown]:after{content:"";background:var(--reversi-black);opacity:.7;pointer-events:none;border-radius:50%;position:absolute;inset:39%}.reversi__board[data-turn=white] .reversi__square[data-shown]:after{background:var(--reversi-white);opacity:.85}.reversi__point{z-index:1;left:calc(var(--column) * var(--square));top:calc(var(--row) * var(--square));width:max(4px, calc(var(--square) * .12));height:max(4px, calc(var(--square) * .12));background:var(--reversi-line);pointer-events:none;border-radius:50%;position:absolute;transform:translate(-50%,-50%)}.reversi__disc{z-index:2;perspective:calc(var(--square) * 5);pointer-events:none;place-items:center;display:grid}.reversi__flip{width:82%;height:82%;box-shadow:0 calc(var(--square) * .04) calc(var(--square) * .05) #00000073;transform-style:preserve-3d;border-radius:50%;position:relative}.reversi__face{box-sizing:border-box;border:max(1px, calc(var(--square) * .035)) solid var(--reversi-black-rim);background:var(--reversi-black);box-shadow:inset 0 calc(var(--square) * -.06) 0 var(--reversi-black-shade);backface-visibility:hidden;border-radius:50%;position:absolute;inset:0}.reversi__face--back{transform:rotateY(180deg)}.reversi__disc[data-colour=white] .reversi__face--front,.reversi__disc[data-colour=black] .reversi__face--back{border-color:var(--reversi-white-rim);background:var(--reversi-white);box-shadow:inset 0 calc(var(--square) * -.06) 0 var(--reversi-white-shade)}.reversi__disc[data-last]:after{content:"";background:var(--reversi-last);border-radius:50%;position:absolute;inset:42%}.reversi-end__panel{text-align:center}.reversi-end__title{margin:0 0 .25rem}.reversi-end__reading{color:var(--ink);margin:0;font-weight:700}.reversi-end__reason{color:var(--ink-soft);margin:.25rem 0 1.25rem}.reversi-end__actions{justify-content:center;gap:.75rem;display:flex}.reversi-moves__panel{width:min(18em,100%)}.reversi-moves__list{border-collapse:collapse;font-variant-numeric:tabular-nums;text-align:left;width:100%}.reversi-moves__list th,.reversi-moves__list td{padding:.25em .5em}.reversi-moves__list th{width:3ch;color:var(--ink-soft);text-align:right;font-weight:600}.reversi-moves__list thead th{text-align:left;width:auto}.reversi-moves__list tbody tr:nth-child(odd){background:color-mix(in srgb, var(--panel-edge) 35%, transparent)}.reversi-moves__empty{color:var(--ink-soft);margin:.5em 0 0}.reversi-level .setting{flex-direction:column;align-items:stretch;gap:.5em}.reversi-level .segmented{grid-template-columns:repeat(3,1fr);display:grid}.reversi-level .segmented span{text-align:center;padding-inline:.5em}@media (width<=48rem) and (height>=24rem){.reversi-game{grid-template:"stats""modes""board"minmax(0,1fr)"controls"/minmax(0,1fr)}.reversi-hud__modes{margin-top:-.25rem;padding-bottom:.125rem;font-size:.9375rem;line-height:1.25}.reversi-hud__mode{padding-block:.1875em}.reversi-hud__stats,.reversi-hud__controls{flex-wrap:wrap;justify-content:center;justify-self:center;margin:0;padding-block:.5rem;font-size:1rem}.reversi-hud__stats{gap:.25rem 1rem}.reversi-hud__stat[data-stat=colour],.reversi-hud__stat[data-stat=time]{display:none}.reversi-hud__controls{flex-direction:row-reverse;justify-content:space-evenly;gap:1.5rem .5rem;width:100%;padding-block:.75rem 1.5rem;padding-inline:.5rem}.reversi-seats{align-items:center}.reversi-seats__list{justify-content:center}.reversi-hud__notice{text-align:center;flex-basis:100%;max-width:none;font-size:.875rem}.reversi-hud__label{color:var(--cream);font-family:var(--body);text-align:center;white-space:nowrap;pointer-events:none;font-size:.625rem;line-height:1;position:absolute;inset:calc(100% + .375rem) -1rem auto}.reversi-hud__icon{display:block}.reversi-hud__button--icon .reversi-hud__icon{width:1.5rem;height:1.5rem}.reversi-hud__button{border-radius:var(--radius-control);width:2.75rem;height:2.75rem;box-shadow:0 .25rem 0 var(--hud-edge);padding-inline:0}.reversi-hud__button:active:not(:disabled,[aria-disabled=true]){box-shadow:0 .0625rem 0 var(--hud-edge);transform:translateY(.1875rem)}.reversi{padding:.375rem}}