/* Paradise Drop — Tropical Retro Arcade v2.6 */
:root{--arcade-panel:rgba(5,18,42,.86);--cyan:#27e4ff;--mango:#ffd34f;--coral:#ff6f7d;--pink:#ff4fa3}html,body{background:#07152b}body{font-family:ui-rounded,"SF Pro Rounded",-apple-system,sans-serif}
#scene{background:radial-gradient(circle at 78% 21%,#fff7a6 0 3.5%,#ffd95e 3.7% 7.4%,rgba(255,187,76,.18) 7.6% 12%,transparent 16%),linear-gradient(180deg,#081a43 0%,#124d8b 28%,#22a0bf 52%,#ff75a4 73%,#ff9b62 84%,#ffd179 100%);transition:filter 1.8s ease,background 1.8s ease}
body[data-paradise-phase="day"] #scene{background:radial-gradient(circle at 78% 21%,rgba(255,224,160,.12) 0%,transparent 18%),linear-gradient(180deg,#092452 0%,#1766a1 30%,#27abc4 54%,#ff82ad 75%,#ffad70 86%,#ffd98c 100%)}body[data-paradise-phase="golden"] #scene{background:radial-gradient(circle at 78% 25%,rgba(255,194,112,.14) 0%,transparent 20%),linear-gradient(180deg,#16376b 0%,#3975a1 27%,#62aeb2 49%,#ffb25f 70%,#ff865c 84%,#ffd276 100%)}body[data-paradise-phase="sunset"] #scene{background:radial-gradient(circle at 78% 30%,rgba(255,142,113,.12) 0%,transparent 20%),linear-gradient(180deg,#161d55 0%,#4d397e 27%,#a44588 48%,#f45783 67%,#ff765c 82%,#ffad68 100%)}body[data-paradise-phase="night"] #scene{background:radial-gradient(circle at 78% 24%,#eaf4ff 0 2.2%,#b7d2ed 2.4% 4.2%,rgba(183,210,237,.09) 4.4% 8%,transparent 11%),linear-gradient(180deg,#03091e 0%,#081532 30%,#102d50 55%,#174c66 76%,#17657b 100%)}body[data-paradise-phase="night"] .star{opacity:.98!important;animation-duration:2.8s}body[data-paradise-phase="night"] #sun{opacity:.16;filter:saturate(0) brightness(1.8);box-shadow:0 0 24px rgba(202,225,255,.26)}body[data-paradise-phase="golden"] #sun{filter:saturate(1.12);box-shadow:0 0 40px rgba(255,182,62,.42)}body[data-paradise-phase="sunset"] #sun{filter:hue-rotate(-18deg) saturate(1.35);opacity:.75;box-shadow:0 0 34px rgba(255,105,78,.35)}
#scene::before{content:'';position:absolute;left:0;right:0;bottom:14%;height:8%;background:linear-gradient(180deg,rgba(89,220,226,.32),rgba(14,106,145,.68));clip-path:polygon(0 46%,8% 35%,18% 48%,29% 32%,40% 50%,52% 34%,64% 48%,76% 30%,88% 45%,100% 33%,100% 100%,0 100%);opacity:.72;transition:filter 1.8s ease,opacity 1.8s ease}#scene::after{content:'';position:absolute;left:0;right:0;bottom:10.5%;height:4.5%;background:linear-gradient(180deg,rgba(255,221,139,.66),rgba(231,171,91,.42));clip-path:polygon(0 42%,13% 28%,26% 47%,40% 30%,55% 46%,69% 26%,84% 45%,100% 30%,100% 100%,0 100%);transition:filter 1.8s ease,opacity 1.8s ease}body[data-paradise-phase="golden"] #scene::before{filter:sepia(.22) saturate(1.15)}body[data-paradise-phase="sunset"] #scene::before{filter:hue-rotate(-18deg) saturate(1.35);opacity:.62}body[data-paradise-phase="night"] #scene::before{filter:hue-rotate(15deg) brightness(.55);opacity:.48}body[data-paradise-phase="night"] #scene::after{filter:brightness(.42) saturate(.7);opacity:.45}
.star{opacity:.4;transition:opacity 1.8s ease}.bird{display:none}.cloud{opacity:.12!important}.palm{opacity:.58;filter:saturate(.82) brightness(.72);transition:filter 1.8s ease,opacity 1.8s ease}body[data-paradise-phase="golden"] .palm{filter:saturate(.8) brightness(.62) sepia(.15)}body[data-paradise-phase="sunset"] .palm{filter:saturate(.7) brightness(.48)}body[data-paradise-phase="night"] .palm{filter:saturate(.5) brightness(.27);opacity:.7}#sun{width:66px;height:66px;background:radial-gradient(circle at 38% 34%,#fff8aa,#ffe05f 58%,#ffad4e);box-shadow:0 0 30px rgba(255,198,78,.32);transition:opacity 1.8s ease,filter 1.8s ease,box-shadow 1.8s ease}
.panel{background:linear-gradient(180deg,rgba(9,31,67,.9),var(--arcade-panel));border:1px solid rgba(39,228,255,.58);border-radius:12px;box-shadow:0 5px 16px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.05)}.panel-label,.stat-card .label{color:#69eefe;font-weight:900;text-shadow:0 0 8px rgba(39,228,255,.2)}.stat-card{background:rgba(0,0,0,.16)}.stat-card .value{color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.45)}.piece-box{background:rgba(2,13,34,.68);border:1px solid rgba(39,228,255,.16)}#board-wrap{background:linear-gradient(180deg,rgba(3,16,39,.93),rgba(3,13,33,.97));border:2px solid rgba(48,233,244,.78);border-radius:10px;box-shadow:0 0 0 1px rgba(7,46,75,.8),0 0 22px rgba(39,228,255,.2),0 14px 36px rgba(0,0,0,.36)}#gameCanvas{background:rgba(3,14,35,.9)}
/* Start + game-over polish */
#screen-splash,#screen-gameover{background:linear-gradient(180deg,rgba(4,18,43,.78),rgba(4,14,35,.9));border:1px solid rgba(39,228,255,.34);box-shadow:0 20px 60px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.08);backdrop-filter:blur(12px)}#screen-splash::before,#screen-gameover::before{content:'';position:absolute;inset:7px;border:1px solid rgba(255,211,79,.14);border-radius:inherit;pointer-events:none}.splash-icon{filter:drop-shadow(0 5px 8px rgba(0,0,0,.3));animation:paradiseFloat 3s ease-in-out infinite}.splash-title{color:var(--mango)!important;text-shadow:0 3px 0 rgba(255,79,163,.72),0 0 18px rgba(255,211,79,.24);letter-spacing:2px}.splash-subtitle{color:#72efff!important;text-transform:uppercase;letter-spacing:2.2px;font-size:10px!important}.splash-desc{color:rgba(255,255,255,.78)!important}.controls-hint{background:rgba(2,13,34,.32);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:9px}.hint-key{border-color:rgba(39,228,255,.38)!important;background:rgba(39,228,255,.08)!important}.btn-play,.btn-restart{background:linear-gradient(180deg,#ff78b5,#e23d86)!important;border:2px solid rgba(255,255,255,.42)!important;box-shadow:0 4px 0 #8b2258,0 8px 20px rgba(0,0,0,.28),inset 0 2px 0 rgba(255,255,255,.2)!important;text-transform:uppercase;letter-spacing:1.5px;font-weight:1000!important}.btn-play:active,.btn-restart:active{transform:translateY(3px)!important;box-shadow:0 1px 0 #8b2258,0 4px 10px rgba(0,0,0,.25)!important}.highscore-display{color:rgba(255,255,255,.62)!important}.gameover-emoji{filter:drop-shadow(0 6px 8px rgba(0,0,0,.3));animation:gameOverBob 1.8s ease-in-out infinite}.gameover-title{color:var(--mango)!important;text-shadow:0 3px 0 rgba(255,79,163,.62),0 0 15px rgba(255,211,79,.2)}.gameover-scores{background:rgba(2,13,34,.28);border:1px solid rgba(39,228,255,.15);border-radius:14px;padding:8px}.score-block.best{background:rgba(255,211,79,.08)!important;border-color:rgba(255,211,79,.22)!important}.score-block.best .val{color:var(--mango)!important}@keyframes paradiseFloat{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-6px) rotate(2deg)}}@keyframes gameOverBob{0%,100%{transform:rotate(-4deg) scale(1)}50%{transform:rotate(4deg) scale(1.08)}}
#paradise-celebration{position:fixed;left:50%;top:48%;transform:translate(-50%,-50%) scale(.72);z-index:60;pointer-events:none;opacity:0;font-weight:1000;letter-spacing:2px;font-size:clamp(25px,8vw,48px);white-space:nowrap;color:#fff;text-shadow:0 3px 0 rgba(5,20,48,.75),0 0 14px rgba(39,228,255,.65)}#paradise-celebration.show{animation:paradisePop .52s cubic-bezier(.2,.85,.25,1)}#paradise-celebration.clear-2{color:#6ff5ff}#paradise-celebration.clear-3{color:#ff75bd}#paradise-celebration.clear-4{color:#ffe45f;font-size:clamp(29px,9vw,54px);animation-duration:.7s}@keyframes paradisePop{0%{opacity:0;transform:translate(-50%,-50%) scale(.65) rotate(-3deg)}22%{opacity:1;transform:translate(-50%,-50%) scale(1.12) rotate(1deg)}68%{opacity:1;transform:translate(-50%,-58%) scale(1)}100%{opacity:0;transform:translate(-50%,-72%) scale(.94)}}body.paradise-clear #board-wrap{animation:boardPulse .32s ease-out}@keyframes boardPulse{0%{box-shadow:0 0 0 rgba(39,228,255,0)}35%{box-shadow:0 0 34px rgba(39,228,255,.48)}100%{box-shadow:0 0 22px rgba(39,228,255,.2)}}
#paradise-crab{position:fixed;left:20px;bottom:111px;width:38px;height:25px;z-index:18;pointer-events:none;filter:drop-shadow(0 3px 2px rgba(0,0,0,.3));transform-origin:50% 100%}.crab-body{position:absolute;left:8px;top:8px;width:22px;height:15px;border-radius:50% 50% 45% 45%;background:linear-gradient(#ff9862,#f05245 65%,#bd3438);box-shadow:inset 0 2px 0 rgba(255,255,255,.25)}.crab-eye{position:absolute;top:-5px;width:4px;height:6px;border-radius:4px;background:#fff;border:1px solid #70262d}.crab-eye::after{content:'';position:absolute;width:2px;height:2px;border-radius:50%;background:#17243a;left:1px;top:1px}.eye-left{left:4px}.eye-right{right:4px}.crab-claw{position:absolute;top:7px;width:10px;height:9px;border-radius:55% 55% 45% 45%;background:#f45a48;border:1px solid rgba(116,38,43,.45)}.claw-left{left:0;transform:rotate(-25deg)}.claw-right{right:0;transform:rotate(25deg)}.crab-leg{position:absolute;top:17px;width:9px;height:6px;border-top:2px solid #d84640;border-radius:50%}.legs-left{left:3px;transform:rotate(-18deg)}.legs-right{right:3px;transform:rotate(18deg)}#paradise-crab.pop{animation:crabPop .58s ease-out}#paradise-crab.cheer{animation:crabCheer .62s ease-out}#paradise-crab.paradise{animation:crabParadise .88s ease-out}.cheer .claw-left,.paradise .claw-left{animation:clawL .45s ease-in-out 2}.cheer .claw-right,.paradise .claw-right{animation:clawR .45s ease-in-out 2}@keyframes crabPop{0%,100%{transform:translateY(0)}40%{transform:translateY(-7px) scale(1.08)}}@keyframes crabCheer{0%,100%{transform:rotate(0)}25%{transform:rotate(-8deg) translateY(-4px)}55%{transform:rotate(8deg) translateY(-5px)}}@keyframes crabParadise{0%,100%{transform:translateY(0) rotate(0)}20%{transform:translateY(-9px) rotate(-10deg) scale(1.12)}45%{transform:translateY(-5px) rotate(10deg) scale(1.12)}70%{transform:translateY(-9px) rotate(-6deg) scale(1.08)}}@keyframes clawL{50%{transform:rotate(-65deg) translateY(-3px)}}@keyframes clawR{50%{transform:rotate(65deg) translateY(-3px)}}
#touch-controls{background:linear-gradient(180deg,rgba(7,62,86,0) 0%,rgba(5,38,64,.38) 28%,rgba(3,12,31,.91) 100%);border:0!important;box-shadow:none!important;backdrop-filter:blur(2px)}.tbtn{border-radius:50%;border:2px solid rgba(255,255,255,.38);box-shadow:0 3px 0 #041328,0 6px 14px rgba(0,0,0,.3),inset 0 2px 0 rgba(255,255,255,.13);color:#fff}.tbtn-left,.tbtn-right{background:linear-gradient(#2795df,#155fa5)}.tbtn-soft{background:linear-gradient(#48d8ad,#168d74)}.tbtn-rotate{background:linear-gradient(#ff62ad,#cc3277)}
@media (orientation:portrait) and (max-width:680px){:root{--block:25px}body.has-touch #app,#app{position:relative;display:grid;grid-template-columns:66px minmax(0,1fr) 66px;grid-template-rows:22px 50px auto;align-content:start;align-items:center;justify-content:center;width:100%;max-width:430px;margin:0 auto;padding:calc(env(safe-area-inset-top) + 2px) 8px 126px;gap:3px;box-sizing:border-box}body.has-touch #app::before,#app::before{content:'PARADISE DROP';grid-column:1/4;grid-row:1;position:static;transform:none;justify-self:center;align-self:center;z-index:12;pointer-events:none;white-space:nowrap;font-size:11px;font-weight:1000;letter-spacing:2.6px;color:var(--mango);text-shadow:0 2px 0 rgba(255,79,163,.85),0 0 10px rgba(255,211,79,.28);opacity:.98}#app::after{display:none!important}#board-wrap{grid-column:1/4;grid-row:3;justify-self:center;margin:0;max-height:none;overflow:hidden}#left-panel{grid-column:2;grid-row:2;width:auto;min-width:0;height:46px;padding:3px 23px 3px 5px;display:grid;grid-template-columns:1fr 1fr;gap:2px;align-items:center;position:relative}#left-panel .stat-card{min-width:0;padding:1px;border:0;background:transparent}#left-panel .stat-card:nth-child(2),#left-panel .stat-card:nth-child(4){display:none}#left-panel .stat-card .label{font-size:6px;letter-spacing:.9px}.stat-card .value{font-size:15px}#left-panel .btn-pause{display:block!important;position:absolute;right:4px;top:4px;width:18px;height:18px;min-width:0;padding:0;border-radius:50%;font-size:0;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);box-shadow:none}#left-panel .btn-pause::after{content:'Ⅱ';font-size:9px;color:#fff}#right-panel{display:contents}#right-panel>div:first-child{grid-column:1;grid-row:2}#right-panel>div:nth-child(2){grid-column:3;grid-row:2}#right-panel>div:first-child,#right-panel>div:nth-child(2){height:46px;background:var(--arcade-panel);border:1px solid rgba(39,228,255,.58);border-radius:9px;padding:2px;box-sizing:border-box;text-align:center}#right-panel .panel-label{font-size:6px;letter-spacing:.9px}.piece-box{border:0;background:transparent}.piece-box canvas{max-width:52px!important;max-height:27px!important}#right-panel>div:nth-child(2) .piece-box:nth-child(n+2){display:none}#touch-controls{height:116px;padding:0;display:block!important;position:fixed;left:0;right:0;bottom:0;pointer-events:none;z-index:20}#touch-controls .touch-row{display:contents}.tbtn{pointer-events:auto;position:absolute;width:54px;height:54px;font-size:22px;margin:0}.tbtn-label{font-size:6px}#t-left{left:max(20px,calc(50% - 188px));bottom:max(9px,env(safe-area-inset-bottom))}#t-soft{left:50%;transform:translateX(-50%);bottom:max(7px,env(safe-area-inset-bottom))}#t-right{right:max(20px,calc(50% - 188px));bottom:max(9px,env(safe-area-inset-bottom))}#t-rotate{right:max(22px,calc(50% - 186px));bottom:61px;width:50px;height:50px}#t-hold,#t-hard,#t-pause{display:none!important}#screen-splash,#screen-gameover{width:min(92vw,360px)!important;padding:24px 20px!important;border-radius:22px!important}.controls-hint{font-size:9px!important}.splash-title{font-size:clamp(31px,10vw,44px)!important}.gameover-title{font-size:clamp(26px,8vw,38px)!important}}
@media (orientation:portrait) and (max-width:390px){:root{--block:22px}#t-left{left:14px}#t-right,#t-rotate{right:14px}.tbtn{width:52px;height:52px}#paradise-crab{left:15px;bottom:101px;transform:scale(.92)}}@media (orientation:portrait) and (max-height:760px){:root{--block:20px}body.has-touch #app,#app{grid-template-rows:18px 43px auto;padding-bottom:112px}#right-panel>div:first-child,#right-panel>div:nth-child(2),#left-panel{height:39px}.piece-box canvas{max-height:22px!important}#touch-controls{height:104px}.tbtn{width:48px;height:48px}#t-rotate{width:46px;height:46px;bottom:54px}#paradise-crab{bottom:94px;transform:scale(.86)}body.has-touch #app::before,#app::before{font-size:9px}#screen-splash,#screen-gameover{padding:18px 17px!important}.splash-desc{font-size:11px!important;margin:4px 0!important}.controls-hint{padding:6px!important}.splash-icon,.gameover-emoji{font-size:42px!important}}

/* V2.12 — clearer playfield and a single, softer sun. */
#sun {
  width: 56px; height: 56px; opacity: .78;
  animation: none;
  box-shadow: 0 0 34px rgba(255,198,78,.18);
}
#sun::after { animation: none; opacity: .45; }
body[data-paradise-phase="night"] #sun { opacity: 0; }
.hint-item { min-width: 0; }
@media (pointer:fine) and (min-width:900px) and (min-height:800px) {
  :root { --block: 34px; }
}
@media (pointer:fine) and (min-width:900px) and (min-height:900px) {
  :root { --block: 38px; }
}
@media (pointer:fine) and (min-width:1000px) and (min-height:1000px) {
  :root { --block: 42px; }
}
@media (pointer:fine) and (min-width:1100px) and (min-height:1100px) {
  :root { --block: 46px; }
}