:root{--ale-purple:#4d0f9a;--ale-violet:#6d27d1;--ale-lilac:#f1e4ff}
body{background:linear-gradient(180deg,#f3e8ff,#fff8fb 70%)}
.ale-controller{width:min(560px,100%);background:linear-gradient(150deg,#fff9ff,#e6d1ff);border-color:#b67be9;box-shadow:inset 0 3px 0 #fff,0 14px 28px #4d0f9a42}
.game-shell{padding-top:7px;padding-bottom:7px;min-height:0}
.game-shell .game-frame{margin-top:0}
.game-hearts{position:absolute;z-index:2;top:10px;right:11px;padding:5px 8px;border-radius:999px;background:#143e69a8;color:white;font-size:clamp(.8rem,3.4vw,1rem);letter-spacing:-.08em;text-shadow:0 2px 3px #123}
.game-hearts{max-width:72%;line-height:1.25;overflow-wrap:anywhere;text-align:right}
.game-tramo{position:absolute;z-index:2;left:50%;bottom:7%;transform:translateX(-50%);padding:5px 11px;border-radius:999px;background:#143e69bb;color:#fff;font-size:.76rem;font-weight:950;letter-spacing:.07em;white-space:nowrap}
.game-shell .game-overlay{z-index:5}.game-shell .toast{z-index:4}
.controller-brand{color:var(--ale-purple)}
.controller-tools{display:flex;align-items:center;gap:7px}
.help-button,.start-button{border:0;border-radius:999px;background:var(--ale-purple);color:#fff;font-weight:950;min-height:32px}
.help-button{width:33px;font-size:1.15rem}.start-button{padding:6px 12px}
.controller-body{justify-content:space-between}
.pad-button,.pad-center{background:#4c2385;box-shadow:inset 0 3px 2px #ffffff3b,0 4px 0 #2b1255}
.pad-button:disabled{opacity:.55;color:#d1b8ec;box-shadow:none}
.pad-button.pressed{background:#a142f0}
.pad-center{color:#ffd166}
.action-buttons{display:grid;grid-template-columns:repeat(3,clamp(41px,12vw,55px));grid-template-rows:repeat(3,clamp(41px,12vw,55px));flex:0 0 auto;gap:0;justify-content:end;margin-left:auto;margin-right:2px}
.action-button{width:clamp(52px,15vw,68px);height:clamp(52px,15vw,68px);align-self:center;justify-self:center;box-shadow:0 4px 0 #4b2183,0 7px 14px #4d0f9a45}
.action-button strong{font-size:1.4rem}.action-button small{font-size:.46rem}
.action-x{grid-column:2;grid-row:1;background:linear-gradient(145deg,#7e36e8,#4d0f9a)}
.action-y{grid-column:1;grid-row:2;background:linear-gradient(145deg,#7e36e8,#4d0f9a)}
.action-a{grid-column:3;grid-row:2;background:linear-gradient(145deg,#ffb947,#e87527)}
.action-b{grid-column:2;grid-row:3;background:linear-gradient(145deg,#e451a6,#a82082)}
.action-button:disabled{filter:grayscale(.8);opacity:.48;box-shadow:0 2px 0 #65418b;cursor:default}
.action-center{grid-column:2;grid-row:2;display:grid;place-items:center;color:#8042cf;font-size:1.3rem}
.action-button:active,.action-button.pressed{transform:translateY(3px);box-shadow:0 1px 0 #4b2183}
.game-shell .hint{display:none}
@media(max-width:620px){.game-shell{padding:5px 5px 6px}.ale-controller{width:100%;margin:7px auto 2px;padding:12px 18px 22px 12px;border-radius:23px;min-height:190px}.dpad{grid-template-columns:repeat(3,clamp(43px,11.8vw,48px));grid-template-rows:repeat(3,clamp(43px,11.8vw,48px))}.action-buttons{grid-template-columns:repeat(3,clamp(45px,12.4vw,53px));grid-template-rows:repeat(3,clamp(45px,12.4vw,53px));margin-right:4px}.action-button{width:clamp(49px,14.5vw,64px);height:clamp(49px,14.5vw,64px)}.controller-body{gap:4px}.game-hearts{top:7px;right:6px}}