.admin-body { min-height: 100vh; background: #0b0d10; }
.admin-sidebar { position: fixed; z-index: 60; inset: 0 auto 0 0; width: 260px; padding: 1.25rem; display: flex; flex-direction: column; background: #08090c; border-right: 1px solid var(--line); }
.admin-sidebar__top { display: flex; align-items: center; justify-content: space-between; min-height: 55px; }
.admin-sidebar .brand small { margin-left: -.25rem; padding: .18rem .35rem; color: var(--lime); border: 1px solid rgba(202,255,69,.32); border-radius: .3rem; font-family: var(--mono); font-size: .47rem; letter-spacing: .06em; }
.admin-close { display: none; background: none; border: 0; font-size: 1.6rem; }
.admin-nav { display: grid; gap: .3rem; margin-top: 3rem; }
.admin-nav > span { margin: 1.3rem .85rem .45rem; color: #52555d; font-family: var(--mono); font-size: .53rem; letter-spacing: .14em; text-transform: uppercase; }
.admin-nav a { display: flex; align-items: center; gap: .9rem; min-height: 44px; padding: 0 .85rem; color: #8f929a; border-radius: .65rem; font-size: .76rem; font-weight: 600; transition: .2s; }
.admin-nav a i { color: #4c4f56; font-family: var(--mono); font-size: .54rem; font-style: normal; }
.admin-nav a:hover { color: var(--text); background: var(--surface); }
.admin-nav a.is-active { color: var(--bg); background: var(--lime); }
.admin-nav a.is-active i { color: rgba(8,9,12,.55); }
.admin-profile { margin-top: auto; padding-top: 1.2rem; display: grid; grid-template-columns: 38px 1fr auto; align-items: center; gap: .7rem; border-top: 1px solid var(--line); }
.admin-profile > span, .device-avatar { display: grid; place-items: center; width: 38px; height: 38px; color: var(--bg); background: var(--lime); border-radius: 50%; font-weight: 800; font-size: .72rem; }
.admin-profile div { display: grid; min-width: 0; }
.admin-profile strong { font-size: .72rem; }
.admin-profile small { color: var(--muted); font-family: var(--mono); font-size: .55rem; }
.admin-profile > a { color: var(--muted); }
.admin-shell { min-height: 100vh; margin-left: 260px; }
.admin-topbar { height: 72px; padding: 0 clamp(1.2rem, 3vw, 3rem); display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); background: rgba(11,13,16,.82); backdrop-filter: blur(15px); position: sticky; top: 0; z-index: 30; }
.admin-topbar > div { display: flex; align-items: center; gap: 1.5rem; }
.admin-topbar p { margin: 0; color: var(--muted); font-family: var(--mono); font-size: .59rem; text-transform: uppercase; }
.admin-topbar span { display: flex; align-items: center; gap: .5rem; color: #74777f; font-family: var(--mono); font-size: .55rem; text-transform: uppercase; }
.admin-topbar span i { width: 6px; height: 6px; border-radius: 50%; background: var(--lime); }
.admin-topbar > a { font-size: .7rem; font-weight: 700; }
.admin-topbar > a b { color: var(--lime); margin-left: .5rem; }
.admin-menu { display: none; width: 40px; height: 40px; border: 1px solid var(--line); border-radius: .55rem; background: transparent; }
.admin-main { padding: clamp(2rem, 4vw, 4rem) clamp(1rem, 3vw, 3rem) 5rem; }
.admin-heading { display: flex; justify-content: space-between; align-items: end; gap: 2rem; margin-bottom: 3rem; }
.admin-kicker { color: var(--lime); font-family: var(--mono); font-size: .6rem; letter-spacing: .12em; text-transform: uppercase; }
.admin-heading h1 { margin: .7rem 0 0; font-size: clamp(3.1rem, 6vw, 6.4rem); line-height: .83; letter-spacing: -.075em; }
.admin-heading h1 em { color: var(--lime); font-style: normal; }
.admin-heading p { max-width: 650px; color: var(--muted); font-size: .86rem; }
.admin-heading code { color: var(--text); }
.admin-heading--compact { align-items: center; }
.admin-heading--compact h1 { font-size: clamp(3rem, 5vw, 5rem); }
.admin-date { display: flex; align-items: center; gap: .8rem; }
.admin-date > span { font-size: 4.7rem; line-height: .8; letter-spacing: -.08em; }
.admin-date div { color: var(--muted); font-family: var(--mono); font-size: .65rem; text-transform: uppercase; }
.admin-date small { color: #50535a; }
.metric-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: .8rem; margin-bottom: .8rem; }
.metric-card { min-height: 176px; padding: 1.3rem; display: flex; flex-direction: column; background: #111318; border: 1px solid var(--line); border-radius: 1rem; }
.metric-card--accent { color: var(--bg); background: var(--lime); border-color: var(--lime); }
.metric-card > span { color: var(--muted); font-family: var(--mono); font-size: .59rem; text-transform: uppercase; }
.metric-card--accent > span { color: rgba(8,9,12,.62); }
.metric-card strong { margin-top: auto; font-size: 3.2rem; line-height: 1; letter-spacing: -.07em; }
.metric-card small { margin-top: .55rem; color: #6e7179; font-size: .66rem; }
.metric-card--accent small { color: rgba(8,9,12,.62); }
.metric-card small.positive { color: #476000; }
.metric-card small.negative { color: var(--orange); }
.admin-grid { display: grid; gap: .8rem; margin-top: .8rem; }
.admin-grid--chart { grid-template-columns: 1fr 300px; }
.admin-grid--tables { grid-template-columns: 1fr 1fr; }
.panel { min-width: 0; padding: 1.35rem; background: #111318; border: 1px solid var(--line); border-radius: 1rem; overflow: hidden; }
.panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.4rem; }
.panel-heading > div { display: grid; }
.panel-heading span, .setting-card > span { color: var(--lime); font-family: var(--mono); font-size: .53rem; letter-spacing: .1em; text-transform: uppercase; }
.panel-heading h2 { margin: .25rem 0 0; font-size: 1.2rem; letter-spacing: -.035em; }
.panel-heading a, .panel-heading > small { color: var(--muted); font-size: .62rem; }
.chart-panel { min-height: 340px; display: flex; flex-direction: column; }
.bar-chart { height: 225px; display: flex; align-items: end; gap: clamp(.3rem, 1vw, .8rem); margin-top: auto; padding-top: 1.5rem; border-bottom: 1px solid var(--line); background-image: linear-gradient(var(--line) 1px, transparent 1px); background-size: 100% 25%; }
.bar-chart__item { flex: 1; height: 100%; display: flex; flex-direction: column; justify-content: end; align-items: center; gap: .45rem; }
.bar-chart__item span { width: min(24px, 70%); min-height: 4px; background: var(--lime); border-radius: .25rem .25rem 0 0; transition: height .6s ease; }
.bar-chart__item small { color: #666971; font-family: var(--mono); font-size: .48rem; }
.pulse-panel { position: relative; display: flex; flex-direction: column; overflow: hidden; }
.pulse-panel > strong { margin-top: auto; font-size: 5.6rem; line-height: .82; letter-spacing: -.08em; }
.pulse-panel > p { margin: .7rem 0 0; color: var(--muted); font-size: .72rem; }
.pulse-orbit { position: absolute; right: -50px; bottom: -55px; width: 180px; height: 180px; }
.pulse-orbit i { position: absolute; inset: 0; border: 1px solid rgba(202,255,69,.22); border-radius: 50%; animation: orbitPulse 3s infinite ease-out; }
.pulse-orbit i:nth-child(2) { inset: 25px; animation-delay: .5s; }
.pulse-orbit i:nth-child(3) { inset: 50px; animation-delay: 1s; background: var(--lime); }
@keyframes orbitPulse { 50% { opacity: .25; transform: scale(.92); } }
.top-list, .visitor-list { display: grid; }
.top-list > a, .visitor-list > a { min-height: 64px; display: flex; align-items: center; gap: .8rem; border-top: 1px solid var(--line); }
.top-list > a > b { width: 28px; color: var(--lime); font-family: var(--mono); font-size: .56rem; }
.top-list img { width: 62px; height: 42px; object-fit: cover; border-radius: .45rem; }
.top-list a > span, .visitor-list a > div { display: grid; min-width: 0; }
.top-list strong, .visitor-list strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .72rem; }
.top-list small, .visitor-list small { color: var(--muted); font-size: .58rem; }
.top-list em { margin-left: auto; color: var(--lime); font-family: var(--mono); font-size: .62rem; font-style: normal; }
.visitor-list .device-avatar { flex: none; width: 36px; height: 36px; background: #282b31; color: var(--text); }
.visitor-list time { margin-left: auto; color: #6f7279; font-family: var(--mono); font-size: .54rem; white-space: nowrap; }
.admin-button { min-height: 44px; padding: 0 1rem; border: 1px solid rgba(202,255,69,.45); border-radius: 999px; color: var(--lime); background: var(--lime-soft); cursor: pointer; font-size: .7rem; font-weight: 700; }
.admin-button--danger { color: #ff8e68; border-color: rgba(255,106,53,.35); background: rgba(255,106,53,.08); }
.admin-notice { margin: -1rem 0 1.4rem; padding: .8rem 1rem; color: #dffc9a; border: 1px solid rgba(202,255,69,.25); border-radius: .65rem; background: var(--lime-soft); font-size: .75rem; }
.admin-notice--error { color: #ffc1ab; border-color: rgba(255,106,53,.3); background: rgba(255,106,53,.08); }
.data-panel { padding: 0; }
.data-panel > .panel-heading { padding: 1.35rem 1.35rem 0; }
.responsive-table { width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th { padding: .75rem 1rem; color: #64676f; background: #0d0f12; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); text-align: left; font-family: var(--mono); font-size: .5rem; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
td { padding: .8rem 1rem; color: #c8c9cd; border-bottom: 1px solid rgba(255,255,255,.06); font-size: .67rem; white-space: nowrap; }
td > b { color: var(--lime); font-family: var(--mono); }
td code { color: #8f9299; font-size: .6rem; }
.table-car, .user-cell { display: flex; align-items: center; gap: .7rem; }
.table-car img { width: 62px; height: 42px; object-fit: cover; border-radius: .4rem; }
.table-car span, .user-cell > span:last-child { display: grid; }
.table-car strong, .user-cell strong { color: var(--text); font-size: .7rem; }
.table-car small, .user-cell small, .cell-sub { display: block; margin-top: .15rem; color: #6f7279; font-size: .56rem; }
.status-badge { display: inline-flex; align-items: center; padding: .3rem .55rem; color: #8c8f96; border: 1px solid var(--line); border-radius: 999px; font-family: var(--mono); font-size: .5rem; text-transform: uppercase; }
.status-badge.is-live { color: var(--lime); border-color: rgba(202,255,69,.3); background: var(--lime-soft); }
.table-action { padding: .35rem .55rem; color: #b7b9be; border: 1px solid var(--line); background: transparent; border-radius: .45rem; cursor: pointer; font-size: .55rem; }
.table-empty { padding: 2.5rem 1rem !important; color: var(--muted); text-align: center; }
.help-panel { margin-top: .8rem; padding: 1.7rem; display: grid; grid-template-columns: 170px 1fr 1.2fr; align-items: center; gap: 2rem; border: 1px dashed var(--line); border-radius: 1rem; }
.help-panel > span { color: var(--lime); font-family: var(--mono); font-size: .55rem; }
.help-panel code { color: #d7d8da; font-family: var(--mono); font-size: .62rem; line-height: 1.9; }
.help-panel p { color: var(--muted); font-size: .72rem; }
.admin-search { display: flex; gap: .5rem; }
.admin-search input { width: min(340px, 60vw); height: 44px; padding: 0 1rem; color: var(--text); background: #111318; border: 1px solid var(--line); border-radius: 999px; outline: none; }
.admin-search input:focus { border-color: var(--lime); }
.admin-search button { padding: 0 1rem; color: var(--bg); background: var(--lime); border: 0; border-radius: 999px; font-weight: 700; }
.admin-back { display: inline-block; margin-bottom: 2rem; color: var(--muted); font-family: var(--mono); font-size: .6rem; text-transform: uppercase; }
.user-hero { padding-bottom: 2.5rem; display: flex; align-items: center; gap: 1.2rem; }
.device-avatar--large { width: 72px; height: 72px; font-size: 1.5rem; }
.user-hero h1 { margin: .25rem 0; font-size: clamp(2rem, 5vw, 4rem); letter-spacing: -.06em; }
.user-hero p { color: var(--muted); margin: 0; font-family: var(--mono); font-size: .55rem; }
.user-hero .status-badge { margin-left: auto; }
.user-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: .8rem; }
.user-facts article { min-height: 130px; padding: 1.2rem; display: flex; flex-direction: column; background: #111318; border: 1px solid var(--line); border-radius: 1rem; }
.user-facts span { color: var(--muted); font-family: var(--mono); font-size: .53rem; text-transform: uppercase; }
.user-facts strong { margin-top: auto; font-size: 1.35rem; }
.user-facts small { color: #777a81; font-size: .6rem; }
.technical-panel { margin-top: .8rem; }
.technical-panel dl { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.technical-panel dl div { min-width: 0; padding: .85rem; display: grid; gap: .2rem; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.technical-panel dt { color: #6f7279; font-family: var(--mono); font-size: .48rem; text-transform: uppercase; }
.technical-panel dd { margin: 0; overflow: hidden; text-overflow: ellipsis; color: #d4d5d8; font-size: .68rem; white-space: nowrap; }
.user-agent { margin: 1rem 0 0; display: grid; gap: .35rem; }
.user-agent span { color: #6f7279; font-family: var(--mono); font-size: .48rem; text-transform: uppercase; }
.user-agent code { padding: .7rem; overflow-wrap: anywhere; color: #999ca4; background: #0b0d10; border-radius: .5rem; font-size: .56rem; white-space: normal; }
.timeline { display: grid; }
.timeline > div { position: relative; min-height: 62px; display: grid; grid-template-columns: 15px 1fr auto; align-items: center; gap: .6rem; border-top: 1px solid var(--line); }
.timeline i { width: 7px; height: 7px; border-radius: 50%; background: var(--lime); }
.timeline span { display: grid; }
.timeline strong { font-size: .68rem; }
.timeline small { color: var(--muted); font-size: .56rem; }
.timeline em { color: var(--muted); font-size: .58rem; font-style: normal; }
.settings-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.setting-card { min-height: 270px; display: flex; flex-direction: column; align-items: start; }
.setting-card h2 { margin: .45rem 0 1.2rem; font-size: 2.2rem; letter-spacing: -.05em; }
.setting-card p, .setting-card li { color: var(--muted); font-size: .7rem; }
.setting-card dl { width: 100%; margin: auto 0 0; }
.setting-card dl div { padding: .55rem 0; display: flex; justify-content: space-between; gap: 1rem; border-top: 1px solid var(--line); }
.setting-card dt, .setting-card dd { margin: 0; font-size: .62rem; }
.setting-card dt { color: var(--muted); }
.setting-card form { margin-top: auto; }
.password-panel { margin-top: .8rem; display: grid; grid-template-columns: 1fr 1.4fr; gap: 3rem; align-items: end; }
.password-panel h2 { margin: .4rem 0; font-size: 1.5rem; }
.password-panel p { margin: 0; color: var(--muted); font-size: .68rem; }
.password-panel form { display: grid; grid-template-columns: 1fr 1fr auto; gap: .7rem; align-items: end; }
.password-panel label { display: grid; gap: .35rem; color: #aaa; font-size: .58rem; }
.password-panel input { height: 42px; padding: 0 .7rem; color: var(--text); background: #090b0e; border: 1px solid var(--line); border-radius: .6rem; outline: none; }
.password-panel input:focus { border-color: var(--lime); }

.admin-login-page { min-height: 100svh; padding: 2rem; display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 5vw; background: #090a0d; overflow: hidden; }
.admin-login-brand { position: fixed; top: 2rem; left: 2rem; }
.login-card { width: min(520px, 100%); justify-self: end; }
.login-card h1 { margin: .7rem 0 1.2rem; font-size: clamp(3.1rem, 6vw, 6rem); line-height: .88; letter-spacing: -.075em; }
.login-card h1 em { color: var(--lime); font-style: normal; }
.login-card > p { max-width: 450px; color: var(--muted); }
.login-card form { display: grid; gap: 1rem; margin-top: 2rem; }
.login-card label { display: grid; gap: .45rem; color: #b8bac0; font-size: .68rem; font-weight: 700; }
.login-card input { width: 100%; height: 52px; padding: 0 1rem; color: var(--text); background: #111318; border: 1px solid var(--line); border-radius: .75rem; outline: none; }
.login-card input:focus { border-color: var(--lime); box-shadow: 0 0 0 3px rgba(202,255,69,.1); }
.login-card .button { margin-top: .6rem; }
.login-card .button:disabled { opacity: .4; cursor: not-allowed; }
.login-card > small { display: block; margin-top: 1rem; color: #595c63; font-size: .56rem; }
.form-alert { margin-top: 1.2rem; padding: .8rem 1rem; color: #d6e7ad; border: 1px solid rgba(202,255,69,.25); border-radius: .65rem; background: var(--lime-soft); font-size: .67rem; }
.form-alert a { color: var(--lime); font-weight: 700; }
.form-alert--error { color: #ffc0aa; border-color: rgba(255,106,53,.3); background: rgba(255,106,53,.08); }
.login-visual { position: relative; height: calc(100svh - 4rem); padding: 2rem; display: flex; flex-direction: column; justify-content: space-between; background: linear-gradient(145deg, #1a1d24, #0d0f13); border: 1px solid var(--line); border-radius: 1.5rem 6rem 1.5rem 1.5rem; overflow: hidden; }
.login-visual::before, .login-visual::after { content: ""; position: absolute; border: 1px solid rgba(202,255,69,.22); border-radius: 50%; }
.login-visual::before { width: 42vw; height: 42vw; top: 14%; right: -11vw; }
.login-visual::after { width: 25vw; height: 25vw; top: calc(14% + 8.5vw); right: -2.5vw; background: rgba(202,255,69,.04); }
.login-visual > div { display: flex; justify-content: space-between; color: var(--lime); font-family: var(--mono); font-size: .6rem; }
.login-visual > div strong { font-size: 5rem; line-height: .8; }
.login-visual > p { position: relative; z-index: 1; margin: 0; font-size: clamp(3rem, 5vw, 6rem); line-height: .9; letter-spacing: -.07em; }
.admin-backdrop { display: none; }

@media (max-width: 1100px) {
    .admin-sidebar { transform: translateX(-100%); transition: transform .3s ease; }
    .admin-sidebar.is-open { transform: none; }
    .admin-close, .admin-menu { display: block; }
    .admin-shell { margin-left: 0; }
    .admin-topbar { justify-content: start; gap: 1rem; }
    .admin-topbar > a { margin-left: auto; }
    .admin-backdrop { position: fixed; z-index: 55; inset: 0; background: rgba(0,0,0,.65); }
    .admin-backdrop.is-visible { display: block; }
    .metric-grid { grid-template-columns: 1fr 1fr; }
    .admin-grid--tables { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
    .admin-topbar > div span { display: none; }
    .admin-main { padding-top: 2rem; }
    .admin-heading { align-items: start; flex-direction: column; }
    .admin-date { display: none; }
    .metric-grid { grid-template-columns: 1fr 1fr; }
    .metric-card { min-height: 145px; }
    .metric-card strong { font-size: 2.4rem; }
    .admin-grid--chart { grid-template-columns: 1fr; }
    .pulse-panel { min-height: 260px; }
    .help-panel { grid-template-columns: 1fr; gap: .8rem; }
    .admin-search { width: 100%; }
    .admin-search input { width: 100%; }
    .user-hero { align-items: start; flex-wrap: wrap; }
    .user-hero .status-badge { margin-left: 0; }
    .user-facts, .settings-grid { grid-template-columns: 1fr 1fr; }
    .technical-panel dl { grid-template-columns: repeat(2, 1fr); }
    .password-panel { grid-template-columns: 1fr; }
    .admin-login-page { padding: 6rem 1rem 1rem; grid-template-columns: 1fr; }
    .admin-login-brand { top: 1rem; left: 1rem; }
    .login-card { justify-self: stretch; }
    .login-visual { display: none; }
}
@media (max-width: 480px) {
    .admin-topbar > a { font-size: 0; }
    .admin-topbar > a b { font-size: 1rem; }
    .metric-grid { grid-template-columns: 1fr; }
    .metric-card { min-height: 135px; }
    .user-facts, .settings-grid { grid-template-columns: 1fr; }
    .technical-panel dl { grid-template-columns: 1fr; }
    .password-panel form { grid-template-columns: 1fr; }
}