:root{
  --walnut:#3a2417;--walnut-deep:#2a190f;--brass:#d7b56a;--brass-deep:#8a6a2f;--ivory:#f4ecdc;--ink:#24150b;--alert:#8e1b12;--hint:#0b3c8c;
  --r0:#6f9a5e;--r1:#f0dc96;--r2:#5f8fc9;--r3:#eaa398;--r4:#c9b2e4;--r5:#4fb3a3;--r6:#d39a35;--r7:#f5f1e6;--r8:#f0bcd6;--r9:#8f8a72;
  --pat:#24150b26;
  --font:"Didot","Bodoni 72",ui-serif,"New York","Iowan Old Style",Georgia,serif;
  --text:ui-serif,"New York","Iowan Old Style",Georgia,serif;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;color:var(--ivory);font-family:var(--text);line-height:1.5;background-color:var(--walnut);
  background-image:repeating-linear-gradient(91deg,#0000 0 13px,#1a0d0533 13px 14px,#0000 14px 37px,#6b462b26 37px 39px,#0000 39px 61px)}
#site-header{padding:14px 16px 8px;text-align:center}
.crest{display:flex;align-items:center;justify-content:center;gap:12px}
.crest::before,.crest::after{content:"";flex:1;max-width:150px;height:1px;background:var(--brass)}
.crest img{width:44px;height:44px;display:block}
#site-title{margin:2px 0 0;font-family:var(--font);font-weight:400;font-size:clamp(1.75rem,8vw,2.5rem);line-height:1.15}
button,select,textarea{font:inherit}
button,select{min-height:44px;color:var(--ivory);background:var(--walnut-deep);border:1px solid var(--brass);border-radius:2px;cursor:pointer;touch-action:manipulation}
button[aria-pressed=true]{background:var(--brass);color:var(--ink)}
button:disabled,select:disabled{border-color:var(--brass-deep);color:#c9b9a0;cursor:default}
:focus-visible{outline:3px solid var(--ivory);outline-offset:2px}
#game{display:flex;flex-direction:column;align-items:center;padding-bottom:40px}
#game>section,#puzzle-title,#game-info,#status{width:100%;padding-inline:12px}
#mode-controls{display:grid;grid-template-columns:1fr 1fr auto 1fr;gap:6px;align-items:center}
#mode-controls label{font-size:.875rem}
#mode-controls select{padding:0 6px;width:100%}
#new-puzzle{grid-column:1/-1}
#puzzle-title{margin:12px 0 0;font-size:1.0625rem;font-weight:400;text-align:center}
#game-info{margin:0 0 8px;text-align:center;color:var(--brass);font-variant-numeric:tabular-nums}
#game-info span{margin-right:12px}
#board{--cell:min(calc((100vw - 8px)/var(--size,8)),64px);display:inline-block;border:4px solid var(--brass-deep);background:var(--walnut-deep);touch-action:none;user-select:none;-webkit-user-select:none}
.board-row{display:flex}
.cell{position:relative;width:var(--cell);height:var(--cell);padding:0;min-height:0;border:1px solid #24150b47;border-radius:0;color:var(--ink);font-size:calc(var(--cell)*.5);background-size:var(--p,10px) var(--p,10px);cursor:pointer}
.cell:focus-visible{outline:3px solid var(--ink);outline-offset:-5px;box-shadow:inset 0 0 0 2px var(--ivory)}
/* Region identity is carried three ways: fill, weave pattern and letter, plus a heavy outline. */
.region-0{background-color:var(--r0);background-image:radial-gradient(var(--pat) 18%,#0000 20%);--p:9px}
.region-1{background-color:var(--r1);background-image:repeating-linear-gradient(45deg,var(--pat) 0 1.5px,#0000 1.5px 7px);background-size:auto}
.region-2{background-color:var(--r2);background-image:repeating-linear-gradient(0deg,var(--pat) 0 2px,#0000 2px 7px);background-size:auto}
.region-3{background-color:var(--r3);background-image:repeating-linear-gradient(-45deg,var(--pat) 0 1.5px,#0000 1.5px 7px);background-size:auto}
.region-4{background-color:var(--r4);background-image:repeating-linear-gradient(90deg,var(--pat) 0 2px,#0000 2px 7px);background-size:auto}
.region-5{background-color:var(--r5);background-image:linear-gradient(var(--pat) 1.5px,#0000 1.5px),linear-gradient(90deg,var(--pat) 1.5px,#0000 1.5px);--p:9px}
.region-6{background-color:var(--r6);background-image:repeating-linear-gradient(45deg,var(--pat) 0 1.5px,#0000 1.5px 7px),repeating-linear-gradient(-45deg,var(--pat) 0 1.5px,#0000 1.5px 7px);background-size:auto}
.region-7{background-color:var(--r7)}
.region-8{background-color:var(--r8);background-image:radial-gradient(#0000 34%,var(--pat) 36%,var(--pat) 48%,#0000 50%);--p:12px}
.region-9{background-color:var(--r9);background-image:conic-gradient(var(--pat) 25%,#0000 0 50%,var(--pat) 0 75%,#0000 0);--p:12px}
.cell.edge-top{border-top:3px solid var(--ink)}.cell.edge-bottom{border-bottom:3px solid var(--ink)}
.cell.edge-left{border-left:3px solid var(--ink)}.cell.edge-right{border-right:3px solid var(--ink)}
.region-tag{position:absolute;left:3px;top:0;font:700 10px/1.3 ui-sans-serif,system-ui,sans-serif;color:var(--ink);background:#f5f1e6b3;padding:0 2px;display:none}
.cell.edge-top.edge-left .region-tag{display:block}
.cell-glyph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-weight:700}
.cell[data-state=queen] .cell-glyph{inset:17%;font-size:0}
.cell[data-state=queen] .cell-glyph::before,.cell[data-state=queen] .cell-glyph::after{content:"";position:absolute;clip-path:polygon(10% 90%,2% 34%,22% 54%,30% 12%,42% 46%,50% 2%,58% 46%,70% 12%,78% 54%,98% 34%,90% 90%)}
.cell[data-state=queen] .cell-glyph::before{inset:0;background:var(--ink)}
.cell[data-state=queen] .cell-glyph::after{inset:13%;background:var(--brass)}
.cell.in-conflict-zone{box-shadow:inset 0 0 0 2px var(--alert)}
.cell.is-conflict{box-shadow:inset 0 0 0 3px var(--alert),inset 0 0 0 5px var(--ivory)}
.cell.is-conflict .cell-glyph::after{background:var(--alert)}
.cell.is-hint{box-shadow:inset 0 0 0 3px var(--hint),inset 0 0 0 5px var(--ivory)}
#board.is-won{border-color:var(--brass)}
#game-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px}
#game-actions button{min-height:52px;font-family:var(--font);font-size:1.125rem}
#status{min-height:1.5em;margin:8px 0 0;text-align:center}
#win-panel{margin-top:8px;padding-block:14px;background:var(--ivory);color:var(--ink)}
#win-title{margin:0;font-family:var(--font);font-weight:400;font-size:1.75rem}
#win-message{margin:0 0 8px}
#win-panel label{display:block;font-size:.875rem}
#share-text{display:block;width:100%;padding:8px;border:1px solid var(--brass-deep);background:#fffaf0;color:var(--ink);font:.9375rem/1.45 ui-monospace,Menlo,monospace;resize:none}
#share-copy{margin-top:8px;padding:0 20px;background:var(--walnut);border-color:var(--walnut)}
#stats,#rules{margin-top:20px}
#stats h2,#rules h2{margin:0 0 6px;padding-bottom:4px;border-bottom:1px solid var(--brass-deep);font-family:var(--font);font-weight:400;font-size:1.375rem}
#stats h3{margin:12px 0 4px;font-size:.9375rem;font-weight:400;color:var(--brass)}
#stats dl{display:grid;grid-template-columns:1fr 1fr;margin:0}
#stats dt{grid-row:2;font-size:.875rem;color:var(--brass)}
#stats dd{grid-row:1;margin:0;font-size:1.75rem}
#stat-best-times{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:2px 12px;list-style:none;margin:0;padding:0;font-variant-numeric:tabular-nums}
#rules p{margin:0 0 8px}
@media (min-width:900px){
  #site-header{padding-top:20px}
  #game{display:grid;justify-content:center;gap:0 44px;padding:8px 32px 40px;
    grid-template-columns:auto 340px;
    grid-template-rows:auto auto auto auto auto auto auto 1fr;
    grid-template-areas:"board modes" "board title" "board info" "board actions" "board status" "board win" "board stats" "board rules"}
  #board{grid-area:board;align-self:start;--cell:min(calc((100svh - 150px)/var(--size,8)),72px)}
  #game>section,#puzzle-title,#game-info,#status{padding-inline:0}
  #mode-controls{grid-area:modes}#puzzle-title{grid-area:title;text-align:left}
  #game-info{grid-area:info;text-align:left}#game-actions{grid-area:actions;margin-top:0}
  #status{grid-area:status;text-align:left}#win-panel{grid-area:win;padding-inline:14px!important}
  #stats{grid-area:stats}#rules{grid-area:rules}
  body:not(:has(#win-panel[hidden])) #rules{display:none}
}
@media (prefers-reduced-motion:no-preference){.cell-glyph{transition:opacity .1s}}