/* RKN SEO Reports - client portal.
   Tokens mirror the Royking Nocturne site exactly, so the dashboard is part of the site
   rather than a panel sitting on top of it. Dark is the default, as on the site; the
   site's own toggle sets data-theme="light" on the html element. */

.rkn-wrap, body.rkn-portal-page{
--rk-bg:#14161d;--rk-surface:#1b1e26;--rk-lift:#21252e;
--rk-text:#e6e8ec;--rk-text-2:#bcc2cc;--rk-muted:#838a95;
--rk-line:color-mix(in srgb, #e6e8ec 15%, transparent);
--rk-line-soft:color-mix(in srgb, #e6e8ec 9%, transparent);
--rk-grid:color-mix(in srgb, #e6e8ec 5%, transparent);
--rk-accent:#cf6f2e;--rk-accent-soft:#e58c49;--rk-accent-bg:#22130a;
--rk-hot:#e2725b;--rk-hot-bg:#2c1510;
--rk-warm:#e0a97f;--rk-warm-bg:#2a1a0d;
--rk-cool:#a1a8b3;--rk-cool-bg:#1f242c;
--rk-shadow:0 0 0 1px color-mix(in srgb, #e6e8ec 12%, transparent), 0 8px 22px rgba(0,0,0,.5);
--rk-mesh:linear-gradient(to right, var(--rk-grid) 1px, transparent 1px), linear-gradient(to bottom, var(--rk-grid) 1px, transparent 1px);
--r:3px;
}
:root[data-theme="light"] .rkn-wrap,
:root[data-theme="light"] body.rkn-portal-page,
body.rkn-portal-page[data-theme="light"]{
--rk-bg:#e3e1dc;--rk-surface:#f1f0ec;--rk-lift:#ecebe6;
--rk-text:#1c1e23;--rk-text-2:#43413b;--rk-muted:#7b776f;
--rk-line:color-mix(in srgb, #1c1e23 18%, transparent);
--rk-line-soft:color-mix(in srgb, #1c1e23 10%, transparent);
--rk-grid:color-mix(in srgb, #1c1e23 7%, transparent);
--rk-accent:#a8521c;--rk-accent-soft:#c67c44;--rk-accent-bg:#fbeadd;
--rk-hot:#b4432c;--rk-hot-bg:#f7e3de;
--rk-warm:#8a4217;--rk-warm-bg:#f6e8d9;
--rk-cool:#5c5952;--rk-cool-bg:#e7e5e0;
--rk-shadow:0 0 0 1px color-mix(in srgb, #1c1e23 14%, transparent), 0 6px 18px rgba(28,30,35,.12);
}

/* The portal page takes the site's own background and its grid mesh. */
body.rkn-portal-page{background-color:var(--rk-bg);background-image:var(--rk-mesh);background-size:96px 96px;color:var(--rk-text)}

/* Theme integration. The page template wraps content in a narrow prose column with a
   dark-on-dark title, both of which fight a dashboard, so they are neutralised here
   and only on this page. */
body.rkn-portal-page main > article,
body.rkn-portal-page main > .entry-content,
body.rkn-portal-page article > .prose{max-width:none!important;padding-left:clamp(16px,4vw,40px);padding-right:clamp(16px,4vw,40px)}
body.rkn-portal-page main > article{padding-top:28px;padding-bottom:40px}
body.rkn-portal-page main article > header,
body.rkn-portal-page main > article > h1,
body.rkn-portal-page .entry-title{display:none}
body.rkn-portal-page > header{border-color:var(--rk-line-soft)!important}
body.rkn-portal-page > header,
body.rkn-portal-page > header a,
body.rkn-portal-page > footer,
body.rkn-portal-page > footer a{color:var(--rk-text)!important}
body.rkn-portal-page > footer{border-color:var(--rk-line-soft)!important}
body.rkn-portal-page .prose :where(table,th,td,h2,h3,h4,p,a,li){color:inherit;margin:0}
body.rkn-portal-page .prose :where(table){box-shadow:none}

.rkn-wrap{color:var(--rk-text);font-family:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;font-size:15px;line-height:1.55;max-width:1180px;margin:0 auto;padding:4px 0 64px;-webkit-font-smoothing:antialiased}
.rkn-wrap *{box-sizing:border-box}
.rkn-wrap h2,.rkn-wrap h3,.rkn-wrap h4{font-family:"Inter",system-ui,sans-serif;margin:0;letter-spacing:-.015em;text-wrap:balance;color:var(--rk-text)}
.rkn-wrap a{color:var(--rk-accent-soft)}
.rkn-mono,.rkn-table td.num,.rkn-kpi-value{font-family:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;font-variant-numeric:tabular-nums}

/* masthead */
.rkn-mast{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:flex-end;padding-bottom:14px;border-bottom:1px solid var(--rk-line);margin-bottom:22px}
.rkn-eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:10.5px;font-weight:500;color:var(--rk-muted)}
.rkn-mast h2{font-size:clamp(25px,3.6vw,36px);font-weight:600;line-height:1.05;margin:6px 0 6px}
.rkn-stamp{color:var(--rk-muted);font-size:13px}
.rkn-stamp b{color:var(--rk-text-2);font-weight:500}
.rkn-dot{display:inline-block;width:3px;height:3px;border-radius:50%;background:var(--rk-muted);margin:0 8px;vertical-align:middle}
.rkn-mast-right{display:flex;align-items:flex-end;gap:10px}
.rkn-switch label{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.12em;color:var(--rk-muted);margin-bottom:5px}
.rkn-switch select{font:inherit;font-size:13.5px;background:var(--rk-surface);color:var(--rk-text);border:1px solid var(--rk-line);border-radius:var(--r);padding:8px 12px;min-width:190px}
.rkn-signout{font-size:12.5px;color:var(--rk-text-2);text-decoration:none;border:1px solid var(--rk-line);border-radius:var(--r);padding:8px 13px;background:var(--rk-surface)}
.rkn-signout:hover{border-color:var(--rk-accent);color:var(--rk-accent-soft)}

/* section nav */
.rkn-nav{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:26px;align-items:center}
.rkn-nav a{font-size:12.5px;text-decoration:none;color:var(--rk-text-2);background:var(--rk-surface);border:1px solid var(--rk-line-soft);border-radius:var(--r);padding:6px 11px}
.rkn-nav a:hover{border-color:var(--rk-accent);color:var(--rk-accent-soft)}

/* sections */
.rkn-section{margin-bottom:40px;scroll-margin-top:20px}
.rkn-section-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:5px}
.rkn-section-head h3{font-size:18px;font-weight:600}
.rkn-source{font-size:11.5px;color:var(--rk-muted);letter-spacing:.01em}
.rkn-source b{color:var(--rk-text-2);font-weight:500}
.rkn-lede{color:var(--rk-text-2);font-size:13.5px;margin:0 0 15px;max-width:74ch}

/* kpi tiles */
.rkn-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(152px,1fr));gap:10px;margin-bottom:16px}
.rkn-kpi{background:var(--rk-surface);border:1px solid var(--rk-line-soft);border-radius:var(--r);padding:13px 14px}
.rkn-kpi-label{font-size:11px;color:var(--rk-muted);margin-bottom:6px;text-transform:uppercase;letter-spacing:.06em}
.rkn-kpi-value{font-size:25px;font-weight:500;line-height:1.1;letter-spacing:-.02em;color:var(--rk-text)}
.rkn-kpi-delta{font-size:11.5px;margin-top:5px;color:var(--rk-muted)}
.rkn-up{color:var(--rk-accent-soft);font-weight:500}
.rkn-down{color:var(--rk-hot);font-weight:500}
.rkn-flat{color:var(--rk-muted)}

/* charts: the container owns the height so the canvas cannot grow unbounded */
.rkn-charts{display:grid;grid-template-columns:repeat(auto-fit,minmax(265px,1fr));gap:12px;margin-bottom:16px}
.rkn-panel{background:var(--rk-surface);border:1px solid var(--rk-line-soft);border-radius:var(--r);padding:13px 14px 10px}
.rkn-panel h4{font-size:12.5px;font-weight:600;color:var(--rk-text);margin-bottom:2px}
.rkn-panel-now{font-size:11px;color:var(--rk-muted);margin-bottom:9px}
.rkn-chart{position:relative;height:150px;width:100%}
.rkn-chart canvas{position:absolute;inset:0;width:100%!important;height:100%!important}
.rkn-nochart{font-size:12px;color:var(--rk-muted);height:150px;display:flex;align-items:center}

/* tables */
.rkn-tablewrap{overflow-x:auto}
.rkn-table{width:100%;border-collapse:collapse;font-size:13.5px;background:var(--rk-surface);border:1px solid var(--rk-line-soft);border-radius:var(--r);overflow:hidden}
.rkn-table th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.08em;color:var(--rk-muted);font-weight:500;padding:9px 12px;border-bottom:1px solid var(--rk-line);background:var(--rk-lift);white-space:nowrap}
.rkn-table td{padding:9px 12px;border-bottom:1px solid var(--rk-line-soft);vertical-align:top;color:var(--rk-text-2)}
.rkn-table td strong{color:var(--rk-text)}
.rkn-table tr:last-child td{border-bottom:none}
.rkn-table td.num,.rkn-table th.num{text-align:right;white-space:nowrap}
.rkn-table tbody tr:hover td{background:var(--rk-lift)}
.rkn-url{max-width:340px;word-break:break-word}
.rkn-url a{text-decoration:none}
.rkn-url a:hover{text-decoration:underline}
.rkn-muted{color:var(--rk-muted);font-size:12.5px}
.rkn-cap{font-size:11.5px;color:var(--rk-muted);margin:8px 0 0}

/* pills and states */
.rkn-sev{display:inline-block;font-size:10.5px;font-weight:600;padding:2px 8px;border-radius:var(--r);white-space:nowrap;text-transform:uppercase;letter-spacing:.05em}
.rkn-sev-error{background:var(--rk-hot-bg);color:var(--rk-hot)}
.rkn-sev-warning{background:var(--rk-warm-bg);color:var(--rk-warm)}
.rkn-sev-notice{background:var(--rk-cool-bg);color:var(--rk-cool)}
.rkn-status-2{color:var(--rk-accent-soft);font-weight:500}
.rkn-status-3{color:var(--rk-warm);font-weight:500}
.rkn-status-4,.rkn-status-5,.rkn-status-0{color:var(--rk-hot);font-weight:500}
.rkn-delta-up{color:var(--rk-accent-soft);font-weight:500}
.rkn-delta-down{color:var(--rk-hot);font-weight:500}

/* notes, empties, alerts */
.rkn-note{background:var(--rk-lift);border:1px solid var(--rk-line-soft);border-left:2px solid var(--rk-accent);border-radius:0 var(--r) var(--r) 0;padding:12px 14px;font-size:13px;color:var(--rk-text-2);margin-bottom:14px}
.rkn-note b{color:var(--rk-text)}
.rkn-note code{background:var(--rk-bg);padding:2px 6px;border-radius:var(--r);font-family:"JetBrains Mono",ui-monospace,monospace;font-size:12px}
.rkn-empty-box{background:var(--rk-surface);border:1px dashed var(--rk-line);border-radius:var(--r);padding:18px;font-size:13.5px;color:var(--rk-muted)}
.rkn-alert{border:1px solid var(--rk-line-soft);border-left:2px solid var(--rk-muted);background:var(--rk-surface);border-radius:0 var(--r) var(--r) 0;padding:11px 14px;margin-bottom:8px}
.rkn-alert-critical{border-left-color:var(--rk-hot);background:var(--rk-hot-bg)}
.rkn-alert-warning{border-left-color:var(--rk-warm);background:var(--rk-warm-bg)}
.rkn-alert-head{font-weight:600;font-size:14px;color:var(--rk-text)}
.rkn-alert-detail{font-size:12.5px;color:var(--rk-text-2);margin:4px 0;word-break:break-word}

/* layout helpers */
.rkn-split{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:16px}
.rkn-split h4,.rkn-section h4{font-size:13.5px;font-weight:600;margin-bottom:8px}
.rkn-brand{max-height:42px;max-width:190px;width:auto;margin-bottom:10px;display:block;object-fit:contain}
.rkn-table .rkn-brand{margin-bottom:0;max-height:26px;max-width:80px;flex:0 0 auto}
.rkn-table .rkn-monogram{width:26px;height:26px;font-size:11px}
.rkn-monogram{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:var(--rk-accent);color:#fff;font-family:"JetBrains Mono",ui-monospace,monospace;font-weight:500;font-size:16px;letter-spacing:.02em;border-radius:var(--r)}
.rkn-you td{background:var(--rk-accent-bg)}
.rkn-print{margin-left:auto}

/* login */
.rkn-login,.rkn-empty{max-width:400px;margin:36px auto;background:var(--rk-surface);border:1px solid var(--rk-line);border-radius:var(--r);padding:26px;box-shadow:var(--rk-shadow)}
.rkn-login h2,.rkn-empty h2{font-size:21px;margin-bottom:6px}
.rkn-login p,.rkn-empty p{color:var(--rk-text-2);font-size:14px}
.rkn-login label{display:block;font-size:11.5px;color:var(--rk-muted);margin-bottom:4px;text-transform:uppercase;letter-spacing:.06em}
.rkn-login input[type=text],.rkn-login input[type=password]{width:100%;padding:10px 12px;border:1px solid var(--rk-line);border-radius:var(--r);background:var(--rk-bg);color:var(--rk-text);font:inherit}
.rkn-login .login-submit input{background:var(--rk-accent);color:#fff;border:none;border-radius:var(--r);padding:10px 20px;cursor:pointer;font:inherit;font-weight:600}
.rkn-login .login-remember{font-size:13px;color:var(--rk-text-2)}

@media(max-width:782px){
.rkn-mast{flex-direction:column;align-items:flex-start}
.rkn-mast-right{width:100%;flex-wrap:wrap}
.rkn-switch select{min-width:0;width:100%}
.rkn-chart{height:140px}
.rkn-url{max-width:200px}
body.rkn-portal-page{background-size:64px 64px}
}

/* print to PDF */
@media print{
body.rkn-portal-page{background:#fff!important;color:#000}
.rkn-wrap{max-width:none;padding:0;font-size:11pt;color:#000}
.rkn-nav,.rkn-signout,.rkn-switch,.rkn-print{display:none!important}
.rkn-section{break-inside:avoid;page-break-inside:avoid;margin-bottom:22px}
.rkn-panel,.rkn-kpi,.rkn-table{break-inside:avoid;box-shadow:none;background:#fff;border-color:#ccc}
.rkn-chart{height:120px}
.rkn-table{font-size:9.5pt}
.rkn-table td,.rkn-table th{color:#000;background:#fff}
a{text-decoration:none;color:#000}
}

/* wp-admin */
.rkn-admin .rkn-actions .button{margin-right:4px;margin-bottom:2px}
.rkn-admin-table td{vertical-align:middle}
