/* TokensFN premium visual refresh — presentation only */
:root{--bg:#070b14;--card:#0e1625;--card2:#121f32;--line:#23334b;--tx:#f4f7ff;--mu:#91a2bb;--ac:#4f7cff;--ac2:#35d5f4;--gold:#f7c96b;--ok:#42d6a4;--bad:#ff7187}
html{background:var(--bg)}
body{background:radial-gradient(900px 520px at 82% -12%,rgba(51,100,255,.20),transparent 66%),radial-gradient(680px 520px at 0% 35%,rgba(29,197,221,.075),transparent 68%),linear-gradient(180deg,#080d17 0%,#070b13 100%);letter-spacing:.005em}
.wrap{max-width:1600px;padding:0 34px 38px 270px}
header{min-height:76px;margin:0 -34px 26px -270px;padding:14px 34px 14px 270px;background:rgba(7,13,24,.82);border-bottom:1px solid rgba(126,157,204,.14);backdrop-filter:blur(20px)}
.logo{font-size:20px;letter-spacing:.055em}.logo b{background:linear-gradient(105deg,#78a5ff,#47e2e4);-webkit-background-clip:text;background-clip:text}
.side{width:238px;padding:24px 14px 18px;background:rgba(9,16,29,.94);border-right:1px solid rgba(126,157,204,.15);box-shadow:12px 0 44px #0002;gap:5px}
.side:before{content:'TOKEN / ARENA';position:absolute;top:20px;left:25px;font-size:12px;letter-spacing:.19em;font-weight:900;color:#dbe7ff}
.side small{margin:22px 12px 7px;font-size:10px;letter-spacing:.18em;font-weight:800;color:#657995}
.side button{display:flex;align-items:center;gap:12px;min-height:43px;padding:10px 13px;border:1px solid transparent;border-radius:11px;color:#9fb0c8;font-size:13px;transition:background .18s,border-color .18s,color .18s,transform .18s}
.side button svg{width:17px;height:17px;flex:none;opacity:.9}
.side button:hover{background:#14233a;border-color:#263b5a;color:#fff;transform:translateX(2px)}
.side button.on{background:linear-gradient(100deg,rgba(65,111,255,.24),rgba(35,205,225,.08));border-color:rgba(93,142,255,.24);color:#f7fbff;box-shadow:inset 3px 0 0 #64a0ff,0 7px 20px #0002}
.me{gap:9px}.pill{border-radius:11px;background:#101d30;border-color:#283a55}.pill.t{color:#f7d477;background:linear-gradient(110deg,#2c2415,#151d29);border-color:#5d4c2a}.pbtn{background:#101b2d;border-color:#283a55}
button{border-radius:11px;background:linear-gradient(115deg,#4c79ff,#3465e9);box-shadow:0 5px 16px rgba(42,91,220,.12);font-size:13px;transition:filter .2s,transform .15s,box-shadow .2s}
button:hover{filter:brightness(1.12);box-shadow:0 7px 22px rgba(42,91,220,.2)}button:active{transform:translateY(1px) scale(.99)}button.g{background:#121f32;border:1px solid #2a3b55;color:#dce7fa;box-shadow:none}button.r{background:linear-gradient(120deg,#a12b46,#742239)}
input,textarea,select{background:#0a1220!important;border-color:#283b56!important;border-radius:11px!important;color:#f3f7ff}input:focus,textarea:focus,select:focus{border-color:#5b8bff!important;box-shadow:0 0 0 3px rgba(74,126,255,.13)}
.card,.cord-card{background:linear-gradient(145deg,rgba(17,29,48,.96),rgba(10,18,31,.98));border:1px solid rgba(113,145,190,.18);border-radius:17px;box-shadow:0 14px 38px rgba(0,0,0,.14)}
.hero2,.cord-hero{position:relative;overflow:hidden;border:1px solid rgba(105,151,255,.26);border-radius:20px;background:radial-gradient(600px 240px at 88% 0%,rgba(42,139,255,.22),transparent 68%),linear-gradient(115deg,#111f36,#0d192b 65%,#102a38);padding:30px;box-shadow:0 18px 44px #0002}
.hero2:after,.cord-hero:after{content:'';position:absolute;width:220px;height:220px;right:-75px;top:-115px;border:1px solid rgba(111,165,255,.17);border-radius:50%;box-shadow:0 0 0 25px rgba(111,165,255,.025),0 0 0 52px rgba(111,165,255,.02);pointer-events:none}
.hero2 h1,.cord-hero h1{font-size:clamp(25px,3vw,35px);font-weight:850;letter-spacing:-.035em;margin:0 0 8px}.hero2 p,.cord-hero p{color:#a8bad2;max-width:720px}
.bar{gap:9px}.mc,.lob,.team,.cord-card{border-radius:15px}.mc{background:linear-gradient(150deg,#111f33,#0c1625);border:1px solid #243650;box-shadow:0 10px 26px #0002;transition:transform .2s,border-color .2s}.mc:hover{transform:translateY(-2px);border-color:#3c5c86}
.tags .tg,.badge,.cord-badge{border-radius:8px}.ring{filter:drop-shadow(0 0 10px #4f7cff22)}
.tabs button,.cas button{border-radius:10px}.empty{padding:34px 18px;border:1px dashed #30445f;border-radius:15px;color:#93a7c2;background:#0d1726;text-align:center}
#toast{background:rgba(12,22,37,.96);border-color:#527fff;box-shadow:0 14px 45px #0007;backdrop-filter:blur(14px)}
.lg-r{background:linear-gradient(145deg,#111e32,#0b1422);border-color:#2a3e5d}.lg-logo{letter-spacing:.12em}.lg h1{letter-spacing:-.04em}.lg h1 span{background:linear-gradient(95deg,#6d9aff,#4de0e6);-webkit-background-clip:text;background-clip:text}
.cord-wrap{gap:18px}.cord-hero{padding:28px}.cord-tabs{position:relative;z-index:1}.cord-tabs button{background:#16263d;border:1px solid #2c4567;box-shadow:none}.cord-tabs button.active{background:linear-gradient(115deg,#4c79ff,#1eb6c8);border-color:transparent}
.cord-grid{gap:15px}.cord-card{padding:19px}.cord-card h3{letter-spacing:-.015em}.cord-chat{max-height:52vh;min-height:250px;padding:3px}.cord-msg{background:#101d30;border-color:#253a57;border-radius:12px;padding:11px 13px}.cord-msg small{color:#8ea7c9}
#app:not(.lgn){animation:appEnter .28s ease-out both}@keyframes appEnter{from{opacity:.7;transform:translateY(4px)}to{opacity:1;transform:none}}
@media(max-width:900px){.wrap{padding:0 16px 26px}.side{position:static;width:auto;padding:8px 0 14px;box-shadow:none;flex-direction:row;gap:6px}.side:before{display:none}.side small{display:none}.side button{min-height:39px;padding:9px 12px;background:#101b2c;border:1px solid #243650}.side .made{display:none}header{margin:0 -16px 18px;padding:12px 16px;min-height:66px}.logo{position:static}.hero2,.cord-hero{padding:23px}}
@media(max-width:560px){.wrap{padding:0 11px 20px}.side{margin:0 -1px;overflow-x:auto}.side button{font-size:12px;padding:8px 10px}.me{gap:5px}.me .pill{padding:6px 9px}.hero2,.cord-hero{padding:19px}.card,.cord-card{padding:14px}.lg{padding:28px 18px;gap:26px}}

/* Header-Layout (Desktop): Logo rechts neben der Sidebar, Konto-Bereich ganz rechts */
@media(min-width:901px){
  header{display:flex;align-items:center;flex-wrap:nowrap;position:sticky}
  header .logo{position:absolute;left:278px;top:50%;transform:translateY(-50%);z-index:1;margin:0}
  header .me{margin-left:auto;flex-wrap:nowrap;justify-content:flex-end}
  .side{z-index:30}
}
