:root{font-family:'Arial Rounded MT Bold','PingFang TC','Microsoft JhengHei',sans-serif;color:#62455c;background:#faf7fd}*{box-sizing:border-box}body{margin:0;background-image:radial-gradient(#ded3e9 1px,transparent 1px);background-size:24px 24px}button,a{font:inherit;color:inherit}button{cursor:pointer;touch-action:manipulation}button:focus-visible,a:focus-visible{outline:3px solid #8f57ac;outline-offset:3px}main{max-width:1240px;margin:auto;padding:0 28px}header{height:76px;border-bottom:1px solid #e4dbe9;display:flex;align-items:center;justify-content:space-between}.back{text-decoration:none;font-size:14px;color:#8a7183}.brand{font-size:12px;letter-spacing:2px;text-decoration:none}.brand b{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#925ca8;color:white;margin-right:8px}.round{width:40px;height:40px;border:1px solid #dfd3e7;background:#fff;border-radius:50%;color:#885c9f;font-weight:bold}.title{text-align:center;padding:28px 0 25px}.title p,.label{font-size:10px;letter-spacing:2px;color:#9c7ca8;font-weight:800}.title h1{font-size:34px;margin:9px 0}.title div{font-size:14px;color:#8a7183}.layout{display:grid;grid-template-columns:250px minmax(400px,650px) 230px;gap:20px;align-items:start;justify-content:center}.panel,.game-shell{background:#fff;border:1px solid #e2d8e8;border-radius:24px;box-shadow:0 6px 0 #eae1ef}.panel{padding:23px}.panel h2{font-size:17px;margin:8px 0 14px}.segmented{display:grid;grid-template-columns:1fr 1fr;background:#f4eef7;border-radius:12px;padding:4px}.segmented button{font-size:13px;padding:9px 4px;border:0;background:transparent;border-radius:9px;color:#8a718e}.segmented .selected{background:white;color:#70447f;box-shadow:0 2px 6px #51325f15}.fruit-label{display:block;margin-top:25px}.fruit-picker{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}.fruit-picker button{height:40px;border:1px solid #eadfed;background:#fbf8fc;border-radius:10px;font-size:21px}.fruit-picker .selected{background:#efe2f6;border-color:#a36cba;transform:translateY(-2px);box-shadow:0 3px 0 #c9afd5}.primary{margin-top:28px;width:100%;border:0;border-radius:30px;background:#85509b;color:white;padding:13px 12px;font-weight:700;box-shadow:0 4px 0 #633a76}.primary span{float:right}.hint{font-size:11px!important;text-align:center!important;color:#a08b9d!important;margin:15px 0 0!important}.game-shell{padding:15px}.game-top{display:flex;align-items:center;justify-content:space-between;padding:0 5px 13px}.game-top>div{display:flex;gap:8px;align-items:center}.piece{font-size:25px}.game-top small{display:block;font-size:10px;color:#9b8497}.game-top strong{font-size:14px}#restart{border:0;background:#f4eef7;color:#79538a;padding:8px 12px;border-radius:20px;font-size:12px}.board-box{position:relative;aspect-ratio:1;border:2px solid #d2bd9c;border-radius:14px;overflow:hidden;background:#f5dfb9}canvas{display:block;width:100%;height:100%;touch-action:manipulation}.result{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);width:min(88%,390px);background:#fffaf3f2;border:2px solid #ead8e2;border-radius:20px;box-shadow:0 8px 24px #674f5f33;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;text-align:left;padding:13px 15px}.result[hidden]{display:none}.result>span{font-size:38px;grid-row:1/3}.result h2{font-size:19px;margin:0}.result p{font-size:11px;color:#8b7182;margin:2px 0;grid-column:2}.result button{border:0;border-radius:30px;background:#8b559f;color:#fff;padding:10px 16px;grid-column:3;grid-row:1/3;white-space:nowrap}.game-note{text-align:center;padding:13px 5px 0;font-size:12px;color:#8d7485}.rules>div{display:flex;gap:10px;margin:20px 0}.rules b{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#f0e5f5;color:#84569a;flex-shrink:0}.rules p{margin:0;font-size:12px;line-height:1.6;color:#8e7687}.rules p strong{display:block;color:#62455c;font-size:13px}.rules>small{font-size:10px;line-height:1.6;color:#a58c9e}footer{text-align:center;font-size:10px;letter-spacing:2px;color:#aa91a4;padding:30px 0}footer span{font-size:16px;margin-left:10px}@media(max-width:950px){.layout{grid-template-columns:minmax(300px,650px) 230px}.setup{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:10px 24px}.setup .fruit-label,.setup .primary{margin-top:8px}.setup .hint{display:none}#opponent-pick{grid-column:1/-1}.primary{align-self:end}.fruit-picker{max-width:270px}.rules{grid-column:2;grid-row:2}.game-shell{grid-column:1;grid-row:2}}@media(max-width:700px){main{padding:0 12px}header{height:63px}.brand{display:none}.title{padding:22px 0 17px}.title h1{font-size:27px}.layout{display:flex;flex-direction:column}.setup,.rules,.game-shell{width:100%}.setup{display:block;order:1}.game-shell{order:0;padding:9px}.rules{order:2}.fruit-label{margin-top:20px}.game-top{padding:0 3px 9px}.board-box{border-radius:10px}}
/* Keep the complete final board visible, including the bottom row. */
.board-box{aspect-ratio:auto;overflow:visible}.board-box canvas{aspect-ratio:1;height:auto;border-radius:12px}.result{position:static;transform:none;width:100%;margin:12px 0 0;box-shadow:none}.result p{font-size:14px}

@media(max-width:700px){main{padding:0 4px}.game-shell{padding:3px;border-radius:12px}.board-box{border-width:1px}.game-top{padding:6px}.fruit-picker button{height:48px;font-size:30px}.game-note{font-size:14px}}

.board-size-label{display:flex;align-items:center;gap:6px;font-size:14px}.board-size-label select{font:inherit;padding:8px;border:1px solid #c9afd5;border-radius:10px;background:#fffafc;color:#62455c}.game-top{flex-wrap:wrap;gap:8px}