/* Netflix.wf theme */
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:#141414;color:#fff;font-family:Netflix Sans,'Helvetica Neue',Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:#fff;text-decoration:none}
a:hover{color:#e5e5e5}
.muted{color:#b3b3b3}
.small{font-size:12px}
.mono{font-family:ui-monospace,Menlo,Consolas,monospace}

.nf-topbar{display:flex;justify-content:space-between;align-items:center;padding:14px 44px;background:linear-gradient(180deg,rgba(0,0,0,.85),transparent);position:sticky;top:0;z-index:5}
.nf-topbar .logo{font-weight:900;color:#e50914;letter-spacing:-1px;font-size:26px}
.nf-topbar .logo span{color:#fff;font-weight:500;font-size:14px;margin-left:2px}
.nf-topbar .logo small{color:#b3b3b3;font-size:12px;font-weight:400;margin-left:8px}
.nf-topbar nav a{margin-left:22px;font-size:14px}

.hero{background:linear-gradient(135deg,#000 0%,#3a0000 55%,#650000 100%);padding:56px 44px 40px}
.hero-inner{max-width:960px;margin:auto}
.hero h1{font-size:38px;margin:0 0 8px}
.hero .muted{font-size:15px}
.quota-pill{display:inline-block;margin-top:14px;padding:6px 12px;background:rgba(255,255,255,.1);border-radius:20px;font-size:13px}

.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;padding:32px 44px;max-width:1200px;margin:auto}
.card{position:relative;background:#1f1f1f;border-radius:6px;padding:18px 18px 14px;transition:transform .15s,box-shadow .15s}
.card:hover{transform:scale(1.03);box-shadow:0 8px 28px rgba(0,0,0,.6)}
.card h3{margin:6px 0 4px;font-size:19px}
.card .row{display:flex;gap:14px;margin:10px 0 12px}
.card .mode{font-size:13px;color:#b3b3b3;display:flex;gap:5px;align-items:center}
.card .result{margin-top:8px;min-height:16px;word-break:break-all}
.badge{position:absolute;top:10px;right:10px;background:#e50914;color:#fff;font-size:11px;padding:3px 8px;border-radius:3px;letter-spacing:1px;font-weight:700}

.btn-red{background:#e50914;border:0;color:#fff;padding:10px 20px;border-radius:4px;font-size:15px;font-weight:600;cursor:pointer;transition:background .15s}
.btn-red:hover{background:#f6121d}
.btn-red[disabled]{background:#666;cursor:not-allowed}
.btn-ghost{background:transparent;border:1px solid #e50914;color:#e50914;padding:10px 18px;border-radius:4px;font-weight:600;display:inline-block;cursor:pointer}
.btn-ghost:hover{background:#e50914;color:#fff}

.panel{margin:24px auto;max-width:1120px;padding:24px 32px;background:#181818;border-radius:6px}
.panel h2{margin:0 0 12px;font-size:22px;color:#e5e5e5}
.panel h3{margin:20px 0 8px;font-size:16px}
.alert{margin:12px 0;padding:10px 14px;background:#5a1010;color:#fff;border-left:4px solid #e50914;border-radius:3px;font-size:14px}
.alert.ok{background:#0e3a17;border-color:#46d369}
.chip{display:inline-block;padding:3px 9px;margin:2px;background:#333;border-radius:12px;font-size:12px}

.tbl{width:100%;border-collapse:collapse;font-size:14px}
.tbl th,.tbl td{padding:8px 10px;text-align:left;border-bottom:1px solid #2a2a2a}
.tbl th{background:#0f0f0f;color:#b3b3b3;font-weight:500}
.tbl tr:hover td{background:#1a1a1a}
.mini{padding:4px 8px;font-size:12px;background:#333;color:#fff;border:0;border-radius:3px;cursor:pointer;margin:1px}
.mini:hover{background:#444}
.mini.danger{background:#5a1010}
.mini.danger:hover{background:#c11119}

.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 0}
.form-grid label{display:flex;flex-direction:column;font-size:13px;color:#b3b3b3;gap:4px}
.form-grid input,.form-grid select{background:#333;color:#fff;border:0;padding:9px 10px;border-radius:3px;font-size:14px}
.form-grid .span2{grid-column:span 2}
.form-grid button{grid-column:span 2}

/* Login page */
body.auth{background:#000 url('https://assets.nflxext.com/ffe/siteui/vlv3/34e02248-4d33-499f-b6c5-35b6bcf0f68d/6adc9dc7-b8a8-4e35-b634-de6e1c6b6b0f/ID-id-20240909-TRIFECTA-perspective_5f4de174-fd51-46f3-9d5c-95c9cc23b5cd_medium.jpg') center/cover;min-height:100vh}
body.auth::before{content:'';position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:0}
body.auth .nf-topbar,body.auth .auth-hero,body.auth .nf-foot{position:relative;z-index:1}
.auth-hero{display:flex;justify-content:center;padding:50px 20px 80px}
.auth-card{background:rgba(0,0,0,.75);color:#fff;padding:56px 60px;border-radius:6px;width:100%;max-width:420px}
.auth-card h1{margin:0 0 24px;font-size:30px}
.auth-card label{display:block;margin-bottom:14px;font-size:14px;color:#b3b3b3}
.auth-card input{width:100%;padding:13px 14px;background:#333;color:#fff;border:0;border-radius:4px;font-size:15px;margin-top:4px}
.auth-card button{width:100%;margin:12px 0 8px;padding:12px}

.nf-foot{padding:22px 44px;color:#737373;font-size:12px;text-align:center}
.admin-main{padding:24px}

@media (max-width:640px){
  .hero{padding:32px 20px 24px}
  .hero h1{font-size:24px}
  .grid{padding:18px 14px;gap:12px}
  .nf-topbar{padding:10px 18px}
  .form-grid{grid-template-columns:1fr}
  .form-grid .span2,.form-grid button{grid-column:span 1}
  .auth-card{padding:36px 26px}
}
