:root{--ink:#082c3f;--panel:rgba(5,43,58,.9);--mint:#34e6c1;--blue:#37b9f1;--yellow:#ffdd57;--orange:#ff9848;--green:#54d66d}.angle-ace-page{margin:0;overflow:hidden;background:#24d5bf;overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.angle-game{position:relative;width:100vw;height:100dvh;min-height:430px;overflow:hidden;color:#fff;font-family:Inter,"Segoe UI",system-ui,sans-serif}.angle-game canvas{display:block;width:100%;height:100%;touch-action:none}.angle-hud{position:absolute;z-index:12;top:max(10px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));left:max(10px,env(safe-area-inset-left));display:flex;align-items:center;gap:8px;pointer-events:none}.angle-brand,.level-pill,.star-pill,.hud-button{min-height:46px;border:2px solid rgba(4,29,43,.25);border-radius:15px;background:var(--panel);box-shadow:0 5px 0 rgba(2,20,31,.35),0 12px 25px rgba(2,20,31,.15);backdrop-filter:blur(8px)}.angle-brand{display:flex;align-items:center;gap:8px;padding:5px 12px 5px 5px;color:#fff;text-decoration:none;pointer-events:auto}.angle-brand span{display:grid;width:34px;height:34px;place-items:center;border-radius:10px;background:var(--mint);color:var(--ink);font-weight:950;box-shadow:inset -4px -4px rgba(0,0,0,.13)}.angle-brand b{font-size:.84rem}.level-pill,.star-pill{display:flex;align-items:center;gap:7px;padding:7px 12px}.level-pill small{color:#acd1dc;font-size:.63rem;font-weight:850;text-transform:uppercase}.level-pill b{font-size:.9rem}.star-pill{margin-left:auto}.star-pill span{color:var(--yellow)}.hud-button{display:grid;width:46px;place-items:center;color:#fff;font-size:1rem;pointer-events:auto;cursor:pointer}.mission-card{position:absolute;z-index:8;top:78px;left:max(12px,env(safe-area-inset-left));width:min(345px,calc(100vw - 24px));padding:15px 16px;border:2px solid rgba(255,255,255,.43);border-radius:19px;background:rgba(255,255,255,.94);color:var(--ink);box-shadow:0 8px 0 rgba(4,59,71,.18),0 20px 42px rgba(2,44,56,.2)}.mission-meta{display:flex;gap:7px}.mission-meta span,.mission-meta b{padding:4px 8px;border-radius:8px;background:#dffaf4;color:#08725f;font-size:.62rem;font-weight:950;text-transform:uppercase;letter-spacing:.05em}.mission-meta b{background:#fff0b0;color:#6b5300}.mission-card h1{margin:8px 0 4px;font-size:1.18rem;letter-spacing:-.03em}.mission-card>p{margin:0;color:#496b77;font-size:.78rem;line-height:1.35}.target-range{display:flex;align-items:end;justify-content:space-between;margin-top:10px;padding-top:9px;border-top:1px solid #d7e5e8}.target-range span{font-size:.67rem;font-weight:850;text-transform:uppercase}.target-range strong{color:#078873;font-size:1.15rem}.mission-support{display:flex;gap:7px;margin-top:9px}.mission-support button,.result-support button{min-height:34px;padding:5px 11px;border:1px solid #a8d4d1;border-radius:9px;background:#e5faf7;color:#086657;font-weight:900;cursor:pointer}.mission-support button:last-child,.result-support button:last-child{border-color:#d6c27a;background:#fff7d4;color:#6b5500}.mission-teaching{margin-top:9px;padding:9px 10px;border-radius:10px;background:#edf6f7}.mission-teaching strong{font-size:.76rem}.mission-teaching p{margin:3px 0 0;color:#4b6b75;font-size:.72rem;line-height:1.35}.flight-stats{position:absolute;z-index:8;top:78px;right:max(12px,env(safe-area-inset-right));display:grid;grid-template-columns:repeat(2,112px);gap:7px}.flight-stats div{padding:9px 11px;border:2px solid rgba(255,255,255,.2);border-radius:14px;background:rgba(4,52,66,.82);box-shadow:0 5px 0 rgba(2,30,42,.25);backdrop-filter:blur(7px)}.flight-stats small,.flight-stats b{display:block}.flight-stats small{color:#a9d5dd;font-size:.58rem;font-weight:850;text-transform:uppercase}.flight-stats b{margin-top:1px;font-size:1.05rem}.flight-stats i{font-size:.6rem;font-style:normal;color:#a9d5dd}.shot-controls{position:absolute;z-index:10;right:max(14px,env(safe-area-inset-right));bottom:max(14px,env(safe-area-inset-bottom));left:max(14px,env(safe-area-inset-left));display:grid;grid-template-columns:minmax(260px,1fr) minmax(220px,1fr) 185px;gap:10px;padding:11px;border:2px solid rgba(255,255,255,.25);border-radius:19px;background:rgba(4,40,55,.9);box-shadow:0 7px 0 rgba(2,22,32,.42),0 22px 45px rgba(1,25,36,.2);backdrop-filter:blur(10px)}.control-label{display:block;margin-bottom:5px;color:#b5d7de;font-size:.62rem;font-weight:900;text-transform:uppercase}.angle-control>div{display:grid;grid-template-columns:40px 1fr 40px 55px;align-items:center;gap:7px}.angle-control button{width:40px;height:40px;border:1px solid rgba(255,255,255,.25);border-radius:11px;background:#164c5f;color:#fff;font-size:1.3rem;font-weight:950;cursor:pointer}.angle-control input{width:100%;accent-color:var(--yellow)}.angle-control output{font-size:1.1rem;font-weight:950;text-align:right}.power-control{align-self:center}.power-track{position:relative;height:19px;border:2px solid rgba(255,255,255,.32);border-radius:99px;background:#0a3143;overflow:hidden}.power-track i{display:block;width:var(--power,35%);height:100%;border-radius:inherit;background:linear-gradient(90deg,#34e6c1 0 55%,#ffdd57 72%,#ff9848 100%);transition:width .06s linear}.power-sweet{position:absolute;top:0;left:72%;height:100%;padding:1px 4px;border-left:2px solid #fff;border-right:2px solid #fff;color:#fff;font-size:.52rem;font-weight:900;text-transform:uppercase}.power-control small{display:block;margin-top:4px;color:#a9d0d8;font-size:.65rem}.hit-button{min-height:64px;border:2px solid #bd8d12;border-radius:15px;background:linear-gradient(#ffe26c,#ffbe32);color:#402c00;box-shadow:0 5px 0 #a96508;cursor:pointer;touch-action:none}.hit-button span,.hit-button b,.hit-button small{display:block}.hit-button span{position:absolute;opacity:0}.hit-button b{font-size:.96rem;text-transform:uppercase}.hit-button small{margin-top:2px;font-size:.6rem}.hit-button.charging{transform:translateY(3px);box-shadow:0 2px 0 #a96508;background:linear-gradient(#ffcd48,#ff8f3c)}.shot-controls.locked{opacity:.56;pointer-events:none}.angle-toast{position:absolute;z-index:18;top:78px;left:50%;max-width:min(80vw,520px);padding:0;border-radius:13px;background:#fff;color:var(--ink);font-weight:900;text-align:center;transform:translate(-50%,-25px);opacity:0;pointer-events:none;transition:.2s}.angle-toast.show{padding:10px 14px;transform:translate(-50%,0);opacity:1}.angle-toast.success{background:#e4fae8;color:#17602b}.welcome{position:absolute;z-index:30;inset:0;display:grid;place-items:center;padding:18px;background:rgba(2,33,45,.56);backdrop-filter:blur(6px)}.welcome.hidden{display:none}.angle-modal-card{position:relative;width:min(570px,100%);padding:23px;border:2px solid rgba(255,255,255,.28);border-radius:23px;background:#07384d;color:#fff;box-shadow:0 12px 0 rgba(1,20,31,.4),0 35px 80px rgba(0,0,0,.28)}.modal-kicker{margin:0;color:var(--mint);font-size:.68rem;font-weight:950;letter-spacing:.1em;text-transform:uppercase}.angle-modal-card h1,.angle-modal-card h2{margin:4px 0 9px;font-size:clamp(2.3rem,8vw,4rem);line-height:.88;letter-spacing:-.06em}.angle-modal-card h1 span{color:var(--yellow)}.angle-modal-card h2{font-size:2.1rem}.angle-modal-card>p:not(.modal-kicker){margin:0;color:#bfdae2;line-height:1.42}.selector-label{margin-top:14px!important;color:#fff!important;font-size:.68rem;font-weight:900;text-transform:uppercase}.year-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:7px}.year-grid button{min-height:75px;padding:10px;border:2px solid transparent;border-radius:13px;background:#104b61;color:#fff;text-align:left;cursor:pointer}.year-grid button.active{border-color:var(--yellow);background:#176179;box-shadow:inset 0 0 0 2px rgba(255,221,87,.15)}.year-grid b,.year-grid small{display:block}.year-grid small{margin-top:3px;color:#a9ced8;font-size:.65rem;line-height:1.25}.how-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0}.how-grid article{display:flex;min-height:56px;align-items:center;gap:9px;padding:8px;border-radius:12px;background:#104b61}.how-grid article>span{display:grid;flex:0 0 34px;height:34px;place-items:center;border-radius:9px;background:var(--yellow);color:#443100;font-weight:950}.how-grid b,.how-grid small{display:block}.how-grid small{margin-top:2px;color:#a9ced8;font-size:.65rem;line-height:1.2}.primary-button,.secondary-button{width:100%;min-height:49px;border:2px solid #07957b;border-radius:13px;background:var(--mint);color:#063b40;font-weight:950;box-shadow:0 5px 0 #087865;cursor:pointer}.secondary-button{border-color:#8eaab3;background:#fff;color:#183f4d;box-shadow:0 5px 0 #718d97}.angle-modal-card>small{display:block;margin-top:11px;color:#8fb9c4;font-size:.64rem;text-align:center}.angle-dialog{width:min(610px,calc(100% - 24px));max-height:calc(100dvh - 24px);padding:0;border:0;background:transparent;overflow:auto}.angle-dialog::backdrop{background:rgba(2,25,35,.73);backdrop-filter:blur(6px)}.angle-dialog .angle-modal-card{width:auto}.close-button{position:absolute;top:11px;right:11px;width:42px;height:42px;border:0;background:transparent;color:#bdd5dd;font-size:1.7rem;cursor:pointer}.result-measures{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin:13px 0}.result-measures span{padding:9px;border-radius:11px;background:#104b61;text-align:center}.result-measures small,.result-measures b{display:block}.result-measures small{color:#9bc3cc;font-size:.57rem;text-transform:uppercase}.result-measures b{margin-top:2px;color:var(--yellow);font-size:.85rem}.result-question{padding:13px;border-radius:14px;background:#fff;color:var(--ink)}.result-question p{margin:0 0 10px;font-weight:900;line-height:1.3}.answer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.answer-grid button{min-height:52px;padding:8px;border:2px solid #c9dcdf;border-radius:10px;background:#f3f9f9;color:var(--ink);font-weight:850;cursor:pointer}.answer-grid button.correct{border-color:#31aa5b;background:#daf5df}.answer-grid button.wrong{border-color:#da625a;background:#ffe3e0}.result-support{display:flex;gap:7px;margin-top:9px}.result-teaching{margin-top:9px;padding:11px;border-radius:11px;background:#0d4a60}.result-teaching p{margin:4px 0;color:#c4dce2;font-size:.76rem;line-height:1.4}.result-teaching small{color:#9bc6cf}.answer-feedback{min-height:1.3em;margin:10px 0 8px!important;color:#fff!important;font-weight:900}.result-card>.primary-button,.result-card>.secondary-button{margin-top:6px}.complete-card{text-align:center}.cup{display:grid;width:76px;height:76px;place-items:center;margin:0 auto 12px;border-radius:23px;background:var(--yellow);color:#7a5700;font-size:2.3rem;box-shadow:0 7px 0 #a9770e}.complete-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:18px}.angle-dialog a{display:flex;min-height:42px;align-items:center;justify-content:center;margin-top:8px;color:#bdd6dd;font-weight:850;text-decoration:none}
@media(max-width:720px){.angle-brand b{display:none}.angle-hud{gap:5px}.angle-brand{padding-right:5px}.level-pill,.star-pill{padding:6px 9px}.hud-button{width:42px;min-height:42px}.mission-card{top:67px;width:min(290px,calc(100vw - 24px));padding:11px 12px}.mission-card h1{font-size:.96rem}.mission-card>p{display:none}.mission-support{position:absolute;top:7px;right:8px;margin:0}.mission-meta{padding-right:104px}.mission-support button{min-height:30px;padding:4px 8px;font-size:.64rem}.target-range{margin-top:7px;padding-top:6px}.flight-stats{top:67px;grid-template-columns:repeat(2,82px);gap:5px}.flight-stats div{padding:6px 8px}.flight-stats b{font-size:.82rem}.shot-controls{grid-template-columns:1fr 105px;gap:7px;padding:8px}.angle-control{grid-column:1}.angle-control>div{grid-template-columns:34px 1fr 34px 48px}.angle-control button{width:34px;height:34px}.power-control{grid-column:1}.hit-button{grid-column:2;grid-row:1/3;min-height:90px}.hit-button small{font-size:.54rem}.year-grid{grid-template-columns:1fr}.year-grid button{min-height:53px}.year-grid small{display:inline}.how-grid{grid-template-columns:1fr 1fr}.result-measures{grid-template-columns:1fr 1fr}.answer-grid{grid-template-columns:1fr}.answer-grid button{min-height:45px}.angle-dialog .angle-modal-card{padding:18px}}
@media(max-width:480px){.star-pill{margin-left:auto}.mission-card{right:10px;left:10px;width:auto}.flight-stats{top:177px;right:10px;grid-template-columns:repeat(4,1fr);left:10px}.flight-stats div{min-width:0;text-align:center}.flight-stats i{display:none}.shot-controls{right:8px;bottom:max(8px,env(safe-area-inset-bottom));left:8px}.angle-control>div{grid-template-columns:32px 1fr 32px 44px}.angle-control button{width:32px;height:32px}.power-sweet{font-size:.45rem}.welcome{padding:8px}.angle-modal-card{padding:16px}.angle-modal-card h1{font-size:2.45rem}.how-grid{margin:10px 0}.how-grid article{min-height:48px;padding:6px}.how-grid small{font-size:.58rem}}
@media(max-height:560px) and (orientation:landscape){.angle-game{min-height:0}.angle-hud{top:5px}.angle-brand,.level-pill,.star-pill,.hud-button{min-height:39px}.angle-brand span{width:29px;height:29px}.hud-button{width:39px}.mission-card{top:53px;left:7px;width:280px;padding:8px 10px}.mission-card h1{margin:5px 0;font-size:.88rem}.mission-card>p,.target-range span{display:none}.target-range{margin-top:5px;padding-top:4px}.mission-support{top:5px}.mission-teaching{position:fixed;top:52px;left:295px;width:240px;margin:0}.flight-stats{top:53px;right:7px;grid-template-columns:repeat(4,75px)}.shot-controls{right:7px;bottom:7px;left:7px;grid-template-columns:minmax(250px,1fr) minmax(190px,1fr) 155px;padding:7px}.hit-button{min-height:56px}.control-label{margin-bottom:2px}.angle-modal-card{padding:13px}.angle-modal-card h1{font-size:2.2rem}.angle-modal-card>p:not(.modal-kicker){font-size:.72rem}.selector-label{margin-top:8px!important}.year-grid{grid-template-columns:repeat(3,1fr)}.year-grid button{min-height:50px;padding:6px}.how-grid{grid-template-columns:repeat(4,1fr);margin:8px 0}.how-grid article{min-height:44px;padding:5px}.how-grid article>span{flex-basis:28px;height:28px}.how-grid small{display:none}.angle-modal-card>small{display:none}.result-measures{margin:8px 0}.result-question{padding:8px}.answer-grid button{min-height:38px}.result-teaching{padding:7px}.answer-feedback{margin:5px 0!important}}
@media(prefers-reduced-motion:reduce){.angle-toast,.power-track i{transition:none}}