:root{
  --bg:#040307;
  --bg2:#0b0714;
  --panel:rgba(14,10,22,.76);
  --panel-strong:rgba(20,13,32,.92);
  --panel-soft:rgba(255,255,255,.055);
  --line:rgba(190,121,255,.2);
  --line-strong:rgba(190,121,255,.38);
  --text:#fbf7ff;
  --muted:#b9a8cf;
  --soft:#806c97;
  --accent:#a855f7;
  --accent2:#6d28d9;
  --accent3:#f5f3ff;
  --danger:#ff3d81;
  --warning:#ffcf5c;
  --success:#6df5b2;
  --shadow:0 28px 90px rgba(0,0,0,.54);
  --glow:0 0 38px rgba(168,85,247,.36);
  --radius:28px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{min-height:100%;margin:0}
body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);background:
  radial-gradient(circle at 12% 0%,rgba(168,85,247,.34),transparent 30%),
  radial-gradient(circle at 90% 2%,rgba(109,40,217,.24),transparent 34%),
  linear-gradient(135deg,#030205 0%,#09040f 46%,#12091e 100%);overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:62px 62px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.82),transparent 85%)}
body:after{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(120deg,transparent 0 38%,rgba(168,85,247,.08) 50%,transparent 62%);mix-blend-mode:screen;opacity:.65}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer}
.pup-ambient{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:0}.pup-ambient span{position:absolute;border-radius:999px;filter:blur(18px);opacity:.65;animation:floaty 10s ease-in-out infinite}.pup-ambient span:nth-child(1){width:330px;height:330px;left:-120px;top:12%;background:rgba(168,85,247,.2)}.pup-ambient span:nth-child(2){width:420px;height:420px;right:-160px;top:24%;background:rgba(109,40,217,.22);animation-delay:-3s}.pup-ambient span:nth-child(3){width:260px;height:260px;left:48%;bottom:-90px;background:rgba(245,243,255,.08);animation-delay:-6s}@keyframes floaty{0%,100%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(16px,-22px,0) scale(1.06)}}
.top-menu{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:minmax(240px,320px) minmax(0,1fr) auto;align-items:center;gap:18px;padding:16px 24px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,rgba(5,3,9,.88),rgba(5,3,9,.62));backdrop-filter:blur(22px);box-shadow:0 20px 70px rgba(0,0,0,.28)}
.brand-top{display:flex;align-items:center;gap:13px;min-width:0}.brand-top img{width:54px;height:54px;object-fit:cover;border-radius:18px;border:1px solid var(--line-strong);box-shadow:var(--glow)}.brand-top b{display:block;font-size:20px;letter-spacing:.08em;line-height:1;text-transform:uppercase}.brand-top small{display:block;margin-top:5px;color:var(--muted);font-size:12px;letter-spacing:.05em}.top-nav{display:flex;align-items:center;justify-content:center;gap:10px;min-width:0}.top-nav a{position:relative;display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border:1px solid transparent;border-radius:999px;color:var(--muted);font-weight:800;letter-spacing:.02em;overflow:hidden}.top-nav a:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(168,85,247,.34),rgba(245,243,255,.08));opacity:0;transition:.2s}.top-nav a span{position:relative}.top-nav a.active,.top-nav a:hover{color:var(--text);border-color:var(--line-strong);box-shadow:var(--glow)}.top-nav a.active:before,.top-nav a:hover:before{opacity:1}.top-meta{display:flex;align-items:center;gap:10px;padding:12px 16px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.045);color:var(--muted)}.pulse-dot{width:10px;height:10px;border-radius:50%;background:var(--success);box-shadow:0 0 0 0 rgba(109,245,178,.5);animation:pulse 1.8s infinite}@keyframes pulse{70%{box-shadow:0 0 0 12px rgba(109,245,178,0)}100%{box-shadow:0 0 0 0 rgba(109,245,178,0)}}
.panel-shell{position:relative;z-index:1;display:grid;grid-template-columns:286px minmax(0,1fr);gap:22px;max-width:1500px;margin:0 auto;padding:24px}.profile-rail{position:sticky;top:98px;align-self:start;display:grid;gap:16px}.profile-card,.card,.hero-card,.stat-card,.page-head{border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.028));box-shadow:var(--shadow);backdrop-filter:blur(20px)}.profile-card{padding:20px}.user-card{text-align:left;overflow:hidden;position:relative}.user-card:after{content:"";position:absolute;right:-64px;bottom:-80px;width:180px;height:180px;border-radius:50%;background:rgba(168,85,247,.2);filter:blur(8px)}.user-logo-wrap{position:relative;width:118px;height:118px;margin:0 0 18px;border-radius:34px;padding:5px;background:linear-gradient(135deg,var(--accent),rgba(245,243,255,.6),var(--accent2));box-shadow:var(--glow)}.user-logo-wrap img{display:block;width:100%;height:100%;object-fit:cover;border-radius:29px;background:#050209}.eyebrow{display:inline-flex;align-items:center;gap:8px;color:#e7d8ff;text-transform:uppercase;letter-spacing:.16em;font-size:11px;font-weight:900}.eyebrow:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 16px rgba(168,85,247,.8)}.profile-card h2{position:relative;margin:10px 0 8px;font-size:25px;line-height:1.12}.profile-card p{position:relative;margin:0;color:var(--muted);line-height:1.55}.profile-card.compact{display:grid;gap:12px}.profile-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.07)}.profile-row:last-child{border-bottom:0}.profile-row span{color:var(--muted);font-size:13px}.profile-row b{font-size:13px;color:var(--text);text-align:right}.logout-form{margin:0}.workspace{min-width:0;display:grid;gap:18px}.page-head{padding:24px 26px}.page-head h1{margin:8px 0 8px;font-size:38px;letter-spacing:-.04em}.page-head p{max-width:850px;margin:0;color:var(--muted);line-height:1.65}
h1,h2,h3,p{margin-top:0}h2{font-size:24px;letter-spacing:-.03em}h3{font-size:15px;margin:0 0 12px;color:#efe7ff}.hero-card{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:26px;align-items:center;padding:32px;overflow:hidden}.hero-card:before{content:"";position:absolute;inset:-1px;background:radial-gradient(circle at 80% 20%,rgba(168,85,247,.35),transparent 28%),linear-gradient(135deg,rgba(168,85,247,.22),transparent 42%);pointer-events:none}.hero-copy,.hero-emblem{position:relative}.hero-card h2{max-width:820px;margin:12px 0 14px;font-size:46px;line-height:.98}.hero-card p{max-width:820px;color:var(--muted);line-height:1.7}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}.hero-emblem{display:grid;place-items:center;min-height:270px;border-radius:42px;background:rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.1);box-shadow:inset 0 0 34px rgba(168,85,247,.16)}.hero-emblem img{width:min(230px,90%);aspect-ratio:1;object-fit:cover;border-radius:50%;box-shadow:0 0 52px rgba(168,85,247,.36)}
.grid{display:grid;gap:18px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.card{padding:24px}.card-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}.card-head h2{margin:0}.muted{color:var(--muted)}.tag{display:inline-flex;align-items:center;padding:8px 12px;border-radius:999px;border:1px solid var(--line);background:rgba(168,85,247,.12);color:#eadcff;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.stat-card{padding:22px;overflow:hidden;position:relative}.stat-card:after{content:"";position:absolute;right:-24px;top:-30px;width:100px;height:100px;border-radius:50%;background:rgba(168,85,247,.22);filter:blur(4px)}.stat-card span,.stat-card small{position:relative;display:block;color:var(--muted)}.stat-card b{position:relative;display:block;margin:10px 0 4px;font-size:28px}.info-list{display:grid;gap:10px}.info-list div{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.08)}.info-list div:last-child{border-bottom:0}.info-list span{color:var(--muted)}.info-list b{text-align:right}.clean-list{margin:0;padding:0;list-style:none;display:grid;gap:12px}.clean-list li{position:relative;padding:14px 16px 14px 44px;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:rgba(255,255,255,.035);color:#eadfff;line-height:1.55}.clean-list li:before{content:"";position:absolute;left:17px;top:21px;width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 18px rgba(168,85,247,.8)}.design-notes .clean-list li{padding-top:12px;padding-bottom:12px}.ui-kit{scroll-margin-top:90px}.kit-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.kit-grid>div{min-height:154px;padding:18px;border:1px solid rgba(255,255,255,.08);border-radius:22px;background:rgba(0,0,0,.16)}.kit-actions,.status-line{display:flex;flex-wrap:wrap;gap:10px}.palette{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.palette span{display:block;height:54px;border-radius:16px;border:1px solid rgba(255,255,255,.12)}.palette span:nth-child(1){background:#040307}.palette span:nth-child(2){background:#a855f7}.palette span:nth-child(3){background:#6d28d9}.palette span:nth-child(4){background:#f5f3ff}.status{display:inline-flex;align-items:center;padding:9px 12px;border-radius:999px;font-size:12px;font-weight:900}.status.good{background:rgba(109,245,178,.15);color:#a8ffd2;border:1px solid rgba(109,245,178,.3)}.status.warn{background:rgba(255,207,92,.14);color:#ffe5a3;border:1px solid rgba(255,207,92,.28)}.status.bad{background:rgba(255,61,129,.13);color:#ffc1d8;border:1px solid rgba(255,61,129,.28)}
.stack{display:grid;gap:16px}label{display:grid;gap:8px;color:#eee5ff;font-size:14px;font-weight:800}input,textarea,select{width:100%;border:1px solid rgba(255,255,255,.12);border-radius:18px;background:rgba(2,1,5,.55);padding:14px 15px;color:var(--text);outline:none;transition:.18s}input:focus,textarea:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 4px rgba(168,85,247,.16)}input[type=file]{padding:13px;background:rgba(255,255,255,.04)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;border:0;border-radius:999px;padding:0 20px;background:linear-gradient(135deg,var(--accent),var(--accent2));color:white;font-weight:900;letter-spacing:.02em;box-shadow:0 12px 34px rgba(168,85,247,.25);transition:transform .18s,box-shadow .18s,background .18s}.btn:hover{transform:translateY(-1px);box-shadow:0 18px 42px rgba(168,85,247,.34)}.btn.ghost{background:rgba(255,255,255,.055);border:1px solid var(--line);color:#eadfff;box-shadow:none}.btn.danger{background:linear-gradient(135deg,#ff3d81,#9b174a)}.btn.full{width:100%}.hint{margin-top:16px;padding:16px 18px;border-radius:18px;border:1px solid rgba(255,255,255,.08);background:rgba(168,85,247,.08);color:var(--muted);line-height:1.6}.alert{position:relative;z-index:5;margin-bottom:18px;border:1px solid var(--line);border-radius:20px;padding:14px 16px;background:rgba(168,85,247,.14);color:#fff;box-shadow:var(--shadow);transition:opacity .28s,transform .28s}.alert.danger{background:rgba(255,61,129,.16);border-color:rgba(255,61,129,.28)}.alert.warning{background:rgba(255,207,92,.14);border-color:rgba(255,207,92,.26)}.alert.is-soft-hidden{opacity:0;transform:translateY(-8px);pointer-events:none}.timeline{display:grid;gap:14px}.tl{position:relative;padding:18px 18px 18px 48px;border:1px solid rgba(255,255,255,.08);border-radius:20px;background:rgba(255,255,255,.035)}.tl:before{content:"";position:absolute;left:18px;top:22px;width:13px;height:13px;border-radius:50%;background:var(--accent);box-shadow:0 0 22px rgba(168,85,247,.8)}.tl b{display:block;margin-bottom:8px}.tl p{margin:0 0 8px;color:#e8dcfa;line-height:1.55}.tl small{color:var(--muted)}
.login-body{display:grid;place-items:center;min-height:100vh;padding:24px}.login-card{position:relative;z-index:1;width:min(100%,470px);border:1px solid var(--line);border-radius:36px;background:linear-gradient(145deg,rgba(16,10,27,.86),rgba(7,4,13,.78));box-shadow:var(--shadow);backdrop-filter:blur(22px);padding:24px}.login-banner{position:relative;text-align:center;padding:30px 24px 24px;border-radius:28px;overflow:hidden;background:radial-gradient(circle at 50% 12%,rgba(168,85,247,.36),transparent 34%),rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)}.login-banner:before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent,rgba(255,255,255,.07),transparent);transform:translateX(-100%);animation:sheen 5s ease-in-out infinite}@keyframes sheen{0%,55%{transform:translateX(-100%)}100%{transform:translateX(100%)}}.login-logo{position:relative;width:150px;height:150px;object-fit:cover;border-radius:50%;border:1px solid var(--line-strong);box-shadow:0 0 58px rgba(168,85,247,.5);margin:0 auto 18px}.login-banner h1{position:relative;margin:12px 0 10px;font-size:44px;letter-spacing:-.04em}.login-banner p{position:relative;margin:0;color:var(--muted);line-height:1.65}.login-form{margin-top:18px}.main.guest{position:relative;z-index:1;width:100%;max-width:1100px;margin:0 auto;padding:24px}
@media (max-width:1100px){.top-menu{grid-template-columns:1fr;align-items:start}.top-nav{justify-content:flex-start;overflow-x:auto;padding-bottom:2px}.top-meta{justify-self:start}.panel-shell{grid-template-columns:1fr}.profile-rail{position:relative;top:auto;grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch}.logout-form{align-self:stretch}.logout-form .btn{height:100%}.hero-card{grid-template-columns:1fr}.hero-emblem{min-height:220px}.grid.two,.grid.three,.kit-grid{grid-template-columns:1fr 1fr}}
@media (max-width:700px){.top-menu{padding:14px}.brand-top img{width:48px;height:48px}.brand-top b{font-size:17px}.top-nav a{min-height:40px;padding:0 16px}.panel-shell{padding:14px}.profile-rail{grid-template-columns:1fr}.page-head,.card,.hero-card{padding:20px;border-radius:22px}.page-head h1{font-size:30px}.hero-card h2{font-size:34px}.grid.two,.grid.three,.kit-grid{grid-template-columns:1fr}.card-head{display:block}.card-head .muted,.card-head .tag{margin-top:10px}.hero-actions .btn{width:100%}.login-card{padding:16px;border-radius:28px}.login-logo{width:122px;height:122px}.login-banner h1{font-size:36px}}
/* PUP MOD CRM modules */
.nav-group{display:flex;align-items:center;gap:8px;min-height:46px;border:1px solid rgba(255,255,255,.08);border-radius:999px;padding:3px 5px 3px 16px;background:rgba(255,255,255,.035);color:#eadfff;font-size:13px;font-weight:900;white-space:nowrap}.nav-group>span{color:#fff;text-transform:uppercase;letter-spacing:.06em;font-size:12px}.nav-group>a{min-height:36px;padding:0 13px;border-radius:999px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.06)}.nav-group.active{border-color:rgba(168,85,247,.42);box-shadow:0 0 25px rgba(168,85,247,.12)}.mt{margin-top:16px}.btn.small{min-height:36px;padding:0 13px;font-size:12px}.table-wrap{width:100%;overflow:auto;border:1px solid rgba(255,255,255,.08);border-radius:22px;background:rgba(0,0,0,.14)}table{width:100%;border-collapse:collapse;min-width:760px}th,td{padding:15px 16px;border-bottom:1px solid rgba(255,255,255,.07);text-align:left;vertical-align:middle}th{color:#cbb8ee;font-size:12px;text-transform:uppercase;letter-spacing:.08em;background:rgba(168,85,247,.07)}td{color:#f7f0ff}tbody tr:hover{background:rgba(168,85,247,.055)}code{display:inline-block;max-width:180px;overflow:hidden;text-overflow:ellipsis;vertical-align:middle;padding:6px 8px;border-radius:10px;background:rgba(0,0,0,.3);border:1px solid rgba(255,255,255,.08);color:#e9d5ff}.row-actions,.kit-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.row-actions form,.kit-actions form{margin:0}.filter-bar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;margin-bottom:18px}.resource-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.resource-card{position:relative;padding:20px;border:1px solid rgba(255,255,255,.08);border-radius:24px;background:linear-gradient(145deg,rgba(255,255,255,.06),rgba(255,255,255,.025));box-shadow:0 20px 55px rgba(0,0,0,.18);overflow:hidden}.resource-card:before{content:"";position:absolute;right:-45px;top:-55px;width:150px;height:150px;border-radius:50%;background:rgba(168,85,247,.16);filter:blur(10px)}.resource-card>*{position:relative}.resource-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}.resource-card h3{font-size:22px;margin:0 0 8px}.resource-card p{margin:0 0 14px;color:var(--muted)}.info-list.mini div{padding:10px 0}.info-list.mini b{max-width:250px;overflow:hidden;text-overflow:ellipsis}.status.success{background:rgba(109,245,178,.15);color:#a8ffd2;border:1px solid rgba(109,245,178,.3)}textarea{resize:vertical;min-height:120px}select option{background:#12091d;color:#fff}.danger{color:#ffc1d8}.muted a{color:#e9d5ff}@media (max-width:980px){.resource-grid{grid-template-columns:1fr}.nav-group{width:max-content}.filter-bar{grid-template-columns:1fr}.filter-bar .btn{width:100%}}@media (max-width:700px){.nav-group{align-items:flex-start;flex-direction:column;border-radius:22px;padding:12px}.nav-group>a{width:100%;justify-content:flex-start}.top-nav{gap:8px}.row-actions .btn,.kit-actions .btn{width:100%}}

/* v1.0.5 clean panel */
.clean-top-menu{grid-template-columns:minmax(220px,300px) minmax(0,1fr) auto}.clean-shell{grid-template-columns:250px minmax(0,1fr)}.compact-profile{gap:14px}.compact-profile .profile-card{padding:18px}.compact-profile .user-logo-wrap{width:92px;height:92px;border-radius:28px}.compact-profile .user-logo-wrap img{border-radius:23px}.compact-profile .profile-card h2{font-size:22px}.compact-head{padding:20px 24px}.compact-head h1{font-size:34px;margin-bottom:0}.top-nav a{gap:8px}.top-nav a em,.section-tabs a em{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 8px;border-radius:999px;background:rgba(168,85,247,.24);border:1px solid rgba(168,85,247,.38);color:#fff;font-style:normal;font-size:12px;font-weight:900}.section-tabs{display:flex;align-items:center;gap:10px;margin-bottom:18px;padding:8px;border:1px solid var(--line);border-radius:26px;background:rgba(255,255,255,.035);box-shadow:0 18px 50px rgba(0,0,0,.22);overflow:auto}.section-tabs a{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:0 18px;border-radius:999px;color:var(--muted);font-weight:900;white-space:nowrap;border:1px solid transparent}.section-tabs a.active,.section-tabs a:hover{color:#fff;border-color:var(--line-strong);background:linear-gradient(135deg,rgba(168,85,247,.28),rgba(255,255,255,.06));box-shadow:0 0 28px rgba(168,85,247,.14)}.clean-login .login-banner{padding-bottom:28px}.clean-login .login-banner p{max-width:300px;margin:0 auto}.info-list b{word-break:break-word}.alert.mt{margin-bottom:0}.card + .section-tabs{margin-top:8px}@media (max-width:1100px){.clean-top-menu{grid-template-columns:1fr}.clean-shell{grid-template-columns:1fr}.compact-profile{position:relative;top:auto;grid-template-columns:1fr auto}.compact-profile .logout-form{align-self:stretch}.compact-profile .logout-form .btn{height:100%}}@media (max-width:700px){.compact-profile{grid-template-columns:1fr}.section-tabs{border-radius:20px}.section-tabs a{width:max-content}.compact-head h1{font-size:28px}}

/* v1.0.8 dashboard + bot settings */
.grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}.dashboard-stats{margin-bottom:2px}.dashboard-search{grid-template-columns:minmax(0,1fr) 130px}.settings-preview-grid{align-items:start}.card-subhead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:4px 0 8px}.card-subhead h3{margin:0;font-size:18px}.hint.compact{margin-top:0;font-size:13px;padding:12px 14px}.switch-row{display:flex;grid-template-columns:none;align-items:flex-start;gap:14px;padding:14px;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:rgba(255,255,255,.035);cursor:pointer}.switch-row input{width:22px;height:22px;margin-top:2px;accent-color:#a855f7}.switch-row span{display:grid;gap:5px}.switch-row b{color:#fff}.switch-row em{font-style:normal;color:var(--muted);line-height:1.45;font-size:13px}.button-builder{display:grid;gap:10px}.button-row{display:grid;grid-template-columns:minmax(120px,1.35fr) minmax(140px,1.5fr) 74px 96px 68px 44px;gap:10px;align-items:end;padding:12px;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:rgba(0,0,0,.12)}.button-row label{font-size:12px}.button-row input{border-radius:14px;padding:11px 12px}.button-row input[type=color]{height:43px;padding:5px}.remove-button{min-width:44px;padding:0}.preview-card{position:sticky;top:110px}.telegram-preview{min-height:520px;border-radius:30px;border:1px solid rgba(255,255,255,.1);background:radial-gradient(circle at 18% 0,rgba(168,85,247,.25),transparent 30%),linear-gradient(145deg,#171126,#07040d);overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}.tg-preview-head,.tg-preview-foot{display:flex;align-items:center;gap:10px;padding:16px 18px;background:rgba(0,0,0,.24);border-bottom:1px solid rgba(255,255,255,.08)}.tg-preview-head span{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent2));box-shadow:0 0 22px rgba(168,85,247,.4)}.tg-preview-head b{font-size:14px}.tg-preview-head em{margin-left:auto;color:#92ffc1;font-size:12px;font-style:normal}.tg-preview-foot{border-top:1px solid rgba(255,255,255,.08);border-bottom:0;justify-content:space-between;color:var(--muted);font-size:12px}.tg-message{width:min(88%,430px);margin:34px 18px 26px auto;padding:14px;border-radius:22px 22px 6px 22px;background:linear-gradient(145deg,rgba(168,85,247,.28),rgba(89,38,155,.2));border:1px solid rgba(255,255,255,.1);box-shadow:0 18px 40px rgba(0,0,0,.25)}.tg-message p{margin:0;color:#fff;line-height:1.55;white-space:normal}.tg-buttons{display:grid;gap:8px;margin-top:12px}.tg-buttons button{min-height:40px;border:1px solid color-mix(in srgb,var(--btn-color,#a855f7) 62%,#fff 10%);border-radius:14px;background:linear-gradient(135deg,color-mix(in srgb,var(--btn-color,#a855f7) 42%,transparent),rgba(255,255,255,.06));color:#fff;font-weight:900;box-shadow:0 8px 24px color-mix(in srgb,var(--btn-color,#a855f7) 28%,transparent)}
@media (max-width:1100px){.grid.four{grid-template-columns:repeat(2,minmax(0,1fr))}.preview-card{position:relative;top:auto}.button-row{grid-template-columns:1fr 1fr 74px 96px 68px 44px}}
@media (max-width:800px){.button-row{grid-template-columns:1fr 1fr}.button-row .remove-button{width:100%}.dashboard-search{grid-template-columns:1fr}.dashboard-search .btn{width:100%}}
@media (max-width:700px){.grid.four{grid-template-columns:1fr}.switch-row{align-items:flex-start}.telegram-preview{min-height:420px}.tg-message{width:auto;margin:24px 12px}}

/* v1.0.10 — Bot variables descriptions */
.bot-connect-grid,.bot-runtime-grid{align-items:stretch;margin-bottom:18px}.bot-connect-grid>* ,.bot-runtime-grid>*{min-width:0}.settings-preview-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(340px,.85fr);align-items:start;gap:18px}.settings-preview-grid>*{min-width:0}.bot-options-card{overflow:hidden}.button-builder{display:grid;gap:12px;min-width:0}.button-row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr)) 44px;gap:10px;align-items:end;padding:12px;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:rgba(0,0,0,.12);min-width:0}.button-row label{min-width:0;font-size:12px}.button-row input,.button-row select{width:100%;min-width:0;border-radius:14px;padding:11px 12px}.button-field-text{grid-column:span 3}.button-field-url{grid-column:span 4}.button-field-row{grid-column:span 1}.button-field-sort{grid-column:span 1}.button-field-style{grid-column:span 3}.button-row .remove-button{grid-column:auto;min-width:44px;width:44px;padding:0}.preview-card{position:sticky;top:110px;max-width:100%;overflow:hidden}.telegram-preview{min-height:500px}.tg-buttons{display:grid;gap:8px;margin-top:12px}.tg-button-row{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:8px}.tg-buttons button{min-width:0;min-height:40px;border-radius:14px;color:#fff;font-weight:900;box-shadow:0 8px 24px rgba(0,0,0,.18);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tg-buttons button.primary{border:1px solid rgba(96,165,250,.46);background:linear-gradient(135deg,rgba(59,130,246,.58),rgba(96,165,250,.18))}.tg-buttons button.success{border:1px solid rgba(74,222,128,.46);background:linear-gradient(135deg,rgba(34,197,94,.58),rgba(74,222,128,.18))}.tg-buttons button.danger{border:1px solid rgba(248,113,113,.46);background:linear-gradient(135deg,rgba(239,68,68,.58),rgba(248,113,113,.18))}.hint code{white-space:nowrap}@media (max-width:1320px){.settings-preview-grid{grid-template-columns:1fr}.preview-card{position:relative;top:auto}.button-field-text,.button-field-url{grid-column:span 6}.button-field-row,.button-field-sort{grid-column:span 2}.button-field-style{grid-column:span 8}}@media (max-width:760px){.button-row{grid-template-columns:1fr 44px}.button-row label{grid-column:1 / -1}.button-row .remove-button{grid-column:2}.tg-button-row{grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:1fr}.dashboard-search{grid-template-columns:1fr}.grid.four{grid-template-columns:1fr}.bot-connect-grid,.bot-runtime-grid{grid-template-columns:1fr}}

/* v1.0.10 — descriptions for welcome variables */
.variables-help{display:grid;gap:8px;padding:14px;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:rgba(255,255,255,.035);box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.variables-title{font-size:13px;font-weight:900;color:#fff;letter-spacing:.02em;margin-bottom:2px}
.variable-item{display:grid;grid-template-columns:160px minmax(0,1fr);gap:10px;align-items:start;padding:8px 10px;border-radius:14px;background:rgba(0,0,0,.14);border:1px solid rgba(255,255,255,.055)}
.variable-item code{width:max-content;max-width:100%;white-space:nowrap;color:#fff;background:rgba(168,85,247,.22);border:1px solid rgba(168,85,247,.28);border-radius:10px;padding:4px 7px;font-size:12px}
.variable-item span{font-size:13px;line-height:1.45;color:var(--muted)}
@media (max-width:760px){.variable-item{grid-template-columns:1fr;gap:6px}}


/* v1.0.11 — fixed message buttons layout without overlaps */
.bot-options-form .card-subhead{align-items:center;flex-wrap:wrap;row-gap:10px}
.bot-options-form .card-subhead .btn{flex:0 0 auto}
.bot-options-form .hint.compact{overflow-wrap:anywhere}
.bot-options-form .hint.compact code{white-space:normal;word-break:break-word}
.button-builder{display:grid;gap:12px;inline-size:100%;max-inline-size:100%}
.button-row{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  grid-template-areas:
    "text text text text text text url url url url url url"
    "row row sort sort style style style style style style style remove";
  gap:12px;
  align-items:end;
  inline-size:100%;
  max-inline-size:100%;
  overflow:hidden;
}
.button-row label{display:grid;gap:7px;min-inline-size:0;line-height:1.25}
.button-row input,.button-row select{display:block;inline-size:100%;max-inline-size:100%;min-inline-size:0;height:44px}
.button-field-text{grid-area:text!important}.button-field-url{grid-area:url!important}.button-field-row{grid-area:row!important}.button-field-sort{grid-area:sort!important}.button-field-style{grid-area:style!important}
.button-row .remove-button{grid-area:remove!important;inline-size:44px;min-inline-size:44px;height:44px;align-self:end;justify-self:end;padding:0;border-radius:14px}
.tg-buttons{inline-size:100%;max-inline-size:100%;overflow:hidden}
.tg-button-row{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:8px;inline-size:100%;max-inline-size:100%;overflow:hidden}
.tg-buttons button{display:block;inline-size:100%;max-inline-size:100%;min-inline-size:0;padding:0 10px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:900px){
  .button-row{grid-template-areas:
    "text text text text text text text text text text text text"
    "url url url url url url url url url url url url"
    "row row row sort sort sort style style style style style remove"}
}
@media (max-width:640px){
  .button-row{grid-template-columns:1fr 44px;grid-template-areas:
    "text text"
    "url url"
    "row row"
    "sort sort"
    "style style"
    ". remove"}
  .button-row .remove-button{justify-self:end}
  .tg-button-row{grid-auto-flow:row;grid-auto-columns:auto;grid-template-columns:1fr}
}