.upload-drop{min-height:0;aspect-ratio:1/1;padding:0;cursor:default}
.upload-prompt{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px}
.upload-prompt[hidden]{display:none}
.upload-prompt button{margin-top:17px;padding:10px 18px;border:0;border-radius:999px;background:var(--red);color:#fff;font-size:11px;font-weight:700;cursor:pointer}
.upload-drop canvas{display:none;width:100%;height:100%;object-fit:contain;touch-action:none;cursor:grab;background:#13242c}
.upload-drop canvas:active{cursor:grabbing}
.upload-drop.has-image canvas{display:block}
.upload-drop.has-image:after{content:none}
.crop-controls{display:grid;gap:13px;padding:15px;background:#fff;border:1px solid var(--line);border-radius:16px}
.crop-controls.hidden{display:none}
.crop-controls>div{display:flex;align-items:baseline;justify-content:space-between}.crop-controls>div strong{font-size:12px}.crop-controls>div span{font-size:9px;color:var(--muted)}
.crop-controls label{display:grid;grid-template-columns:36px 1fr;gap:10px;align-items:center;font-size:10px;font-weight:700}.crop-controls input{accent-color:var(--red)}
.crop-controls button{justify-self:end;border:0;background:none;color:var(--red);font-size:10px;font-weight:700;cursor:pointer}
.photo-stage{height:auto;min-height:0;aspect-ratio:1/1;background:#13242c}
.photo-stage img{object-fit:cover;background:#13242c}
.winner-photo{height:auto;aspect-ratio:1/1;background:#fff}
.winner-photo img{object-fit:cover}
.selected-prefecture-result{grid-template-columns:132px 1fr;min-height:132px}
.selected-prefecture-result img{width:132px;height:132px;min-height:0;object-fit:cover;background:#fff}
.prefecture-result-item img{object-fit:cover;background:#fff}
.japan-map{min-height:0;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:auto;grid-auto-flow:dense;align-content:start;gap:6px}
.pref-tile{aspect-ratio:1/1;transform:none!important;border-radius:11px}
.pref-tile span{left:6px;bottom:6px;font-size:clamp(9px,2.5vw,14px);line-height:1.2;text-shadow:0 1px 4px rgba(0,0,0,.8)}
.pref-tile b{right:5px;top:5px;padding:4px 6px;border-radius:999px;font-size:clamp(8px,2vw,12px);line-height:1;background:rgba(255,255,255,.94);box-shadow:0 2px 7px rgba(9,27,34,.2)}
.pref-tile.no-post{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:1.5px dashed rgba(23,77,98,.28);background:repeating-linear-gradient(135deg,#f7f9f8 0,#f7f9f8 8px,#eef3f1 8px,#eef3f1 16px);box-shadow:none;cursor:default}
.pref-tile.no-post:after{display:none}
.pref-tile.no-post span{position:static;color:var(--muted);font-size:clamp(9px,2.5vw,14px);font-weight:700;text-shadow:none}
.pref-tile.no-post em{color:#839096;font-size:clamp(8px,2vw,11px);font-style:normal;font-weight:700}
.national-tile{grid-column:1/span 2;grid-row:1/span 2}
.pref-tile.rank-1{box-shadow:0 0 0 3px #d5a33d,0 7px 16px rgba(112,78,10,.28)}
.pref-tile.rank-2{box-shadow:0 0 0 3px #aeb8bd,0 7px 16px rgba(62,75,82,.24)}
.pref-tile.rank-3{box-shadow:0 0 0 3px #b9784b,0 7px 16px rgba(104,56,25,.25)}
.pref-tile.rank-1:before,.pref-tile.rank-2:before,.pref-tile.rank-3:before{position:absolute;z-index:3;left:4px;top:4px;width:18px;height:18px;display:grid;place-items:center;border-radius:50%;color:#fff;font:800 8px 'DM Sans'}
.pref-tile.rank-1:before{content:'1';background:#d5a33d}.pref-tile.rank-2:before{content:'2';background:#aeb8bd}.pref-tile.rank-3:before{content:'3';background:#b9784b}
#japan-map .pref-tile.rank-1:before,#japan-map .pref-tile.rank-2:before,#japan-map .pref-tile.rank-3:before{display:none}
.legend-rank{display:block;width:7px;height:7px;border:2px solid currentColor}
.legend-gold{color:#d5a33d}.legend-silver{color:#aeb8bd}.legend-bronze{color:#b9784b}
.map-medal-key{display:flex;align-items:center;gap:8px;color:var(--muted)}
.map-medal-key span{display:flex;align-items:center;gap:3px;font:700 8px 'DM Sans'}
.map-likes-button{aspect-ratio:1/1;display:grid;place-items:center;border:1px solid rgba(219,73,57,.22);border-radius:11px;background:rgba(255,255,255,.78);color:var(--red);cursor:pointer}
.map-likes-button span{font-size:clamp(24px,8vw,42px);line-height:1}.map-likes-button:hover{background:#fff0ec}

@media(min-width:720px){
  .japan-map{grid-template-columns:repeat(8,minmax(0,1fr));gap:8px}
  .national-tile{grid-column:3/span 2;grid-row:1/span 2}
  .pref-tile[data-pref],.pref-tile.no-post{grid-column:var(--desktop-col);grid-row:var(--desktop-row)}
  .map-likes-button{grid-column:8;grid-row:8}
}