:root{color-scheme:dark;--ink:#f2e1c5;--muted:#b1a28b;--gold:#d9b776;--line:#b3986738}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 50% 0,#3d3630 0,transparent 58%),radial-gradient(ellipse at 0 90%,#292f2d 0,transparent 40%),#242528;color:var(--ink);font-family:Arial,"Microsoft YaHei",sans-serif}body:before{content:'';position:fixed;inset:0;pointer-events:none;opacity:.08;background-image:radial-gradient(#ead4a5 .6px,transparent .6px);background-size:7px 7px}button{font:inherit;cursor:pointer}button:disabled{cursor:default}.game-shell{position:relative;max-width:980px;margin:auto;padding:31px 28px 23px}.rune-heading{text-align:center;margin-bottom:30px}.eyebrow{color:#c1a673;font-size:9px;font-weight:600;letter-spacing:3px;margin:0 0 15px}.eyebrow span:first-child,.eyebrow span:last-child{font-size:19px;padding:0 12px;vertical-align:middle}h1{font:clamp(38px,5.5vw,62px) Georgia,"Times New Roman",serif;letter-spacing:-1.9px;margin:0;color:#f5e6cd}.intro{font-size:13px;color:#b9aa94;margin:13px 0 0}.game-panel{border:1px solid #a9906142;border-radius:20px;padding:23px 26px 0;background:#2f2d2b80;box-shadow:0 25px 70px #0002}.top-row{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-bottom:21px;border-bottom:1px solid var(--line)}.difficulty{display:flex;gap:7px}.difficulty button{min-width:108px;display:flex;flex-direction:column;gap:6px;padding:10px 17px;background:transparent;border:1px solid transparent;border-radius:9px;color:#a79982;text-align:left}.difficulty button span{font-size:12px}.difficulty button small{font-size:9px;color:#847b6b}.difficulty button[aria-pressed=true]{background:#d6b67b15;border-color:#d3b0786b;color:#efd7a9}.difficulty button[aria-pressed=true] small{color:#b59c71}.difficulty button:hover{background:#d6b67b10}.session-actions{display:flex;gap:8px}.icon-button{width:41px;height:41px;color:#ccb68f;border:1px solid #b397643d;background:#39352f;border-radius:50%;font-size:20px}.icon-button:hover:not(:disabled){background:#494134}.icon-button:disabled{opacity:.35}.stats{display:flex;justify-content:space-around;padding:20px 0 21px}.stats>div{min-width:80px;text-align:center}.stats span{display:block;font-size:9px;letter-spacing:.8px;color:#9f927e;margin-bottom:8px}.stats strong{font:24px Georgia,serif;font-variant-numeric:tabular-nums;color:#e9d6b3}.stats small{font:13px Georgia,serif;color:#8c806d}.board-wrap{position:relative;max-width:650px;margin:auto}.card-grid{display:grid;grid-template-columns:repeat(var(--cols,4),1fr);gap:12px;isolation:isolate}.card{position:relative;aspect-ratio:1.06;border:0;border-radius:11px;background:transparent;padding:0;perspective:800px;touch-action:manipulation;-webkit-tap-highlight-color:transparent;min-width:0}.card-inner{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .38s cubic-bezier(.25,.75,.2,1)}.card.is-open .card-inner,.card.is-matched .card-inner{transform:rotateY(180deg)}.card-back,.card-front{position:absolute;inset:0;border-radius:10px;backface-visibility:hidden;display:grid;place-items:center;overflow:hidden}.card-back{background:radial-gradient(ellipse at 50% 25%,#494238,#39352f);border:1px solid #b89a5e80;box-shadow:0 4px 0 #1b1d1e,0 5px 9px #0002}.card-back:before{content:'';position:absolute;inset:7px;border:1px solid #ac905a44;border-radius:5px}.card-back:after{content:'';position:absolute;width:51%;height:51%;border:1px solid #b6995f40;transform:rotate(45deg);border-radius:4px}.card-back svg{width:64%;height:64%;color:#cfac6f;z-index:1;opacity:.83}.card:hover:not(.is-open):not(.is-matched) .card-back{background:radial-gradient(ellipse at 50% 25%,#5b503e,#423b31);border-color:#d6b575}.card-front{transform:rotateY(180deg);background:radial-gradient(ellipse at 50% 35%,#faf0d6,#e8d5ad);border:1px solid #f8ebcc;box-shadow:0 4px 0 #b49a6d,0 5px 9px #0002}.card-front:before{content:'';position:absolute;inset:7px;border:1px solid #ad8b5340;border-radius:5px}.rune-art{position:relative;width:66%;height:66%;overflow:visible;filter:drop-shadow(0 3px 1px #775b291a)}.card-front .rune-name{position:absolute;bottom:9px;color:#947b54;font-size:8px;letter-spacing:.5px}.card.is-matched .card-front{background:radial-gradient(ellipse at 50% 35%,#e5e9cc,#c5d0aa);border-color:#d7e3bb;box-shadow:0 4px 0 #879d72}.card.is-matched .rune-name{color:#6d8057}.card.is-matched{cursor:default}.card.is-matched .card-front:after{content:'✓';position:absolute;right:8px;top:5px;color:#759060;font-size:12px}.card:focus-visible{outline:3px solid #f1ce89;outline-offset:4px;z-index:2}.card-grid.paused{visibility:hidden}.bottom-row{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:21px 0 19px;border-top:1px solid var(--line);margin-top:23px}.bottom-row p{font-size:11px;line-height:1.7;color:#a89a83;margin:0}.bottom-star{font-size:26px;color:#c1a56e}.overlay{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#302e2bef;border:1px solid #b094604d;border-radius:13px;text-align:center;padding:24px;backdrop-filter:blur(8px)}.overlay[hidden]{display:none}.overlay-symbol{color:#d6b274;font:58px Georgia,serif;margin-bottom:6px}.overlay h2{font:clamp(25px,4vw,37px) Georgia,serif;color:#f1dfbb;margin:10px 0}.overlay p:not(.eyebrow){font-size:12px;line-height:1.8;color:#b6a487;max-width:340px;margin:8px 0 16px}.overlay .eyebrow{font-size:8px;letter-spacing:2px;margin:7px 0 0}.primary{border:1px solid #d8b875;border-radius:8px;background:#d5b276;color:#353025;font-size:12px;font-weight:600;padding:14px 23px;margin-top:14px;min-height:44px}.primary:hover{background:#e6c790}.score-total{display:flex;align-items:baseline;gap:9px}.score-total strong{font:43px Georgia,serif;color:#dfbe7e}.score-total span{font-size:11px;color:#b6a487}footer{display:flex;justify-content:space-between;gap:22px;color:#8e846f;font-size:9px;line-height:1.7;padding-top:22px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(min-width:761px){.card-grid[data-pairs="6"]{max-width:560px;margin:auto}.card-grid[data-pairs="8"]{max-width:540px;margin:auto}.card-grid[data-pairs="12"]{gap:11px}.card-grid[data-pairs="12"] .card{aspect-ratio:.82}.card-grid[data-pairs="12"] .rune-name{font-size:7px}}@media(max-width:760px){.game-shell{padding:24px 15px 20px}.rune-heading{margin-bottom:23px}.game-panel{padding:15px 14px 0;border-radius:16px}.top-row{gap:6px;padding-bottom:14px}.difficulty{gap:3px;flex:1}.difficulty button{min-width:0;flex:1;padding:9px 10px}.difficulty button span{font-size:11px}.difficulty button small{font-size:8px}.session-actions{gap:5px}.icon-button{width:33px;height:33px;font-size:17px}.stats{padding:17px 0}.stats>div{min-width:0}.stats span{font-size:8px}.stats strong{font-size:22px}.card-grid{gap:9px;--cols:4!important}.card{aspect-ratio:.88}.card-front .rune-name{font-size:6px;bottom:8px}.card-back:before,.card-front:before{inset:5px}.card-grid[data-pairs="12"]{grid-template-columns:repeat(4,1fr)}.card-grid[data-pairs="12"] .card{aspect-ratio:1.18}.card-grid[data-pairs="12"] .rune-name{display:none}.card-grid[data-pairs="12"] .rune-art{height:75%;width:75%}.bottom-row{margin-top:18px;padding:15px 0}.bottom-row p{font-size:10px}.overlay{padding:16px}.overlay-symbol{font-size:41px}.overlay h2{font-size:29px}.overlay p:not(.eyebrow){font-size:11px}.score-total strong{font-size:36px}.primary{margin-top:10px;padding:12px 17px}.victory .overlay-symbol{font-size:35px}.victory .eyebrow{font-size:7px}footer{font-size:8px;display:block;text-align:center;padding-top:17px}footer span{display:block}footer span+span{margin-top:6px}}@media(max-width:370px){.game-shell{padding-left:10px;padding-right:10px}.game-panel{padding-left:10px;padding-right:10px}.difficulty button{padding:8px 6px}.card-grid{gap:7px}.overlay h2{font-size:25px}.victory p:not(.eyebrow){margin:5px 0 8px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
:root { --focus-color: #f1ce89; }
button:focus-visible { outline: 3px solid #f1ce89; outline-offset: 4px; }
.difficulty button { color: #d1c0a3; min-height: 48px; }
.difficulty button small { color: #b2a18a; }
.difficulty button:hover { color: #fff0d4; background: #504634; }
.difficulty button[aria-pressed=true]:hover { color: #fff2d6; background: #615138; }
.difficulty button[aria-pressed=true] small { color: #d4bc90; }
.icon-button { width: 44px; height: 44px; }
.icon-button:hover:not(:disabled) { color: #ffedca; }
.primary:hover { color: #30281b; }
.memory-tools { display: grid; grid-template-columns: minmax(0,1fr) auto auto; align-items: center; gap: 24px; margin: 0 0 18px; padding: 16px 18px; border-radius: 12px; background: #3c393080; border: 1px solid #9b885b55; }
.memory-progress > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 11px; color: #ddc9a1; }
.memory-progress strong { white-space: nowrap; font-variant-numeric: tabular-nums; }
.memory-progress progress { display: block; width: 100%; height: 6px; border: 0; border-radius: 7px; overflow: hidden; margin-top: 10px; background: #625743; }
.memory-progress progress::-webkit-progress-bar { background: #625743; }
.memory-progress progress::-webkit-progress-value { background: #cabb85; border-radius: 7px; }
.memory-progress progress::-moz-progress-bar { background: #cabb85; }
.memory-stat { display: flex; flex-direction: column; gap: 7px; text-align: center; }
.memory-stat span { font-size: 10px; color: #c0b292; }
.memory-stat strong { font: 23px Georgia,serif; color: #e9d4a2; font-variant-numeric: tabular-nums; }
.peek-tools { display: flex; gap: 18px; align-items: center; margin: 0 0 22px; }
.peek-tools button { flex-shrink: 0; min-height: 44px; padding: 11px 16px; border: 1px solid #baa384; border-radius: 9px; background: #4a4154; color: #f1e1f3; font-size: 12px; }
.peek-tools button:hover:not(:disabled) { background: #675574; color: #fff; }
.peek-tools button:disabled { opacity: .6; }
.peek-tools p { font-size: 11px; color: #bfb099; line-height: 1.7; margin: 0; }
.peek-countdown { color: #f6e5ff; padding: 12px; margin: -8px 0 16px; background: #53445e; border: 1px solid #b3a0ba; border-radius: 9px; text-align: center; font-size: 14px; font-weight: 600; }
.game-status { min-height: 22px; margin: 14px 0 18px; color: #ddc69d; font-size: 12px; line-height: 1.7; text-align: center; }
.storage-status { font-size: 11px; line-height: 1.7; color: #c0b297; margin: 0 0 8px; }
.card-front .rune-name { color: #70562f; }
.card.is-matched .rune-name { color: #445d35; }
.overlay { overflow-y: auto; justify-content: safe center; }
.victory .overlay-symbol { display: none; }
.victory p:not(.eyebrow) { margin: 4px 0 8px; line-height: 1.5; }
.reset-dialog { width: min(440px,calc(100% - 28px)); padding: 26px; border: 1px solid #bda06a; border-radius: 18px; background: #332e32; color: #f2e1c5; box-shadow: 0 25px 80px #0008; }
.reset-dialog::backdrop { background: #151518b8; backdrop-filter: blur(4px); }
.reset-dialog h2 { margin: 0; font: 27px Georgia,serif; }
.reset-dialog p { font-size: 13px; line-height: 1.8; color: #d1bfa7; margin: 16px 0 22px; }
.reset-dialog > div { display: flex; flex-wrap: wrap; gap: 10px; }
.reset-dialog button { min-height: 44px; border: 1px solid #a3947e; border-radius: 8px; padding: 11px 15px; background: #494039; color: #fff0d8; font-size: 12px; margin: 0; }
.reset-dialog button:hover { background: #625448; color: #fff; }
.reset-dialog .primary { background: #d5b276; color: #353025; }
.reset-dialog .primary:hover { background: #eed19b; color: #353025; }
@media(max-width:580px) {
  .top-row { flex-wrap: wrap; }
  .difficulty { flex-basis: 100%; }
  .session-actions { margin-left: auto; margin-top: 6px; }
  .memory-tools { grid-template-columns: 1fr 1fr; gap: 14px; padding: 13px; }
  .memory-progress { grid-column: 1 / -1; }
  .peek-tools { display: block; }
  .peek-tools button { width: 100%; }
  .peek-tools p { margin-top: 10px; }
  .stats>div { flex: 1; }
  .stats span { letter-spacing: 0; }
  .overlay p:not(.eyebrow) { font-size: 11px; }
  .victory h2 { font-size: 24px; margin: 6px 0; }
}
@media(prefers-reduced-motion:reduce) {
  .card-inner,.card.is-open .card-inner,.card.is-matched .card-inner { transform: none; transform-style: flat; }
  .card-front { transform: none; visibility: hidden; }
  .card.is-open .card-front,.card.is-matched .card-front { visibility: visible; }
  .card.is-open .card-back,.card.is-matched .card-back { visibility: hidden; }
}