/* Compatibility fallback for browsers before CSS Grid/custom properties/aspect-ratio. Modern rules in styles.css override this where supported. */
html,body{background:#dce8ef;color:#263845;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.loading-screen,.fatal-card{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#e7f0f6;color:#263845}
.screen{width:100%;height:100%;padding:12px 14px;background:#e7f0f6;color:#263845}
.btn,.control-btn,.hud-pause,.toggle-btn,.small-pill,.seg,.chapter-card,.level-card,.icon-btn{background:#eef5f9;color:#263845;box-shadow:5px 5px 12px rgba(86,112,128,.24),-5px -5px 12px rgba(255,255,255,.9)}
.btn-primary{background:#72e4ad}.text-btn{color:#708693}.text-btn.danger{color:#d66e75}.spark-symbol{color:#e9b84f}
.screen-header,.game-header{display:flex;align-items:center;justify-content:space-between}.screen-header h1,.game-level-label{flex:1;text-align:center}
.screen-home,.screen-chapters,.screen-levels,.screen-characters,.screen-settings,.screen-daily,.screen-endless,.screen-result{display:flex;flex-direction:column}
.screen-home{justify-content:space-between;align-items:center}.home-top{width:100%}.home-hero{width:100%;max-width:760px;margin-left:auto;margin-right:auto;display:flex;flex-direction:column;align-items:center;text-align:center}.home-actions{width:100%;max-width:520px;margin-left:auto;margin-right:auto;display:flex;flex-wrap:wrap}.home-actions>*{margin:6px;flex:1 1 42%}.home-actions .btn-primary{flex-basis:100%}.home-footer{width:100%;display:flex;justify-content:center}
.scroll-region{overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}.chapter-list,.level-grid,.character-grid,.settings-list,.endless-choices{width:100%;max-width:760px;margin:0 auto}
.level-grid,.character-grid,.endless-choices{display:flex;flex-wrap:wrap}.level-card{width:22%;margin:1.5%;height:72px}.character-card{width:46%;margin:2%}
.screen-game{display:flex;flex-direction:column;align-items:center;justify-content:space-between}.board-host{flex:1;width:100%;display:flex;align-items:center;justify-content:center;min-height:0}.board-shell{position:relative;width:88%;max-width:600px}.board-grid{position:absolute;left:0;top:0;width:100%;height:100%;display:flex;flex-wrap:wrap}.board-slot{position:relative;box-sizing:border-box}.tile{position:absolute;left:7%;top:7%;right:7%;bottom:7%;display:flex;align-items:center;justify-content:center;background:#eef5f9}.path-layer{position:absolute;left:0;top:0;width:100%;height:100%}.flow-path-base{stroke:#62df9f}.flow-path-shimmer{stroke:#b8f5d4}.flowling{position:absolute;transform:translate(-50%,-50%)}
.game-controls{display:flex;width:100%;max-width:600px}.game-controls .control-btn{flex:1;margin:0 5px}.mechanic-tip{background:rgba(255,255,255,.45)}
.panel,.result-card,.daily-card{background:#eef5f9}.portal-tile,.goal-tile{color:#8e71e8}.goal-tile{background:linear-gradient(145deg,#e5e3f9,#e4e8f7)}.vortex{position:relative;width:62%;height:62%;min-width:24px;min-height:24px;border-radius:50%;display:block;filter:drop-shadow(0 0 7px rgba(142,113,232,.35))}.vortex i{position:absolute;left:0;right:0;top:0;bottom:0;border-radius:50%;border:3px solid #a790ed;border-right-color:transparent}.vortex i:nth-child(2){left:18%;right:18%;top:18%;bottom:18%}.vortex i:nth-child(3){left:36%;right:36%;top:36%;bottom:36%;border:0;background:#ae99ee}.goal-charged{box-shadow:0 0 22px rgba(142,113,232,.42),5px 5px 11px rgba(86,112,128,.24),-5px -5px 11px rgba(255,255,255,.9)}.visited{background:#c9f5df}.hint-rollback{outline:3px solid #d66e75}.hint-glow{outline:3px solid #e9b84f}
@media (orientation:landscape) and (max-height:520px){.screen-game{flex-direction:row;align-items:stretch}.board-host{width:62%;height:100%}.board-shell{width:96%;max-height:100%}.game-header,.game-controls{width:36%}.game-controls{flex-direction:column;justify-content:flex-end}.game-controls .control-btn{min-height:48px;height:48px;margin:4px 0;padding:9px 10px;font-size:14px}.mechanic-tip{display:none}}
.board-shell{touch-action:none;-ms-touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
/* DEV-POLISH-01 legacy-safe anchor/sprite motion and typography fallback. */
.flowling-anchor{position:absolute;z-index:8;pointer-events:none;transform:translate(-50%,-50%)}
.flowling-anchor .flowling{position:relative;left:auto;top:auto;width:100%;height:100%;transform:none}
.flow-nudge-right{animation:legacyNudgeRight .175s ease}.flow-nudge-left{animation:legacyNudgeLeft .175s ease}.flow-nudge-up{animation:legacyNudgeUp .175s ease}.flow-nudge-down{animation:legacyNudgeDown .175s ease}
@keyframes legacyNudgeRight{50%{transform:translateX(4px) scale(1.02)}}@keyframes legacyNudgeLeft{50%{transform:translateX(-4px) scale(1.02)}}@keyframes legacyNudgeUp{50%{transform:translateY(-4px) scale(1.02)}}@keyframes legacyNudgeDown{50%{transform:translateY(4px) scale(1.02)}}
button,.btn,.control-btn,.hud-pause,.toggle-btn,.small-pill,.seg,.text-btn{font-size:14px}.mechanic-tip,.toast,.how-section p,.chapter-info small{font-size:14px}.home-subtitle{font-size:16px}.game-level-label,.game-count{font-size:16px}

/* SQUISHY-01 basic Front-only fallback for legacy layout engines. */
.squishy-sprite{position:relative;width:100%;height:100%;overflow:visible;transform-origin:center bottom}
.squishy-front{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:contain}
.squishy-sprite.flow-nudge-right{animation:legacySquishyRight .19s ease}.squishy-sprite.flow-nudge-left{animation:legacySquishyLeft .19s ease}.squishy-sprite.flow-nudge-up{animation:legacySquishyUp .19s ease}.squishy-sprite.flow-nudge-down{animation:legacySquishyDown .19s ease}
@keyframes legacySquishyRight{0%{transform:scale(.98,1.02)}50%{transform:translateX(4px) scale(1.03,.98)}100%{transform:scale(1)}}@keyframes legacySquishyLeft{0%{transform:scale(.98,1.02)}50%{transform:translateX(-4px) scale(1.03,.98)}100%{transform:scale(1)}}@keyframes legacySquishyUp{0%{transform:scale(1.02,.98)}50%{transform:translateY(-4px) scale(.98,1.03)}100%{transform:scale(1)}}@keyframes legacySquishyDown{0%{transform:scale(1.02,.98)}50%{transform:translateY(4px) scale(.98,1.03)}100%{transform:scale(1)}}
.squishy-idle-cycle{animation:legacySquishyIdle .56s ease}@keyframes legacySquishyIdle{0%{transform:scale(1)}22%{transform:translateY(-2px) scale(.99,1.015)}48%{transform:translateY(-4px) scale(.98,1.03)}75%{transform:scale(1.03,.97)}88%{transform:translateY(-1px) scale(.99,1.015)}100%{transform:scale(1)}}