:root {
  --bg: #09090b;
  --panel: #111216;
  --panel-soft: #17181d;
  --border: #24262f;
  --text: #f4f5f7;
  --muted: #9ea3af;
  --accent: #ffffff;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: Inter, Arial, sans-serif; background: var(--bg); color: var(--text); }
a { text-decoration: none; color: inherit; }
.landing-body { min-height: 100vh; display: grid; place-items: center; padding: 24px; }
.landing-card { width: min(720px, 100%); background: linear-gradient(180deg, #14161b, #0f1014); border: 1px solid var(--border); border-radius: 28px; padding: 34px; box-shadow: 0 20px 80px rgba(0,0,0,.35); }
.small-card { width: min(520px, 100%); }
.pill { display: inline-flex; padding: 8px 12px; border-radius: 999px; background: #1b1d24; border: 1px solid var(--border); font-size: 14px; margin-bottom: 14px; }
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 22px; }
.primary-btn, .ghost-btn, .logout-btn { display: inline-flex; align-items: center; justify-content: center; padding: 12px 18px; border-radius: 14px; }
.primary-btn { background: #f3f4f6; color: #111; font-weight: 700; }
.ghost-btn, .logout-btn { background: #17191f; border: 1px solid var(--border); }
.wide-btn { width: 100%; margin-top: 12px; }
.error-box { background: #32181d; border: 1px solid #5d242f; color: #ffd9df; padding: 12px 14px; border-radius: 14px; margin: 14px 0; }
.layout { display: grid; grid-template-columns: 280px 1fr; min-height: 100vh; }
.sidebar { background: #0f1014; border-right: 1px solid var(--border); padding: 18px; display: flex; flex-direction: column; justify-content: space-between; gap: 18px; }
.user-box { display: flex; gap: 14px; align-items: center; background: #15171d; border: 1px solid var(--border); border-radius: 18px; padding: 14px; margin-bottom: 18px; }
.avatar { width: 48px; height: 48px; border-radius: 999px; object-fit: cover; }
.avatar.large { width: 72px; height: 72px; }
.small-label { color: var(--muted); font-size: 12px; }
.user-name { font-weight: 800; font-size: 17px; }
.user-sub { color: var(--muted); font-size: 14px; }
.menu-title { color: var(--muted); font-size: 13px; margin: 8px 4px 10px; }
.nav { display: flex; flex-direction: column; gap: 6px; }
.nav-link { padding: 12px 14px; border-radius: 14px; color: #fff; }
.nav-link.active, .nav-link:hover { background: #1b1d24; }
.content { padding: 28px; }
.topbar { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 22px; }
.eyebrow { color: var(--muted); font-size: 13px; margin-bottom: 4px; }
.topbar h1 { margin: 0; font-size: 30px; }
.top-user { background: #17191f; border: 1px solid var(--border); border-radius: 14px; padding: 12px 14px; }
.stats-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 18px; }
.stat-card, .card { background: var(--panel); border: 1px solid var(--border); border-radius: 22px; }
.stat-card { padding: 20px; display: flex; justify-content: space-between; align-items: center; }
.stat-card span { color: var(--muted); }
.stat-card strong { font-size: 30px; }
.content-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.card { padding: 20px; }
.card h2 { margin-top: 0; }
.list-item { padding: 14px 0; border-top: 1px solid rgba(255,255,255,.06); }
.list-item:first-child { border-top: 0; }
.list-title { font-weight: 700; margin-bottom: 6px; }
.list-sub { color: var(--muted); font-size: 14px; }
.profile-card { display: flex; gap: 18px; align-items: center; }
.badge-row { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 10px; }
.tag { padding: 7px 11px; border-radius: 999px; background: #181b21; border: 1px solid var(--border); font-size: 13px; }
.tag.red { background: #3a171d; }
.tag.blue { background: #162336; }
@media (max-width: 960px) {
  .layout { grid-template-columns: 1fr; }
  .content-grid, .stats-grid { grid-template-columns: 1fr; }
  .topbar { flex-direction: column; align-items: flex-start; }
}

.action-item{display:flex;justify-content:space-between;align-items:center;gap:16px;}
.action-buttons{display:flex;gap:10px;flex-wrap:wrap;}
.mini-btn{background:#17191f;border:1px solid var(--border);color:#fff;padding:10px 12px;border-radius:12px;cursor:pointer;}
.mini-btn.danger{background:#32181d;border-color:#5d242f;}
.ticket-link{display:block;}
@media (max-width:960px){.action-item{flex-direction:column;align-items:flex-start;}}

.form-card h2{margin-top:0;}
.form-grid{display:grid;gap:12px;}
.text-input,.text-area{width:100%;padding:12px 14px;background:#17191f;border:1px solid var(--border);border-radius:14px;color:#fff;}
.text-area{min-height:120px;resize:vertical;}
.info-box{background:#151d2d;border:1px solid #30456d;color:#dfe8ff;padding:12px 14px;border-radius:14px;margin-bottom:14px;}
.top-gap{margin-top:18px;}

.chat-box{display:flex;flex-direction:column;gap:12px;max-height:420px;overflow:auto;padding:12px;background:#0f1115;border:1px solid var(--border);border-radius:18px;}
.bubble{max-width:85%;padding:12px 14px;border-radius:16px;line-height:1.5;}
.bubble.assistant{background:#1b1f27;color:#f8fafc;align-self:flex-start;}
.bubble.user{background:#f3f4f6;color:#111827;align-self:flex-end;}
.chat-form{display:grid;grid-template-columns:1fr auto auto;gap:10px;margin-top:14px;}
@media (max-width:900px){.public-header,.public-footer{padding:18px 20px;}.public-hero{padding:24px;}.public-hero h1{font-size:32px;}.chat-form{grid-template-columns:1fr;}}

.unified-page{background:var(--bg);color:var(--text);min-height:100vh;display:flex;flex-direction:column;}
.unified-header{display:flex;justify-content:space-between;align-items:center;padding:24px 32px;border-bottom:1px solid var(--border);background:#0f1014;}
.brand-dark{font-size:28px;font-weight:800;color:#f8fafc;}
.unified-main{flex:1;display:grid;place-items:center;padding:32px 20px;}
.unified-card{width:min(860px,100%);background:linear-gradient(180deg,#14161b,#0f1014);border:1px solid var(--border);border-radius:28px;padding:34px;box-shadow:0 20px 80px rgba(0,0,0,.35);}
.large-card{text-align:center;}
.small-card-dark{width:min(520px,100%);}
.center-actions{justify-content:center;}
.unified-footer{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:24px 32px;border-top:1px solid var(--border);background:#0f1014;}
.footer-links-dark{display:flex;gap:16px;flex-wrap:wrap;color:#94a3b8;}
.footer-right-dark{color:#94a3b8;}
@media (max-width:900px){.unified-header,.unified-footer{padding:18px 20px;}.unified-card{padding:24px;}.brand-dark{font-size:22px;}}
