:root{--bg-primary:#faf4f4;--bg-secondary:#fff;--bg-tertiary:#f5e9e9;--marsala-primary:#851020;--marsala-dark:#5c0914;--marsala-light:#a31f32;--marsala-soft:#c04b5c;--marsala-glow:#85102047;--marsala-tint:#85102014;--gold-accent:#c59b3f;--gold-light:#e0b95d;--gold-dark:#916e1c;--text-main:#261014;--text-muted:#785157;--text-dark:#1a070a;--border-subtle:#ebd7d7;--border-focus:#dfbebe;--border-table:#1e2229;--border-grid-line:#2d333b;--border-prototype:#222;--color-success:#16a34a;--color-success-glow:#16a34a40;--color-error:#dc2626;--font-serif:"Cinzel", serif, Georgia;--font-sans:"Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:"JetBrains Mono", monospace;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--transition-fast:.15s ease;--transition-normal:.25s ease;--transition-flip:.55s cubic-bezier(.34, 1.4, .64, 1)}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--bg-primary);color:var(--text-main);-webkit-font-smoothing:antialiased;background-image:radial-gradient(circle at 50% 0,#85102017 0%,#0000 65%),radial-gradient(circle at 100% 100%,#c59b3f0d 0%,#0000 45%),linear-gradient(#fdf8f8 0%,#f4e8e8 100%);flex-direction:column;align-items:center;min-height:100vh;padding:1.25rem 1rem 2.5rem;line-height:1.5;display:flex;overflow-x:hidden}.app-container{flex-direction:column;gap:1.5rem;width:100%;max-width:1100px;margin:0 auto;display:flex}.official-banner-wrapper{border:1px solid var(--border-subtle);border-radius:var(--radius-md);width:100%;transition:transform var(--transition-normal), box-shadow var(--transition-normal);background:linear-gradient(135deg,#fff 0%,#faf0f1 50%,#f5e6e7 100%);justify-content:center;align-items:center;padding:.5rem 1rem;display:flex;box-shadow:0 4px 16px #8510200f,0 0 0 1px #85102008}.official-banner-wrapper:hover{transform:translateY(-1px);box-shadow:0 6px 20px #8510201a}.official-banner-img{object-fit:contain;width:100%;max-width:860px;height:auto;max-height:110px;display:block}.app-header{flex-direction:column;gap:1.25rem;display:flex}.header-content{border-bottom:1px solid var(--border-subtle);flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:1rem;padding-bottom:1.25rem;display:flex}.title-group{flex-direction:column;gap:.35rem;display:flex}.badge-tag{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.08em;color:var(--marsala-primary);background:var(--marsala-tint);border:1px solid #85102040;border-radius:999px;align-self:flex-start;padding:.2rem .65rem;font-size:.72rem;font-weight:700;display:inline-block}.game-title{font-family:var(--font-serif);letter-spacing:.02em;background:linear-gradient(135deg, var(--marsala-dark) 0%, var(--marsala-primary) 55%, var(--marsala-light) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:clamp(1.75rem,3.5vw,2.5rem);font-weight:700;line-height:1.15}.game-subtitle{color:var(--text-muted);font-size:clamp(.9rem,1.8vw,1.05rem);font-weight:500}.header-actions{flex-wrap:wrap;align-items:center;gap:.65rem;display:flex}.btn{font-family:var(--font-sans);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);-webkit-user-select:none;user-select:none;white-space:nowrap;border:1px solid #0000;justify-content:center;align-items:center;gap:.5rem;padding:.6rem 1.1rem;font-size:.9rem;font-weight:600;display:inline-flex}.btn:active{transform:scale(.97)}.btn-primary{background:linear-gradient(135deg, var(--marsala-light) 0%, var(--marsala-primary) 100%);color:#fff;box-shadow:0 4px 14px var(--marsala-glow);border-color:#720d1a}.btn-primary:hover{background:linear-gradient(135deg,#b5293e 0%,#941325 100%);box-shadow:0 6px 18px #85102066}.btn-secondary{color:var(--text-main);border-color:var(--border-focus);background:#fff;box-shadow:0 1px 3px #8510200a}.btn-secondary:hover{border-color:var(--marsala-light);color:var(--marsala-dark);background:#fdf8f8}.btn-large{padding:.8rem 1.75rem;font-size:1.05rem}.btn-icon{stroke-width:2.2px;width:1.15rem;height:1.15rem}.hidden{display:none!important}.stats-panel{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.75rem;display:grid}.stat-card{background:var(--bg-secondary);border:1px solid var(--border-subtle);border-radius:var(--radius-md);flex-direction:column;gap:.25rem;padding:.65rem .9rem;display:flex;box-shadow:0 2px 8px #8510200a}.stat-card.highlight{background:#8510200a;border-color:#85102059}.stat-label{text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted);font-size:.75rem;font-weight:600}.stat-value{font-family:var(--font-mono);color:var(--marsala-dark);font-size:1.25rem;font-weight:700}.stat-pairs-wrapper{flex-direction:column;gap:.35rem;display:flex}.progress-bar-container{background:#eddada;border-radius:999px;width:100%;height:6px;overflow:hidden}.progress-bar-fill{background:linear-gradient(90deg, var(--marsala-primary), var(--marsala-light));border-radius:999px;height:100%;transition:width .4s}.board-section{flex-direction:column;align-items:center;gap:.85rem;width:100%;display:flex}.board-frame-wrapper{-webkit-user-select:none;user-select:none;background:#fff;border-radius:4px;width:100%;max-width:980px;padding:6px;box-shadow:0 12px 36px #8510201a,0 0 0 1px #8510200f}.board-table{box-sizing:border-box;background:#fff;border:2px solid #000;grid-template-rows:32px repeat(4,1fr) 32px;grid-template-columns:36px repeat(6,1fr) 36px;display:grid}.grid-header-corner,.grid-footer-corner{background:#fff;border:1px solid #1a1a1a}.grid-col-header,.grid-col-footer,.grid-row-label-left,.grid-row-label-right{color:#000;font-family:var(--font-sans);background:#fff;border:1px solid #1a1a1a;justify-content:center;align-items:center;font-size:clamp(.85rem,1.6vw,1.15rem);font-weight:800;display:flex}.card-cell{aspect-ratio:152/124;perspective:1000px;cursor:pointer;background:#000;border:1px solid #1a1a1a;position:relative;overflow:hidden}.card-inner{text-align:center;width:100%;height:100%;transition:transform var(--transition-flip);transform-style:preserve-3d;position:relative}.card-cell.flipped .card-inner{transform:rotateY(180deg)}.card-face{backface-visibility:hidden;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;inset:0;overflow:hidden}.card-back{transition:filter var(--transition-fast), transform var(--transition-fast);background-color:#2b2b2b;background-position:50%;background-repeat:no-repeat;background-size:100% 100%;transform:rotateY(0)}.card-cell:not(.flipped):hover .card-back{filter:brightness(1.08)contrast(1.04)}.card-cell:not(.flipped):active .card-back{filter:brightness(.92)}.card-coord-badge{font-family:var(--font-mono);color:#ffffffd9;pointer-events:none;opacity:0;transition:opacity var(--transition-fast);background:#00000073;border-radius:3px;padding:1px 4px;font-size:.65rem;font-weight:700;position:absolute;top:4px;left:4px}.card-cell:hover .card-coord-badge{opacity:.9}.card-front{transition:border-color var(--transition-fast), box-shadow var(--transition-fast);background:#fff;border:2px solid #0000;flex-direction:column;justify-content:center;align-items:center;padding:4px;display:flex;transform:rotateY(180deg)}.card-shape-img{object-fit:contain;pointer-events:none;width:82%;height:82%;transition:transform .25s}.card-shape-name{font-family:var(--font-sans);color:#1a1a1a;white-space:nowrap;text-overflow:ellipsis;pointer-events:none;background:#f0f0f0f2;border-radius:4px;max-width:92%;padding:1px 6px;font-size:clamp(.55rem,.9vw,.72rem);font-weight:700;position:absolute;bottom:3px;overflow:hidden;box-shadow:0 1px 3px #00000026}.card-cell.matched{cursor:default}.card-cell.matched .card-front{background:#f6fff8;border-color:#238636;box-shadow:inset 0 0 12px #23863659}.card-cell.matched .card-shape-img{transform:scale(1.05)}.card-cell.matched:after{content:"✓";color:#fff;z-index:5;background:#238636;border-radius:50%;justify-content:center;align-items:center;width:18px;height:18px;font-size:11px;font-weight:800;animation:.3s cubic-bezier(.175,.885,.32,1.275) popBadge;display:flex;position:absolute;top:4px;right:4px;box-shadow:0 2px 5px #0000004d}@keyframes popBadge{0%{transform:scale(0)}70%{transform:scale(1.2)}to{transform:scale(1)}}.card-cell.mismatch .card-front{border-color:var(--color-error);animation:.45s ease-in-out shakeCard}@keyframes shakeCard{0%,to{transform:rotateY(180deg)translate(0)}20%,60%{transform:rotateY(180deg)translate(-4px)}40%,80%{transform:rotateY(180deg)translate(4px)}}.board-caption{color:var(--text-muted);text-align:center;max-width:800px;font-size:.88rem}.board-caption strong{color:var(--text-main)}.game-dialog{background:0 0;border:none;max-width:90vw;max-height:90vh;margin:auto;padding:0}.game-dialog::backdrop{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#2610148c}.dialog-card{border:1px solid var(--border-subtle);border-radius:var(--radius-lg);color:var(--text-main);text-align:center;background:#fff;flex-direction:column;align-items:center;gap:1.25rem;max-width:500px;padding:2rem;animation:.3s cubic-bezier(.16,1,.3,1) modalScaleIn;display:flex;box-shadow:0 24px 60px #8510202e,0 0 0 1px #85102026}.dialog-card.large-dialog{text-align:left;align-items:stretch;width:90vw;max-width:840px}@keyframes modalScaleIn{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}.confetti-cannon-icon{font-size:3.5rem;line-height:1}.dialog-title{font-family:var(--font-serif);color:var(--marsala-dark);font-size:1.75rem;font-weight:700}.dialog-subtitle{color:var(--text-muted);font-size:.95rem}.dialog-header-bar{justify-content:space-between;align-items:flex-start;gap:1rem;display:flex}.btn-close-icon{color:var(--text-muted);cursor:pointer;transition:color var(--transition-fast);background:0 0;border:none;padding:.25rem;font-size:1.75rem;line-height:1}.btn-close-icon:hover{color:var(--marsala-dark)}.stars-rating{letter-spacing:.3rem;color:#dfbebe;font-size:2.2rem}.stars-rating .filled{color:#eab308;text-shadow:0 0 16px #eab30873}.victory-stats-grid{grid-template-columns:repeat(3,1fr);gap:.75rem;width:100%;display:grid}.v-stat-box{background:var(--bg-tertiary);border:1px solid var(--border-subtle);border-radius:var(--radius-md);flex-direction:column;gap:.25rem;padding:.85rem .5rem;display:flex}.v-stat-title{color:var(--text-muted);text-transform:uppercase;font-size:.75rem;font-weight:600}.v-stat-num{font-family:var(--font-mono);color:var(--marsala-primary);font-size:1.35rem;font-weight:700}.dialog-actions{gap:.75rem;width:100%;margin-top:.5rem;display:flex}.dialog-actions .btn{flex:1}.shapes-catalog-grid{grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:1rem;max-height:60vh;padding-right:.5rem;display:grid;overflow-y:auto}.shape-catalog-card{border:1px solid var(--border-subtle);border-radius:var(--radius-md);text-align:center;color:var(--text-dark);background:#fff;flex-direction:column;align-items:center;gap:.5rem;padding:.85rem;display:flex;box-shadow:0 2px 8px #0000000a}.shape-catalog-card img{object-fit:contain;width:100px;height:100px}.shape-cat-title{color:var(--text-dark);font-size:.95rem;font-weight:700}.shape-cat-type{color:var(--text-muted);background:var(--bg-tertiary);border-radius:4px;padding:2px 6px;font-size:.75rem;font-weight:600}.prototype-view-body{flex-direction:column;align-items:center;gap:1rem;display:flex}.prototype-img-wrapper{border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:#fff;max-width:100%;padding:8px;box-shadow:0 4px 16px #00000014}.prototype-full-img{object-fit:contain;width:100%;max-height:60vh;display:block}.prototype-description{color:var(--text-muted);text-align:center;max-width:650px;font-size:.92rem}@media (width<=768px){body{padding:.75rem .5rem 2rem}.header-content{flex-direction:column;align-items:flex-start}.header-actions{justify-content:flex-start;width:100%}.board-table{grid-template-rows:24px repeat(4,1fr) 24px;grid-template-columns:24px repeat(6,1fr) 24px}.grid-col-header,.grid-col-footer,.grid-row-label-left,.grid-row-label-right{font-size:.75rem}.card-shape-name{display:none}.victory-stats-grid{grid-template-columns:1fr}}.fullscreen-hud{z-index:1000;animation:.4s ease-out fadeInHud;display:none;position:fixed;top:16px;right:16px}@keyframes fadeInHud{0%{opacity:0;transform:translateY(-8px)}to{opacity:.65;transform:translateY(0)}}.btn-hud-exit{-webkit-backdrop-filter:blur(12px);color:var(--text-main);border:1px solid var(--border-focus);font-family:var(--font-sans);cursor:pointer;opacity:.85;transition:all var(--transition-fast);-webkit-user-select:none;user-select:none;background:#fffffff0;border-radius:999px;align-items:center;gap:.5rem;padding:.55rem 1.05rem;font-size:.85rem;font-weight:600;display:inline-flex;box-shadow:0 8px 24px #8510201f,0 0 0 1px #8510201a}.btn-hud-exit:hover{opacity:1;border-color:var(--marsala-primary);color:var(--marsala-dark);background:#fff;transform:translateY(-1px);box-shadow:0 8px 28px #85102040}.btn-hud-exit:active{transform:translateY(0)scale(.97)}.btn.btn-active{background:var(--marsala-tint);border-color:var(--marsala-primary);color:var(--marsala-primary)}body.fullscreen-mode{background-color:var(--bg-primary)!important;justify-content:center!important;align-items:center!important;width:100vw!important;height:100vh!important;min-height:100vh!important;margin:0!important;padding:0!important;display:flex!important;overflow:hidden!important}body.fullscreen-mode .fullscreen-hud{display:block}body.fullscreen-mode .app-container{justify-content:center;align-items:center;gap:0;width:100vw;max-width:100vw;height:100vh;margin:0;padding:0;display:flex}body.fullscreen-mode .app-header,body.fullscreen-mode .board-caption{display:none!important}body.fullscreen-mode .board-section{box-sizing:border-box;justify-content:center;align-items:center;width:100vw;height:100vh;padding:1vh 1vw;display:flex}body.fullscreen-mode .board-frame-wrapper{background:#fff;flex-direction:column;width:min(98vw,176.515vh - 67.7412px);max-width:98vw;max-height:97vh;padding:6px;display:flex;box-shadow:0 20px 60px #8510202e,0 0 0 1px #85102014}body.fullscreen-mode .board-table{width:100%;height:100%}body.fullscreen-mode .grid-col-header,body.fullscreen-mode .grid-col-footer,body.fullscreen-mode .grid-row-label-left,body.fullscreen-mode .grid-row-label-right{font-size:clamp(.95rem,1.8vw,1.35rem)}body.fullscreen-mode .card-shape-name{padding:2px 7px;font-size:clamp(.65rem,1vw,.9rem);display:block!important}body.fullscreen-mode .card-coord-badge{padding:2px 5px;font-size:clamp(.68rem,.85vw,.85rem)}