#arc-magic-trigger{position:absolute;z-index:7;width:52px;height:52px;transform:translate(-50%,-50%);border:2px solid #ffe5a777;border-radius:50%;background:#15292c44;color:#fff1b2;font:700 17px system-ui;cursor:pointer;pointer-events:auto;touch-action:none;box-shadow:0 0 14px #badcb166}
#arc-magic-trigger span{display:block;transform:translateY(-12px);text-shadow:0 1px 4px #08252a}
#arc-magic-trigger:hover,#arc-magic-trigger:focus-visible{border-color:#fff0b1;background:#29423bc0;outline:2px solid #fff0b1;outline-offset:2px}
#arc-magic-menu{position:absolute;z-index:8;width:260px;height:260px;transform:translate(-50%,-50%);border:1px solid #dfc98d;border-radius:50%;background:#0e222adf;box-shadow:0 0 0 8px #102b2b77,0 14px 34px #05171bd9;backdrop-filter:blur(6px);pointer-events:auto;touch-action:none}
#arc-magic-menu button{position:absolute;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:3px;width:104px;min-height:62px;padding:5px;border:1px solid #c2d3ac;border-radius:11px;background:#30483eea;color:#fff2d4;text-align:center;cursor:pointer;touch-action:none}
#arc-magic-menu button strong{font:700 13px/1.15 system-ui}#arc-magic-menu button small{font:10px/1.2 system-ui;color:#d6e9d4}
#arc-magic-menu button[data-magic-mode=wand]{left:78px;top:0;border-color:#e7cf9e}
#arc-magic-menu button[data-magic-mode=storm]{right:0;top:99px;border-color:#a8ccfb}
#arc-magic-menu button[data-magic-mode=ember]{left:78px;bottom:0;border-color:#efb791}
#arc-magic-menu button[data-magic-mode=halo]{left:0;top:99px;border-color:#b4dfba}
#arc-magic-menu button[aria-checked=true],#arc-magic-menu button.aimed,#arc-magic-menu button:hover,#arc-magic-menu button:focus-visible{outline:2px solid #fff3bd;outline-offset:2px;background:#456a54}
#arc-magic-menu button[data-locked=true]{border-color:#b9c1b580;background:#24343bd9;color:#b7c3bd}
#arc-magic-menu button[data-locked=true] small{color:#e0cead}
#arc-magic-current{position:absolute;left:105px;top:107px;display:flex;align-items:center;justify-content:center;width:50px;height:46px;color:#ffe8b0;text-align:center;font:700 11px/1.1 system-ui;pointer-events:none}
@media(max-width:480px){#arc-magic-menu{width:234px;height:234px}#arc-magic-menu button{width:96px;min-height:58px}#arc-magic-menu button[data-magic-mode=wand],#arc-magic-menu button[data-magic-mode=ember]{left:69px}#arc-magic-menu button[data-magic-mode=storm],#arc-magic-menu button[data-magic-mode=halo]{top:88px}#arc-magic-current{left:92px;top:94px}}
@media(prefers-reduced-motion:reduce){#arc-magic-trigger,#arc-magic-menu{transition:none}}

/* Spell choice lives with the controls; the wizard stays unobscured. */
#arc-magic-trigger{position:fixed;left:auto;top:auto;right:258px;bottom:max(14px,env(safe-area-inset-bottom));transform:none;width:74px;height:42px;min-height:42px;display:flex;align-items:center;justify-content:center;gap:4px;padding:5px;border:1px solid #d9c694a3;border-radius:9px;background:#213d3ddc;box-shadow:0 4px 14px #07161977;color:#fff0ca;font:700 12px/1.1 var(--wizard-copy,system-ui)}
#arc-magic-trigger span{display:inline;transform:none;font:17px/1 var(--wizard-copy,system-ui)}
#arc-magic-trigger small{display:inline;font:700 12px/1 var(--wizard-copy,system-ui)}
@media(max-width:760px){#arc-magic-trigger{right:70px;bottom:max(16px,env(safe-area-inset-bottom));width:54px;height:50px;min-height:50px;flex-direction:column;gap:0;padding:3px}#arc-magic-trigger small{font-size:10px}#arc-magic-trigger span{font-size:16px}}
@media(max-height:500px){#arc-magic-trigger{bottom:10px}}
@media(min-width:761px) and (max-height:500px){#arc-magic-trigger{right:252px;bottom:10px}}

/* Five spell choices remain readable on the compact phone radial. */
#arc-magic-menu button{width:92px;min-height:58px}
#arc-magic-menu button[data-magic-mode=wand]{left:84px;top:0}
#arc-magic-menu button[data-magic-mode=storm]{left:auto;right:1px;top:64px}
#arc-magic-menu button[data-magic-mode=ember]{left:auto;right:24px;top:auto;bottom:5px}
#arc-magic-menu button[data-magic-mode=halo]{left:24px;top:auto;bottom:5px}
#arc-magic-menu button[data-magic-mode=boomerang]{left:1px;top:64px;border-color:#b9d9f2}
@media(max-width:480px){
 #arc-magic-menu button{width:84px;min-height:54px}
 #arc-magic-menu button[data-magic-mode=wand]{left:75px;top:0}
 #arc-magic-menu button[data-magic-mode=storm]{left:auto;right:0;top:57px}
 #arc-magic-menu button[data-magic-mode=ember]{left:auto;right:20px;top:auto;bottom:4px}
 #arc-magic-menu button[data-magic-mode=halo]{left:20px;top:auto;bottom:4px}
 #arc-magic-menu button[data-magic-mode=boomerang]{left:0;top:57px}
}

/* Six separate touch targets leave the center and orbit gaps unobstructed. */
#arc-magic-menu button{width:90px;min-height:54px}
#arc-magic-menu button[data-magic-mode=wand]{left:85px;top:0}
#arc-magic-menu button[data-magic-mode=storm]{left:auto;right:0;top:48px}
#arc-magic-menu button[data-magic-mode=ember]{left:auto;right:0;top:auto;bottom:48px}
#arc-magic-menu button[data-magic-mode=orbitals]{left:85px;top:auto;bottom:0;border-color:#9ee8eb}
#arc-magic-menu button[data-magic-mode=halo]{left:0;top:auto;bottom:48px}
#arc-magic-menu button[data-magic-mode=boomerang]{left:0;top:48px}
@media(max-width:480px){
 #arc-magic-menu button{width:78px;min-height:50px}
 #arc-magic-menu button[data-magic-mode=wand]{left:78px;top:0}
 #arc-magic-menu button[data-magic-mode=storm]{left:auto;right:0;top:42px}
 #arc-magic-menu button[data-magic-mode=ember]{left:auto;right:0;top:auto;bottom:42px}
 #arc-magic-menu button[data-magic-mode=orbitals]{left:78px;top:auto;bottom:0}
 #arc-magic-menu button[data-magic-mode=halo]{left:0;top:auto;bottom:42px}
 #arc-magic-menu button[data-magic-mode=boomerang]{left:0;top:42px}
}

/* Seven story spells share a ring with open space for the selected name. */
#arc-magic-menu{width:314px;height:314px}
#arc-magic-menu button{width:90px;min-height:54px}
#arc-magic-menu button[data-magic-mode=wand]{left:112px;top:0}
#arc-magic-menu button[data-magic-mode=storm]{left:198px;right:auto;top:35px}
#arc-magic-menu button[data-magic-mode=ember]{left:219px;right:auto;top:154px;bottom:auto}
#arc-magic-menu button[data-magic-mode=boomerang]{left:160px;top:auto;bottom:4px}
#arc-magic-menu button[data-magic-mode=orbitals]{left:64px;top:auto;bottom:4px}
#arc-magic-menu button[data-magic-mode=halo]{left:5px;top:154px;bottom:auto}
#arc-magic-menu button[data-magic-mode=ice]{left:26px;top:35px;border-color:#a8eaff}
#arc-magic-current{left:132px;top:134px}
@media(max-width:480px){
 #arc-magic-menu{width:282px;height:282px}
 #arc-magic-menu button{width:78px;min-height:50px}
 #arc-magic-menu button[data-magic-mode=wand]{left:102px;top:0}
 #arc-magic-menu button[data-magic-mode=storm]{left:182px;right:auto;top:43px}
 #arc-magic-menu button[data-magic-mode=ember]{left:204px;right:auto;top:140px;bottom:auto}
 #arc-magic-menu button[data-magic-mode=boomerang]{left:146px;top:auto;bottom:0}
 #arc-magic-menu button[data-magic-mode=orbitals]{left:58px;top:auto;bottom:0}
 #arc-magic-menu button[data-magic-mode=halo]{left:0;top:140px;bottom:auto}
 #arc-magic-menu button[data-magic-mode=ice]{left:22px;top:43px}
 #arc-magic-current{left:116px;top:118px}
}

/* Eight earned spells remain separate touch targets around the selector. */
#arc-magic-menu button[data-magic-mode=wand]{left:112px;top:0}
#arc-magic-menu button[data-magic-mode=storm]{left:207px;top:35px}
#arc-magic-menu button[data-magic-mode=ember]{left:224px;top:130px}
#arc-magic-menu button[data-magic-mode=boomerang]{left:207px;top:auto;bottom:35px}
#arc-magic-menu button[data-magic-mode=orbitals]{left:112px;top:auto;bottom:0}
#arc-magic-menu button[data-magic-mode=halo]{left:17px;top:auto;bottom:35px}
#arc-magic-menu button[data-magic-mode=ice]{left:0;top:130px}
#arc-magic-menu button[data-magic-mode=well]{left:17px;top:35px;border-color:#d6b9ff}
@media(max-width:480px){
 #arc-magic-menu button[data-magic-mode=wand]{left:102px;top:0}
 #arc-magic-menu button[data-magic-mode=storm]{left:182px;top:32px}
 #arc-magic-menu button[data-magic-mode=ember]{left:204px;top:116px}
 #arc-magic-menu button[data-magic-mode=boomerang]{left:182px;top:auto;bottom:32px}
 #arc-magic-menu button[data-magic-mode=orbitals]{left:102px;top:auto;bottom:0}
 #arc-magic-menu button[data-magic-mode=halo]{left:22px;top:auto;bottom:20px}
 #arc-magic-menu button[data-magic-mode=ice]{left:0;top:108px}
 #arc-magic-menu button[data-magic-mode=well]{left:22px;top:20px}
}

/* Earned spells share a direct radial switch, with a clear center and distinct targets. */
#arc-magic-menu{box-sizing:border-box;width:388px;height:388px;border-radius:50%;background:radial-gradient(circle,#112b32f2 0 25%,#0d222be8 70%);}
#arc-magic-menu[hidden]{display:none}
#arc-magic-current{position:absolute;left:50%;top:50%;width:86px;height:52px;transform:translate(-50%,-50%);font-size:12px}
#arc-magic-menu button,#arc-magic-menu button[data-magic-mode]{position:absolute;right:auto;bottom:auto;width:88px;min-height:52px;transform:translate(-50%,-50%);padding:3px}
#arc-magic-menu button strong{font-size:11px}
#arc-magic-menu button small{font-size:9px}
#arc-magic-menu button[data-magic-mode=stream]{border-color:#a7eaff}
#arc-magic-menu button[data-magic-mode=sanctuary]{border-color:#a4f3c3}
@media(max-width:480px){#arc-magic-menu{width:344px;height:344px}#arc-magic-menu button,#arc-magic-menu button[data-magic-mode]{width:76px;min-height:50px}#arc-magic-menu button strong{font-size:10px}#arc-magic-menu button small{font-size:8px}}
@media(max-height:450px){#arc-magic-menu button,#arc-magic-menu button[data-magic-mode]{width:70px;min-height:44px}#arc-magic-menu button strong{font-size:9px}#arc-magic-menu button small{font-size:8px}}

/* Spells retain individual radial targets without touching the center. */
#arc-magic-menu button,#arc-magic-menu button[data-magic-mode]{width:78px;min-height:50px}
#arc-magic-menu button[data-magic-mode=ricochet]{border-color:#f1d395}
@media(max-width:480px){#arc-magic-menu button,#arc-magic-menu button[data-magic-mode]{width:66px;min-height:48px}}

/* Thirteen earned attacks stay separate around the touch ring. */
#arc-magic-menu button,#arc-magic-menu button[data-magic-mode]{width:66px;min-height:44px}
#arc-magic-menu button[data-magic-mode=sweep]{border-color:#ffc28c}
#arc-magic-menu button[data-magic-mode=lob]{border-color:#aaf3c3}
@media(max-width:480px){#arc-magic-menu button,#arc-magic-menu button[data-magic-mode]{width:58px;min-height:44px}#arc-magic-menu button strong{font-size:11px}}
@media(max-width:360px){#arc-magic-menu button,#arc-magic-menu button[data-magic-mode]{width:51px;min-height:42px}#arc-magic-menu button strong{font-size:10px}#arc-magic-menu button small{font-size:7px}}
#arc-magic-menu button small{display:none}
#arc-magic-menu button[data-locked=true]::after{content:'🔒';position:absolute;right:1px;top:1px;font-size:9px}
