@font-face{font-family:'Noonnu Basic Gothic';src:url('NoonnuBasicGothicRegular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
.difficulty-grid{position:absolute;left:50%;top:50%;translate:-50% -50%;width:86%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3%}.difficulty-sign{width:100%;aspect-ratio:1997 / 2361;background:transparent url('difficulty-signs.png?v=8b26b61179ae197378fb4980fc1b1f817a95b1d039675390ca4089435f60d7ba') no-repeat;background-size:300% 100%;transition:transform .2s,filter .2s;border-radius:12%}.difficulty-sign:hover,.difficulty-sign:focus-visible{transform:translateY(-2%) scale(1.04);filter:brightness(1.08) drop-shadow(0 9px 12px #3d200d70)}.difficulty-sign.selected{filter:drop-shadow(0 0 8px #fff2a655)}
.shop-search{position:absolute;top:14%;left:25%;width:50%;height:7%;display:flex;align-items:center;padding:0 1.4%;background:#fff8e9f7;border:2px solid #754620;border-radius:14px;box-shadow:0 4px 12px #3a241a50;color:#8e633b;font-size:1.7cqw}.shop-search input{flex:1;min-width:0;height:90%;padding:0 3%;font-size:1.25cqw;color:#63401f;border:0;outline:none;background:transparent}.shop-search button{background:transparent;color:#8b623d;font-size:1.8cqw}
.category-grid{position:absolute;top:25%;left:9%;right:9%;height:61%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(var(--category-rows,1),minmax(0,1fr));gap:1.2cqw 2cqw;align-content:center}.category-sign{position:relative;container-type:size;min-width:0;width:100%;height:100%;display:grid;place-items:center;padding:0;background:none;transition:transform .2s,filter .2s}.category-art{position:relative;isolation:isolate;display:block;width:100%;width:min(100cqw,150cqh);aspect-ratio:3/2}.category-art>img{position:absolute;z-index:0;inset:0;display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}.category-name{position:absolute;z-index:1;left:15%;width:70%;top:45%;height:35%;display:grid;place-items:center;color:#643519;font-family:'Noonnu Basic Gothic',sans-serif;font-weight:400;font-synthesis:none;font-size:clamp(12px,9cqw,36px);line-height:1.25;text-align:center;overflow:hidden;pointer-events:none}.category-name>span{max-width:100%;max-height:100%;overflow:hidden;overflow-wrap:anywhere;word-break:keep-all;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.category-sign:hover,.category-sign:focus-visible{transform:scale(1.04);filter:brightness(1.08) drop-shadow(0 5px 8px #4c2b1c80)}.category-sign.selected{filter:drop-shadow(0 0 7px #fff2b1)}.category-empty{grid-column:1/-1;align-self:center;text-align:center;background:#fff8e9ee;color:#765333;border-radius:16px;padding:5%;font-size:1.6cqw}.shop-pagination{position:absolute;bottom:3%;left:38%;width:24%;display:flex;justify-content:center;align-items:center;gap:15%;padding:.5%;border-radius:25px;background:#fff4dded;box-shadow:0 3px 12px #38271a44;font-size:1.1cqw}.shop-pagination button{padding:0;background:transparent;color:#70431e;font-size:2cqw;line-height:1}.shop-pagination button:disabled{opacity:.3}
.shop-card-screen{position:absolute;inset:0;background:radial-gradient(ellipse,#fff9e7,#f4e8d1)}.shop-card-screen .heading{background:transparent;border:0;box-shadow:none;color:#795536;top:2%}.shop-card-screen .heading small{color:#9b806a}#flash-level.shop-card-screen #vocab-grid{position:absolute;inset:0;pointer-events:none}#flash-level.shop-card-screen .vocab-card{position:absolute;left:50%;top:50%;translate:-50% -50%;width:74%;height:auto;aspect-ratio:2/1;container-type:inline-size;padding:0;border:0;background:transparent;box-shadow:none;cursor:pointer;pointer-events:auto;font-family:'Noonnu Basic Gothic',sans-serif;font-synthesis:none;color:#603514}#flash-level .vocab-inner,#flash-level .vocab-face{position:absolute;inset:0;display:block}#flash-level .vocab-face[hidden]{display:none!important}#flash-level .vocab-card-frame{position:absolute;inset:0;z-index:0;display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none}#flash-level .wood-front-word{position:absolute;inset:28% 14% 23%;display:grid;place-items:center;font-family:'Noonnu Basic Gothic',sans-serif;font-weight:400;font-synthesis:none;font-size:clamp(18px,8cqw,90px);line-height:1.25;text-align:center;overflow:hidden;overflow-wrap:anywhere;word-break:keep-all}#flash-level .wood-back-content{position:absolute;inset:29% 16% 18%;display:block;overflow:hidden;z-index:1}#flash-level .wood-picture-area{position:absolute;left:0;right:0;top:25%;height:45%;display:block;overflow:hidden}#flash-level .wood-picture{display:block;width:100%;height:100%;min-height:0;object-fit:contain;object-position:center}#flash-level .wood-meaning{position:absolute;left:0;right:0;bottom:0;height:26%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.15em;max-width:100%;color:#603514;font-size:clamp(12px,2.9cqw,30px);line-height:1.25;text-align:center;overflow-wrap:anywhere}#flash-level .wood-meaning>[lang='ja']{font-size:.8em}#flash-level .vocab-card:focus-visible{outline:3px solid #c89142;outline-offset:6px;border-radius:8%}
.shop-card-controls .card-prev,.shop-card-controls .card-next{position:absolute;top:50%;translate:0 -50%;width:6.5%;height:13%;display:grid;place-items:center;padding:0;border:2px solid #cda568;border-radius:18px;background:#fff1d7;color:#75471e;font-size:3cqw;line-height:1;box-shadow:0 4px 0 #cdb28a}.card-prev{left:3%}.card-next{right:3%}.shop-card-controls .card-prev span,.shop-card-controls .card-next span{font-family:'Noonnu Basic Gothic',sans-serif;font-size:.95cqw;line-height:1}.shop-card-controls button:hover:not(:disabled){filter:brightness(1.06)}.shop-card-controls button:disabled{opacity:.35}.card-counter{position:absolute;left:42%;width:16%;bottom:12%;text-align:center;color:#9a744c;font-size:1.1cqw}.shop-card-controls .speak-button{position:absolute;left:42%;bottom:5.5%;width:16%;height:6%;white-space:nowrap;color:#75471e;background:#fff1d7;border:2px solid #cda568;border-radius:15px;box-shadow:0 3px 0 #dac3a0;font-family:'Noonnu Basic Gothic',sans-serif;font-size:1.2cqw}.shop-speech-status{position:absolute;bottom:1%;left:22%;right:22%;margin:0;text-align:center;font-size:.95cqw;color:#9c7a69}
@media(max-width:700px) and (orientation:portrait){.stage:has(.shop-search,.difficulty-grid){aspect-ratio:4/5}.stage:has(.shop-card-screen){aspect-ratio:4/3}.difficulty-grid{width:96%;gap:0}.shop-search{left:12%;width:76%;top:13%;height:6%;font-size:4cqw}.shop-search input{font-size:3cqw}.shop-search button{font-size:4cqw}.category-grid{left:3%;right:3%;top:23%;height:64%;gap:2cqw}.category-name{font-size:clamp(10px,12cqw,20px)}.category-empty{font-size:3.3cqw}.shop-pagination{font-size:3cqw}.shop-pagination button{font-size:5cqw}.stage:has(.shop-search,.difficulty-grid,.shop-card-screen) .heading{font-size:4cqw;left:15%;right:15%}.stage:has(.shop-search,.difficulty-grid,.shop-card-screen) .heading small{font-size:2.2cqw}.stage:has(.shop-search,.difficulty-grid,.shop-card-screen) .back{width:24%}#flash-level.shop-card-screen .vocab-card{width:80%}.shop-card-controls .card-prev,.shop-card-controls .card-next{width:8%;height:14%;font-size:5cqw;border-radius:10px}.card-prev{left:1%}.card-next{right:1%}.shop-card-controls .card-prev span,.shop-card-controls .card-next span{font-size:2cqw}.card-counter{font-size:2.6cqw;bottom:18%}.shop-card-controls .speak-button{font-size:2.8cqw;left:35%;width:30%;height:8%;bottom:8%}.shop-speech-status{font-size:2.1cqw;left:28%;right:3%}.stage:has(.difficulty-grid) .scene,.stage:has(.shop-search) .scene{object-fit:cover}}

#flash-level .wood-card-word{position:absolute;left:0;right:0;top:0;height:21%;display:grid;place-items:center;overflow:hidden;text-align:center;font-family:'Noonnu Basic Gothic',sans-serif;font-weight:400;font-size:clamp(14px,3.8cqw,42px);line-height:1.2;overflow-wrap:anywhere;word-break:keep-all}

/* One shared wood card for every current and future shop deck.
   Three horizontal slices preserve the rope/top/bottom proportions; only the
   central wood and straight side sections expand. The original PNG is never modified. */
.fullscreen-stage #flash-level.shop-card-screen.wood-study .vocab-card{
 width:min(74%,130dvh);aspect-ratio:25/16;top:50%;
}
#flash-level.wood-study .vocab-card-frame{pointer-events:none}
#flash-level.wood-study .vocab-card-frame>span{
 position:absolute;left:0;right:0;background-image:var(--wood-frame);
 background-repeat:no-repeat;pointer-events:none;
}
#flash-level.wood-study .wood-frame-top{
 top:0;height:19.166cqw;background-size:100% auto;background-position:center top;
}
#flash-level.wood-study .wood-frame-bottom{
 bottom:0;height:7.892cqw;background-size:100% auto;background-position:center bottom;
}
#flash-level.wood-study .wood-frame-middle{
 top:calc(19.166cqw - .5px);bottom:calc(7.892cqw - .5px);
 background-size:100% 217.936%;background-position:center 70.8333%;
}
#flash-level.wood-study .wood-face-content{inset:22% 15% 13%;overflow:visible}
#flash-level.wood-study .wood-card-word{
 top:0;height:14%;font-size:clamp(18px,3.8cqw,48px);
}
#flash-level.wood-study .wood-picture-area{
 left:0;right:0;top:17%;height:auto;bottom:0;overflow:visible;
}
#flash-level.wood-study .back-face .wood-picture-area{top:0;bottom:18%}
#flash-level.wood-study .wood-picture{
 width:100%;height:100%;max-width:none;max-height:none;object-fit:contain;
}
#flash-level.wood-study .wood-meaning{
 left:0;right:0;bottom:0;height:14%;
 font-size:clamp(16px,3cqw,40px);line-height:1.15;
}
#flash-level.wood-study .card-counter{
 left:36%;width:12%;bottom:3%;font-size:clamp(13px,1.2cqw,22px);
}
/* Follow the unchanged card's top and right edges, with an 8px gap. */
#flash-level.wood-study>.heading{pointer-events:none}
#flash-level.wood-study .shop-card-controls .speak-button{
 z-index:5;pointer-events:auto;touch-action:manipulation;
 left:auto;right:calc(50% - min(37vw,65dvh));bottom:auto;
 top:max(8px,calc(50% - min(23.68vw,41.6dvh) - clamp(36px,5dvh,54px) - 8px));
 width:clamp(145px,18%,320px);height:clamp(36px,5dvh,54px);
 font-size:clamp(13px,1.2cqw,22px);
}
#flash-level.wood-study .shop-speech-status{
 bottom:.2%;font-size:clamp(10px,.75cqw,14px);
}
.fullscreen-stage:has(#flash-level.wood-study) .back{width:clamp(100px,12%,220px)}
@media(max-width:700px) and (orientation:portrait){
 .fullscreen-stage #flash-level.shop-card-screen.wood-study .vocab-card{width:80%}
 #flash-level.wood-study .card-counter{left:28%;width:15%;bottom:12%}
 #flash-level.wood-study .shop-card-controls .speak-button{
  left:auto;right:10%;bottom:auto;width:42%;height:clamp(36px,6dvh,54px);
  top:max(8px,calc(50% - 25.6vw - clamp(36px,6dvh,54px) - 8px));
 }
 #flash-level.wood-study .shop-speech-status{left:28%;right:3%;bottom:7%;font-size:10px}
}

@media(max-height:520px) and (min-aspect-ratio:3/2){
 #flash-level.wood-study .shop-card-controls .speak-button{
  left:calc(50% + min(37vw,65dvh) + 8px);right:8px;
  top:max(8px,calc(50% - min(23.68vw,41.6dvh)));
  width:auto;min-width:0;font-size:clamp(11px,1.2cqw,18px);
 }
}
