.packing-game{--pack-ink:#243a48;--pack-blue:#5278c9;--pack-paper:#fff9ed;color:var(--pack-ink);max-width:1120px;margin:auto;font-size:15px}.packing-game button{font:inherit;color:inherit;cursor:pointer;background:#fffaf0;border:1.5px solid #243a4830;border-radius:10px;justify-content:center;align-items:center;gap:7px;min-height:42px;padding:8px 12px;transition:background .12s,transform .12s,border-color .12s;display:inline-flex}.packing-game button:hover:not(:disabled){border-color:var(--pack-blue);background:#e5ebfa}.packing-game button:focus-visible{outline-offset:3px;outline:3px solid #5278c9}.packing-board:focus-visible{outline-offset:3px;outline:3px solid #5278c9}.packing-game button:active:not(:disabled){transform:translateY(1px)}.packing-game button:disabled{opacity:.42;cursor:default}.packing-toolbar{justify-content:space-between;align-items:center;gap:12px;margin:0 0 16px;font-size:13px;display:flex}.packing-toolbar>span{letter-spacing:.02em;font-weight:700}.packing-toolbar>div{gap:6px;display:flex}.packing-toolbar button{min-height:36px;padding:6px 10px;font-size:12px}.packing-toolbar .packing-sound{width:38px;padding:5px}.packing-layout{grid-template-columns:minmax(0,1.35fr) minmax(285px,.85fr);align-items:start;gap:20px;display:grid}.packing-case{background:var(--pack-paper);border:1.5px solid #243a4828;border-radius:21px;padding:18px;box-shadow:0 5px #243a480b}.packing-case-heading{justify-content:space-between;align-items:center;gap:12px;margin:0 0 12px;display:flex}.packing-case-heading>div>span{letter-spacing:.1em;text-transform:uppercase;color:#8a5140;font-size:11px;font-weight:800}.packing-case h2{letter-spacing:-.03em;margin:5px 0 0;font-size:clamp(20px,2.2vw,28px);font-weight:800;line-height:1.1}.packing-count{text-align:center;background:#e7ebf4;border-radius:12px;min-width:58px;padding:7px 10px}.packing-count strong{font-size:26px;line-height:1;display:block}.packing-count small{color:#61717d;font-size:15px}.packing-count>span{letter-spacing:.06em;text-transform:uppercase;font-size:10px}.packing-board{aspect-ratio:376/320;touch-action:none;isolation:isolate;-webkit-user-select:none;user-select:none;border-radius:24px;width:100%;max-width:min(100%,117.5dvh - 399.5px);margin:auto;position:relative}.packing-board>svg{width:100%;height:100%;display:block;overflow:visible}.packing-board .packing-cell{opacity:1;min-height:0;box-shadow:none;touch-action:none;border:0;border-radius:4px;padding:0;position:absolute;background:0 0!important}.packing-board .packing-cell:disabled{opacity:1}.packing-board .packing-cell:hover:not(:disabled){outline-offset:-2px;outline:2px solid #5278c950}.packing-board .packing-cell:active:not(:disabled){transform:none}.packing-preview{pointer-events:none}.packing-notice{text-align:center;color:#4c5f6a;min-height:36px;margin:12px 2px 8px;font-size:13px;line-height:1.4}.packing-controls{flex-wrap:wrap;justify-content:center;gap:7px;display:flex}.packing-controls button{min-height:40px;padding:8px 11px;font-size:12px}.packing-game .packing-primary{background:var(--pack-blue);color:#fff;border-color:#4263a6;box-shadow:0 2px #314e8b}.packing-game .packing-primary:hover:not(:disabled){color:#fff;background:#4267b7}.packing-controls kbd{opacity:.6;border:1px solid #243a4820;border-radius:3px;padding:1px 4px;font:10px inherit}.packing-history{border-top:1px solid #243a4815;justify-content:space-between;align-items:center;gap:8px;margin-top:12px;padding-top:9px;font-size:12px;display:flex}.packing-history>div{gap:5px;display:flex}.packing-history button{background:0 0;border:0;min-height:32px;padding:5px 7px;font-size:12px}.packing-side{gap:14px;display:grid}.packing-tray{background:#e9e5da;border:1.5px solid #243a4828;border-radius:20px;padding:15px}.packing-tray-heading{justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px;display:flex}.packing-tray-heading h3{letter-spacing:-.02em;margin:0;font-size:17px}.packing-tray-heading>span{color:#647078;font-size:11px}.packing-items{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.packing-items .packing-item-card{touch-action:none;-webkit-user-select:none;user-select:none;background:#fffaf0;border:2px solid #0000;flex-direction:column;gap:0;min-width:0;padding:4px 3px 8px;display:flex;box-shadow:0 2px #243a480d}.packing-item-card>svg{pointer-events:none;width:100%;height:100px;overflow:visible}.packing-item-card>span{align-items:center;gap:3px;max-width:100%;font-size:11px;font-weight:700;display:flex}.packing-item-card>span>svg{width:14px;height:14px}.packing-items .packing-item-card.inside{background:#e0e4df}.packing-items .packing-item-card.inside>svg{opacity:.5}.packing-items .packing-item-card.selected{background:#e7edff;border-color:#5278c9;box-shadow:0 0 0 2px #5278c925}.packing-help{background:#fff4;border:1px solid #243a4828;border-radius:13px;padding:13px 15px;font-size:12px;line-height:1.55}.packing-help summary{cursor:pointer;font-size:13px;font-weight:700}.packing-help p{margin:10px 0 0}.packing-limit{background:#f6e3cb;border-left:3px solid #b6513f;padding:12px;font-size:12px;line-height:1.5}.packing-result{border-top:1px solid #243a4818;flex-wrap:wrap;align-items:center;gap:12px;margin-top:9px;padding-top:16px;display:flex}.packing-result>svg{color:#527b59}.packing-result>div:not(.packing-share){flex:1}.packing-result h3{margin:0;font-size:20px}.packing-result p{margin:4px 0 0;font-size:12px}.packing-result>button{font-size:12px}.packing-share{flex-wrap:wrap;gap:8px;width:100%;display:flex}.packing-share button{min-height:37px;font-size:12px}.packing-zipper{animation:.8s ease-out packing-close}.packing-case.is-packed{border-color:#63896970}.club-game:has(.packing-game) .club-game-top{margin-bottom:16px}@keyframes packing-close{0%{stroke-dasharray:0 1500}to{stroke-dasharray:3 3}}@media (min-width:1050px){.packing-tray{padding:18px}.packing-item-card>svg{height:110px}}@media (max-width:700px){.packing-layout{grid-template-columns:1fr;gap:13px}.packing-toolbar{flex-wrap:wrap;gap:8px;margin-bottom:10px}.packing-toolbar>span{font-size:11px}.packing-toolbar>div{gap:5px}.packing-toolbar button{min-height:34px;padding:5px 8px;font-size:11px}.packing-toolbar .packing-sound{width:34px}.packing-case{border-radius:17px;padding:12px}.packing-case-heading{margin-bottom:9px}.packing-case h2{font-size:22px}.packing-case-heading>div>span{font-size:10px}.packing-count{min-width:49px;padding:6px 8px}.packing-count strong{font-size:23px}.packing-board{max-width:420px}.packing-notice{min-height:34px;margin:8px 0;font-size:12px}.packing-controls{gap:5px}.packing-controls button{min-height:42px;padding:8px;font-size:11px}.packing-controls kbd{display:none}.packing-history{margin-top:9px;padding-top:6px;font-size:11px}.packing-history button{font-size:11px}.packing-tray{border-radius:16px;padding:12px}.packing-item-card>svg{height:87px}.packing-items{gap:7px}.packing-items .packing-item-card{min-height:109px}.packing-tray-heading{margin-bottom:8px}.packing-tray-heading h3{font-size:16px}.packing-tray-heading>span{font-size:10px}.packing-result{gap:10px}.packing-result h3{font-size:18px}.packing-game{font-size:14px}}@media (prefers-reduced-motion:reduce){.packing-game *{transition:none!important;animation:none!important}}.packing-nudge{border-top:1px solid #243a4815;justify-content:space-between;align-items:center;gap:8px;margin-top:8px;padding-top:8px;display:flex}.packing-nudge button{min-height:36px;padding:6px 9px;font-size:12px}.packing-nudge>span{color:#67747b;text-align:right;font-size:10px}.packing-dead-end{background:#f3dfce;border-left:3px solid #b6513f;border-radius:5px;margin:7px 0 10px;padding:9px 11px;font-size:12px;line-height:1.45}@media (max-width:700px){.packing-nudge{gap:5px}.packing-nudge button{font-size:11px}.packing-nudge>span{max-width:125px;font-size:9px}}.packing-mobile-tip{display:none}.packing-help{background:0 0;border:0;border-radius:0;padding:4px 0}.packing-case h2{letter-spacing:-.015em}@media (max-width:700px){.club-game:has(.packing-game):not(:-webkit-full-screen){overflow:visible}.club-game:has(.packing-game):not(:fullscreen){overflow:visible}.packing-layout{overflow:visible}.packing-tray{align-self:start}.packing-case{scroll-margin-top:230px}.packing-layout{grid-template-columns:minmax(0,1fr);gap:10px}.packing-side{display:contents}.packing-tray{z-index:8;background:#eee9de;border-radius:13px;grid-row:1;min-width:0;padding:8px 9px 5px;position:sticky;top:6px;box-shadow:0 4px 14px #243a481c}.packing-case{grid-row:2;min-width:0}.packing-tray-heading{margin-bottom:3px}.packing-tray-heading h3{font-size:13px}.packing-tray-heading>span:not(.packing-mobile-tip){display:none}.packing-tray-heading>.packing-mobile-tip{font-size:11px;display:inline}.packing-items{scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#8299b2 transparent;touch-action:pan-x;gap:7px;padding:2px 2px 7px;display:flex;overflow-x:auto}.packing-items .packing-item-card{scroll-snap-align:start;touch-action:pan-x;flex:0 0 80px;min-height:85px;padding:2px 3px 6px}.packing-item-card>svg{height:61px}.packing-item-card>span{letter-spacing:-.02em;font-size:11px;line-height:14px}.packing-item-card>span>svg{flex-shrink:0;width:12px;height:12px}.packing-board{scroll-margin-top:125px}}.packing-comparison{width:100%;max-width:880px;margin:0 auto}.packing-comparison>.daily-board{margin-top:28px}.packing-clock-row{justify-content:space-between;align-items:center;gap:10px;margin:0 0 10px;display:flex}.packing-clock-row>span{color:#69797b;text-align:right;font-size:10px}.packing-direction{color:#566c71;flex-wrap:wrap;align-items:center;gap:7px;margin:0 0 13px;font-size:12px;line-height:1.5;display:flex}.packing-direction>svg{color:#a57724}.packing-direction>b{color:#334a54}.packing-direction>span{margin-left:auto;font-size:11px}.packing-tray{touch-action:pan-y;transition:background .12s,border-color .12s}.packing-tray.is-drop-zone{background:#dcebd7;border:2px dashed #58845d;box-shadow:0 0 0 4px #58845d22}.packing-items .packing-item-card{touch-action:none}.packing-items .packing-item-card.can-turn{background:#fff4d5;border-color:#d3aa56}.packing-items .packing-item-card.can-turn.selected{background:#e7edff;border-color:#5278c9}.packing-turn-badge{letter-spacing:0;color:#77837b;justify-content:center;align-items:center;gap:4px;min-height:13px;margin-top:4px;font-size:9px;font-weight:650;display:flex}.can-turn .packing-turn-badge{color:#8d6020}.packing-turn-badge svg{width:12px!important;height:12px!important}.packing-item-card>svg{height:98px}.packing-help a{color:#365c8e;text-underline-offset:3px;text-decoration:underline}.packing-drag-ghost{z-index:100;pointer-events:none;filter:drop-shadow(0 5px 8px #243a4835);flex-direction:column;justify-content:flex-end;align-items:center;width:112px;height:130px;display:flex;position:fixed;transform:translate(-50%,-65%)}.packing-drag-ghost>svg{opacity:.9;width:105px;height:100px;display:block;overflow:visible}.packing-drag-ghost>span{white-space:nowrap;color:#fff8e8;background:#243a48;border-radius:5px;padding:5px 8px;font:650 10px Arial,sans-serif;box-shadow:0 2px 5px #243a4820}.packing-drag-ghost.returning>span{background:#446e47}.packing-controls button{min-height:44px}.packing-tray-heading>span{font-size:11px}.packing-limit>button{min-height:36px;margin-left:8px;padding:4px 8px;font-size:11px}@media (max-width:700px){.packing-direction{gap:5px;margin-bottom:9px;font-size:11px}.packing-direction>span{width:100%;margin-left:21px;font-size:10px}.packing-tray{padding:8px 9px;top:5px}.packing-tray-heading{margin-bottom:5px}.packing-tray-heading>.packing-mobile-tip{font-size:10px}.packing-items{touch-action:auto;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;padding:0;display:grid;overflow:visible}.packing-items .packing-item-card{touch-action:none;border-radius:7px;min-height:83px;padding:3px 2px 4px}.packing-item-card>svg{height:48px}.packing-item-card>span{font-size:10px;line-height:13px}.packing-turn-badge{gap:3px;min-height:10px;margin-top:2px;font-size:8px;line-height:10px}.packing-turn-badge svg{width:10px!important;height:10px!important}.packing-board{scroll-margin-top:215px}.packing-drag-ghost{width:95px;height:110px}.packing-drag-ghost>svg{width:86px;height:85px}.packing-drag-ghost>span{font-size:9px}.packing-controls button{min-height:44px}.packing-toolbar button{min-height:40px}}
