body[data-variant=freecell]{--board-columns: 8;--board-max-width: min(100vw, 700px);--card-width: clamp(38px, 11vw, 69px);--card-height: calc(var(--card-width) * 1.36);--card-offset: clamp(16px, 2.2vw, 22px);--card-border-radius: 5px;--pile-gap: clamp(2px, .6vw, 8px)}.game-board--freecell{display:grid;grid-template-columns:repeat(var(--board-columns, 8),1fr);grid-template-rows:auto 1fr;gap:var(--pile-gap);max-width:var(--board-max-width);width:100%;margin:0 auto;padding:10px;box-sizing:border-box}.game-board--freecell .pile{position:relative;width:100%;aspect-ratio:69/94}.game-board--freecell .pile--cell{grid-row:1;background:#0003;border:2px dashed rgba(255,255,255,.3);border-radius:var(--card-border-radius);display:flex;align-items:center;justify-content:center;transition:border-color .2s ease,background-color .2s ease}.game-board--freecell .cell-1{grid-column:1}.game-board--freecell .cell-2{grid-column:2}.game-board--freecell .cell-3{grid-column:3}.game-board--freecell .cell-4{grid-column:4}.game-board--freecell .pile--cell.drag-over{border-color:#64c864cc;background:#64c86426}.game-board--freecell .pile--cell .card{position:absolute;inset:-2px;width:calc(100% + 4px);height:calc(100% + 4px);border-radius:var(--card-border-radius);background-color:#fff}.game-board--freecell .pile--cell:after{content:"FREE";font-size:clamp(8px,1vw,11px);font-weight:600;letter-spacing:.1em;color:#ffffff59;text-transform:uppercase;pointer-events:none}.game-board--freecell .pile--cell:has(.card):after{display:none}.game-board--freecell .pile--foundation{grid-row:1;background:#0003;border:2px solid rgba(255,255,255,.25);border-radius:var(--card-border-radius);display:flex;align-items:center;justify-content:center}.game-board--freecell .foundation-hearts{grid-column:5}.game-board--freecell .foundation-diamonds{grid-column:6}.game-board--freecell .foundation-clubs{grid-column:7}.game-board--freecell .foundation-spades{grid-column:8}.game-board--freecell .pile--foundation:before{font-size:clamp(20px,3vw,32px);opacity:.4;z-index:0;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none}.game-board--freecell .foundation-hearts:before{content:"♥";color:#dc2626}.game-board--freecell .foundation-diamonds:before{content:"♦";color:#dc2626}.game-board--freecell .foundation-clubs:before{content:"♣";color:#64748b}.game-board--freecell .foundation-spades:before{content:"♠";color:#64748b}.game-board--freecell .pile--foundation .card{position:absolute;inset:-2px;width:calc(100% + 4px);height:calc(100% + 4px);border-radius:var(--card-border-radius);background-color:#fff;z-index:1}.game-board--freecell .pile--tableau{grid-row:2;position:relative;min-height:calc(var(--card-height) + var(--card-offset) * 12);aspect-ratio:unset}.game-board--freecell .tableau-1{grid-column:1}.game-board--freecell .tableau-2{grid-column:2}.game-board--freecell .tableau-3{grid-column:3}.game-board--freecell .tableau-4{grid-column:4}.game-board--freecell .tableau-5{grid-column:5}.game-board--freecell .tableau-6{grid-column:6}.game-board--freecell .tableau-7{grid-column:7}.game-board--freecell .tableau-8{grid-column:8}.game-board--freecell .pile--tableau .card{position:absolute;left:0;width:var(--card-width);height:var(--card-height);top:calc(var(--card-index, 0) * var(--card-offset));z-index:var(--card-index, 0);border-radius:var(--card-border-radius);box-shadow:0 1px 2px #00000040;cursor:pointer;background-color:#fff;contain:layout style;backface-visibility:hidden}@media (max-width: 768px){body[data-variant=freecell]{--card-width: clamp(36px, 11vw, 55px);--card-offset: clamp(14px, 2vw, 18px);--pile-gap: 2px}.game-board--freecell .pile--cell:after{display:none}.game-board--freecell{padding:4px}}@media (max-width: 480px){body[data-variant=freecell]{--card-width: clamp(32px, 11.5vw, 45px);--card-offset: clamp(12px, 1.8vw, 16px);--pile-gap: 1px}.game-board--freecell{padding:2px}.game-board--freecell .pile--foundation:before{font-size:clamp(14px,4vw,20px)}}.game-board--freecell .card.selected{box-shadow:0 0 0 3px #fbbf24,0 4px 12px #fbbf2466;transform:translateY(-4px);z-index:100!important}.game-board--freecell .pile,.game-board--freecell .pile:focus,.game-board--freecell .pile:focus-visible,.game-board--freecell .pile:focus-within,.game-board--freecell .pile--tableau,.game-board--freecell .pile--tableau:focus,.game-board--freecell .pile--tableau:focus-visible{outline:none!important;border-color:inherit;box-shadow:none}.game-board--freecell .drag-layer{position:absolute;inset:0;pointer-events:none;z-index:10000}.game-board--freecell .drag-layer .card{pointer-events:auto;width:var(--card-width);height:var(--card-height);box-shadow:0 12px 32px #0006}.game-board--freecell .card{cursor:grab;touch-action:none;will-change:transform}.game-board--freecell .card:active{cursor:grabbing}.game-board--freecell .card.hint-from{outline:3px solid #22c55e;outline-offset:2px;animation:hintGlow 1s ease-in-out infinite}@keyframes hintGlow{0%,to{box-shadow:0 0 8px #22c55e66}50%{box-shadow:0 0 16px #22c55ecc}}@keyframes cellPulse{0%,to{box-shadow:0 0 #64c86400}50%{box-shadow:0 0 0 4px #64c8644d}}.pile--cell.hint-pulse,.pile--foundation.hint-pulse{animation:cellPulse 1s ease-in-out infinite}.game-board--freecell .card.hint-to{outline:3px solid #22c55e;outline-offset:2px}.game-area{display:flex;flex-direction:column;align-items:center;width:100%;max-width:var(--board-max-width);margin:0 auto;padding-top:10px}body[data-variant=freecell] .floating-controls{position:sticky;bottom:12px;width:100%;max-width:var(--board-max-width);display:flex;flex-direction:column;align-items:center;gap:32px;padding:10px 8px;margin-top:12px;z-index:50;background:transparent;border:none;border-radius:0;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;pointer-events:none}body[data-variant=freecell] .floating-controls .header-telemetry{margin-bottom:12px;pointer-events:none}body[data-variant=freecell] .floating-controls .global-controls{pointer-events:auto}body[data-variant=freecell] .floating-controls .global-controls{margin-top:0}.page-content{width:100%;max-width:800px;margin:40px auto;padding:0 20px;color:var(--color-text-primary, #f0ebe1)}.page-content__container{background:#00000040;border-radius:12px;padding:30px;border:1px solid rgba(255,255,255,.1)}.page-content__title{font-size:clamp(1.5rem,4vw,2rem);font-weight:600;margin:0 0 16px;color:var(--color-gold, #f8d66d)}.page-content__intro{font-size:1.1rem;line-height:1.7;margin-bottom:24px;opacity:.9}.page-content__section{margin-bottom:24px}.page-content__section h3{font-size:1.25rem;font-weight:600;margin:0 0 12px;color:var(--color-cream, #f0ebe1)}.page-content__section p{line-height:1.7;margin:0 0 12px;opacity:.85}.page-content__section ul{margin:0 0 12px;padding-left:20px}.page-content__section li{line-height:1.7;margin-bottom:8px;opacity:.85}.page-content__section strong{color:var(--color-cream, #f0ebe1)}@media (max-width: 600px){.page-content{padding:0 12px;margin:24px auto}.page-content__container{padding:20px 16px}}