/* =======================================================
   LabelRIX – Shared Dark UI (index+subpages, v3 full)
   ======================================================= */

/* --- Design tokens --- */
:root{
  --bg:#0b0c10; --panel:#111318; --panel-2:#0f141e;
  --hair:#141823; --border:#171a22; --border-2:#242938;
  --text:#e7e9ee; --muted:#aeb5c8; --muted-2:#97a0b7;
  --brand:#6ee7b7; --brand-2:#60a5fa; --accent:#f59e0b;
  --danger:#ef4444; --success:#10b981; --warn:#f59e0b;
  --radius:16px; --radius-sm:10px; --shadow:0 10px 30px rgba(0,0,0,.35);
  --topbar-h:64px; --sidebar-w:260px; --gutter:16px;
}

/* --- Base & typography --- */
*{box-sizing:border-box}
html,body{
  margin:0; padding:0; background:var(--bg); color:var(--text);
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,'Helvetica Neue',Arial,'Noto Sans',sans-serif;
  overflow-x:hidden;
}
body{ padding-top:var(--topbar-h); } /* ne csússzon a nav alá */
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block;border-radius:14px}
h1,h2,h3,h4{margin:0 0 .4rem 0}
h1{font-size:clamp(2rem,4vw + .6rem,3.1rem);line-height:1.1}
h2{font-size:clamp(1.6rem,2.4vw + .6rem,2.2rem)}
h3{font-size:1.15rem}
small,.small{font-size:.9rem;color:var(--muted)}
.container{width:min(1200px, calc(100% - var(--gutter)*2)); margin-inline:auto}

