* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    min-height: 100%;
}

body {
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    background:
        radial-gradient(circle at center, #30291f 0%, #17130f 65%, #090806 100%);
    font-family: Arial, sans-serif;
}

.game-area {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 30px;
}

.board {
    width: min(82vw, 760px);
    aspect-ratio: 1 / 1;
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    grid-template-rows: repeat(8, 1fr);
    border: 10px solid #6e5738;
    box-shadow:
        0 0 0 3px #2b2116,
        0 18px 35px rgba(0, 0, 0, 0.65);
    background: #b8945f;
}

.square {
    position: relative;
    background:
        radial-gradient(
            circle at 35% 30%,
            rgba(255, 235, 190, 0.16),
            transparent 45%
        ),
        linear-gradient(
            135deg,
            #c8a56d,
            #b58d58 55%,
            #a77e4c
        );
    border: 1px solid rgba(74, 52, 28, 0.32);
    box-shadow:
        inset 1px 1px 1px rgba(255, 239, 202, 0.18),
        inset -1px -1px 2px rgba(70, 45, 22, 0.20);
}

.square.embossed {
    background:
        radial-gradient(
            circle at 35% 30%,
            rgba(255, 235, 190, 0.12),
            transparent 45%
        ),
        linear-gradient(
            135deg,
            #c19b64,
            #ad8553 55%,
            #a07849
        );
}

.stone-symbol {
    position: absolute;
    width: 58%;
    height: 58%;
    left: 21%;
    top: 21%;
    opacity: 0.55;
    filter:
        drop-shadow(1px 1px 0 rgba(235, 203, 145, 0.55))
        drop-shadow(-1px -1px 1px rgba(74, 48, 24, 0.55));
    pointer-events: none;
    user-select: none;
}


/* 0.0.4a — Ankh-shaped turn control */
.game-area {
    gap: 54px;
    align-items: center;
}

.board-wrap {
    flex: 0 1 auto;
}

.game-piece {
    position: absolute;
    z-index: 20;
    width: 88%;
    height: 88%;
    left: 6%;
    top: 6%;
    object-fit: contain;
    pointer-events: auto;
    cursor: pointer;
    user-select: none;
    transform-origin: 50% 50%;
    transition: filter 100ms ease;
}

/* 0.0.32f — approved generated Pharaoh artwork. CSS only sizes/positions the PNG. */
.game-piece.king-piece {
    width: 70%;
    height: 70%;
    left: 15%;
    top: 15%;
}

.game-piece.selected {
    filter:
        sepia(.25)
        saturate(2.2)
        drop-shadow(0 0 3px #fff5a0)
        drop-shadow(0 0 8px #ffd900)
        drop-shadow(0 0 13px #ffd900);
}

.ankh-controls {
    position: relative;
    width: 250px;
    height: 430px;
    flex: 0 0 250px;
    color: #f4dfaa;
    user-select: none;
    filter: drop-shadow(0 9px 8px rgba(0,0,0,.48));
}

.ankh-controls.phantom {
    visibility: hidden;
    pointer-events: none;
}

/* The visible Ankh body: loop, arms and stem. */
.ankh-loop {
    position: absolute;
    z-index: 0;
    left: 50px;
    top: 45px;
    width: 150px;
    height: 172px;
    box-sizing: border-box;
    border: 24px solid #b48a4e;
    border-radius: 50%;
    background: rgba(24,17,9,.82);
    box-shadow:
        inset 0 0 0 3px #d5b36e,
        0 0 0 3px #70502a;
}

.ankh-crossbar {
    position: absolute;
    z-index: 0;
    left: 12px;
    top: 206px;
    width: 226px;
    height: 42px;
    border-radius: 21px;
    background: linear-gradient(#d0aa67, #9b713d);
    border: 3px solid #6d4c27;
    box-sizing: border-box;
}

.ankh-stem {
    position: absolute;
    z-index: 0;
    left: 101px;
    top: 208px;
    width: 48px;
    height: 174px;
    border-radius: 0 0 13px 13px;
    background: linear-gradient(90deg, #9a703d, #d1ad69 50%, #96703e);
    border: 3px solid #6d4c27;
    box-sizing: border-box;
}

.ankh-title {
    position: absolute;
    z-index: 3;
    top: 4px;
    left: 0;
    width: 100%;
    text-align: center;
    font-size: 17px;
    font-weight: 800;
    letter-spacing: .12em;
    text-shadow: 0 2px 2px #000;
}

.ankh-btn,
.ankh-pass {
    position: absolute;
    z-index: 4;
    border: 2px solid #62441f;
    background: linear-gradient(#f0d99e, #c79b58);
    color: #2b1b0b;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.65),
        0 2px 3px rgba(0,0,0,.35);
    font-weight: 900;
    cursor: pointer;
}

.ankh-btn {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    font-size: 22px;
    line-height: 42px;
    padding: 0;
}

.ankh-btn:hover,
.ankh-pass:hover {
    background: linear-gradient(#fff1bd, #dbb66f);
}

.ankh-btn:active,
.ankh-pass:active {
    transform: translateY(1px);
}

.move-n { left: 101px; top: 70px; }
.move-w { left: 67px;  top: 122px; }
.move-e { left: 135px; top: 122px; }
.move-s { left: 101px; top: 174px; }

.rot-l { left: 19px;  top: 203px; }
.rot-r { right: 19px; top: 203px; }

.ankh-pass {
    left: 87px;
    top: 292px;
    width: 76px;
    height: 42px;
    border-radius: 8px;
    font-size: 14px;
    letter-spacing: .08em;
}

.ankh-status {
    position: absolute;
    z-index: 4;
    top: 391px;
    left: 0;
    width: 100%;
    min-height: 30px;
    text-align: center;
    font-size: 13px;
    line-height: 1.25;
    color: #e7d3a2;
    text-shadow: 0 1px 2px #000;
}

@media (max-width: 1050px) {
    .game-area {
        gap: 20px;
    }

    .ankh-controls {
        transform: scale(.88);
        transform-origin: center center;
        flex-basis: 220px;
    }
}

@media (max-width: 850px) {
    .game-area {
        flex-direction: column;
    }

    .ankh-controls {
        transform: scale(.82);
        transform-origin: top center;
        margin-bottom: -70px;
    }
}

/* 0.0.14a — FIRE control */
.ankh-fire {
    position: absolute;
    left: 50%;
    bottom: 54px;
    transform: translateX(-50%);
    min-width: 64px;
    height: 30px;
    border: 1px solid rgba(238, 207, 128, .75);
    border-radius: 7px;
    background: rgba(62, 35, 18, .92);
    color: #f0d790;
    font-weight: 800;
    letter-spacing: .08em;
    cursor: pointer;
}
.ankh-fire:disabled {
    opacity: .30;
    cursor: default;
}

/* 0.0.15 — visible center-to-center laser path */
.board { position: relative; }
.laser-layer {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 20;
    overflow: visible;
}
.laser-segment {
    fill: none;
    stroke: #fff6cf;
    stroke-width: 7;
    stroke-linecap: round;
    filter: drop-shadow(0 0 4px #fff) drop-shadow(0 0 9px #ffcf5a);
}

/* 0.0.16 — latched laser impact indication */
.piece.laser-hit,
.piece img.laser-hit {
    filter: brightness(2.3) drop-shadow(0 0 7px #fff) drop-shadow(0 0 15px #ffd86a) !important;
}

/* 0.0.16a — visible latched laser-hit glow on the actual IMG element */
.game-piece.laser-hit {
    filter:
        brightness(2.6)
        drop-shadow(0 0 5px white)
        drop-shadow(0 0 12px #fff0a8)
        drop-shadow(0 0 22px #ffc43d) !important;
    animation: laserHitPulse .48s ease-in-out infinite alternate;
}
@keyframes laserHitPulse {
    from { opacity: .78; }
    to   { opacity: 1; }
}

/* 0.0.32l — Guard damage is now shown by staged tower artwork.
   Directional guard-hit-* classes remain in the DOM because hitSides still
   drives repeated-side protection and Purposeful AI, but no longer draw borders. */

/* 0.0.20a — persistent victory declaration */
#victory-overlay {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 10000;
    padding: 22px 34px;
    border: 3px solid #d4af37;
    border-radius: 12px;
    background: rgba(18, 12, 7, 0.94);
    color: #f3d778;
    font-size: clamp(24px, 4vw, 46px);
    font-weight: 800;
    letter-spacing: 0.06em;
    text-align: center;
    text-shadow: 0 2px 5px #000;
    box-shadow: 0 0 28px rgba(212,175,55,.65);
}
#victory-overlay[hidden] { display: none; }

/* 0.0.22 — temporary functional game setup controls. Final art comes later. */
.game-setup {
    max-width: 760px;
    margin: 0 auto 18px;
    padding: 12px 16px;
    border: 1px solid rgba(214,177,92,.55);
    background: rgba(20,16,12,.88);
    color: #ead7a0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px 14px;
    align-items: end;
}
.game-setup h2 {
    width: 100%;
    margin: 0 0 2px;
    font-size: 18px;
}
.game-setup label {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 13px;
}
.game-setup select,
.game-setup button {
    min-height: 36px;
    font: inherit;
}
.game-setup button {
    padding: 0 18px;
    cursor: pointer;
}
.setup-rule {
    width: 100%;
    font-size: 12px;
    opacity: .8;
}
.game-setup.setup-locked select,
.game-setup.setup-locked button {
    opacity: .65;
}


/* 0.0.24d — visible 10x10 optical ring. Every exterior cell is exactly one
   board-square wide/high, and every mirror is mathematically centered. */
#edge-mirror-layer { overflow: visible; }
.optical-ring-cell {
    position:absolute;
    box-sizing:border-box;
    border:1px solid rgba(151,116,63,.38);
    background:rgba(28,23,17,.28);
}
.optical-ring-mirror {
    position:absolute;
    left:50%; top:50%;
    width:78%; height:78%;
    object-fit:contain;
    transform-origin:50% 50%;
}


/* 0.0.24d — layout-only correction.
   Reserve real layout space for the complete 10x10 optical arena so all four
   fixed corners are visible at game start. Gameplay and mirror geometry are
   unchanged from 0.0.24c. */
:root {
    --ankh-board-size: min(600px, 64vh, 48vw);
    --ankh-cell-size: calc(var(--ankh-board-size) / 8);
}

body {
    min-height: 100vh;
    flex-direction: row;
    gap: 26px;
    padding: 18px 22px;
    overflow: auto;
}

.game-setup {
    flex: 0 0 340px;
    width: 340px;
    max-width: 340px;
    margin: 0;
    align-self: center;
}

.game-area {
    flex: 0 0 auto;
    padding: 0;
    gap: 34px;
    overflow: visible;
}

.board-wrap {
    position: relative;
    flex: 0 0 auto;
    padding: var(--ankh-cell-size);
    overflow: visible;
}

.board {
    width: var(--ankh-board-size);
    height: var(--ankh-board-size);
    aspect-ratio: 1 / 1;
}

/* Keep the control Ankh outside the 10x10 arena. */
.ankh-controls {
    flex: 0 0 250px;
}

@media (max-width: 1250px) {
    :root { --ankh-board-size: min(540px, 60vh, 45vw); }
    body { gap: 14px; padding: 12px; }
    .game-setup { flex-basis: 300px; width: 300px; max-width: 300px; }
    .game-area { gap: 18px; }
    .ankh-controls { transform: scale(.84); transform-origin: center left; flex-basis: 210px; }
}

@media (max-width: 980px) {
    body { flex-direction: column; align-items: center; }
    .game-setup { width: min(92vw, 560px); max-width: 560px; flex-basis: auto; }
    :root { --ankh-board-size: min(560px, 66vw); }
    .game-area { flex-direction: column; }
    .ankh-controls { transform-origin: top center; }
}

/* 0.0.25 — plain functional temporary-column test object. */
.neutral-piece { cursor: default; }

/* 0.0.29 — graphics slice 1. Visual treatment only; optical geometry unchanged. */
.board-wrap::before {
    content:"";
    position:absolute;
    inset: calc(var(--ankh-cell-size) * .12);
    z-index:0;
    pointer-events:none;
    border: calc(var(--ankh-cell-size) * .10) solid #7b5225;
    outline: 3px solid #2c1b0d;
    box-shadow: 0 0 0 5px #bd8738, 0 0 0 9px #2b1a0d, 0 12px 30px rgba(0,0,0,.75), inset 0 0 24px rgba(0,0,0,.7);
    background:
      repeating-linear-gradient(90deg, rgba(219,167,73,.16) 0 2px, transparent 2px 34px),
      repeating-linear-gradient(0deg, rgba(219,167,73,.10) 0 2px, transparent 2px 30px),
      #211a12;
}
.board-wrap { isolation:isolate; }
.board { z-index:3; box-shadow:0 0 0 4px #3d2914,0 0 0 7px #b57b31,0 8px 24px rgba(0,0,0,.65); }
#edge-mirror-layer { z-index:8 !important; }
.optical-ring-cell {
    border: 1px solid rgba(205,153,65,.55);
    background: radial-gradient(circle at 35% 28%, #3c3020, #17130e 72%);
    box-shadow: inset 0 0 0 2px rgba(74,45,18,.8);
}
.optical-ring-cell.fixed-corner { background:radial-gradient(circle at 50% 50%,#49361f,#15110d 72%); }
.optical-ring-mirror { width:82%; height:82%; }
.arena-guardian {
    position:absolute;
    width:calc(var(--ankh-cell-size) * .72);
    height:calc(var(--ankh-cell-size) * .72);
    object-fit:contain;
    z-index:10;
    pointer-events:none;
    filter:drop-shadow(0 3px 4px rgba(0,0,0,.75));
}
/* Guardians sit OUTSIDE the 10x10 optical cells: west = cat, east = cobra. */
.guardian-nw { left:calc(var(--ankh-cell-size) * .12); top:calc(var(--ankh-cell-size) * .12); transform:translate(-72%,-72%); }
.guardian-sw { left:calc(var(--ankh-cell-size) * .12); bottom:calc(var(--ankh-cell-size) * .12); transform:translate(-72%,72%); }
.guardian-ne { right:calc(var(--ankh-cell-size) * .12); top:calc(var(--ankh-cell-size) * .12); transform:translate(72%,-72%); }
.guardian-se { right:calc(var(--ankh-cell-size) * .12); bottom:calc(var(--ankh-cell-size) * .12); transform:translate(72%,72%); }

/* 0.0.30 — approved generated mascot textures.
   Mascots are deliberately outside the 10x10 optical arena, so they never
   cover an edge/corner mirror or interfere with optical hit geometry. */
.arena-guardian {
    width: calc(var(--ankh-cell-size) * .82);
    height: calc(var(--ankh-cell-size) * 1.72);
    object-fit: cover;
    object-position: center top;
    z-index: 11;
    border-radius: 4px;
    filter: drop-shadow(0 5px 7px rgba(0,0,0,.82));
}
.guardian-nw { left: 0; top: 0; transform: translate(-108%, 0); }
.guardian-sw { left: 0; bottom: 0; transform: translate(-108%, 0); }
.guardian-ne { right: 0; top: 0; transform: translate(108%, 0); }
.guardian-se { right: 0; bottom: 0; transform: translate(108%, 0); }

/* 0.0.32i — Egyptian cosmetic treatment for the setup panel only. */
.game-setup {
    border: 2px solid #9f762c;
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(45,31,17,.97), rgba(16,12,8,.97));
    box-shadow: inset 0 0 0 3px rgba(216,174,76,.10), 0 8px 24px rgba(0,0,0,.42);
    color: #e7c875;
}
.game-setup h2 {
    color: #f0d27f;
    letter-spacing: .08em;
    text-shadow: 0 1px 2px #000;
}
.game-setup label {
    color: #d9b85f;
    font-weight: 700;
}
.game-setup select {
    min-height: 38px;
    padding: 0 34px 0 10px;
    border: 1px solid #b88b37;
    border-radius: 5px;
    background-color: #17110b;
    color: #f1ddb0;
    box-shadow: inset 0 0 0 1px rgba(239,202,112,.10);
    cursor: pointer;
}
.game-setup select:focus {
    outline: 2px solid rgba(226,183,80,.45);
    outline-offset: 1px;
}
.game-setup #start-game {
    min-height: 38px;
    padding: 0 20px;
    border: 1px solid #6e4b18;
    border-radius: 6px;
    background: linear-gradient(180deg, #e7c26c 0%, #bd8d38 55%, #9b6c24 100%);
    color: #251607;
    font-weight: 900;
    letter-spacing: .04em;
    text-shadow: 0 1px rgba(255,238,179,.45);
    box-shadow: inset 0 1px rgba(255,239,177,.65), 0 2px 5px rgba(0,0,0,.42);
}
.game-setup #start-game:hover:not(:disabled) {
    filter: brightness(1.08);
}
.game-setup #start-game:active:not(:disabled) {
    transform: translateY(1px);
}
.game-setup .setup-rule {
    color: #c9ab67;
    opacity: .9;
}
.game-setup.setup-locked select,
.game-setup.setup-locked button {
    opacity: .55;
    cursor: default;
}


/* 0.0.32j — approved clean Ankh art + locked invisible click zones */
.ankh-controls { width:250px; height:430px; flex:0 0 250px; filter:none; }
.ankh-controller-art { position:absolute; z-index:1; left:0; top:32px; width:250px; height:375px; object-fit:contain; display:block; }
.ankh-loop,.ankh-crossbar,.ankh-stem { display:none !important; }
.ankh-title { top:4px; z-index:6; }

.ankh-btn,.ankh-pass,.ankh-fire {
  position:absolute; z-index:7; box-sizing:border-box; margin:0; padding:0;
  min-width:0; border:0 !important;
  border-radius:4px !important; background:transparent !important;
  color:transparent !important; box-shadow:none !important; text-shadow:none !important;
  font-size:0 !important; line-height:0 !important; transform:none !important;
}
.ankh-btn:hover,.ankh-pass:hover,.ankh-fire:hover { background:transparent !important; }
.ankh-btn:active,.ankh-pass:active,.ankh-fire:active { transform:none !important; }
.ankh-fire:disabled { opacity:.55; cursor:default; }

/* Coordinates are proportional to the approved 1024x1536 artwork rendered 250x375 at y=32. */
.move-n { left:111px; top:67px; width:28px; height:30px; }
.move-w { left:72px; top:105px; width:29px; height:31px; }
.move-e { left:149px; top:105px; width:30px; height:31px; }
.move-s { left:111px; top:147px; width:28px; height:31px; }
.rot-l  { left:30px; top:178px; width:35px; height:41px; }
.rot-r  { left:185px; top:178px; width:35px; height:41px; }
.ankh-pass { left:103px; top:275px; width:43px; height:33px; }
.ankh-fire { left:103px; top:309px; width:43px; height:33px; }
.ankh-status { top:409px; z-index:6; }

/* 0.0.32k — subtle gold pinstripe framing the controller artwork only */
.ankh-controls::before {
    content:"";
    position:absolute;
    z-index:2;
    left:0;
    top:32px;
    width:250px;
    height:375px;
    box-sizing:border-box;
    border:1px solid rgba(181,126,28,.88);
    pointer-events:none;
}


/* 0.0.32m — central scarab opens the Rules / Manual overlay */
.ankh-scarab {
    position:absolute;
    z-index:8;
    left:105px;
    top:183px;
    width:40px;
    height:43px;
    margin:0;
    padding:0;
    border:0;
    border-radius:50%;
    background:transparent;
    box-shadow:none;
    cursor:pointer;
    font-size:0;
}
.ankh-scarab:focus-visible {
    outline:1px solid rgba(229,189,89,.9);
    outline-offset:2px;
}
.rules-modal[hidden] { display:none !important; }
.rules-modal {
    position:fixed;
    inset:0;
    z-index:10000;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
    background:rgba(5,4,2,.82);
}
.rules-panel {
    width:min(720px,94vw);
    max-height:86vh;
    overflow:auto;
    min-height:330px;
    padding:24px;
    text-align:center;
    color:#f1ddb0;
    background:linear-gradient(180deg,#241a0e,#120e09);
    border:1px solid #b17b1d;
    border-radius:10px;
    box-shadow:0 18px 60px rgba(0,0,0,.72), inset 0 0 0 1px rgba(239,202,112,.12);
}
.rules-panel h2 {
    margin:0 0 24px;
    color:#e5bd59;
    letter-spacing:.08em;
}
.rules-placeholder {
    min-height:190px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border-top:1px solid rgba(181,126,28,.45);
    border-bottom:1px solid rgba(181,126,28,.45);
}
.rules-ankh {
    font-size:64px;
    line-height:1;
    color:#d7a83f;
    text-shadow:0 0 12px rgba(215,168,63,.25);
}
.rules-placeholder p { max-width:430px; color:#c9ab67; }
.rules-panel #rules-close {
    margin-top:20px;
    min-width:120px;
    min-height:38px;
    border:1px solid #6e4b18;
    border-radius:6px;
    background:linear-gradient(180deg,#e7c26c 0%,#bd8d38 55%,#9b6c24 100%);
    color:#251607;
    font-weight:900;
    letter-spacing:.05em;
    cursor:pointer;
}


/* 0.0.32m — rules discovery hint beneath the optical arena */
.rules-hint {
    position:absolute;
    left:var(--ankh-cell-size);
    right:var(--ankh-cell-size);
    bottom:-22px;
    z-index:8;
    text-align:center;
    color:#c9ab67;
    font-size:13px;
    letter-spacing:.025em;
    pointer-events:none;
}



/* 0.0.32s — visible build identifier beneath the board */
.game-version {
    position:absolute;
    left:var(--ankh-cell-size);
    right:var(--ankh-cell-size);
    bottom:-58px;
    z-index:8;
    text-align:center;
    color:#9f895b;
    font-size:11px;
    letter-spacing:.06em;
    pointer-events:none;
}

/* 0.0.32o — first Rules / Manual section: Game Basics */
.rules-content {
    padding:16px 18px 6px;
    text-align:left;
    border-top:1px solid rgba(181,126,28,.45);
    border-bottom:1px solid rgba(181,126,28,.45);
}
.rules-content .rules-ankh { text-align:center; margin-bottom:6px; }
.rules-content h3 {
    margin:0 0 18px; text-align:center; color:#e5bd59; letter-spacing:.09em;
}
.rules-content h4 {
    margin:18px 0 6px; color:#e5bd59; letter-spacing:.05em;
}
.rules-content p { margin:0 0 10px; color:#e1cfaa; line-height:1.5; }
.rules-content ul { margin:6px 0 12px 22px; padding:0; color:#e1cfaa; line-height:1.5; }
.rules-content li { margin:3px 0; }

/* 0.0.32p — ANKH-styled Rules / Manual scrollbar */
.rules-panel {
    scrollbar-width: thin;
    scrollbar-color: #b7832d #171008;
}
.rules-panel::-webkit-scrollbar {
    width: 11px;
}
.rules-panel::-webkit-scrollbar-track {
    background: #171008;
    border-left: 1px solid #5e4219;
}
.rules-panel::-webkit-scrollbar-thumb {
    background: linear-gradient(90deg,#76501b 0%,#c6973d 48%,#8a5f20 100%);
    border: 2px solid #171008;
    border-radius: 8px;
    box-shadow: inset 0 0 0 1px rgba(232,190,91,.32);
}
.rules-panel::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(90deg,#956822 0%,#e0b557 48%,#a97828 100%);
}

/* 0.0.32u — collapsed Guard rubble: permanent movement obstacle, laser-transparent. */
.rubble-piece {
    transform: none !important;
    pointer-events: none;
    z-index: 2;
    filter: saturate(.88) brightness(.88);
}


/* 0.0.32v — navigation link beneath the board */
.games-back-link {
    position:absolute;
    left:var(--ankh-cell-size);
    right:var(--ankh-cell-size);
    bottom:-40px;
    z-index:9;
    display:block;
    width:max-content;
    max-width:calc(100% - (var(--ankh-cell-size) * 2));
    margin:0 auto;
    color:#c79a3b;
    font-size:13px;
    letter-spacing:.03em;
    text-decoration:none;
    text-align:center;
}
.games-back-link:hover, .games-back-link:focus-visible {
    color:#e2bd61;
    text-decoration:underline;
}
.games-back-link:focus-visible {
    outline:1px solid #c79a3b;
    outline-offset:3px;
}