.modes{flex-direction:column;gap:16px;width:100%;max-width:1180px;margin:0 auto;padding:22px 16px 60px;display:flex}.modes-head{align-items:baseline;gap:12px;display:flex}.modes-head h1{font-family:var(--font-head);letter-spacing:.12em;text-transform:uppercase;margin:0;font-size:22px}.modes-head span{color:var(--text-dim);font-size:13px}.mode-hero[data-tone=up],.mode-tile[data-tone=up]{--tone:#ffae39}.mode-hero[data-tone=cl],.mode-tile[data-tone=cl]{--tone:#ff4d4f}.mode-hero[data-tone=ct],.mode-tile[data-tone=ct]{--tone:#5aa9ff}.mode-hero[data-tone=cd],.mode-tile[data-tone=cd]{--tone:var(--acc)}.mode-hero[data-tone=bt],.mode-tile[data-tone=bt]{--tone:#2ed3c6}.mode-hero[data-tone=fl],.mode-tile[data-tone=fl]{--tone:#f3e9a8}.mode-kick{letter-spacing:.24em;text-transform:uppercase;color:var(--tone);align-items:center;gap:8px;font-size:11px;display:inline-flex}.mode-kick b{background:var(--tone);width:7px;height:7px;box-shadow:0 0 12px 2px color-mix(in srgb, var(--tone) 70%, transparent);border-radius:50%}.mode-hero .mode-kick b{animation:1.6s ease-in-out infinite mode-pulse}@keyframes mode-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.75)}}.mode-hero{border-radius:var(--r-panel);isolation:isolate;min-height:250px;color:inherit;background-color:var(--glass-bg);background-image:var(--glass-sheen);box-shadow:var(--glass-sh);border:1px solid color-mix(in srgb, var(--tone) 32%, transparent);align-items:center;gap:26px;padding:28px 30px;text-decoration:none;display:flex;position:relative;overflow:hidden}.mode-hero-grid{z-index:0;pointer-events:none;opacity:.5;background:linear-gradient(color-mix(in srgb, var(--tone) 10%, transparent) 1px, transparent 1px) 0 0 / 100% 34px, linear-gradient(90deg, color-mix(in srgb, var(--tone) 10%, transparent) 1px, transparent 1px) 0 0 / 34px 100%, radial-gradient(70% 120% at 80% 50%, color-mix(in srgb, var(--tone) 22%, transparent), transparent 70%);position:absolute;inset:0;-webkit-mask-image:linear-gradient(90deg,#0000,#000 40%,#000);mask-image:linear-gradient(90deg,#0000,#000 40%,#000)}.mode-hero-corners i{border:2px solid color-mix(in srgb, var(--tone) 70%, transparent);width:22px;height:22px;position:absolute}.mode-hero-corners i:first-child{border-bottom:0;border-right:0;top:12px;left:12px}.mode-hero-corners i:nth-child(2){border-bottom:0;border-left:0;top:12px;right:12px}.mode-hero-corners i:nth-child(3){border-top:0;border-right:0;bottom:12px;left:12px}.mode-hero-corners i:nth-child(4){border-top:0;border-left:0;bottom:12px;right:12px}.mode-hero-em{z-index:2;object-fit:contain;width:132px;height:132px;filter:drop-shadow(0 0 26px color-mix(in srgb, var(--tone) 45%, transparent));flex:none;transition:transform .2s;position:relative}.mode-hero:hover .mode-hero-em{transform:translateY(-2px)scale(1.02)}.mode-hero-body{z-index:2;flex-direction:column;gap:10px;max-width:560px;display:flex;position:relative}.mode-hero-name{font-family:var(--font-head);text-transform:uppercase;background:linear-gradient(180deg, #fff 30%, color-mix(in srgb, var(--tone) 65%, #fff));color:#0000;-webkit-background-clip:text;background-clip:text;font-size:clamp(34px,4.4vw,52px);line-height:.98}.mode-hero-text{color:var(--text-dim);font-size:14px;line-height:1.55}.mode-go{border-radius:var(--btn-r);min-height:var(--btn-h);background:var(--gold);color:#12100c;box-shadow:0 10px 26px rgba(var(--gold-rgb), .22);align-self:flex-start;align-items:center;gap:8px;margin-top:6px;padding:12px 24px;font-size:14px;font-weight:700;transition:transform .16s;display:inline-flex}.mode-go svg{width:17px;height:17px;transition:transform .16s}.mode-hero:hover .mode-go{transform:translateY(-1px)}.mode-hero:hover .mode-go svg{transform:translate(3px)}.modes-grid{grid-template-columns:repeat(2,1fr);gap:14px;display:grid}.mode-tile{border-radius:var(--r-card);color:inherit;background-color:var(--glass-bg-soft);background-image:var(--glass-sheen);box-shadow:var(--glass-sh);border:1px solid var(--glass-line);grid-template-columns:84px 1fr;align-items:center;gap:16px;padding:18px 20px;text-decoration:none;transition:transform .16s,border-color .16s;display:grid;position:relative;overflow:hidden}.mode-tile:hover{border-color:color-mix(in srgb, var(--tone) 50%, transparent);transform:translateY(-2px)}.mode-tile{isolation:isolate}.mode-bg{z-index:-1;pointer-events:none;transition:transform .4s var(--ease,ease);background-position:100%;background-size:cover;position:absolute;inset:0}.mode-bg:after{content:"";background:linear-gradient(90deg,#08090ef0 0%,#08090eb8 42%,#08090e40 100%),linear-gradient(#08090e00 55%,#08090ed9 100%);position:absolute;inset:0}.mode-tile:hover .mode-bg,.mode-hero:hover .mode-bg{transform:scale(1.04)}.mode-tile-em{object-fit:contain;width:84px;height:84px;filter:drop-shadow(0 0 18px color-mix(in srgb, var(--tone) 35%, transparent))}.mode-tile-body{flex-direction:column;gap:5px;display:flex}.mode-tile-name{font-family:var(--font-head);letter-spacing:.06em;text-transform:uppercase;font-size:20px}.mode-tile-sub{color:var(--text-dim);font-size:12.5px;line-height:1.45}.mode-tile-foot{border-top:1px solid #ffffff12;flex-wrap:wrap;grid-column:1/-1;gap:10px;margin-top:4px;padding-top:12px;display:flex}.mode-tile-foot>span{flex-direction:column;gap:2px;min-width:96px;display:flex}.mode-tile-foot i{letter-spacing:.14em;text-transform:uppercase;color:var(--text-dim);font-size:10.5px;font-style:normal}.mode-tile-foot b{color:var(--tone);font-variant-numeric:tabular-nums;font-size:14px}@media (max-width:900px){.modes{padding:16px 14px 48px}.mode-hero{flex-direction:column;align-items:flex-start;gap:14px;min-height:0;padding:22px 18px 24px}.mode-hero-em{width:84px;height:84px}.modes-grid{grid-template-columns:1fr}.mode-tile{grid-template-columns:64px 1fr;padding:16px}.mode-tile-em{width:64px;height:64px}}
