:root{
  --bg:#060b17;
  --bg-2:#091227;
  --panel:rgba(11,18,38,.78);
  --panel-2:rgba(14,24,51,.88);
  --border:rgba(122,169,255,.18);
  --text:#edf3ff;
  --muted:#9fb0d8;
  --blue:#2f7dff;
  --cyan:#21c2ff;
  --ok:#3ad38a;
  --warn:#f6b73c;
  --danger:#ff6b81;
  --radius:22px;
  --shadow:0 25px 80px rgba(0,0,0,.45);
  --container:1280px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--text);
  font-family:Inter,system-ui,-apple-system,sans-serif;
  background:
    radial-gradient(circle at top left, rgba(47,125,255,.12), transparent 28%),
    radial-gradient(circle at 85% 20%, rgba(33,194,255,.10), transparent 24%),
    linear-gradient(180deg,#040814 0%, #060b17 42%, #02050e 100%);
  min-height:100vh;
}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}
.container{width:min(calc(100% - 32px), var(--container));margin-inline:auto}
.topbar{
  position:sticky; top:0; z-index:50;
  backdrop-filter:blur(18px);
  background:rgba(4,8,20,.66);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 0}
.brand{display:flex;align-items:center;gap:14px}
.brand img{width:62px;height:62px;object-fit:contain}
.brand strong{display:block;font-size:1rem}
.brand small{display:block;color:var(--muted)}
.nav{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.nav a{font-weight:700;color:#dbe7ff}
.nav a:hover{color:#fff}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:13px 18px;border-radius:15px;border:1px solid transparent;
  font-weight:800;transition:.2s ease;background:transparent;color:white;cursor:pointer;
}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:linear-gradient(135deg,var(--blue),var(--cyan));box-shadow:0 16px 40px rgba(47,125,255,.28)}
.btn-outline{border-color:rgba(255,255,255,.12);background:rgba(255,255,255,.04)}
.btn-danger{background:linear-gradient(135deg,#d94b68,#ff6b81)}
.hero{padding:52px 0 24px}
.hero-card,.panel,.doc-card,.sidebar-card,.table-card,.form-card{
  background:linear-gradient(180deg, rgba(13,22,46,.88), rgba(8,14,30,.76));
  border:1px solid var(--border);
  box-shadow:var(--shadow);
  backdrop-filter:blur(18px);
}
.hero-card{
  border-radius:30px;padding:32px;display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:center;
}
.eyebrow{display:inline-block;color:#81beff;letter-spacing:.18em;font-weight:800;font-size:.78rem;margin-bottom:12px}
h1,h2,h3{margin:0 0 12px}
h1{font-size:clamp(2.4rem,4.8vw,4.8rem);line-height:.95;letter-spacing:-.05em}
h1 span,h2 span{background:linear-gradient(135deg,#fff 0%, #7fd5ff 40%, #2f7dff 85%);-webkit-background-clip:text;background-clip:text;color:transparent}
.lead,p{line-height:1.8}
.lead,.muted{color:var(--muted)}
.hero-actions,.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.mock{
  min-height:320px;border-radius:24px;overflow:hidden;
  border:1px solid rgba(255,255,255,.08);position:relative;
  background:linear-gradient(180deg,#0c1735,#081022);
}
.mock::before{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(130deg, rgba(255,255,255,.06), transparent 35%),
    radial-gradient(circle at 75% 20%, rgba(33,194,255,.18), transparent 28%);
}
.mock-grid{position:absolute;inset:0;opacity:.32;background-image:linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px);background-size:34px 34px}
.section{padding:24px 0 70px}
.layout{display:grid;grid-template-columns:310px 1fr;gap:20px;align-items:start}
.sidebar-card,.doc-card,.table-card,.form-card,.panel{border-radius:24px;padding:22px}
.sidebar-list{display:grid;gap:10px;margin-top:14px}
.sidebar-item{
  display:block;padding:14px 15px;border-radius:16px;
  border:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.03)
}
.sidebar-item:hover,.sidebar-item.active{border-color:rgba(122,169,255,.30);background:rgba(47,125,255,.08)}
.meta{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0 6px}
.pill{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 11px;border-radius:999px;font-size:.88rem;font-weight:700;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);color:#dce7ff
}
.doc-content{color:#dbe7ff}
.doc-content h2{margin-top:26px}
.doc-content code,.mini-code{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);padding:.2rem .45rem;border-radius:8px
}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.metric{
  border-radius:18px;padding:18px;border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.03)
}
.metric strong{display:block;font-size:1.5rem;margin-bottom:6px}
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:14px 12px;text-align:left;border-bottom:1px solid rgba(255,255,255,.06);vertical-align:top}
.table th{color:#dce8ff;font-size:.92rem}
.badge-ok,.badge-warn,.badge-danger{
  display:inline-flex;padding:7px 10px;border-radius:999px;font-size:.85rem;font-weight:800
}
.badge-ok{background:rgba(58,211,138,.14);color:#98ffd1;border:1px solid rgba(58,211,138,.22)}
.badge-warn{background:rgba(246,183,60,.12);color:#ffd88c;border:1px solid rgba(246,183,60,.22)}
.badge-danger{background:rgba(255,107,129,.12);color:#ffb6c3;border:1px solid rgba(255,107,129,.22)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{display:grid;gap:8px}
.field.full{grid-column:1/-1}
label{font-weight:700;color:#dce8ff}
input,select,textarea{
  width:100%;padding:14px 15px;border-radius:14px;border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);color:white;outline:none
}
textarea{min-height:140px;resize:vertical}
.help{font-size:.9rem;color:var(--muted)}
.notice{
  margin-bottom:16px;padding:14px 16px;border-radius:14px;
  background:rgba(47,125,255,.10);border:1px solid rgba(47,125,255,.22);color:#d7e7ff
}
.notice.error{background:rgba(255,107,129,.10);border-color:rgba(255,107,129,.22);color:#ffd2dc}
.notice.ok{background:rgba(58,211,138,.10);border-color:rgba(58,211,138,.22);color:#c6ffe5}
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:28px}
.login-card{width:min(520px,100%);border-radius:28px;padding:28px}
.footer{padding:24px 0 34px;border-top:1px solid rgba(255,255,255,.06);color:var(--muted)}
@media (max-width:1100px){
  .hero-card,.layout,.form-grid,.grid-3{grid-template-columns:1fr}
}


.footer-logo{width:40px!important;height:40px!important;object-fit:contain;flex:0 0 40px}
.doc-cover{
  margin:20px 0 24px;
  border-radius:22px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg,#0c1735,#081022);
  max-height:420px;
}
.doc-cover img{width:100%;height:100%;object-fit:cover;display:block}
.gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin:22px 0 10px}
.gallery-item{
  border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03)
}
.gallery-item img{width:100%;height:100%;object-fit:cover;display:block}
.upload-box{
  padding:16px;border-radius:16px;border:1px dashed rgba(122,169,255,.28);
  background:rgba(255,255,255,.03)
}
input[type="file"]{
  padding:12px;background:rgba(255,255,255,.03);
}
select{
  appearance:auto;
  -webkit-appearance:menulist;
  -moz-appearance:menulist;
}
@media (max-width:760px){
  .gallery{grid-template-columns:1fr}
}

.mock-logo{
  display:grid;
  place-items:center;
}
.mock-logo img{
  position:relative;
  z-index:1;
  width:min(280px, 72%);
  height:auto;
  object-fit:contain;
  filter:drop-shadow(0 20px 60px rgba(47,125,255,.28));
}

/* ===== Admin 2026 ===== */
.admin-auth-body,.admin-dashboard-body{background:#050913}
.admin-auth-shell{min-height:100vh;display:grid;grid-template-columns:1.05fr .95fr;background:radial-gradient(circle at 10% 15%,rgba(34,139,255,.16),transparent 30%),radial-gradient(circle at 85% 80%,rgba(33,194,255,.10),transparent 26%),#050913}
.auth-brand-panel{padding:64px clamp(34px,6vw,90px);display:flex;flex-direction:column;justify-content:space-between;border-right:1px solid rgba(255,255,255,.06);min-height:100vh}
.admin-brand{display:flex;align-items:center;gap:14px;width:max-content}.admin-brand img{width:58px;height:58px;object-fit:contain}.admin-brand strong{display:block;font-size:1rem}.admin-brand small{color:var(--muted);display:block;margin-top:3px}
.auth-copy{max-width:680px}.auth-copy h1{font-size:clamp(3rem,5.4vw,5.8rem);margin-bottom:26px}.auth-copy p{font-size:1.08rem;color:var(--muted);max-width:590px}
.security-strip{display:flex;gap:14px;flex-wrap:wrap}.security-item{min-width:230px;display:flex;align-items:center;gap:12px;padding:14px 16px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.035);border-radius:16px}.security-item strong,.security-item small{display:block}.security-item small{color:var(--muted);margin-top:3px;font-size:.78rem}.security-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:11px;background:rgba(47,125,255,.14);border:1px solid rgba(47,125,255,.22);color:#8dccff;font-weight:900;font-size:.8rem}
.auth-form-panel{display:grid;place-items:center;padding:34px}.modern-login-card{width:min(520px,100%);padding:38px;border-radius:28px;background:linear-gradient(180deg,rgba(15,24,49,.92),rgba(8,14,30,.92));border:1px solid rgba(122,169,255,.18);box-shadow:0 40px 100px rgba(0,0,0,.45)}.modern-login-card h2{font-size:2rem;margin-bottom:8px}.login-heading{display:flex;align-items:center;gap:8px;color:#8ccaff;font-size:.74rem;letter-spacing:.16em;font-weight:900;margin-bottom:20px}.login-status-dot{width:8px;height:8px;border-radius:50%;background:#3ad38a;box-shadow:0 0 0 5px rgba(58,211,138,.10)}.auth-field{margin-top:20px}.password-wrap{position:relative}.password-wrap input{padding-right:88px;min-height:54px;background:rgba(255,255,255,.035)}.password-toggle{position:absolute;right:10px;top:50%;transform:translateY(-50%);border:0;background:transparent;color:#88caff;font-weight:800;cursor:pointer}.auth-submit{width:100%;margin-top:20px;min-height:54px}.auth-back{display:block;text-align:center;color:var(--muted);font-weight:700;margin-top:18px}.auth-back:hover{color:white}.cloudflare-setup-note{margin-top:18px;padding:14px 16px;border-radius:14px;border:1px solid rgba(246,183,60,.2);background:rgba(246,183,60,.08);color:#ffe1a5;font-size:.86rem;line-height:1.6}.cloudflare-setup-note code{font-family:ui-monospace,monospace}.turnstile-wrap{margin-top:18px;min-height:65px}
.admin-app{display:grid;grid-template-columns:260px minmax(0,1fr);min-height:100vh}.admin-sidebar{position:sticky;top:0;height:100vh;padding:28px 20px;border-right:1px solid rgba(255,255,255,.06);background:rgba(5,9,19,.88);backdrop-filter:blur(18px);display:flex;flex-direction:column}.admin-menu{display:grid;gap:8px;margin-top:42px}.admin-menu a{padding:13px 14px;border-radius:13px;color:#aebcdb;font-weight:700;display:flex;align-items:center;gap:11px}.admin-menu a:hover,.admin-menu a.active{background:rgba(47,125,255,.10);color:white}.menu-icon{width:25px;text-align:center;color:#78c8ff}.sidebar-security{margin-top:auto;padding:16px;border:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.03);border-radius:17px}.sidebar-security-top{display:flex;align-items:center;gap:10px}.cloudflare-mark{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,#ff9d32,#f16b2a);font-size:.72rem;font-weight:900;color:white}.sidebar-security p{font-size:.82rem;color:var(--muted);line-height:1.5}.security-pill{display:inline-flex;padding:6px 8px;border-radius:999px;background:rgba(246,183,60,.10);color:#ffd98c;border:1px solid rgba(246,183,60,.18);font-size:.67rem;font-weight:900;letter-spacing:.08em}.security-pill.is-on{background:rgba(58,211,138,.10);color:#9cffd2;border-color:rgba(58,211,138,.18)}.logout-link{margin-top:14px;padding:12px 14px;border-radius:13px;color:#ff9eaf;font-weight:800}.logout-link:hover{background:rgba(255,107,129,.08)}
.admin-main{padding:38px clamp(24px,4vw,58px) 70px;min-width:0}.admin-topbar{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:26px}.admin-topbar h1{font-size:clamp(2.4rem,4vw,4rem)}.admin-topbar p{color:var(--muted);margin:8px 0 0}.topbar-actions{display:flex;gap:10px;flex-wrap:wrap}.admin-notice{margin:0 0 20px}.admin-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:20px}.stat-card{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px;border-radius:20px;background:linear-gradient(180deg,rgba(14,24,49,.86),rgba(9,16,33,.82));border:1px solid rgba(122,169,255,.14)}.stat-card span,.stat-card small{display:block;color:var(--muted)}.stat-card strong{display:block;font-size:2rem;margin:4px 0}.stat-icon{width:52px;height:52px;border-radius:15px;display:grid;place-items:center;background:rgba(47,125,255,.10);border:1px solid rgba(47,125,255,.15);color:#7fcfff;font-size:.72rem;font-weight:900}
.admin-panel{padding:24px;border-radius:22px;background:linear-gradient(180deg,rgba(12,21,43,.82),rgba(7,13,28,.84));border:1px solid rgba(122,169,255,.13);margin-top:20px}.panel-heading{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:18px}.panel-heading h2{font-size:1.55rem}.panel-heading p{margin:0}.admin-table-wrap{overflow:auto}.modern-table td:first-child strong,.modern-table td:first-child small{display:block}.modern-table td:first-child small{color:#6f83ac;margin-top:4px}.version-chip{display:inline-flex;padding:6px 9px;border-radius:9px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);font-weight:800;font-size:.8rem}.row-actions{display:flex;align-items:center;gap:10px}.row-actions a,.row-actions button{border:0;background:none;padding:0;color:#83caff;font-weight:800;cursor:pointer}.row-actions button{color:#ff91a4}.empty-state{padding:38px;text-align:center}.empty-state strong,.empty-state span{display:block}.empty-state span{color:var(--muted);margin-top:6px}.editor-panel{margin-top:20px}.modern-editor input,.modern-editor select,.modern-editor textarea{background:rgba(255,255,255,.035);border-color:rgba(255,255,255,.08)}.modern-editor input:focus,.modern-editor textarea:focus,.modern-editor select:focus{border-color:rgba(47,125,255,.55);box-shadow:0 0 0 4px rgba(47,125,255,.08)}.modern-editor .upload-box{margin-top:10px}.content-editor{min-height:300px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;line-height:1.7}.editor-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
@media(max-width:1050px){.admin-auth-shell{grid-template-columns:1fr}.auth-brand-panel{min-height:auto;padding:38px 26px}.auth-copy{margin:70px 0 40px}.admin-app{grid-template-columns:1fr}.admin-sidebar{position:relative;height:auto;display:block}.admin-menu{grid-template-columns:repeat(4,1fr);margin-top:22px}.sidebar-security{margin-top:22px}.logout-link{display:inline-block}.admin-stats{grid-template-columns:1fr}.admin-topbar{align-items:flex-start}.admin-sidebar .admin-brand{margin:auto}}
@media(max-width:720px){.auth-brand-panel{display:none}.auth-form-panel{min-height:100vh;padding:18px}.modern-login-card{padding:26px}.admin-main{padding:24px 14px 60px}.admin-menu{grid-template-columns:1fr 1fr}.admin-topbar,.panel-heading{display:block}.topbar-actions,.panel-heading .btn{margin-top:16px}.admin-panel{padding:16px}.form-grid{grid-template-columns:1fr}.table th:nth-child(2),.table td:nth-child(2),.table th:nth-child(5),.table td:nth-child(5){display:none}}