/* --- Utilities --- */
.flex{display:flex} .col{display:flex;flex-direction:column}
.items-center{align-items:center} .justify-between{justify-content:space-between}
.gap-1{gap:.5rem} .gap-2{gap:.75rem} .gap-3{gap:1rem}
.mt-1{margin-top:6px} .mt-2{margin-top:12px} .mt-3{margin-top:18px}
.mb-1{margin-bottom:6px} .mb-2{margin-bottom:12px} .mb-3{margin-bottom:18px}
.p-2{padding:12px} .px-2{padding-inline:12px} .py-2{padding-block:12px}
.w-full{width:100%} .hidden{display:none!important} .muted{color:var(--muted)}
.truncate{min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* --- Top navigation (index) --- */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  background:rgba(11,12,16,.75); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
}
.nav.stuck{ background:rgba(11,12,16,.9); box-shadow:0 8px 24px rgba(0,0,0,.35); }
.nav .inner{display:flex;align-items:center;justify-content:space-between;padding:.9rem 0}
.brand{display:flex;align-items:center;gap:.7rem;font-weight:800;letter-spacing:.6px}
.brand .logo{
  width:34px;height:34px;display:grid;place-items:center;background:#0f131b;
  border:1px solid #283041;border-radius:10px;color:var(--brand-2);font-weight:900
}
.navlinks{display:flex;gap:1rem .8rem;align-items:center;flex-wrap:wrap}
.navlinks a{padding:.5rem .8rem;border-radius:10px;color:#c8ccda;font-weight:600}
.navlinks a:hover{background:#141925}
.hamburger{display:none;background:none;border:1px solid #283041;color:var(--text);
  font-size:1.1rem;padding:.45rem .6rem;border-radius:10px}

/* --- Sidebar (fix, aljáig ér) --- */
.layout{display:block}
.sidebar{
  position:fixed; left:0; top:var(--topbar-h); bottom:0; width:var(--sidebar-w);
  background:#0f1218; border-right:1px solid var(--border); padding:16px;
  overflow:auto; z-index:66;
}
.sb-brand{font-weight:900;letter-spacing:.6px;margin-bottom:12px;display:flex;align-items:center;gap:.6rem}
.sb-links{display:flex;flex-direction:column;gap:6px}
.sb-links a{display:block;padding:.55rem .7rem;border-radius:10px;color:#c8ccda;border:1px solid transparent}
.sb-links a:hover{background:#141925}
.sb-links a.active{
  background:linear-gradient(180deg,rgba(96,165,250,.12),rgba(96,165,250,.04));
  border-color:#263148;color:#d7e6ff
}
.sb-user{ margin-top:auto; padding-top:12px; border-top:1px solid #1a2130 }
.sb-inline{ display:flex; align-items:center; gap:.5rem; flex-wrap:nowrap; max-width:100% }
.sb-pill{
  display:inline-flex; align-items:center; gap:.35rem; white-space:nowrap;
  padding:.3rem .55rem; border-radius:8px; background:#101520; border:1px solid #293348;
}
.sb-pill.round{ border-radius:999px; background:#0f131b; border-color:#283041 }
main.content{margin-left:var(--sidebar-w);min-width:0}

/* --- Mobile drawer --- */
#overlay{position:fixed;inset:0;background:rgba(0,0,0,.4);backdrop-filter:blur(1px);display:none;z-index:65}
@media (max-width:980px){
  .hamburger{display:inline-block}
  .sidebar{left:-280px;transition:left .2s ease}
  .sidebar.open{left:8px}
  #overlay.open{display:block}
  main.content{margin-left:0}
}

/* --- Index hero & sections --- */
.hero{position:relative;padding:52px 0 42px;overflow:hidden}
.hero:before{
  content:"";position:absolute;inset:-30% -10% auto -10%;height:70%;
  background-image:
    radial-gradient(700px 180px at 40% 20%,rgba(96,165,250,.25),transparent 60%),
    radial-gradient(600px 200px at 70% 5%,rgba(110,231,183,.25),transparent 60%);
  pointer-events:none
}
.hero-grid{display:grid;grid-template-columns:1.15fr .9fr;gap:32px;align-items:center}
.hero p.lead{color:#b6bdd2;font-size:1.1rem;margin:0 0 18px}
.hero-media{position:relative;border:1px solid #273148;border-radius:16px;overflow:hidden}
.hero-media img{width:100%;height:auto;display:block;border:0;border-radius:0}
.hero-media .hero-fallback{
  display:none;height:340px;border-radius:0;
  background:
    radial-gradient(600px 200px at 70% 10%, rgba(110,231,183,.18), transparent 60%),
    radial-gradient(700px 220px at 20% 20%, rgba(96,165,250,.22), transparent 60%),
    linear-gradient(180deg,#0f141e,#0c1119);
}
.hero-media .hero-fallback.show{display:block}
.floating-card{
  position:absolute;right:10px;bottom:10px;background:var(--panel);
  border:1px solid #273148;border-radius:16px;padding:14px;box-shadow:var(--shadow);
  max-width:min(320px, calc(100% - 20px)); width:46%;
}
.floating-card h4{margin:0 0 6px;font-size:.95rem}
.floating-card p{margin:0;color:#aab2c7;font-size:.9rem}

section{padding:48px 0;border-top:1px solid var(--hair)}
.section-title{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:26px}
.k{color:var(--brand-2)}
.grid{display:grid;gap:18px} .grid>*{min-width:0}
.grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid.cols-2{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.card{background:var(--panel);border:1px solid var(--border-2);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)}
.card h3{margin:0 0 6px} .card p{margin:0;color:#aeb5c8}
.icon{width:24px;height:24px;display:inline-grid;place-items:center;border-radius:8px;background:#182032;border:1px solid #273148;margin-right:.5rem}
.media-row{display:grid;grid-template-columns:1.2fr 1fr;gap:28px;align-items:center}
.steps{display:grid;gap:16px;grid-template-columns:repeat(4,1fr);counter-reset:step}
.step{background:linear-gradient(180deg,#121620,#0f131b);border:1px solid #242938;border-radius:18px;padding:18px;position:relative}
.step:before{counter-increment:step;content:counter(step);position:absolute;top:12px;right:12px;background:#161b28;color:#8aa3ff;border:1px solid #28314a;width:30px;height:30px;border-radius:10px;display:grid;place-items:center;font-weight:800}
.pricing{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.price{background:linear-gradient(180deg,#121720,#0f1219);border:1px solid #243046;border-radius:18px;padding:22px}
.price .amt{font-size:2rem;font-weight:900}
.price ul{list-style:none;padding:0;margin:12px 0 0;color:#aeb5c8} .price li{margin:8px 0}
.faq{display:grid;grid-template-columns:1fr 1fr;gap:18px}
details{background:#10151f;border:1px solid #263248;border-radius:14px;padding:14px 16px}
summary{cursor:pointer;font-weight:700}
details p{margin:8px 0 0;color:#aeb5c8}
.cta{background:linear-gradient(90deg,rgba(96,165,250,.18),rgba(110,231,183,.18));border:1px solid #263148;border-radius:18px;padding:24px;display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center}
footer{padding:40px 0;color:#97a0b7}
.footgrid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:18px}

/* --- Buttons --- */
.btn{
  display:inline-flex;align-items:center;gap:.6rem;padding:.9rem 1.2rem;border-radius:14px;
  background:linear-gradient(180deg,var(--brand),#33d499);color:#0a0f0c;font-weight:700;border:none;
  cursor:pointer;box-shadow:var(--shadow);transition:transform .15s,filter .15s
}
.btn:hover{transform:translateY(-1px);filter:brightness(1.05)}
.btn.small{padding:.55rem .9rem} .btn.xs{padding:.35rem .6rem;border-radius:10px;font-size:.9rem}
.btn.block{width:100%}
.btn.secondary{background:#1a1e27;color:var(--text);border:1px solid #262b36;box-shadow:none}
.btn.outline{background:transparent;color:#dbeafe;border:1px solid #263148;box-shadow:none}
.btn.link{background:transparent;border:none;box-shadow:none;color:var(--brand-2);padding:.4rem .2rem}
.btn.danger{background:linear-gradient(180deg,#ef4444,#dc2626)}
.btn.success{background:linear-gradient(180deg,#10b981,#059669)}
.btn[disabled],.btn.disabled{opacity:.55;pointer-events:none}
.btn-group{display:inline-flex;border-radius:12px;overflow:hidden;border:1px solid #263148}
.btn-group .btn{border-radius:0;background:#121620;color:#cfe3ff;border-left:1px solid #263148;box-shadow:none}
.btn-group .btn:first-child{border-left:none}
.btn-group .btn.active{background:#0f141e}

/* --- Forms --- */
label{display:block;font-weight:600;margin:8px 0 6px 0;color:#cfe3ff}
.input, input[type=text], input[type=email], input[type=password], input[type=number],
input[type=url], input[type=tel], select, textarea{
  width:100%;background:#0f141e;color:var(--text);border:1px solid #293246;border-radius:12px;padding:12px 14px;outline:none
}
textarea{resize:vertical;min-height:100px}
input:focus,select:focus,textarea:focus{border-color:var(--brand-2);box-shadow:0 0 0 4px rgba(96,165,250,.15)}
.input.sm{padding:8px 10px;border-radius:10px}
.input-group{display:flex;align-items:stretch;border:1px solid #293246;border-radius:12px;overflow:hidden;background:#0f141e}
.input-group>.addon{display:grid;place-items:center;padding:0 10px;background:#121620;border-right:1px solid #293246;color:#cfe3ff;white-space:nowrap}
.input-group>.addon.right{border-left:1px solid #293246;border-right:none}
.input-group>input{border:none;background:transparent}
.help{color:var(--muted);font-size:.9rem;margin-top:4px}
.is-invalid{border-color:#7f1d1d;box-shadow:0 0 0 4px rgba(190,18,60,.18)}
.error-text{color:#fecaca;font-size:.9rem;margin-top:4px}
.switch{appearance:none;width:42px;height:24px;border-radius:999px;position:relative;display:inline-block;background:#263148;vertical-align:middle;outline:none;border:1px solid #334067}
.switch:before{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#cfd6ea;transition:left .15s}
.switch:checked{background:#1d4ed8;border-color:#1e40af}.switch:checked:before{left:22px}

/* --- Notices / alerts --- */
.notice{background:#0b1220;border:1px solid #1f2937;border-radius:12px;padding:12px 14px;color:#b6bdd2}
.notice.success{background:#0d1f1a;border-color:#145a4a;color:#a7f3d0}
.notice.error{background:#1f0d0d;border-color:#7f1d1d;color:#fecaca}
.alert{padding:12px 14px;border-radius:12px}
.alert.warn{background:#1f1a0d;border:1px solid #7c5c10;color:#fcd34d}
.alert.info{background:#0d1321;border:1px solid #1f3a8a;color:#bfdbfe}

/* --- Tabs --- */
.tabs{display:flex;gap:6px;border-bottom:1px solid #263148;margin-bottom:10px}
.tab{padding:.55rem .8rem;border-radius:10px 10px 0 0;background:#121620;color:#cfe3ff;cursor:pointer;border:1px solid transparent;border-bottom:none}
.tab.active{background:#0f141e;border-color:#263148}

/* --- Tables --- */
.table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--border-2);border-radius:14px;overflow:hidden}
.table th,.table td{padding:10px 12px;text-align:left}
.table thead th{background:#121620;color:#cfe3ff;border-bottom:1px solid #263248}
.table.striped tbody tr:nth-child(odd){background:#0f141e}
.table.striped tbody tr:nth-child(even){background:#0d1117}
.table.hover tbody tr:hover{background:#141a27}

/* --- Code blocks (API) --- */
.card pre{
  display:block; max-width:100%; overflow:auto; white-space:pre; margin:0;
  background:#0d1117; border:1px solid #22293a; border-radius:12px; padding:14px; box-sizing:border-box; font-size:.9rem
}
code{background:#101520;border:1px solid #293348;border-radius:6px;padding:.15rem .35rem}
.code-wrap{position:relative}
.code-copy{
  position:absolute;top:8px;right:8px;border:1px solid #263148;background:#121620;color:#cfe3ff;
  border-radius:10px;padding:.25rem .5rem;cursor:pointer;font-size:.85rem
}
.code-copy:hover{filter:brightness(1.1)}

/* --- Badges/pills/kbd --- */
.badge{display:inline-flex;align-items:center;gap:.35rem;padding:.25rem .5rem;border-radius:8px;background:#101520;border:1px solid #293348;color:#cfe3ff;font-size:.85rem}
.badge.brand{background:#0f131b;border-color:#283041;color:#dbeafe}
.pill{display:inline-block;padding:2px 8px;border-radius:999px;background:#0b1220;border:1px solid #1f2937;font-size:.8rem}
kbd{background:#0f131b;border:1px solid #293348;border-radius:6px;padding:.1rem .35rem}

/* --- Tooltip (data-tip) --- */
[data-tip]{position:relative}
[data-tip]:hover:after{
  content:attr(data-tip);position:absolute;left:50%;top:-10px;transform:translate(-50%,-100%);
  background:#11141b;border:1px solid #263148;color:#cfe3ff;padding:.25rem .45rem;border-radius:8px;white-space:nowrap;font-size:.85rem;z-index:5
}

/* --- Modal & backdrop --- */
.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.35);display:none;z-index:900}
.modal{position:fixed;inset:auto 0 0 0;margin:auto;top:12vh;width:min(640px,92vw);background:var(--panel);border:1px solid var(--border-2);
  border-radius:18px;box-shadow:var(--shadow);display:none;z-index:901}
.modal.open,.modal-backdrop.open{display:block}
.modal .modal-header{padding:14px 16px;border-bottom:1px solid var(--border-2)}
.modal .modal-body{padding:16px}
.modal .modal-footer{padding:12px 16px;border-top:1px solid var(--border-2);display:flex;justify-content:flex-end;gap:.5rem}

/* --- Toast --- */
.toast-container{position:fixed;right:14px;bottom:14px;display:grid;gap:8px;z-index:950}
.toast{background:#121620;border:1px solid #263148;color:#dbeafe;border-radius:12px;padding:10px 12px;box-shadow:var(--shadow)}

/* --- Pagination --- */
.pagination{display:flex;gap:6px}
.pagination .page{padding:.4rem .6rem;border:1px solid #263148;border-radius:10px;background:#121620;color:#cfe3ff}
.pagination .page.active{background:#0f141e}

/* --- Auth (login) --- */
.auth-wrap{min-height:calc(100vh - var(--topbar-h));display:grid;place-items:center;padding:24px}
.auth-card{width:min(520px,92vw);background:var(--panel);border:1px solid var(--border-2);border-radius:18px;box-shadow:var(--shadow);padding:22px}
.auth-actions{display:flex;gap:.6rem;justify-content:flex-end;margin-top:12px}

/* --- Anchor scroll offset --- */
header.hero, section{ scroll-margin-top: calc(var(--topbar-h) + 12px); }
/* 1) Legacy include/header.php menü rendezése függőlegesen */
.sidebar .nav-container,
.sidebar .side-header nav {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.sidebar .nav-container a,
.sidebar .side-header nav a {
  display: block;
  padding: .55rem .7rem;
  border-radius: 10px;
  color: #c8ccda;
  border: 1px solid transparent;
}
.sidebar .nav-container a:hover,
.sidebar .side-header nav a:hover { background:#141925; }
.sidebar .nav-container a.active,
.sidebar .side-header nav a.active {
  background: linear-gradient(180deg,rgba(96,165,250,.12),rgba(96,165,250,.04));
  border-color: #263148;
  color: #d7e6ff;
}

/* 2) API-kulcs kártya: gomb ne nyúljon végig, jobbra igazítás */
.card form.grid.cols-2{
  grid-template-columns: minmax(0,1fr) auto; /* 1 oszlop + gomb */
  align-items: end;
}
.card form.grid.cols-2 > *:last-child{
  display: flex;
  justify-content: flex-end;
}
.card form .btn{ width:auto; white-space:nowrap; }

/* 3) (opcionális) a user + token pill egy sorban maradjon */
.sb-user .sb-inline{ display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; }
.sb-user .sb-pill{ display:inline-flex; align-items:center; gap:.35rem; }

/* 4) Biztonsági: minden kódblokk biztosan férjen a kártyába */
.card pre{
  display:block;
  max-width:100%;
  overflow:auto;
  white-space:pre;
  margin:0;
  background:#0d1117;
  border:1px solid #22293a;
  border-radius:12px;
  padding:14px;
  font-size:.9rem;
}
.row-list{ display:grid; gap:14px; }
.row-card{
  display:grid;
  grid-template-columns: minmax(240px,.8fr) minmax(340px,1fr) minmax(420px,1.2fr);
  gap:14px;
  background:var(--panel);
  border:1px solid #242938;
  border-radius:var(--radius);
  padding:14px;
  box-shadow:var(--shadow);
}
.row-card .meta h3{ margin:0 0 6px; }
.row-card .meta .sub{ color:#aeb5c8; font-size:.9rem; }
.row-card .meta .actions{ display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }

.row-card .gen, .row-card .api{ align-self:start; }
.row-card .hidden{ display:none; }

/* változó jelvény */
.pill{
  display:inline-block; margin:.15rem .25rem .15rem 0;
  padding:.1rem .45rem; border-radius:999px;
  border:1px solid #2a3040; background:#11141b; color:#c8ccda; font-size:.75rem;
}

/* kódblokkok jól férjenek a cellába */
.row-card pre{
  display:block; max-width:100%; overflow:auto; white-space:pre;
  background:#0d1117; border:1px solid #22293a; border-radius:12px; padding:14px; margin:0;
  font-size:.9rem;
}
.code-wrap{ position:relative; }
.code-copy{
  position:absolute; right:8px; top:8px; z-index:1;
  padding:.25rem .5rem; border:1px solid #273148; border-radius:8px;
  background:#141a24; color:#cfd6ea; cursor:pointer; font-size:.8rem;
}

/* reszponzív: kisebb képernyőn egymás alá törik */
@media (max-width:1200px){
  .row-card{ grid-template-columns: 1fr; }
}
.row-card .meta .actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:nowrap;      /* <- ne tördeljen */
}
.row-card .meta .actions .btn{ white-space:nowrap; }
/* Lista: egy sablon = egy sor-kártya */
.row-list{display:flex;flex-direction:column;gap:16px;}
.row-card{
  border:1px solid #242938; border-radius:16px;
  background:linear-gradient(180deg,#121620,#0f131b);
  padding:16px;
}
.row-card .meta h3{margin:0 0 6px;}
.row-card .meta .sub{color:#aeb5c8;font-size:.9rem;display:flex;gap:6px;flex-wrap:wrap}
.pill{padding:.15rem .5rem;border:1px solid #28314a;border-radius:999px;background:#161b28;font-size:.8rem}
.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}

/* Panelek egységesen, rácsban. Alapból rejtve, ha nyitva: megjelenik */
.row-card .panels{display:none;margin-top:14px;gap:14px}
.row-card.open-gen .panels,
.row-card.open-api .panels{display:grid}
@media (min-width:1000px){ .row-card .panels{grid-template-columns:1fr 1fr;} }

.row-card .panel{
  background:#0f1218;border:1px solid #242938;border-radius:14px;padding:14px;
}
.row-card .gen, .row-card .api{display:none}
.row-card.open-gen .gen{display:block}
.row-card.open-api .api{display:block}

/* Szép űrlap-rács és inputok */
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.input{
  width:100%;background:#0d1117;border:1px solid #22293a;border-radius:10px;
  padding:.6rem .75rem;color:#e7e9ee
}
.input:focus{outline:none;border-color:#7c9eff;box-shadow:0 0 0 3px rgba(124,158,255,.18)}

/* Kódblokkok másoló gombbal */
.code-wrap{position:relative}
.code-wrap .code-copy{
  position:absolute;top:8px;right:8px;
  border:1px solid #273148;background:#161b28;color:#d7e6ff;
  border-radius:8px;padding:.25rem .5rem;cursor:pointer
}
.row-card .panels{
  display:none;
  margin-top:14px;
}

/* ha bármelyik panel nyitva van, a konténer ne legyen grid, hanem teljes szélességű blokk */
.row-card.open-gen .panels,
.row-card.open-api .panels{
  display:block;         /* <-- EZ oldja meg, nem marad üres 2. oszlop */
}

/* a tényleges panel is töltse ki a szélességet */
.row-card .panel{ width:100%; max-width:none; }

/* (opcionális) ha valaha egyszerre akarod látni mindkettőt, add a sorra .open-both-ot */
.row-card.open-both .panels{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:14px;
}

/* űrlap rács és kódblokkok biztosan törjenek szépen / férjenek el */
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.code-wrap pre{display:block;max-width:100%;overflow:auto;white-space:pre;}
/* --- Generátor lista: 1 sor = 1 kártya, panelek teljes szélességen --- */

/* Öld ki a régi 3 oszlopos gridet */
.row-card{
  display: block !important;         /* NE grid legyen */
  padding: 16px;
  border: 1px solid #242938;
  border-radius: 16px;
  background: linear-gradient(180deg, #121620, #0f131b);
}

/* A meta rész mehet felül, alatta a panelek */
.row-card .meta{ margin-bottom: 10px; }
.row-card .meta .actions{ display:flex; gap:8px; flex-wrap:wrap; }

/* Panelek konténere: alapból rejtve, nyitva teljes szélesség */
.row-card .panels{ display: none; margin-top: 14px; }
.row-card.open-gen .panels,
.row-card.open-api .panels{ display: block; }   /* ne grid, hanem blokkszintű */

.row-card .panel{
  width: 100%;
  max-width: none;                    /* tényleg széltől szélig */
  background: #0f1218;
  border: 1px solid #242938;
  border-radius: 14px;
  padding: 14px;
}

/* Űrlaprács és kódblokk maradjon szépen törhető */
.form-grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); gap:12px; }
.code-wrap pre{ display:block; max-width:100%; overflow:auto; white-space:pre; }