@import url("https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800;900&display=swap");

*{box-sizing:border-box}
body{margin:0;font-family:"Outfit",system-ui,sans-serif;background:#f1f5f9;color:#0f172a;-webkit-font-smoothing:antialiased}

.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:16px}
.login-card{width:100%;max-width:420px;background:#fff;border-radius:16px;padding:28px;box-shadow:0 20px 50px rgba(15,23,42,.12);border:1px solid #e2e8f0}
.brand{display:flex;gap:12px;align-items:center;margin-bottom:20px}
.logo-mark{width:44px;height:44px;border-radius:12px;background:linear-gradient(135deg,#ff6b00,#ff8c33);display:grid;place-items:center;font-size:20px;flex-shrink:0}
.brand h1{margin:0;font-size:20px}.brand h1 span{color:#ff6b00}.brand p{margin:4px 0 0;font-size:13px;color:#64748b}
label{display:block;font-size:13px;font-weight:700;margin:12px 0 6px;color:#334155}
input[type=text],input[type=password],textarea.seo-input{width:100%;padding:12px 14px;border:1.5px solid #cbd5e1;border-radius:12px;font-size:14px;font-family:inherit}
.login-card button{width:100%;margin-top:16px;background:linear-gradient(135deg,#ff6b00,#ff8c33);color:#fff;border:none;border-radius:12px;padding:12px 16px;font-weight:800;cursor:pointer}
.error{color:#b91c1c;font-size:13px;font-weight:600;margin-top:10px}.hint{margin-top:14px;text-align:center;font-size:11px;color:#94a3b8}

.admin-root .topbar{display:flex;justify-content:space-between;align-items:center;padding:14px 24px;background:#0b1220;color:#fff;gap:12px;flex-wrap:wrap}
.topbar-brand{display:flex;align-items:center;gap:12px}
.topbar-brand strong{font-size:16px}
.live-badge{margin-left:8px;background:rgba(255,107,0,.2);color:#ffb347;padding:4px 10px;border-radius:999px;font-size:11px;font-weight:700}
.topbar-actions{display:flex;align-items:center;gap:12px}
.btn-link,.logout{color:#fff;text-decoration:none;font-size:13px;font-weight:700}
.btn-link{padding:8px 12px;border:1px solid rgba(255,255,255,.2);border-radius:10px}
.logout{opacity:.85}

.container{max-width:1280px;margin:0 auto;padding:20px 24px 40px}
.page-head{margin-bottom:20px}
.page-head h1{margin:0 0 6px;font-size:24px;font-weight:800}
.page-head p{margin:0;color:#64748b;font-size:14px}

.admin-stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}
.admin-stat-card{background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:20px;box-shadow:0 1px 3px rgba(15,23,42,.06);border-top:3px solid #0c831f}
.admin-stat-card.accent-green{border-top-color:#059669}
.admin-stat-card.accent-amber{border-top-color:#f59e0b}
.admin-stat-card.accent-blue{border-top-color:#1d4ed8}
.admin-stat-card h4{margin:0 0 8px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#64748b}
.admin-stat-card .value{font-size:28px;font-weight:800;color:#0f172a}

.seo-grid{display:grid;grid-template-columns:2fr 1fr;gap:20px;align-items:start}
.seo-card{background:#fff;border-radius:16px;padding:22px;box-shadow:0 1px 3px rgba(15,23,42,.06),0 8px 24px rgba(15,23,42,.04);border:1px solid #e2e8f0;margin-bottom:20px}
.seo-card-title{font-size:15px;font-weight:800;margin-bottom:18px;color:#0f172a;border-bottom:1px solid #f1f5f9;padding-bottom:14px;display:flex;align-items:center;gap:8px}
.seo-card-title.light{color:#fff;border-bottom-color:rgba(255,255,255,.12)}
.seo-label{display:block;font-size:11px;font-weight:700;color:#64748b;margin-bottom:8px;text-transform:uppercase;letter-spacing:.05em}
.seo-label.mt{margin-top:16px}
.seo-input{width:100%;padding:12px 14px;border-radius:8px;border:1px solid #e2e8f0;font-family:inherit;font-size:14px;outline:none;background:#f8fafc}
.seo-input:focus{border-color:#0c831f;background:#fff;box-shadow:0 0 0 3px rgba(12,131,31,.15)}
.seo-input.small{padding:6px 10px;font-size:12px;width:110px}
.row-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.row-actions{display:flex;align-items:center;gap:10px;margin-top:14px;flex-wrap:wrap}
.muted-inline,.muted{color:#64748b;font-size:13px}
.hint-block{display:block;color:#94a3b8;font-size:12px;margin-top:6px}
.divider{margin:16px 0;border-top:1px dashed #e2e8f0}

.btn-magic,.btn-success,.btn-indigo,.btn-dark{border:none;border-radius:8px;padding:11px 22px;font-weight:700;cursor:pointer;font-family:inherit;font-size:13px;color:#fff;transition:.2s}
.btn-magic{background:linear-gradient(135deg,#0c831f,#059669);box-shadow:0 4px 12px rgba(12,131,31,.25)}
.btn-magic:hover{transform:translateY(-1px)}
.btn-magic.small,.btn-success.small{padding:6px 12px;font-size:12px}
.btn-success{background:#059669}
.btn-indigo{background:#4f46e5}
.btn-dark{background:#0f172a}
.full{width:100%}
.mt{margin-top:10px}
.hidden{display:none!important}

.area-list-box{border:1px solid #e2e8f0;border-radius:12px;max-height:280px;overflow-y:auto;padding:12px;background:#f8fafc}
.area-item{display:flex;align-items:center;gap:10px;padding:9px 12px;background:#fff;border:1px solid #e2e8f0;border-radius:8px;margin-bottom:6px;cursor:pointer;font-size:13px;font-weight:500}
.area-item:hover{border-color:#0c831f;background:rgba(12,131,31,.06)}
.area-item input{accent-color:#0c831f}
.areas-toolbar{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:16px 0 8px;flex-wrap:wrap}
.suffix-inline{display:flex;gap:6px;align-items:center}

.sim-card{background:#eef2ff;border:2px solid #6366f1}
.sim-card .seo-card-title{color:#3730a3;border-bottom-color:#c7d2fe}
.sim-result{margin-top:12px;padding:12px;background:#fff;border-radius:10px;border:1px solid #c7d2fe}
.sim-result .score{font-size:11px;color:#64748b}
.sim-result .title{color:#1a0dab;font-size:14px;font-weight:600;margin-top:4px}
.sim-result .url{color:#006621;font-size:12px;word-break:break-all}

.live-card{background:#f0fdf4;border:2px solid #0c831f}
.live-card .seo-card-title{color:#065f15;border-bottom-color:#bbf7d0}
.live-row{display:flex;justify-content:space-between;gap:12px;margin-bottom:10px;font-size:13px}
.live-row span{color:#64748b;font-weight:600}
.live-row strong{color:#0c831f;text-align:right;word-break:break-all}

.preview-summary{background:#0b1220;color:#fff;border:none}
.preview-summary .live-row.light span{color:#94a3b8}
.preview-summary .live-row.light strong{color:#febd69}

.preview-box{padding:15px;border:1px solid #e2e8f0;border-radius:10px;background:#f8fafc;min-height:200px;max-height:320px;overflow-y:auto}
.preview-box.tall{max-height:480px}
.empty-preview{color:#94a3b8;font-size:12px;text-align:center;padding-top:40px;margin:0}
.preview-url-line{border-bottom:1px solid #f1f5f9;padding:12px 0;font-size:12px}
.preview-url-line:last-child{border-bottom:none}
.preview-url-line a{color:#1d4ed8;text-decoration:none;font-weight:600;word-break:break-all}
.preview-url-line a:hover{text-decoration:underline}
.preview-title{font-size:12px;color:#64748b;margin-top:4px;line-height:1.4}

.gsc-card{background:#eff6ff;border:1px solid #bfdbfe}
.gsc-card .seo-card-title{color:#1e40af;border-bottom-color:#bfdbfe}
.gsc-list{margin:0;padding-left:18px;font-size:12px;line-height:1.7;color:#334155}

.deploy-card{border:1px solid #bbf7d0;background:#fafdfa}
.message{min-height:24px;font-size:13px;font-weight:700;margin-top:12px;color:#059669}
.message.error{color:#b91c1c}

.pages-list{display:grid;gap:8px;max-height:420px;overflow:auto}
.page-item{border:1px solid #e2e8f0;border-radius:10px;padding:12px 14px;font-size:13px;background:#fff}
.page-item strong{display:block;color:#0f172a;margin-bottom:4px}
.page-item a{color:#1d4ed8;font-size:12px;font-weight:600;text-decoration:none;word-break:break-all}
.page-item a:hover{text-decoration:underline}
.page-item span{display:block;color:#64748b;font-size:11px;margin-top:4px}

.admin-modal-overlay{position:fixed;inset:0;background:rgba(15,23,42,.5);z-index:500;display:flex;align-items:center;justify-content:center;padding:20px}
.admin-modal{background:#fff;border-radius:16px;padding:24px;width:100%;max-width:520px;max-height:90vh;overflow-y:auto}
.admin-modal.wide{max-width:680px}
.admin-modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.admin-modal-head h4{margin:0;font-size:16px;font-weight:800}
.modal-close{border:none;background:#f1f5f9;width:32px;height:32px;border-radius:8px;font-size:20px;cursor:pointer;line-height:1}

@media(max-width:1100px){.seo-grid{grid-template-columns:1fr}.admin-stat-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.row-2{grid-template-columns:1fr}.admin-stat-grid{grid-template-columns:1fr}.container{padding:16px}}