/* ================================================================
   HMWorkout — main.css  v3.0
   LUXURY INDIAN FLAG THEME
   Colors: Saffron · White/Cream · Green · Ashoka Navy
   Fonts: Plus Jakarta Sans + Inter
   ================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&family=Inter:wght@300;400;500;600;700&display=swap');

:root {
  --c-saffron:    #FF6B00;
  --c-saffron-2:  #FF9933;
  --c-saffron-3:  #FFC078;
  --c-green:      #138808;
  --c-green-2:    #1DB954;
  --c-navy:       #000080;
  --c-chakra:     #1565C0;
  --c-gold:       #FFD700;
  --c-gold-2:     #FFA000;
  --c-red:        #C62828;
  --c-purple:     #6A1B9A;
  --c-blue:       #1565C0;
  --c-orange:     #FF6B00;

  --bg-base:      #FFFEF7;
  --bg-surface:   #FFFFFF;
  --bg-raised:    #FFF8F0;
  --bg-card:      #FFFFFF;
  --bg-input:     #FFF8F0;
  --bg-overlay:   rgba(0,0,128,0.55);

  --t-primary:    #1A0500;
  --t-secondary:  #5D4037;
  --t-muted:      #A1887F;
  --t-inverse:    #FFFFFF;
  --t-link:       #FF6B00;

  --border:       #FFD7AA;
  --border-strong:#FF9933;

  --r-xs:4px; --r-sm:8px; --r-md:14px; --r-lg:22px;
  --r-xl:32px; --r-2xl:48px; --r-full:9999px;

  --shadow-xs:    0 1px 2px rgba(255,107,0,0.06);
  --shadow-sm:    0 2px 8px rgba(255,107,0,0.10);
  --shadow-md:    0 4px 20px rgba(255,107,0,0.14);
  --shadow-lg:    0 12px 48px rgba(255,107,0,0.18);
  --shadow-xl:    0 24px 80px rgba(0,0,128,0.18);
  --shadow-saffron:0 8px 32px rgba(255,107,0,0.40);
  --shadow-green: 0 8px 32px rgba(19,136,8,0.35);
  --shadow-navy:  0 8px 32px rgba(0,0,128,0.30);
  --shadow-blue:  0 8px 32px rgba(21,101,192,0.30);
  --shadow-orange:0 8px 32px rgba(255,107,0,0.40);
  --shadow-glow:  0 0 60px rgba(255,107,0,0.25);

  --font-display: 'Plus Jakarta Sans', sans-serif;
  --font-body:    'Inter', sans-serif;

  --fs-xs:11px; --fs-sm:13px; --fs-base:15px; --fs-md:17px;
  --fs-lg:20px; --fs-xl:24px; --fs-2xl:32px;  --fs-3xl:44px;
  --fs-4xl:56px; --fs-hero:72px;

  --fw-light:300; --fw-regular:400; --fw-medium:500;
  --fw-semibold:600; --fw-bold:700; --fw-black:800;

  --lh-tight:1.15; --lh-snug:1.3; --lh-normal:1.6; --lh-loose:1.8;

  --s-1:4px;  --s-2:8px;  --s-3:12px; --s-4:16px;
  --s-5:20px; --s-6:24px; --s-8:32px; --s-10:40px;
  --s-12:48px;--s-16:64px;--s-20:80px;--s-24:96px;--s-32:128px;

  --ease-fast:  all 0.15s ease;
  --ease-smooth:all 0.35s cubic-bezier(0.4,0,0.2,1);
  --ease-spring:all 0.5s cubic-bezier(0.34,1.56,0.64,1);
  --ease-slow:  all 0.7s cubic-bezier(0.4,0,0.2,1);

  --grad-hero:     linear-gradient(135deg,#000080 0%,#1565C0 40%,#FF6B00 100%);
  --grad-saffron:  linear-gradient(135deg,#FF9933 0%,#FF6B00 100%);
  --grad-green:    linear-gradient(135deg,#138808 0%,#1DB954 100%);
  --grad-navy:     linear-gradient(135deg,#000080 0%,#1565C0 100%);
  --grad-orange:   linear-gradient(135deg,#FF9933 0%,#FF6B00 100%);
  --grad-blue:     linear-gradient(135deg,#1565C0 0%,#1976D2 100%);
  --grad-gold:     linear-gradient(135deg,#FFD700 0%,#FFA000 100%);
  --grad-card:     linear-gradient(145deg,rgba(255,255,247,0.95) 0%,rgba(255,248,240,0.80) 100%);
  --grad-glass:    linear-gradient(135deg,rgba(255,255,255,0.20) 0%,rgba(255,255,255,0.08) 100%);
  --grad-mesh:     radial-gradient(at 40% 20%,hsla(24,100%,50%,0.12) 0px,transparent 50%),
                   radial-gradient(at 80% 0%,hsla(134,100%,28%,0.08) 0px,transparent 50%),
                   radial-gradient(at 0% 50%,hsla(240,100%,25%,0.10) 0px,transparent 50%);

  --z-base:1;--z-card:10;--z-nav:100;--z-modal:200;--z-toast:300;--z-top:400;
  --container-max:1260px;
  --nav-h:72px;
}

html.dark {
  --bg-base:#050B1A; --bg-surface:#080F20; --bg-raised:#0D1625;
  --bg-card:#0F1A30; --bg-input:#0A1220; --bg-overlay:rgba(0,0,0,0.75);
  --t-primary:#FFF8F0; --t-secondary:#BFA880; --t-muted:#7A6055;
  --border:#1E2A10; --border-strong:#2A4A2A;
  --shadow-md:0 4px 20px rgba(0,0,0,0.40);
  --shadow-lg:0 12px 48px rgba(0,0,0,0.50);
  --grad-card:linear-gradient(145deg,rgba(15,26,48,0.95) 0%,rgba(10,18,32,0.90) 100%);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--font-body);font-size:var(--fs-base);line-height:var(--lh-normal);color:var(--t-primary);background:var(--bg-base);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img,video,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{cursor:pointer;font-family:var(--font-body);border:none;background:none}
input,select,textarea{font-family:var(--font-body)}
ul,ol{list-style:none}
h1,h2,h3,h4,h5,h6{font-family:var(--font-display);line-height:var(--lh-tight);font-weight:var(--fw-bold);color:var(--t-primary)}

.container{width:100%;max-width:var(--container-max);margin:0 auto;padding:0 var(--s-6)}
@media(max-width:768px){.container{padding:0 var(--s-4)}}
.section{padding:var(--s-24) 0}
@media(max-width:768px){.section{padding:var(--s-16) 0}}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s-6)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-6)}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s-6)}
@media(max-width:1024px){.grid-4,.grid-3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.grid-4,.grid-3,.grid-2{grid-template-columns:1fr}}
.flex{display:flex}.flex-center{display:flex;align-items:center;justify-content:center}
.flex-between{display:flex;align-items:center;justify-content:space-between}
.flex-col{display:flex;flex-direction:column}
.gap-2{gap:var(--s-2)}.gap-4{gap:var(--s-4)}.gap-6{gap:var(--s-6)}.gap-8{gap:var(--s-8)}
.text-center{text-align:center}.text-right{text-align:right}
.hidden{display:none!important}.visible{display:block!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.section-header{text-align:center;max-width:680px;margin:0 auto var(--s-12)}
.section-tag{display:inline-flex;align-items:center;gap:var(--s-2);padding:var(--s-1) var(--s-4);background:linear-gradient(135deg,rgba(255,107,0,0.10),rgba(255,153,51,0.08));border:1px solid rgba(255,107,0,0.25);border-radius:var(--r-full);font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:var(--c-saffron);text-transform:uppercase;letter-spacing:0.08em;margin-bottom:var(--s-4)}
.section-title{font-size:var(--fs-3xl);font-weight:var(--fw-black);color:var(--t-primary);line-height:var(--lh-tight);margin-bottom:var(--s-4)}
.section-title span{background:var(--grad-saffron);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.section-subtitle{font-size:var(--fs-md);color:var(--t-secondary);line-height:var(--lh-loose)}
@media(max-width:768px){.section-title{font-size:var(--fs-2xl)}}

/* ── LUXURY BUTTONS ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-2);padding:13px 28px;border-radius:var(--r-full);font-family:var(--font-display);font-weight:var(--fw-semibold);font-size:var(--fs-base);line-height:1;cursor:pointer;border:none;transition:all 0.35s cubic-bezier(0.34,1.2,0.64,1);text-decoration:none;white-space:nowrap;position:relative;overflow:hidden;letter-spacing:0.01em}
.btn::before{content:'';position:absolute;top:0;left:-100%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.22),transparent);transform:skewX(-15deg);transition:left 0.6s ease}
.btn:hover::before{left:160%}
.btn::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at center,rgba(255,255,255,0.25),transparent 60%);opacity:0;transform:scale(0);transition:transform 0.4s ease,opacity 0.4s ease}
.btn:active::after{opacity:1;transform:scale(2.5);transition:0s}
.btn-primary{background:var(--grad-saffron);color:#fff;box-shadow:var(--shadow-saffron)}
.btn-primary:hover{transform:translateY(-4px) scale(1.03);box-shadow:0 16px 50px rgba(255,107,0,0.55)}
.btn-primary:active{transform:translateY(-1px) scale(0.99)}
.btn-secondary{background:var(--bg-surface);color:var(--c-saffron);border:2px solid var(--c-saffron)}
.btn-secondary:hover{background:var(--c-saffron);color:#fff;transform:translateY(-3px);box-shadow:var(--shadow-saffron)}
.btn-green{background:var(--grad-green);color:#fff;box-shadow:var(--shadow-green)}
.btn-green:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 16px 50px rgba(19,136,8,0.50)}
.btn-navy{background:var(--grad-navy);color:#fff;box-shadow:var(--shadow-navy)}
.btn-navy:hover{transform:translateY(-3px) scale(1.03)}
.btn-ghost{background:transparent;color:var(--t-secondary);border:1.5px solid var(--border)}
.btn-ghost:hover{background:var(--bg-raised);color:var(--t-primary);border-color:var(--c-saffron);transform:translateY(-2px)}
.btn-danger{background:var(--c-red);color:#fff}
.btn-danger:hover{background:#B71C1C;transform:translateY(-2px)}
.btn-sm{padding:9px 20px;font-size:var(--fs-sm)}
.btn-lg{padding:17px 40px;font-size:var(--fs-md)}
.btn-xl{padding:20px 52px;font-size:var(--fs-lg);font-weight:var(--fw-bold)}
.btn-icon{width:44px;height:44px;padding:0;border-radius:var(--r-full)}
.btn[disabled],.btn.loading{opacity:0.55;cursor:not-allowed;transform:none!important}
.btn.loading::before{content:'';width:16px;height:16px;border:2px solid rgba(255,255,255,0.4);border-top-color:#fff;border-radius:50%;animation:spin 0.8s linear infinite;margin-right:var(--s-2);position:relative;left:auto;top:auto;transform:none;background:none}

/* ── CARDS ── */
.card{background:var(--bg-card);border-radius:var(--r-lg);border:1px solid var(--border);box-shadow:var(--shadow-sm);padding:var(--s-8);transition:var(--ease-smooth)}
.card:hover{transform:translateY(-5px);box-shadow:0 16px 50px rgba(255,107,0,0.14);border-color:var(--c-saffron-3)}
.card-feature{background:var(--bg-card);border-radius:var(--r-lg);border:1px solid var(--border);padding:var(--s-8);transition:var(--ease-smooth);position:relative;overflow:hidden}
.card-feature::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad-saffron);transform:scaleX(0);transform-origin:left;transition:transform 0.4s ease}
.card-feature:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.card-feature:hover::before{transform:scaleX(1)}
.card-glass{background:var(--grad-glass);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid rgba(255,255,255,0.15);border-radius:var(--r-lg);padding:var(--s-8);transition:var(--ease-smooth)}

