/* SPLIT CRE · buttons.css · v1
   Four local fixes on the design file: ghost-disabled meets AA,
   hover only where hover exists, focus-visible:active keeps the press,
   and the Barlow face is linked from HTML instead of @import. */
:root{
--btn-font:700 1rem/1 "Barlow Semi Condensed","Arial Narrow",sans-serif;--btn-tracking:0.1em;--btn-transform:uppercase;--btn-text:#ffffff;--btn-text-shadow:0 1px 0 rgba(0,0,0,0.55),0 -1px 0 rgba(255,255,255,0.18);
--btn-radius:10px;--btn-h-sm:44px;--btn-h-lg:52px;--fab-size:56px;--btn-pad-x:20px;--btn-pad-x-lg:24px;--btn-gap:10px;--btn-icon:20px;--fab-icon:28px;
--btn-bright:#8a5cf0;--btn-base:#6b2fd6;--btn-deep:#4b1ba6;--btn-edge:#3a1283;--btn-lip:#2e0d6e;
--btn-grad:linear-gradient(180deg,#9a6df5 0%,var(--btn-base) 55%,var(--btn-deep) 100%);
--btn-grad-hover:linear-gradient(180deg,#a882fa 0%,#7b3fe6 55%,#5a22c0 100%);
--btn-grad-pressed:linear-gradient(180deg,#3a1283 0%,var(--btn-deep) 55%,var(--btn-base) 100%);
--btn-sheen:radial-gradient(130% 90% at 50% -30%,rgba(255,255,255,0.30),rgba(255,255,255,0) 60%);
--btn-sheen-hover:radial-gradient(130% 90% at 50% -30%,rgba(255,255,255,0.42),rgba(255,255,255,0) 60%);
--btn-top-highlight:inset 0 1px 0 rgba(255,255,255,0.50);--btn-top-highlight-hover:inset 0 1px 0 rgba(255,255,255,0.60);--btn-inner-line:inset 0 0 0 1px rgba(255,255,255,0.07);--btn-bottom-edge:inset 0 -2px 0 var(--btn-edge);--btn-lip-shadow:0 3px 0 var(--btn-lip);--btn-lip-shadow-hover:0 4px 0 var(--btn-lip);--btn-drop:0 8px 18px rgba(0,0,0,0.55);--btn-drop-hover:0 11px 22px rgba(0,0,0,0.55);--btn-glow:0 0 22px rgba(138,92,240,0.26);--btn-glow-hover:0 0 28px rgba(138,92,240,0.36);--btn-pressed-inset:inset 0 3px 8px rgba(0,0,0,0.65),inset 0 -1px 0 rgba(255,255,255,0.08);--btn-pressed-drop:0 1px 3px rgba(0,0,0,0.4),0 0 10px rgba(107,47,214,0.14);
--btn-lift:-1px;--btn-sink:3px;--btn-ease:140ms ease;--btn-ease-press:60ms ease;
--btn-focus-ring:var(--btn-bright);--btn-focus-width:2px;--btn-focus-offset:2px;--btn-focus-offset-color:var(--bg);
--btn-disabled-bg:#241f33;--btn-disabled-text:#a8a2b6;--btn-disabled-edge:inset 0 1px 0 rgba(255,255,255,0.06),inset 0 -1px 0 #16121f;
--btn2-bg:#17151e;--btn2-bg-hover:#221f2d;--btn2-bg-pressed:#0f0d15;--btn2-border:rgba(255,255,255,0.16);--btn2-border-hover:var(--btn-bright);--btn2-text:#ffffff;
--btn3-text:#c9b8f7;--btn3-text-hover:#ffffff;--btn3-bg-hover:rgba(107,47,214,0.14);--btn3-bg-pressed:rgba(107,47,214,0.28);}
.btn{appearance:none;-webkit-appearance:none;position:relative;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;gap:var(--btn-gap);height:var(--btn-h-sm);padding:0 var(--btn-pad-x);border:0;border-radius:var(--btn-radius);cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;text-decoration:none;white-space:nowrap;color:var(--btn-text);font:var(--btn-font);letter-spacing:var(--btn-tracking);text-transform:var(--btn-transform);text-shadow:var(--btn-text-shadow);background:var(--btn-sheen),var(--btn-grad);box-shadow:var(--btn-top-highlight),var(--btn-inner-line),var(--btn-bottom-edge),var(--btn-lip-shadow),var(--btn-drop),var(--btn-glow);transform:translateY(0);transition:background var(--btn-ease),box-shadow var(--btn-ease),transform var(--btn-ease),color var(--btn-ease);}
.btn svg{width:var(--btn-icon);height:var(--btn-icon);flex:none;fill:currentColor;filter:drop-shadow(0 1px 0 rgba(0,0,0,0.45));}
.btn:active,.btn.is-pressed{background:var(--btn-grad-pressed);transform:translateY(var(--btn-sink));box-shadow:var(--btn-pressed-inset),0 0 0 var(--btn-lip),var(--btn-pressed-drop);transition-duration:var(--btn-ease-press);}
.btn:focus-visible,.btn.is-focus{outline:0;box-shadow:0 0 0 var(--btn-focus-offset) var(--btn-focus-offset-color),0 0 0 calc(var(--btn-focus-offset) + var(--btn-focus-width)) var(--btn-focus-ring),var(--btn-top-highlight),var(--btn-inner-line),var(--btn-bottom-edge),var(--btn-lip-shadow),var(--btn-drop),var(--btn-glow);}
.btn:focus-visible:active,.btn.is-focus.is-pressed{background:var(--btn-grad-pressed);transform:translateY(var(--btn-sink));box-shadow:0 0 0 var(--btn-focus-offset) var(--btn-focus-offset-color),0 0 0 calc(var(--btn-focus-offset) + var(--btn-focus-width)) var(--btn-focus-ring),var(--btn-pressed-inset),0 0 0 var(--btn-lip),var(--btn-pressed-drop);transition-duration:var(--btn-ease-press);}
.btn[disabled],.btn.is-disabled{cursor:default;pointer-events:none;transform:none;color:var(--btn-disabled-text);text-shadow:none;background:var(--btn-disabled-bg);box-shadow:var(--btn-disabled-edge);}
.btn[disabled] svg,.btn.is-disabled svg{filter:none;}
.btn.is-loading{pointer-events:none;color:transparent;text-shadow:none;}
.btn.is-loading svg{opacity:0;}
.btn.is-loading::after{content:"";position:absolute;inset:0;margin:auto;width:18px;height:18px;border-radius:50%;border:2.5px solid rgba(255,255,255,0.25);border-top-color:var(--btn-text);animation:btn-spin 700ms linear infinite;}
@keyframes btn-spin{to{transform:rotate(360deg);}}
.btn--lg{height:var(--btn-h-lg);padding:0 var(--btn-pad-x-lg);}
.btn--block{display:flex;width:100%;}
.btn--icon{padding-left:calc(var(--btn-pad-x) - 4px);}
.btn--lg.btn--icon{padding-left:calc(var(--btn-pad-x-lg) - 4px);}
.btn--fab{width:var(--fab-size);height:var(--fab-size);padding:0;border-radius:50%;}
.btn--fab svg{width:var(--fab-icon);height:var(--fab-icon);}
.btn--fab.is-loading::after{width:22px;height:22px;}
.btn--secondary{color:var(--btn2-text);background:var(--btn2-bg);box-shadow:inset 0 0 0 1px var(--btn2-border),inset 0 1px 0 rgba(255,255,255,0.08),inset 0 -2px 0 #000,0 3px 0 #000,0 6px 14px rgba(0,0,0,0.45);}
.btn--secondary:active,.btn--secondary.is-pressed{background:var(--btn2-bg-pressed);box-shadow:inset 0 3px 8px rgba(0,0,0,0.7),inset 0 0 0 1px var(--btn2-border),0 0 0 #000,0 1px 3px rgba(0,0,0,0.4);}
.btn--secondary:focus-visible,.btn--secondary.is-focus{box-shadow:0 0 0 var(--btn-focus-offset) var(--btn-focus-offset-color),0 0 0 calc(var(--btn-focus-offset) + var(--btn-focus-width)) var(--btn-focus-ring),inset 0 0 0 1px var(--btn2-border),inset 0 1px 0 rgba(255,255,255,0.08),inset 0 -2px 0 #000,0 3px 0 #000,0 6px 14px rgba(0,0,0,0.45);}
.btn--secondary:focus-visible:active,.btn--secondary.is-focus.is-pressed{background:var(--btn2-bg-pressed);transform:translateY(var(--btn-sink));box-shadow:0 0 0 var(--btn-focus-offset) var(--btn-focus-offset-color),0 0 0 calc(var(--btn-focus-offset) + var(--btn-focus-width)) var(--btn-focus-ring),inset 0 3px 8px rgba(0,0,0,0.7),inset 0 0 0 1px var(--btn2-border),0 0 0 #000,0 1px 3px rgba(0,0,0,0.4);transition-duration:var(--btn-ease-press);}
.btn--secondary.is-loading::after{border-color:rgba(255,255,255,0.2);border-top-color:var(--btn-bright);}
.btn--ghost{color:var(--btn3-text);background:transparent;box-shadow:none;text-shadow:none;}
.btn--ghost svg{filter:none;}
.btn--ghost:active,.btn--ghost.is-pressed{background:var(--btn3-bg-pressed);transform:translateY(1px);box-shadow:none;}
.btn--ghost:focus-visible,.btn--ghost.is-focus{box-shadow:0 0 0 var(--btn-focus-offset) var(--btn-focus-offset-color),0 0 0 calc(var(--btn-focus-offset) + var(--btn-focus-width)) var(--btn-focus-ring);}
.btn--ghost[disabled],.btn--ghost.is-disabled{background:transparent;box-shadow:none;color:#7d7889;}
.btn--ghost.is-loading::after{border-top-color:var(--btn3-text);}
@media (hover:hover){
.btn:hover{background:var(--btn-sheen-hover),var(--btn-grad-hover);transform:translateY(var(--btn-lift));box-shadow:var(--btn-top-highlight-hover),var(--btn-inner-line),var(--btn-bottom-edge),var(--btn-lip-shadow-hover),var(--btn-drop-hover),var(--btn-glow-hover);}
.btn--secondary:hover{background:var(--btn2-bg-hover);box-shadow:inset 0 0 0 1px var(--btn2-border-hover),inset 0 1px 0 rgba(255,255,255,0.12),inset 0 -2px 0 #000,0 4px 0 #000,0 9px 18px rgba(0,0,0,0.5);}
.btn--ghost:hover{color:var(--btn3-text-hover);background:var(--btn3-bg-hover);transform:none;box-shadow:none;}
}
@media (prefers-reduced-motion:reduce){.btn,.btn:hover,.btn:active,.btn.is-pressed,.btn--ghost:active{transition:none;transform:none;}.btn.is-loading::after{animation-duration:1.6s;}}