/* Flower layout depends on width, not the changing mobile browser height. */
body.room217-flower.room217-navigation .topbar{height:60px;min-height:60px}
#flowerGame.flower-game{padding:16px 14px 32px;min-height:calc(100svh - 60px)}
#flowerGame .flower-shell .flower-head{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px 14px;text-align:left;padding:0 0 12px;margin:0 0 14px;border-bottom:1px solid #40382e}
#flowerGame .flower-shell .flower-head .era{display:none}
#flowerGame .flower-shell .flower-head h1{margin:0;color:#f1e7d7;font-family:inherit;font-size:22px;line-height:1.4;font-weight:700;letter-spacing:0}
#flowerGame .flower-shell .flower-head p{margin:0;color:#a99b87;font-family:inherit;font-size:11px;line-height:1.4;letter-spacing:.08em}
#flowerGame .flower-shell .flower-progress{grid-column:1/-1;display:flex;min-width:0;gap:7px;margin:0;padding:4px 0}
#flowerGame .flower-shell .flower-progress i{height:7px}
#flowerGame .flower-relay{height:auto;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);grid-template-rows:auto auto auto auto;gap:12px 20px}
#flowerGame .flower-relay-map{width:100%;height:auto;max-height:none;aspect-ratio:1/1.15;grid-column:1;grid-row:1/-1}
#flowerGame .flower-relay-map~*{grid-column:2}
#flowerGame .flower-relay-quote{min-height:0}
#flowerGame .flower-relay-status{min-height:0}
#flowerGame .flower-relay-person{width:110px}
#flowerGame .flower-relay-person .flower-relay-portrait{width:clamp(42px,7vw,68px)}
#flowerGame .flower-relay-record{position:static;width:100%;max-height:none;overflow:visible;padding:10px 0;background:transparent;box-shadow:none}
#flowerGame .flower-relay-record-title{font-size:13px;line-height:1.6;color:#bdab90}
#flowerGame #beaconMap.beacon-deduction{height:auto;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);grid-template-rows:auto auto}
#flowerGame #beaconMap .beacon-paper{width:100%;height:auto;max-height:none;aspect-ratio:1/1.1}
#flowerGame #beaconMap .beacon-record{grid-column:2;grid-row:1/3;width:100%}
#flowerGame #beaconMap .beacon-record .beacon-clues{position:static;width:100%;max-height:none;overflow:visible}
#flowerGame #beaconMap .beacon-point .beacon-tower{width:54px;height:52px}
@media(max-width:849px){
 #flowerGame .flower-relay{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto auto auto;max-width:480px;gap:10px}
 #flowerGame .flower-relay-map{grid-column:1;grid-row:1}
 #flowerGame .flower-relay-map~*{grid-column:1}
 #flowerGame .flower-relay-person .flower-relay-portrait{width:clamp(42px,12vw,60px)}
 #flowerGame .flower-relay-letter{padding:12px}
 #flowerGame .flower-relay-dialogue{grid-template-columns:40px minmax(0,1fr)}
 #flowerGame .flower-relay-quote{font-size:14px;min-height:0;line-height:1.6}
 #flowerGame .flower-relay button[data-action]{min-height:44px}
 #flowerGame #beaconMap.beacon-deduction{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;max-width:480px;gap:12px}
 #flowerGame #beaconMap .beacon-record{grid-column:1;grid-row:3}
 #flowerGame #beaconMap .beacon-point .beacon-tower{width:44px;height:42px}
}
@media(max-width:600px){
 body.room217-flower.room217-navigation .topbar{height:48px;min-height:48px}
 #flowerGame.flower-game{padding:12px 14px 28px;min-height:calc(100svh - 48px)}
 #flowerGame .flower-shell .flower-head h1{font-size:19px}
}