/* ── FORMS ── */
.form-group{display:flex;flex-direction:column;gap:var(--s-2);margin-bottom:var(--s-5)}
.form-label{font-size:var(--fs-sm);font-weight:var(--fw-semibold);color:var(--t-secondary);letter-spacing:0.02em}
.form-input{width:100%;padding:13px 16px;background:var(--bg-input);border:1.5px solid var(--border);border-radius:var(--r-md);font-size:var(--fs-base);font-family:var(--font-body);color:var(--t-primary);transition:var(--ease-fast);outline:none;appearance:none;-webkit-appearance:none}
.form-input:focus{border-color:var(--c-saffron);background:var(--bg-surface);box-shadow:0 0 0 4px rgba(255,107,0,0.12)}
.form-input::placeholder{color:var(--t-muted)}
.form-input.error{border-color:var(--c-red)}
.form-input.success{border-color:var(--c-green)}
.form-select{width:100%;padding:13px 40px 13px 16px;background:var(--bg-input);border:1.5px solid var(--border);border-radius:var(--r-md);font-size:var(--fs-base);font-family:var(--font-body);color:var(--t-primary);cursor:pointer;transition:var(--ease-fast);outline:none;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23A1887F' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}
.form-select:focus{border-color:var(--c-saffron);box-shadow:0 0 0 4px rgba(255,107,0,0.12)}
.form-error{font-size:var(--fs-sm);color:var(--c-red);display:flex;align-items:center;gap:var(--s-1);margin-top:var(--s-1)}
.form-hint{font-size:var(--fs-sm);color:var(--t-muted);margin-top:var(--s-1)}
.otp-group{display:flex;gap:var(--s-3);justify-content:center}
.otp-box{width:54px;height:60px;text-align:center;font-size:var(--fs-xl);font-weight:var(--fw-bold);font-family:var(--font-display);background:var(--bg-input);border:2px solid var(--border);border-radius:var(--r-md);color:var(--t-primary);transition:var(--ease-fast);outline:none}
.otp-box:focus{border-color:var(--c-saffron);box-shadow:0 0 0 4px rgba(255,107,0,0.12);transform:scale(1.06)}
.otp-box.filled{border-color:var(--c-green);background:rgba(19,136,8,0.08)}

/* ── BADGES ── */
.badge{display:inline-flex;align-items:center;gap:var(--s-1);padding:3px 10px;border-radius:var(--r-full);font-size:var(--fs-xs);font-weight:var(--fw-semibold);text-transform:uppercase;letter-spacing:0.06em}
.badge-blue,.badge-navy{background:rgba(21,101,192,0.12);color:var(--c-chakra)}
.badge-orange,.badge-saffron{background:rgba(255,107,0,0.12);color:var(--c-saffron)}
.badge-green{background:rgba(19,136,8,0.12);color:var(--c-green)}
.badge-red{background:rgba(198,40,40,0.12);color:var(--c-red)}
.badge-gold{background:rgba(255,215,0,0.15);color:var(--c-gold-2)}
.badge-gray{background:var(--bg-raised);color:var(--t-secondary)}
.badge-purple{background:rgba(106,27,154,0.12);color:var(--c-purple)}

/* ── TOASTS ── */
.toast-container{position:fixed;bottom:var(--s-6);right:var(--s-6);z-index:var(--z-toast);display:flex;flex-direction:column;gap:var(--s-3);pointer-events:none}
.toast{display:flex;align-items:center;gap:var(--s-3);padding:var(--s-4) var(--s-5);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-lg);box-shadow:var(--shadow-lg);min-width:280px;max-width:380px;pointer-events:all;animation:toastIn 0.4s cubic-bezier(0.34,1.56,0.64,1)}
.toast.hide{animation:toastOut 0.35s ease forwards}
.toast-icon{width:36px;height:36px;border-radius:var(--r-full);display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0}
.toast.success .toast-icon{background:rgba(19,136,8,0.12);color:var(--c-green)}
.toast.error   .toast-icon{background:rgba(198,40,40,0.12);color:var(--c-red)}
.toast.info    .toast-icon{background:rgba(21,101,192,0.12);color:var(--c-chakra)}
.toast.warning .toast-icon{background:rgba(255,107,0,0.12);color:var(--c-saffron)}
.toast-content{flex:1}
.toast-title{font-weight:var(--fw-semibold);font-size:var(--fs-base);color:var(--t-primary);margin-bottom:2px}
.toast-msg{font-size:var(--fs-sm);color:var(--t-secondary)}

