.pz-setup,.pz-room,.pz-play{max-width:1280px;margin:auto;color:#324238}.pz-setup{text-align:center;padding:24px}.pz-intro>span{font-size:46px}.pz-intro h2{margin:12px 0}.pz-setup label{max-width:260px;margin:20px auto}.pz-join{max-width:430px;margin:70px auto;padding:30px;border:1px solid #d9dfcc;border-radius:22px;background:#fffef9}.pz-join img{width:42px}.pz-join h1{font-size:26px;margin:18px 0}.pz-join label{display:grid;gap:10px;margin:24px 0}.pz-join input,.pz-room input{width:100%;padding:12px;border:1px solid #d3dbc9;background:white;border-radius:10px;font:inherit}.pz-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:16px 22px;background:#eaf1e2;border-radius:16px}.pz-top h1{font-size:25px;margin:0}.pz-top small{color:#6c7e6d}.pz-teacher-grid{display:grid;grid-template-columns:minmax(300px,.9fr) minmax(360px,1.3fr);gap:24px;margin-top:24px}.pz-room .tt-panel{padding:24px}.pz-code{display:block;font-size:42px;letter-spacing:8px;color:#405b43;margin:14px 0}.pz-link{font-size:13px!important}.pz-room canvas{display:block;margin:16px auto;background:white;border-radius:12px}.pz-rank{padding:0;list-style:none}.pz-rank li{display:flex;align-items:center;gap:14px;padding:15px 10px;border-bottom:1px solid #e5e9dc}.pz-rank li>b{background:#ffe196;padding:4px 12px;border-radius:9px}.pz-rank li>span{flex:1;overflow-wrap:anywhere}.pz-rank small{color:#77866e}.pz-rank strong{white-space:nowrap}.pz-room label{display:grid;gap:8px;margin-bottom:14px}.pz-room .primary,.pz-room .secondary{margin:5px}.pz-ended{text-align:center;padding:40px 24px;max-width:700px}.pz-ended>span{font-size:60px}.pz-word{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:20px;min-height:100px;margin:20px 0}.pz-word h2{font-size:36px;margin:0}.pz-word>strong{font-size:30px}.pz-word small{font-size:18px;color:#75836e}.pz-board{padding:24px;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:24px;border:1px solid #d6dece;border-radius:22px;background:#f0f4e9;min-height:280px}.pz-char{position:relative;flex:0 0 224px;width:224px;height:224px;border:2px solid #9cad91;border-radius:12px;background:#fffef8;overflow:hidden}.pz-slot{position:absolute!important;padding:0!important;margin:0!important;border:1px dashed #bbc9af!important;border-radius:0!important;box-shadow:none!important;min-height:0!important;min-width:0!important;background:transparent!important;transition:background .18s}.pz-slot:hover{background:#ffe59d66!important}.pz-slot:focus-visible{outline:3px solid #b78929;outline-offset:-4px}.pz-slot.is-filled{border-color:#d3dfc8!important;pointer-events:none}.pz-slot svg{display:block;width:100%;height:100%}.pz-colored{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}.pz-tray{display:flex;flex-wrap:wrap;justify-content:center;gap:15px;padding:25px 12px;border:1px dashed #c8d3bd;border-radius:18px;margin:20px 0}.pz-piece{padding:5px!important;width:96px;height:96px;min-height:0!important;min-width:0!important;flex:0 0 96px;background:#fffdf6!important;border:2px solid #75876c!important;border-radius:12px!important;box-shadow:0 3px 0 #d1d8c7!important;touch-action:none;user-select:none;cursor:grab}.pz-piece svg{width:100%;height:100%;display:block;pointer-events:none}.pz-piece.is-used{opacity:.18;filter:grayscale(1);box-shadow:none!important;cursor:default}.pz-piece.is-selected{outline:4px solid #efbb43;outline-offset:3px}.pz-piece.is-dragging{opacity:.6;pointer-events:none;transform:scale(1.07)}.pz-piece.is-hint,.pz-slot.is-hint{border:3px solid #dd715e!important;animation:pz-hint 1.1s ease-in-out infinite}.pz-controls{justify-content:center}.pz-play #pz-status{text-align:center;min-height:24px;color:#738466;margin:16px 0}.pz-complete{font-size:22px;font-weight:700;color:#507b4f;animation:pz-done .4s ease-out}.pz-play>[id=pz-clock]{font-variant-numeric:tabular-nums}.pz-play .tt-note{text-align:center}@keyframes pz-hint{50%{box-shadow:0 0 0 5px #e8887133}}@keyframes pz-done{from{transform:translateY(12px);opacity:0}to{transform:translateY(0);opacity:1}}@media(max-width:700px){.pz-teacher-grid{grid-template-columns:1fr}.pz-top{padding:12px;gap:8px}.pz-top h1{font-size:22px}.pz-board{padding:15px;gap:15px}.pz-char{flex-basis:min(224px,calc(100vw - 100px));width:min(224px,calc(100vw - 100px));height:min(224px,calc(100vw - 100px))}.pz-piece{flex-basis:76px;width:76px;height:76px}.pz-tray{gap:10px;padding:16px 8px}.pz-word h2{font-size:30px}.pz-word{gap:12px}.pz-join{margin:40px 16px}.pz-room .tt-panel{padding:16px}.pz-rank small{display:none}}@media(prefers-reduced-motion:reduce){.pz-piece,.pz-slot,.pz-complete{animation:none!important;transition:none!important}}

.pz-drag-ghost{position:fixed;z-index:10000;pointer-events:none!important;padding:5px;border:2px solid #738666;border-radius:12px;background:#fffdf6;box-shadow:0 12px 25px #35433633;transform:rotate(-4deg) scale(1.06)}.pz-drag-ghost svg{width:100%;height:100%}.pz-waiting .pz-board,.pz-waiting .pz-tray{pointer-events:none;opacity:.5}@media(prefers-reduced-motion:reduce){.pz-drag-ghost{transform:none}}


@media(max-width:700px){.pz-board{gap:12px}.pz-char{flex-basis:min(224px,calc((100vw - 116px)/2));width:min(224px,calc((100vw - 116px)/2));height:min(224px,calc((100vw - 116px)/2))}}