.pack-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px 4px 25px}.pack-heading h1{font:750 clamp(37px,5vw,60px)/1.12 "Songti SC","Noto Serif SC",serif;letter-spacing:-.045em;margin:0}.pack-heading h1 span{color:#6885a5}.pack-heading .eyebrow{margin-bottom:12px}.pack-heading p:not(.eyebrow){max-width:570px;font-size:13px;line-height:1.9;margin:13px 0 0;color:#809078}.pack-emblem{width:106px;height:106px;border-radius:29px;display:grid;place-items:center;font:800 39px Georgia,serif;background:#e2e8ed;color:#68839f;transform:rotate(9deg);box-shadow:0 7px 0 #cbd6dc}.pack-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:20px;align-items:start}.pack-play{padding:24px}.pack-side{display:grid;gap:14px}.pack-side .card{padding:21px;border-radius:21px}.pack-side h2{font-size:18px;margin:0 0 13px}.pack-toolbar{display:flex;gap:9px;align-items:end;margin-bottom:18px;flex-wrap:wrap}.pack-toolbar label{flex:1;min-width:110px}.pack-toolbar input,.pack-toolbar select{min-height:46px;font-size:12px}.pack-toolbar .btn{min-height:46px;flex:0 0 auto}.pack-toolbar .compact{flex:0 1 120px}.pack-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-bottom:19px}.pack-stat{background:#eef2e8;border:1px solid #e0e7d7;border-radius:12px;padding:12px 5px;text-align:center}.pack-stat strong{display:block;font:800 25px ui-monospace,Consolas,monospace;color:#647f53}.pack-stat span{font-size:10px;color:#9aa48a;display:block;margin-top:4px}.pack-board-shell{position:relative;max-width:560px;margin:auto}.pack-board{width:100%;display:grid;gap:9px;padding:13px;border-radius:19px;border:1px solid #c5d3d1;aspect-ratio:1;user-select:none;-webkit-user-select:none;touch-action:none;overflow:hidden;background:#cfdcd8;box-shadow:0 7px 0 #c0ceca;outline:none}.pack-board:focus-visible{outline:3px solid #d5b06a;outline-offset:5px}.number-cell{min-width:0;display:grid;place-items:center;border-radius:11px;background:#e3ece2;color:#627765;font:800 clamp(25px,5vw,49px)/1 ui-rounded,system-ui,sans-serif;transition:background .12s;aspect-ratio:1;box-shadow:inset 0 -3px #829e7b0d}.number-cell[data-value="2"]{background:#f9f5e9;color:#7c8c74}.number-cell[data-value="4"]{background:#f1e7ca;color:#9b8661}.number-cell[data-value="8"]{background:#e8be8a;color:#fff7e4}.number-cell[data-value="16"]{background:#d6a681;color:#fff5e4}.number-cell[data-value="32"]{background:#c9806e;color:#fff3e1}.number-cell[data-value="64"]{background:#ba7065;color:#fff4e0}.number-cell[data-value="128"]{background:#93a778;color:#fffce2;font-size:38px}.number-cell[data-value="256"]{background:#769879;color:#fffde4;font-size:38px}.number-cell[data-value="512"]{background:#64897c;color:#fffde7;font-size:38px}.number-cell.high{background:#67899c;color:#fff9da;font-size:31px}.pack-board[data-size="5"] .number-cell{font-size:30px}.pack-board[data-size="6"] .number-cell{font-size:25px}.pack-board[data-size="5"] .number-cell.high,.pack-board[data-size="6"] .number-cell.high{font-size:22px}.pack-overlay{position:absolute;inset:0;display:grid;place-items:center;background:#f6f2e980;border-radius:19px;pointer-events:none}.pack-overlay span{padding:15px 22px;font-size:13px;line-height:1.8;font-weight:800;background:#fffdf4ef;border:1px solid #e4e9d5;border-radius:13px;color:#7b8b69;text-align:center;box-shadow:0 8px 28px #62714b16}.pack-controls{display:flex;gap:10px;align-items:center;justify-content:space-between;margin-top:20px}.pack-directions{display:grid;grid-template-columns:repeat(3,49px);gap:5px}.pack-directions button{width:49px;height:45px;font-size:18px;border:1px solid #d4dfce;border-radius:9px;background:#edf3e8;color:#708965}.pack-directions button:first-child{grid-column:2}.pack-directions button:nth-child(2){grid-column:1}.pack-controls p{max-width:230px;font-size:11px;line-height:1.9;color:#8c9980;margin:0}.pack-status{margin:15px 0 0;padding:13px 15px;border:1px solid #e1e7d7;border-radius:12px;background:#f0f4e8;color:#7d8d6c;font-size:12px;line-height:1.8}.pack-status.success{background:#e4efd8;color:#65864f}.pack-status.warning{background:#f8eddf;color:#aa825b}.pack-error{font-size:12px;line-height:1.8;color:#b37758;margin:12px 0 0}.pack-error:empty{display:none}.pack-result{padding:16px;background:#e8efd9;border:1px solid #d4dfbc;border-radius:13px;margin-bottom:16px}.pack-result h2{font-size:21px;margin:0 0 7px;color:#6b8654}.pack-result p{font-size:12px;line-height:1.8;color:#879574;margin:0}.pack-result .btn{margin-top:12px;width:100%}.pack-rules{font-size:11px;line-height:1.95;color:#829377;padding-left:16px;margin:0}.pack-rules li{margin:4px 0}.pack-note{font-size:10px;line-height:1.85;color:#a0aa95;margin:13px 0 0}.pack-best{padding:14px;background:#f8f2df;border:1px solid #e8dcba;border-radius:12px;margin:0 0 15px}.pack-best strong{display:block;font:800 26px ui-monospace,Consolas,monospace;color:#a58c53}.pack-best span{display:block;font-size:10px;color:#aa9d7a;margin-top:5px}.pack-rank-tabs{display:flex;gap:5px;margin:0 0 13px}.pack-rank-tabs button{flex:1;min-height:44px;border-radius:9px;border:1px solid #dfe7d8;font-size:11px;font-weight:800;background:#f2f5ed;color:#95a487}.pack-rank-tabs button[aria-pressed="true"]{background:#dfead6;color:#648054;border-color:#bfd2b1}.pack-rank{width:100%;border-collapse:collapse;font-size:11px;table-layout:fixed}.pack-rank th{padding:9px 4px;text-align:left;color:#a4ad98;font-size:9px;border-bottom:1px solid #e3eadb}.pack-rank td{padding:12px 4px;border-bottom:1px solid #edf0e7;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#819272}.pack-rank th:first-child,.pack-rank td:first-child{width:32px;text-align:center}.pack-rank th:last-child,.pack-rank td:last-child{width:64px;text-align:right;font-weight:850}.pack-rank tr.me{background:#eef4e7}.pack-rank-empty{font-size:11px;color:#a5ae98;line-height:1.9;text-align:center;padding:18px 8px;border:1px dashed #dce5d2;border-radius:10px}.rank-head{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-bottom:12px}.rank-head h2{margin:0}.rank-head button{min-height:44px;font-size:10px;padding:0 9px}.soko-board{gap:3px;padding:9px;background:#d6e0d1;border-color:#bdcdb5;border-radius:17px;grid-template-columns:repeat(7,minmax(0,1fr))}.soko-cell{position:relative;aspect-ratio:1;min-width:0;background:#eff0dc;border-radius:4px;display:grid;place-items:center}.soko-cell.wall{background:linear-gradient(150deg,#8fa89b,#799586);box-shadow:inset 0 3px #c1d2b570,inset 0 -4px #5e7d7040}.soko-cell.wall:after{content:"";position:absolute;inset:45% 0 auto;border-top:1px solid #c2d2bb55}.soko-cell.goal:before{content:"";position:absolute;width:38%;height:38%;border:2px dashed #9cbb89;border-radius:50%;background:#dce8c7}.soko-box{position:relative;z-index:1;width:78%;height:78%;display:grid;place-items:center;border:3px solid #b78d60;border-radius:7px;background:linear-gradient(45deg,transparent 44%,#c7a275 45%,#c7a275 54%,transparent 55%),linear-gradient(-45deg,#efd3a0 44%,#c7a275 45%,#c7a275 54%,#efd3a0 55%);box-shadow:0 3px 0 #99734b33}.soko-box.done{border-color:#81a475;background:#c4d9a7;color:#739664;font-size:25px;font-weight:800}.soko-person{position:relative;z-index:2;background:#759bbc;border:3px solid #517c9f;color:#f9f3dd;width:65%;height:65%;border-radius:40% 40% 35% 35%;display:grid;place-items:center;font-size:clamp(15px,4vw,29px);font-weight:800;box-shadow:0 4px 0 #3b61882b}.soko-actions{display:flex;gap:8px}.soko-actions .btn{font-size:11px}.level-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}.level-button{min-height:44px;aspect-ratio:1;border:1px solid #dde7d3;border-radius:9px;background:#f0f5e9;color:#a1af93;font-size:13px;font-weight:800}.level-button.completed{background:#e1edcf;color:#6c8a55}.level-button.selected{border:2px solid #8ca674;color:#688250;background:#fbf8e9}.level-detail{font-size:10px;line-height:1.9;color:#9ca990;margin-top:13px}.picture-board{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:7px;background:#c7d9cb;border-radius:17px}.picture-tile{aspect-ratio:1;min-width:0;border:0;padding:0;border-radius:8px;position:relative;background-repeat:no-repeat;background-size:300% 300%;box-shadow:0 3px 0 #687d6427}.picture-tile span{position:absolute;left:7px;top:7px;width:24px;height:24px;border-radius:7px;display:grid;place-items:center;background:#fff9e1d1;color:#7c8e69;font-size:12px;font-weight:800;pointer-events:none}.picture-tile.empty{background:#dce8d4!important;box-shadow:inset 0 0 0 2px #b9d0ab47;cursor:default}.picture-tile.empty:after{content:"↔";font-size:22px;color:#aac198;position:absolute;inset:0;display:grid;place-items:center}.picture-tile.movable{outline:2px solid #fbf2c573;outline-offset:-3px}.picture-tile:focus-visible{outline:3px solid #dfb66b;outline-offset:-3px}.reference-picture{width:100%;aspect-ratio:1;border-radius:13px;display:block;object-fit:cover;background:#e0e8d4;margin-bottom:11px}.reference-controls{display:flex;gap:8px;flex-wrap:wrap}.reference-controls .btn{flex:1;font-size:11px;padding:0 9px}.pack-local-label{font-size:11px;border:1px solid #d9e1d0;border-radius:25px;padding:9px 13px;color:#8b9b7c;background:#ffffffa8}.pack-progress{font-size:11px;line-height:1.9;color:#8e9e7f;margin:12px 0 0}.pack-rule-head{color:#799365;font-size:11px;font-weight:800;margin-bottom:8px}
@media(max-width:950px){.pack-layout{grid-template-columns:minmax(0,1fr) 265px;gap:15px}.pack-play{padding:19px}.pack-side .card{padding:18px}.pack-board{gap:7px;padding:10px}.pack-controls{gap:10px}.pack-directions{grid-template-columns:repeat(3,44px)}.pack-directions button{width:44px;height:44px}.pack-controls p{font-size:10px;max-width:175px}.number-cell{font-size:38px}.number-cell.high{font-size:26px}.pack-board[data-size="6"] .number-cell{font-size:21px}.pack-board[data-size="6"] .number-cell.high{font-size:16px}}
@media(max-width:680px){.pack-heading{padding:14px 2px 22px;gap:15px}.pack-heading h1{font-size:40px}.pack-heading p:not(.eyebrow){font-size:11px;max-width:270px}.pack-heading .eyebrow{font-size:8px;margin-bottom:9px}.pack-emblem{width:66px;height:66px;border-radius:20px;font-size:25px;margin-right:4px}.pack-local-label{font-size:9px;padding:8px 10px}.pack-layout{grid-template-columns:1fr;gap:14px}.pack-play{padding:15px;border-radius:22px}.pack-toolbar{gap:8px;margin-bottom:15px}.pack-toolbar label{min-width:90px}.pack-toolbar .compact{flex:1;min-width:85px}.pack-toolbar .btn{min-height:46px;flex:1;font-size:11px;padding:0 10px}.pack-toolbar.has-name .btn{flex:1 0 100%}.pack-stats{gap:7px;margin-bottom:15px}.pack-stat{padding:10px 4px;border-radius:10px}.pack-stat strong{font-size:22px}.pack-stat span{font-size:9px}.pack-board{gap:7px;padding:9px;border-radius:14px}.number-cell{font-size:36px;border-radius:8px}.number-cell[data-value="128"],.number-cell[data-value="256"],.number-cell[data-value="512"]{font-size:31px}.number-cell.high{font-size:26px}.pack-board[data-size="5"] .number-cell{font-size:26px}.pack-board[data-size="6"] .number-cell{font-size:21px}.pack-board[data-size="5"] .number-cell.high{font-size:20px}.pack-board[data-size="6"] .number-cell.high{font-size:16px}.pack-board[data-size="6"]{gap:4px;padding:7px}.pack-controls{margin-top:17px}.pack-controls p{font-size:10px;max-width:155px}.pack-status{font-size:11px;padding:12px;margin-top:14px}.pack-side .card{padding:19px;border-radius:20px}.pack-result h2{font-size:19px}.pack-result p{font-size:11px}.soko-board{gap:2px;padding:6px}.soko-cell{border-radius:3px}.soko-box{border-width:2px;border-radius:5px}.soko-person{border-width:2px;font-size:20px}.soko-box.done{font-size:20px}.level-grid{grid-template-columns:repeat(5,1fr);gap:8px}.level-button{aspect-ratio:auto;min-height:48px}.picture-board{gap:3px;padding:6px}.picture-tile{border-radius:5px}.picture-tile span{width:21px;height:21px;font-size:10px;left:5px;top:5px}.reference-picture{max-width:270px;margin-inline:auto}.pack-rank td{padding:12px 5px}}
@media(max-width:350px){.pack-controls{align-items:start}.pack-controls p{max-width:113px;font-size:9px}.pack-directions{grid-template-columns:repeat(3,44px);gap:4px}.pack-board[data-size="6"] .number-cell{font-size:18px}.pack-board[data-size="6"] .number-cell.high{font-size:13px}.number-cell.high{font-size:22px}.pack-heading h1{font-size:36px}}
.pack-confirm-dialog{width:min(420px,calc(100vw - 32px));max-height:calc(100dvh - 48px);padding:0;border:1px solid #d5dfc9;border-radius:21px;background:#fffdf3;color:#5a7053;box-shadow:0 24px 80px #35492f45}.pack-confirm-dialog::backdrop{background:#35492f70;backdrop-filter:blur(3px)}.pack-confirm-dialog form{padding:25px}.pack-confirm-dialog h2{font-size:23px;margin:0 0 13px;color:#607e55}.pack-confirm-dialog p{font-size:13px;line-height:1.9;color:#7b8d70;margin:0 0 23px;overflow-wrap:anywhere}.pack-confirm-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}.pack-confirm-actions .btn{min-height:46px}