/* ── PROGRESS ── */
.progress-bar{width:100%;height:8px;background:var(--bg-raised);border-radius:var(--r-full);overflow:hidden}
.progress-fill{height:100%;background:var(--grad-saffron);border-radius:var(--r-full);transition:width 0.6s cubic-bezier(0.4,0,0.2,1)}
.progress-fill.green{background:var(--grad-green)}
.progress-fill.blue,.progress-fill.navy{background:var(--grad-navy)}

/* ── STEP INDICATOR ── */
.step-indicator{display:flex;align-items:center;margin-bottom:var(--s-8);width:100%}
.step-item{display:flex;flex-direction:column;align-items:center;flex:1;position:relative}
.step-item:not(:last-child)::after{content:'';position:absolute;top:18px;left:50%;right:-50%;height:2px;background:var(--border);z-index:0}
.step-item.done:not(:last-child)::after{background:var(--c-green)}
.step-item.active:not(:last-child)::after{background:var(--grad-saffron)}
.step-dot{width:36px;height:36px;border-radius:var(--r-full);background:var(--bg-raised);border:2px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:var(--fs-sm);font-weight:var(--fw-bold);color:var(--t-muted);z-index:1;transition:var(--ease-smooth)}
.step-item.active .step-dot{background:var(--grad-saffron);border-color:var(--c-saffron);color:#fff;box-shadow:var(--shadow-saffron);transform:scale(1.1)}
.step-item.done   .step-dot{background:var(--c-green);border-color:var(--c-green);color:#fff}
.step-label{font-size:var(--fs-xs);color:var(--t-muted);margin-top:var(--s-2);text-align:center;font-weight:var(--fw-medium)}
.step-item.active .step-label{color:var(--c-saffron);font-weight:var(--fw-semibold)}
.step-item.done   .step-label{color:var(--c-green)}
@media(max-width:640px){.step-label{display:none}.step-dot{width:28px;height:28px;font-size:11px}}

/* ── AVATAR ── */
.avatar-placeholder{border-radius:var(--r-full);background:var(--grad-saffron);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:var(--fw-bold);flex-shrink:0}
.avatar-sm{width:32px;height:32px;font-size:11px}.avatar-md{width:44px;height:44px;font-size:14px}
.avatar-lg{width:64px;height:64px;font-size:20px}.avatar-xl{width:96px;height:96px;font-size:30px}
.avatar-2xl{width:128px;height:128px;font-size:40px}

/* ── TOOLTIP (mouse hover guidance) ── */
[data-tooltip]{position:relative}
[data-tooltip]::before{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%) translateY(4px);background:rgba(0,0,80,0.95);color:#fff;font-size:var(--fs-xs);font-weight:var(--fw-medium);padding:6px 12px;border-radius:var(--r-sm);white-space:nowrap;pointer-events:none;opacity:0;transition:var(--ease-fast);z-index:var(--z-top);border:1px solid rgba(255,107,0,0.3);max-width:220px;white-space:normal;text-align:center;line-height:1.5}
[data-tooltip]::after{content:'';position:absolute;bottom:calc(100% + 4px);left:50%;transform:translateX(-50%);border:5px solid transparent;border-top-color:rgba(0,0,80,0.95);pointer-events:none;opacity:0;transition:var(--ease-fast)}
[data-tooltip]:hover::before{opacity:1;transform:translateX(-50%) translateY(0)}
[data-tooltip]:hover::after{opacity:1}

/* ── MODALS ── */
.modal-overlay{position:fixed;inset:0;background:var(--bg-overlay);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:var(--z-modal);display:flex;align-items:center;justify-content:center;padding:var(--s-4);animation:fadeIn 0.25s ease}
.modal-box{background:var(--bg-surface);border-radius:var(--r-xl);border:1px solid var(--border);box-shadow:var(--shadow-xl);padding:var(--s-10);width:100%;max-width:520px;max-height:90vh;overflow-y:auto;animation:scaleInBounce 0.4s cubic-bezier(0.34,1.56,0.64,1);position:relative}
.modal-close{position:absolute;top:var(--s-5);right:var(--s-5);width:36px;height:36px;border-radius:var(--r-full);background:var(--bg-raised);border:1px solid var(--border);color:var(--t-muted);display:flex;align-items:center;justify-content:center;transition:var(--ease-fast);font-size:16px}
.modal-close:hover{background:var(--c-red);color:#fff}

/* ── DIVIDERS ── */
.divider{width:100%;height:1px;background:var(--border);margin:var(--s-6) 0}
.divider-text{display:flex;align-items:center;gap:var(--s-4);color:var(--t-muted);font-size:var(--fs-sm);margin:var(--s-6) 0}
.divider-text::before,.divider-text::after{content:'';flex:1;height:1px;background:var(--border)}

/* ── SKELETON ── */
.skeleton{background:linear-gradient(90deg,var(--bg-raised) 25%,rgba(255,107,0,0.08) 50%,var(--bg-raised) 75%);background-size:600px 100%;animation:shimmer 1.6s infinite;border-radius:var(--r-sm)}
html.dark .skeleton{background:linear-gradient(90deg,rgba(255,255,255,0.04) 25%,rgba(255,107,0,0.08) 50%,rgba(255,255,255,0.04) 75%);background-size:600px 100%}

/* ── MISC UTILS ── */
.glass{background:var(--grad-glass);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid rgba(255,255,255,0.14)}
.theme-toggle{width:40px;height:40px;border-radius:var(--r-full);display:flex;align-items:center;justify-content:center;background:var(--bg-raised);border:1px solid var(--border);color:var(--t-secondary);transition:var(--ease-smooth);font-size:16px;flex-shrink:0}
.theme-toggle:hover{background:var(--c-saffron);border-color:var(--c-saffron);color:#fff;transform:rotate(20deg) scale(1.1)}
.tricolor-bar{height:4px;background:linear-gradient(90deg,#FF9933 33%,#FFFFFF 33%,#FFFFFF 66%,#138808 66%);border-radius:var(--r-full)}
html.transitioning *{transition:background-color 0.3s ease,border-color 0.3s ease,color 0.3s ease!important}
::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--c-saffron),var(--c-green));border-radius:99px}
::selection{background:rgba(255,107,0,0.18);color:var(--t-primary)}
:focus-visible{outline:2px solid var(--c-saffron);outline-offset:3px;border-radius:4px}
*{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
html.dark .card,html.dark .card-feature{background:linear-gradient(145deg,rgba(255,255,255,0.04),rgba(255,255,255,0.02));border-color:rgba(255,107,0,0.12)}
html.dark .card:hover,html.dark .card-feature:hover{border-color:rgba(255,107,0,0.3);box-shadow:0 8px 40px rgba(255,107,0,0.12)}
@media(hover:none){.btn:active{transform:scale(0.97)}}