*{box-sizing:border-box}body{margin:0;background:#f6f3eb;color:#343b32;font-family:system-ui,"Microsoft YaHei",sans-serif}main{max-width:1080px;margin:auto;padding:28px}nav{display:flex;justify-content:space-between;font-size:12px;letter-spacing:2px}a{color:inherit;text-decoration:none}header{margin:48px 0 32px}h1{font-size:clamp(28px,5vw,46px);margin:10px 0 14px;letter-spacing:-1px}header p,footer{color:#818575}.eyebrow{color:#718369;font-size:13px;letter-spacing:3px}.layout{display:grid;grid-template-columns:1.3fr 1fr;gap:36px}.play,aside{background:#fffdf8;border:1px solid #e6e1d6;border-radius:22px;padding:26px}.stats{display:flex;justify-content:space-between;font-size:13px;color:#727968;margin-bottom:24px}.frame{padding:18px;background:linear-gradient(120deg,#deb982,#bb8957);border-radius:12px;box-shadow:0 10px 25px #6a482322,inset 0 1px 2px #fff9}#board{position:relative;display:grid;grid-template-columns:repeat(6,1fr);aspect-ratio:6/4;background:#b99569;box-shadow:inset 0 2px 10px #51351760}.square{border:1px solid #98784e33;background:#e8d5b4}.square.hint{opacity:.6}.piece{position:relative;touch-action:none;cursor:grab;border:0;background:none;padding:0;display:block}.tile{position:absolute;border-radius:4px;background:var(--color);border:2px solid #ffffff40;box-shadow:inset 0 -4px 0 #00000015;pointer-events:none}.piece.selected .tile{outline:2px solid #343b32;outline-offset:-4px}.piece.on-board{position:absolute;z-index:2}.ghost{position:fixed;z-index:10;pointer-events:none;opacity:.85}.aside-heading{display:flex;align-items:center;justify-content:space-between}h2{font-size:19px}.aside-heading span{font-size:12px;color:#818575}#tray{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;min-height:180px;padding:22px 0}.slot{display:flex;justify-content:center;align-items:center;min-height:76px;border-radius:10px;background:#f4f1e9}.tools{display:grid;grid-template-columns:1fr 1fr;gap:10px}button{font:inherit;font-size:13px;padding:12px;border:1px solid #dcded1;border-radius:10px;background:#f5f6ee;color:#45513f;cursor:pointer}button:hover{background:#e5eadc}.instructions{font-size:12px;line-height:1.9;color:#878b7d}#message{text-align:center;font-size:14px;min-height:22px;margin:24px 0 0}footer{text-align:center;font-size:12px;padding:32px} @media(max-width:720px){main{padding:20px}header{margin:32px 0}.layout{grid-template-columns:1fr;gap:18px}.play,aside{padding:20px}#tray{min-height:130px}.frame{padding:12px}nav span{letter-spacing:0}}

/* Larger pieces and a fuller wooden frame. */
main{max-width:1320px}.layout{grid-template-columns:1.5fr 1fr;gap:28px}#board{grid-template-columns:repeat(8,1fr);aspect-ratio:8/5}#tray{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.slot{min-height:132px;padding:12px}.tile{background:linear-gradient(145deg,#ffffff25,transparent 55%),var(--color);border-radius:5px;box-shadow:inset 0 -5px 0 #00000018,inset 0 2px 0 #ffffff40}.piece:hover{background:none}.piece:focus-visible{outline:3px solid #45513f;outline-offset:5px}#confetti{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:100}#confetti i{position:absolute;left:var(--x);top:-24px;width:11px;height:18px;border-radius:2px;animation:confetti-fall var(--duration) var(--delay) ease-in forwards}@keyframes confetti-fall{to{transform:translate(var(--drift),110vh) rotate(900deg)}}@media(max-width:720px){.layout{grid-template-columns:1fr}.slot{min-height:126px}}@media(prefers-reduced-motion:reduce){#confetti i{animation:none;top:25%;transform:rotate(25deg)}}