/* ATA Market redesigned homepage — design tokens + base styles */
:root {
  --brand:#1f7bff;--brand-2:#14b8ff;--brand-deep:#1a3fd0;--glow-ice:#3aa8ff;--accent:#1f7bff;--info:#3aa8ff;--glow-matrix:#3ddc84;
  --fg-1:#f5f6fa;--fg-2:#c4c7d1;--fg-3:#8a8a93;--fg-4:#5a5a63;
  --bg-canvas:#000;--ink-950:#070709;--ink-900:#0d0d11;--ink-850:#131318;--surface-raised:#0f0f14;
  --border-subtle:rgba(255,255,255,.08);--border-default:rgba(255,255,255,.14);
  --shadow-overlay:0 24px 80px -16px rgba(0,0,0,.85);
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-16:64px;--space-24:96px;
  --text-xs:.75rem;--text-sm:.875rem;--text-base:1rem;--text-lg:1.125rem;--text-xl:1.25rem;
  --tracking-tight:-0.01em;--tracking-tighter:-0.02em;--tracking-tightest:-0.035em;--tracking-widest:0.2em;
  --font-sans:'Inter',system-ui,-apple-system,sans-serif;--font-mono:ui-monospace,'SF Mono',Menlo,monospace;
  --type-display:800 3.5rem/1.02 'Bricolage Grotesque',var(--font-sans);
  --type-h1:800 clamp(2rem,1.4rem + 2.2vw,3rem)/1.05 'Bricolage Grotesque',var(--font-sans);
  --type-h2:700 1.75rem/1.15 var(--font-sans);--type-h3:700 1.125rem/1.3 var(--font-sans);
  --type-body:400 1rem/1.6 var(--font-sans);--type-body-sm:400 .9375rem/1.55 var(--font-sans);
  --type-eyebrow:600 .75rem/1 var(--font-sans);--type-label:600 1rem/1.2 var(--font-sans);
  --dur-fast:150ms;--dur-base:300ms;--ease-out:cubic-bezier(.16,1,.3,1);
  --radius-xs:10px;--radius-sm:12px;--radius-md:9999px;--radius-lg:24px;--radius-xl:28px;--radius-2xl:36px;
  --content-max:1200px;--hero-gap:28px;--hero-pad-x:clamp(20px,4vw,48px);--size-hero:clamp(3rem,1.8rem + 6vw,6.5rem);
}
.ata-home{position:relative;min-height:100vh;background:var(--bg-canvas);color:var(--fg-2);font-family:var(--font-sans);text-wrap:pretty;overflow-x:hidden}
.ata-home *{box-sizing:border-box}
.ata-home a{color:var(--fg-2);text-decoration:none}.ata-home a:hover{color:var(--brand-2)}
.ata-home h1,.ata-home h2,.ata-home h3,.ata-home p{margin:0}
.ata-home [x-cloak]{display:none!important}
.ata-glass{background:linear-gradient(180deg,rgba(255,255,255,.1),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 16px 40px -12px rgba(0,0,0,.8);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%)}
.ata-glass-soft{background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),inset 0 -1px 0 rgba(255,255,255,.08),inset 0 -10px 20px -12px rgba(255,255,255,.12),0 10px 28px -10px rgba(0,0,0,.7);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%)}
.ata-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--font-sans);font-weight:500;cursor:pointer;white-space:nowrap;border-radius:9999px;transition:background var(--dur-fast) var(--ease-out),border-color var(--dur-fast),transform var(--dur-fast)}
.ata-btn-primary{color:#fff;background:linear-gradient(180deg,rgba(96,170,255,.62),rgba(31,123,255,.42));border:1px solid rgba(170,215,255,.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -10px 18px -8px rgba(8,40,130,.45),0 10px 30px -8px rgba(31,123,255,.6);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%)}
.ata-btn-primary:hover{background:linear-gradient(180deg,rgba(120,185,255,.75),rgba(31,123,255,.55));color:#fff}
.ata-btn-ghost{color:#fff;background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),inset 0 -1px 0 rgba(255,255,255,.08),inset 0 -10px 20px -12px rgba(255,255,255,.12),0 10px 28px -10px rgba(0,0,0,.7);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%)}
.ata-btn-ghost:hover{background:linear-gradient(180deg,rgba(255,255,255,.24),rgba(255,255,255,.08));color:#fff}
.ata-header{box-sizing:border-box;position:fixed;top:12px;left:0;right:0;margin:0 auto;width:min(880px,calc(100% - 24px));z-index:30;display:flex;align-items:center;gap:24px;padding:8px 8px 8px 20px;border-radius:9999px;transition:width 420ms var(--ease-out),top 420ms var(--ease-out),padding 420ms var(--ease-out),gap 420ms var(--ease-out),box-shadow 420ms}
.ata-header.is-scrolled{top:8px;width:min(600px,calc(100% - 24px));padding:4px 4px 4px 14px;gap:16px;box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 12px 32px -8px rgba(0,0,0,.8),0 0 24px rgba(31,123,255,.15)}
.ata-logo{display:flex;align-items:center;gap:10px;margin-right:auto}.ata-logo img{width:28px;height:28px;object-fit:contain;transition:width 420ms var(--ease-out),height 420ms var(--ease-out)}
.ata-header.is-scrolled .ata-logo img{width:24px;height:24px}
.ata-nav{display:flex;gap:24px;font-size:var(--text-sm);white-space:nowrap;transition:gap 420ms var(--ease-out)}
.ata-header.is-scrolled .ata-nav{gap:16px}
.ata-nav-toggle{display:none!important}
@media (max-width:720px){
  .ata-nav{display:none}
  .ata-nav-toggle{display:grid!important}
  .ata-header{gap:12px}
}
.ata-mobile-nav{position:fixed;top:72px;left:16px;right:16px;z-index:29;display:none;flex-direction:column;padding:10px;border-radius:24px;gap:2px}
@media (max-width:720px){.ata-mobile-nav{display:flex}}
.ata-mobile-nav a{padding:12px 16px;border-radius:16px;color:var(--fg-1);font-size:var(--text-base);font-weight:500;text-decoration:none;transition:background 150ms}
.ata-mobile-nav a:hover,.ata-mobile-nav a:active{background:rgba(255,255,255,.08)}
.ata-header-login{height:44px;padding:0 20px;font-size:14px;margin-right:-12px}
.ata-icon-btn{position:relative;width:44px;height:44px;border-radius:9999px;color:var(--fg-1);display:grid;place-items:center;cursor:pointer;border:0;transition:background var(--dur-fast) var(--ease-out)}
.ata-cart-count{position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;padding:0 5px;border-radius:9999px;background:var(--brand);color:#fff;font-size:11px;font-weight:600;display:grid;place-items:center;box-shadow:0 0 12px rgba(31,123,255,.7)}
.ata-hero{z-index:2;position:relative;min-height:min(100vh,880px);display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:0 0 48px 48px}
.ata-shader{position:absolute;inset:0;width:100%;height:100%;background:#000;overflow:hidden}
.ata-shader canvas{display:block;position:absolute;inset:0;width:100%;height:100%}
.ata-hero-inner{position:relative;z-index:10;display:flex;flex-direction:column;align-items:center;gap:var(--hero-gap);padding:140px var(--hero-pad-x) 96px;text-align:center}
.ata-hero-title{font-family:'Bricolage Grotesque',var(--font-sans);font-weight:800;font-size:var(--size-hero);line-height:.95;letter-spacing:-.035em;color:var(--fg-1);text-shadow:0 0 40px rgba(31,123,255,.45)}
.ata-hero-actions{display:flex;gap:var(--space-3);flex-wrap:wrap;justify-content:center}.ata-hero-actions .ata-btn{height:48px;padding:0 28px;font-size:15px}
.ata-flow{position:relative;isolation:isolate;z-index:1}
.ata-tiles{position:absolute;top:-85px;left:0;right:0;bottom:0;z-index:-1;overflow:hidden;pointer-events:none}
.ata-tiles-grid{display:grid;grid-template-columns:repeat(auto-fill,120px);grid-auto-rows:120px;gap:40px;justify-content:center}
.ata-tile{width:120px;height:120px;opacity:0;animation:ataTileIn 700ms ease-out forwards;object-fit:contain;filter:grayscale(1) brightness(1.4)}
.ata-marquee{margin:var(--space-10) 0 0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent);mask-image:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent)}
.ata-marquee-track{display:flex;align-items:center;gap:96px;width:max-content;padding:var(--space-6) 36px;animation:ataMarquee 48s linear infinite;will-change:transform}
.ata-brand{display:flex;align-items:center;gap:20px;flex:none;color:#8a8a93;opacity:.85}
.ata-brand span.ic{width:72px;height:72px;flex:none;background:center/contain no-repeat}
.ata-brand span.nm{font-size:56px;font-weight:700;letter-spacing:-.03em;white-space:nowrap}
.ata-main{max-width:var(--content-max);margin:0 auto;padding:0 clamp(20px,4vw,48px)}
.ata-catalog{padding:var(--space-24) 0 var(--space-16)}
.ata-catalog-title{font:var(--type-display);font-size:clamp(2.75rem,calc(2rem + 3vw),4.5rem);letter-spacing:var(--tracking-tighter);color:var(--fg-1);margin:0 0 var(--space-16);text-align:center}
.ata-search-wrap{max-width:560px;margin:0 auto var(--space-6)}
.ata-search{display:flex;align-items:center;gap:var(--space-3);height:56px;padding:0 8px 0 22px;border-radius:9999px;color:var(--fg-3);transition:border-color var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast)}
.ata-search:focus-within{border-color:var(--brand);box-shadow:0 0 0 3px rgba(31,123,255,.2)}
.ata-search input{flex:1;min-width:0;height:100%;border:0;outline:0;background:transparent;color:var(--fg-1);font-family:var(--font-sans);font-size:15px}
.ata-search .clr{width:40px;height:40px;flex:none;border-radius:9999px;display:grid;place-items:center;color:var(--fg-2);cursor:pointer;border:0}
.ata-cats{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:760px;margin:0 auto}
.ata-cat-pill{padding:9px 20px;border-radius:9999px;background:rgba(255,255,255,.04);border:1px solid var(--border-subtle);color:var(--fg-2);font-size:var(--text-sm);font-weight:600;cursor:pointer;transition:background var(--dur-fast) var(--ease-out),border-color var(--dur-fast),color var(--dur-fast)}
.ata-cat-pill:hover{background:rgba(255,255,255,.08);color:var(--fg-1)}
.ata-cat-pill.active{background:linear-gradient(180deg,rgba(96,170,255,.75),rgba(31,123,255,.6));border-color:rgba(170,215,255,.5);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 10px 24px -8px rgba(31,123,255,.55)}
.ata-noresults{text-align:center;font:var(--type-body);color:var(--fg-3);margin:var(--space-16) 0 0}
.ata-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr));gap:var(--space-5);margin-top:var(--space-16)}
.ata-card{display:flex;flex-direction:column;background:var(--ink-900);border:1px solid var(--border-subtle);border-radius:22px;overflow:hidden;transition:border-color var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out),box-shadow var(--dur-base);animation:ataCardIn 420ms var(--ease-out) backwards}
.ata-card:hover{border-color:rgba(31,123,255,.55);transform:translateY(-4px);box-shadow:0 0 32px rgba(31,123,255,.18)}
.ata-card-media{position:relative;aspect-ratio:16/9;background:var(--ink-850);overflow:hidden}
.ata-card-media img{width:100%;height:100%;object-fit:cover}
.ata-card-media .ph{width:100%;height:100%;display:grid;place-items:center;color:rgba(31,123,255,.35);background:linear-gradient(135deg,#18181b,#09090b)}
.ata-card-badge{position:absolute;top:10px;left:10px;display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:9999px;background:var(--brand);color:#fff;font-size:var(--text-xs);font-weight:600;letter-spacing:.04em;box-shadow:0 0 18px rgba(31,123,255,.6);pointer-events:none}
.ata-card-body{display:flex;align-items:center;gap:var(--space-3);padding:14px 14px 14px 16px}
.ata-card-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.ata-card-name{font-size:15px;font-weight:600;line-height:1.25;letter-spacing:var(--tracking-tight);color:var(--fg-1);margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ata-card-meta{display:flex;align-items:center;gap:8px;font-size:12px}
.ata-card-price{font-size:17px;font-weight:600;letter-spacing:var(--tracking-tight);color:var(--fg-1)}.ata-card-price .from{font-size:11px;font-weight:500;color:var(--fg-3);margin-right:4px}
.ata-card-dot{width:3px;height:3px;border-radius:9999px;background:var(--fg-4)}
.ata-card-stock{display:flex;align-items:center;gap:4px;font-weight:500}.ata-card-stock svg{width:13px;height:13px}
.ata-card-add{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;cursor:pointer;transition:background var(--dur-fast) var(--ease-out);border:1px solid rgba(170,215,255,.4);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 6px 18px -6px rgba(31,123,255,.5);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%)}.ata-card-add svg{width:17px;height:17px}
.ata-card-add:hover{background:linear-gradient(180deg,rgba(120,185,255,.6),rgba(31,123,255,.4))!important}
.ata-more-row{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-3);margin-top:var(--space-10)}.ata-more-row .ata-btn-ghost{height:48px;padding:0 26px;font-size:15px}
.ata-show-less{height:48px;padding:0 22px;border:0;border-radius:9999px;background:transparent;color:var(--fg-3);font-family:var(--font-sans);font-size:14px;font-weight:500;cursor:pointer}.ata-show-less:hover{color:var(--fg-1)}
.ata-sec{padding:var(--space-16) 0}
.ata-eyebrow{font:var(--type-eyebrow);letter-spacing:var(--tracking-widest);text-transform:uppercase;color:var(--brand-2)}
.ata-h1{font:var(--type-h1);letter-spacing:var(--tracking-tighter);color:var(--fg-1);margin:0}
.ata-head{display:flex;flex-direction:column;gap:var(--space-3);margin-bottom:var(--space-10)}
.ata-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:var(--space-4)}
.ata-step{display:flex;flex-direction:column;gap:var(--space-3);border:1px solid var(--border-subtle);background:var(--ink-900);border-radius:28px;padding:28px}
.ata-step-n{width:40px;height:40px;border-radius:9999px;display:grid;place-items:center;font:var(--type-eyebrow);color:#fff;background:var(--brand);box-shadow:0 0 18px rgba(31,123,255,.5)}.ata-step h3{font:var(--type-h3);color:var(--fg-1)}.ata-step p{font:var(--type-body-sm);color:var(--fg-3)}
.ata-pay{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3);margin-top:var(--space-8)}.ata-pay .lbl{font-size:var(--text-sm);color:var(--fg-3)}
.ata-badge-neutral{display:inline-flex;align-items:center;padding:4px 12px;border-radius:9999px;background:rgba(255,255,255,.06);border:1px solid var(--border-subtle);color:var(--fg-2);font-size:var(--text-xs);font-weight:600}
.ata-reviews-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--space-6);margin-bottom:var(--space-10)}
.ata-badge-glow{display:inline-flex;align-items:center;gap:8px;padding:5px 14px;border-radius:9999px;background:rgba(31,123,255,.12);border:1px solid rgba(58,168,255,.5);color:var(--brand-2);font-size:var(--text-xs);font-weight:600;box-shadow:0 0 20px rgba(58,168,255,.35)}.ata-badge-glow .dot{width:7px;height:7px;border-radius:9999px;background:var(--brand-2);box-shadow:0 0 8px var(--brand-2)}
.ata-reviews-track-wrap{overflow:hidden;margin:0 calc(-1 * clamp(20px,4vw,48px));-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.ata-reviews-track{display:flex;gap:var(--space-4);width:max-content;animation:ataMarquee 60s linear infinite;will-change:transform}.ata-reviews-track:hover{animation-play-state:paused}
.ata-review{width:340px;flex:none;display:flex;flex-direction:column;gap:var(--space-4);padding:24px;background:var(--ink-900);border:1px solid var(--border-subtle);border-radius:24px}
.ata-review .stars{display:flex;gap:2px;color:var(--brand-2)}.ata-review .stars svg{width:14px;height:14px}.ata-review p{font:var(--type-body);color:var(--fg-1)}
.ata-review .who{margin-top:auto;font-size:var(--text-sm);color:var(--fg-3)}.ata-review .who span{font-family:var(--font-mono);font-size:var(--text-xs)}
.ata-faq{padding:var(--space-16) 0 var(--space-24);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:var(--space-10)}
.ata-faq-left{display:flex;flex-direction:column;gap:var(--space-3)}.ata-faq-left p{font:var(--type-body);color:var(--fg-3);max-width:36ch}
.ata-faq-list{display:flex;flex-direction:column;gap:var(--space-2)}
.ata-faq-item{border-radius:24px;padding:0 var(--space-6)}
.ata-faq-q{all:unset;box-sizing:border-box;width:100%;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding:var(--space-5) 0;font:var(--type-label);font-size:var(--text-base);color:var(--fg-1)}.ata-faq-q svg{width:16px;height:16px;color:var(--brand-2);flex:none}
.ata-faq-a{font:var(--type-body-sm);color:var(--fg-3);margin:0;padding:0 0 var(--space-5);max-width:60ch}
.ata-footer{margin:0 12px 12px;border:1px solid var(--border-subtle);border-radius:36px;background:var(--ink-950)}
.ata-footer-inner{max-width:var(--content-max);margin:0 auto;padding:var(--space-10) clamp(20px,4vw,48px);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-6);font-size:var(--text-sm);color:var(--fg-3)}
.ata-footer-brand{display:flex;align-items:center;gap:10px}.ata-footer-brand img{width:22px;height:22px;object-fit:contain}.ata-footer-brand .nm{color:var(--fg-1);font-weight:600;letter-spacing:var(--tracking-tighter)}
.ata-footer-links{display:flex;flex-wrap:wrap;gap:var(--space-6)}
.ata-toast{position:fixed;left:16px;bottom:16px;z-index:35;width:min(380px,calc(100% - 32px));animation:ataToastIn 520ms var(--ease-out) both;display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4);border-radius:24px}
.ata-toast .ic{width:40px;height:40px;flex:none;border-radius:9999px;display:grid;place-items:center;background:rgba(31,123,255,.18);color:var(--brand-2)}
.ata-toast .tx{flex:1;min-width:0}.ata-toast .tx .t1{color:var(--fg-1);font-size:var(--text-sm);font-weight:500}.ata-toast .tx .t2{color:var(--fg-3);font-size:var(--text-xs)}
.ata-toast .cl{width:32px;height:32px;flex:none;border:0;background:transparent;color:var(--fg-3);cursor:pointer;border-radius:9999px;display:grid;place-items:center}.ata-toast .cl:hover{color:var(--fg-1)}
.ata-totop{position:fixed;right:16px;bottom:16px;z-index:35;width:56px;height:56px;border-radius:9999px;display:grid;place-items:center;cursor:pointer;color:#fff;border:1px solid rgba(170,215,255,.5)}.ata-totop svg{width:22px;height:22px}
.ata-cart-overlay{position:fixed;inset:0;z-index:40;background:rgba(0,0,0,.7)}
.ata-cart{position:fixed;top:12px;right:12px;bottom:12px;z-index:50;width:min(420px,calc(100% - 24px));display:flex;flex-direction:column;background:var(--surface-raised);border:1px solid var(--border-default);border-radius:32px;box-shadow:var(--shadow-overlay);overflow:hidden}
.ata-cart-head{display:flex;align-items:center;justify-content:space-between;padding:var(--space-5) var(--space-6);border-bottom:1px solid var(--border-subtle)}.ata-cart-head h3{font:var(--type-h2);font-size:var(--text-xl);color:var(--fg-1)}
.ata-cart-body{flex:1;overflow:auto;padding:var(--space-2) var(--space-6)}.ata-cart-empty{font:var(--type-body-sm);color:var(--fg-3);padding:var(--space-10) 0;margin:0}
.ata-cart-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4) 0;border-bottom:1px solid var(--border-subtle)}
.ata-cart-item .mono{width:42px;height:42px;flex:none;border-radius:14px;display:grid;place-items:center;font-weight:600;color:#fff;overflow:hidden;background:linear-gradient(135deg,var(--brand-2),var(--brand) 55%,var(--brand-deep))}
.ata-cart-item .mono img{width:100%;height:100%;object-fit:cover}
.ata-cart-item .nm{color:var(--fg-1);font-size:var(--text-sm);font-weight:500}.ata-cart-item .tm{color:var(--fg-3);font-size:var(--text-xs)}
.ata-cart-item .pr{color:var(--fg-1);font-size:var(--text-sm);font-family:var(--font-mono)}
.ata-cart-item .rm{width:32px;height:32px;flex:none;border:0;background:transparent;color:var(--fg-3);cursor:pointer;border-radius:9999px;display:grid;place-items:center}.ata-cart-item .rm:hover{color:#ff6b6b}
.ata-cart-foot{padding:var(--space-6);border-top:1px solid var(--border-subtle);display:flex;flex-direction:column;gap:var(--space-4)}
.ata-cart-total{display:flex;justify-content:space-between;color:var(--fg-1);font-size:var(--text-lg);font-weight:600}
.ata-checkout{width:100%;height:50px;font-size:15px}
.ata-cart-note{font-size:var(--text-xs);color:var(--fg-3)}
.ata-group-overlay{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.7);backdrop-filter:blur(2px)}
.ata-group-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:70;width:min(480px,calc(100% - 32px));max-height:min(620px,calc(100% - 48px));display:flex;flex-direction:column;border-radius:32px;overflow:hidden}
.ata-group-modal-transition{transition:opacity 300ms var(--ease-out),transform 300ms var(--ease-out)}
.ata-group-modal-out{opacity:0;transform:translate(-50%,-50%) scale(.94)}
.ata-group-modal-in{opacity:1;transform:translate(-50%,-50%) scale(1)}
.ata-group-head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-3);padding:var(--space-6);border-bottom:1px solid var(--border-subtle)}
.ata-group-head h3{margin:0;font:var(--type-h2);font-size:var(--text-xl);color:var(--fg-1)}
.ata-group-head p{margin:4px 0 0;font-size:var(--text-sm);color:var(--fg-3)}
.ata-group-list{flex:1;overflow:auto;padding:var(--space-3) var(--space-4)}
.ata-group-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3);border-radius:20px;text-decoration:none;transition:background var(--dur-fast) var(--ease-out)}
.ata-group-item:hover{background:rgba(255,255,255,.06)}
.ata-group-item-media{width:48px;height:48px;flex:none;border-radius:14px;overflow:hidden;background:linear-gradient(135deg,var(--brand-2),var(--brand) 55%,var(--brand-deep));display:grid;place-items:center;color:#fff}
.ata-group-item-media img{width:100%;height:100%;object-fit:cover}
.ata-group-item-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ata-group-item-info .nm{color:var(--fg-1);font-size:var(--text-sm);font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ata-group-item-info .st{color:var(--fg-3);font-size:var(--text-xs)}
.ata-group-item>.pr{color:var(--fg-1);font-size:var(--text-sm);font-family:var(--font-mono);flex:none}
.ata-group-item-arrow{width:32px;height:32px;flex:none;border-radius:9999px;display:grid;place-items:center;color:var(--brand-2);background:rgba(31,123,255,.12)}
.ata-group-item-add{width:32px;height:32px;flex:none;border-radius:9999px;display:grid;place-items:center;color:var(--fg-1);background:rgba(255,255,255,.06);border:0;cursor:pointer;transition:background var(--dur-fast) var(--ease-out),color var(--dur-fast)}
.ata-group-item-add:hover{background:var(--brand);color:#fff}
@keyframes ataGroupIn{from{opacity:0;transform:translate(-50%,-50%) scale(.94)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes ataCardIn{from{opacity:0;transform:translateY(16px) scale(.96)}to{opacity:1;transform:none}}
@keyframes ataToastIn{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
@keyframes ataTileIn{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:.09;transform:none}}
@keyframes ataMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes ataAurora{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.ata-home *{animation:none!important}}