:root{--bg:#000000;--panel:#0a0a0a;--text:#ffffff;--muted:#cfcfcf;--purple:#6000DA;--orange:#FF6B00;--white:#ffffff;--black:#000000;--red:#ef4444;--field:#0b0914;--field-border:var(--orange);--field-border-focus:#ffa466;--placeholder:#94a3b8}
*{box-sizing:border-box}
html,body{margin:0;padding:0;height:100%}
/* Sticky footer layout: container flexes to fill viewport, footer sticks to bottom */
body{min-height:100%;display:flex;flex-direction:column;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;font-size:17px;background:var(--bg);color:var(--text);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
a{color:var(--purple);text-decoration:none}
a:hover{color:#7d33ff}

/* RQND Pro font for wordmark (Reveal link only) */
@font-face{
	font-family:'RQND Pro';
	src:url('./fonts/RQNDPro.woff2') format('woff2');
	font-weight:400;
	font-style:normal;
	font-display:swap;
}
.container{max-width:min(1400px,92vw);margin:12px auto;padding:0 16px;flex:1 0 auto}
.footer{flex-shrink:0}
.card{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:18px;margin:12px 0}
/* Narrower cards for auth/contact forms */
.card-narrow{max-width:min(920px, 96vw);margin-left:auto;margin-right:auto}
.header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:6px 0 12px 0}
/* Header wordmark size: moderate by default; very large on desktop */
.logo{height:clamp(56px, 5.8vw, 104px);width:auto;display:block}
@media (min-width: 900px){
	.logo{height:clamp(140px, 12vw, 260px)}
}
/* No special-case size for home; keep consistent clamp */
/* (Removed previous .home .logo override that caused oversized header) */
.title{font-size:24px;font-weight:800;letter-spacing:.2px}
/* Ensure h3 section headers are consistent site-wide */
h3{font-size:24px;margin:0 0 6px 0}
.btn{background:transparent;color:var(--purple);border:1px solid var(--purple);border-radius:12px;padding:10px 14px;font-weight:600;cursor:pointer;transition:transform .08s ease,filter .15s ease, box-shadow .15s ease, color .15s ease, border-color .15s ease;box-shadow:0 8px 20px rgba(96,0,218,.24), 0 3px 8px rgba(96,0,218,.18);display:inline-flex;align-items:center;justify-content:center;text-align:center}
@media (max-width: 560px) {
	.container.home .card.narrow,
	.container.home .card {
		margin-left: auto;
		margin-right: auto;
		width: min(100%, 640px);
	}
	.container.home { padding-left: 12px; padding-right: 12px; }
	.header .title { word-break: break-word; hyphens: auto; }
	form input[type="text"],
	form input[type="email"],
	form input[type="url"],
	form input[type="password"],
	form select,
	form textarea { width: 100%; max-width: 100%; box-sizing: border-box; }
	/* Move the endpoint labels above the scale on mobile */
	.scale-labels-mobile { display: flex !important; }
	.scale-label-desktop { display: none !important; }
	.score-scale { align-items: center !important; gap: 8px !important; }
	.scale-bar { height: 12px !important; }
	.scale-ticks { font-size: 0.8rem !important; }
}

/* Ensure media elements and cards don't overflow on small screens */
@media (max-width: 640px) {
	.card { overflow: hidden; }
	.card img.media, .card video.media { max-width: 100%; height: auto; display: block; }
	.admin-table { display: block; width: 100%; overflow-x: auto; }
}

/* Themed Show more link glow (fallback if inline style is missing) */
.toggle-more { color: #b99cff; text-shadow: 0 0 8px rgba(109,40,217,.75); }
.btn:hover{filter:none;box-shadow:0 12px 28px rgba(96,0,218,.34), 0 6px 14px rgba(96,0,218,.24);color:#b99cff;border-color:#8f5dff}
.btn:active{transform:translateY(1px)}
.btn-orange{background:transparent;color:var(--purple);border:1px solid var(--purple);box-shadow:0 8px 20px rgba(96,0,218,.24), 0 3px 8px rgba(96,0,218,.18)}
.btn-orange:hover{box-shadow:0 12px 28px rgba(96,0,218,.34), 0 6px 14px rgba(96,0,218,.24);color:#b99cff;border-color:#8f5dff}
.btn-outline{background:transparent;border:1px solid var(--purple);color:var(--purple);box-shadow:0 8px 18px rgba(96,0,218,.24)}
.btn-outline:hover{background:transparent;color:#b99cff;border-color:#8f5dff;filter:none;box-shadow:0 12px 26px rgba(96,0,218,.34)}
.btn-outline-orange{background:transparent;border:1px solid var(--purple);color:var(--purple);box-shadow:0 8px 18px rgba(96,0,218,.24)}
.btn-outline-orange:hover{background:transparent;color:#b99cff;border-color:#8f5dff;filter:none;box-shadow:0 12px 26px rgba(96,0,218,.34)}
.btn, .btn-outline, .btn-orange, .btn-outline-orange{font-size:16px;min-height:42px;line-height:1.2;padding:10px 16px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;text-align:center}
.btn:focus-visible,.btn-outline:focus-visible{outline:2px solid rgba(255,255,255,.85);outline-offset:2px}
.btn-same-size{width:clamp(240px, 25%, 360px)}
@media (max-width: 600px){.btn-same-size{width:100%}}
.badge{display:inline-block;background:rgba(124,58,237,.15);color:var(--white);border:1px solid rgba(124,58,237,.35);border-radius:999px;padding:4px 10px;font-size:14px}
.badge-danger{background:rgba(239,68,68,.18);border:1px solid rgba(239,68,68,.45);color:#fecaca}
/* Informational text should not be tiny; normalize to base size */
.small{font-size:inherit;color:var(--muted)}
/* Actions row to place primary button left and help link on far right */
.actions-row{display:flex;align-items:center;gap:10px;margin-top:10px}
.help-link{margin-left:auto;color:#9ca3af}
.help-link:hover{color:#ffffff}
/* Normalize content sizes site-wide */
p, li{font-size:17px}
/* If authors used .small on paragraphs/lists, keep them at 17px */
p.small, li.small{font-size:17px}
/* Lists marked small should not shrink content */
ul.small, ol.small{font-size:inherit}
ul.small li, ol.small li{font-size:17px}
/* Unified form fields styling with high contrast */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="number"],
input[type="url"],
input[type="file"],
textarea,
select{background:var(--field);color:#e8ecf6;border:1px solid var(--field-border);border-radius:12px;padding:12px;width:100%;box-shadow:0 6px 14px rgba(255,107,0,.18), 0 2px 6px rgba(255,107,0,.12)}
input,button,select,textarea{font-family:inherit;color:inherit}
input::placeholder,textarea::placeholder{color:var(--placeholder);opacity:.9}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--field-border-focus);box-shadow:0 12px 28px rgba(255,107,0,.36), 0 6px 14px rgba(255,107,0,.26)}
label{display:block;margin-bottom:8px}
hr{border:0;border-top:1px solid rgba(255,255,255,.08);margin:16px 0}
.score{font-size:44px;font-weight:800}
.score-sm{font-size:32px;font-weight:800;line-height:1}
.btn-sm{padding:6px 10px;min-height:32px;font-size:14px;border-radius:10px}

/* Pill-style toggle switch (purple off, orange on) */
.switch input[type="checkbox"]{
	-webkit-appearance:none;
	appearance:none;
	width:56px; height:28px;
	border-radius:999px;
	border:1px solid var(--purple);
	background:rgba(96,0,218,.12);
	position:relative;
	display:inline-block;
	vertical-align:middle;
	margin-right:8px;
	cursor:pointer;
	box-shadow:0 0 14px rgba(96,0,218,.35) inset, 0 0 12px rgba(96,0,218,.25);
	transition:border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.switch input[type="checkbox"]::before{
	content:"OFF";
	position:absolute;
	inset:0;
	display:flex;
	align-items:center;
	justify-content:center;
	font-size:11px;
	font-weight:800;
	color:var(--purple);
	text-shadow:0 0 8px rgba(96,0,218,.35);
	pointer-events:none;
	z-index:3;
}
/* Remove inner knob; color state and text convey status */
.switch input[type="checkbox"]::after{ display:none; }
.switch input[type="checkbox"]:hover{
	box-shadow:0 0 18px rgba(96,0,218,.45) inset, 0 0 14px rgba(96,0,218,.35);
}
.switch input[type="checkbox"]:checked{
	border-color:var(--orange);
	background:rgba(255,107,0,.12);
	box-shadow:0 0 16px rgba(255,107,0,.32) inset, 0 0 12px rgba(255,107,0,.28);
}
.switch input[type="checkbox"]:checked::before{
	content:"ON";
	color:var(--orange);
	text-shadow:0 0 8px rgba(255,107,0,.35);
}
.switch input[type="checkbox"]:checked:hover{
	box-shadow:0 0 18px rgba(255,107,0,.42) inset, 0 0 14px rgba(255,107,0,.32);
}
/* No knob movement needed since there is no knob */
.switch input[type="checkbox"]:focus-visible{
	outline:2px solid rgba(255,255,255,.85);
	outline-offset:2px;
}

/* Gradient score pill & progress bar (purple -> orange) */
.score-pill{display:inline-block;border-radius:999px;padding:6px 12px;border:1px solid rgba(255,255,255,.12);font-weight:700}
.progress{position:relative;height:8px;border-radius:999px;background:rgba(255,255,255,.06);overflow:hidden;border:1px solid rgba(255,255,255,.08)}
.progress > .bar{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg, var(--purple), var(--orange));box-shadow:0 0 16px rgba(255,107,0,.25)}
/* Token counter display: bold number with soft orange glow and matching label font */
.tokens-display{display:flex;align-items:baseline;gap:8px}
.tokens-display .token-count{font-size:32px;font-weight:800;line-height:1;color:var(--orange);
	text-shadow:0 0 14px rgba(255,107,0,.35), 0 0 6px rgba(255,107,0,.25)}
.tokens-display .token-label{font-size:18px;font-weight:800;line-height:1.1;color:#e8ecf6;opacity:.95}
/* Simple cost list styling matching theme */
.scan-costs{display:flex;flex-wrap:wrap;gap:8px}
.scan-costs .cost-pill{display:flex;align-items:baseline;gap:8px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:8px 10px}
.glow-purple{color:var(--purple);font-weight:700;text-shadow:0 0 10px rgba(96,0,218,.38)}
.glow-orange{color:var(--orange);font-weight:800;text-shadow:0 0 12px rgba(255,107,0,.45)}
.scan-costs .sep{opacity:.6}
/* System fonts by default; selectively use RQND Pro for wordmark */
/* Ensure text remains high-contrast inside controls */
input[type="text"],input[type="email"],input[type="password"],input[type="search"],input[type="tel"],input[type="number"],input[type="url"],input[type="file"],textarea{color:#e8ecf6}

/* Keep dark theme during browser autofill/preview (Chrome/Safari/Firefox) */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
select:-webkit-autofill{
	-webkit-text-fill-color:#e8ecf6 !important;
	caret-color:#e8ecf6;
	/* Inset fill to override UA white/yellow background */
	box-shadow:inset 0 0 0 1000px var(--field), 0 6px 14px rgba(255,107,0,.18), 0 2px 6px rgba(255,107,0,.12) !important;
	border:1px solid var(--field-border) !important;
}
input:-webkit-autofill:focus,
textarea:-webkit-autofill:focus,
select:-webkit-autofill:focus{
	box-shadow:inset 0 0 0 1000px var(--field), 0 12px 28px rgba(255,107,0,.36), 0 6px 14px rgba(255,107,0,.26) !important;
	border-color:var(--field-border-focus) !important;
}
/* Firefox */
input:-moz-autofill, textarea:-moz-autofill, select:-moz-autofill{
	box-shadow:inset 0 0 0 1000px var(--field), 0 6px 14px rgba(255,107,0,.18), 0 2px 6px rgba(255,107,0,.12) !important;
	-moz-text-fill-color:#e8ecf6;
}
input:-moz-autofill:focus, textarea:-moz-autofill:focus, select:-moz-autofill:focus{
	box-shadow:inset 0 0 0 1000px var(--field), 0 12px 28px rgba(255,107,0,.36), 0 6px 14px rgba(255,107,0,.26) !important;
}
/* Chromium experimental (best-effort) */
input:-internal-autofill-selected{
	-webkit-text-fill-color:#e8ecf6 !important;
	box-shadow:inset 0 0 0 1000px var(--field), 0 6px 14px rgba(255,107,0,.18), 0 2px 6px rgba(255,107,0,.12) !important;
}

/* Form layout helpers */
.form-wrap{max-width:640px;margin:0 auto;width:100%}
.form-actions{display:flex;gap:10px;flex-wrap:wrap}

/* Admin filter controls: make selects/inputs wrap nicely on small screens */
@media (max-width: 700px){
	.form-wrap{max-width:100%; display:block !important}
	.form-wrap label{display:block;min-width:auto;width:100%;margin-bottom:8px}
	.form-wrap select{min-width:auto;width:100%}
	.form-wrap input[type="text"], .form-wrap input[type="search"]{min-width:auto;width:100%}
	.form-wrap .btn, .form-wrap button{width:100%}
}

/* Homepage visuals */
.home{position:relative;overflow:visible}
/* Full-bleed gradient using absolute positioning to prevent mobile fixed-layer jank */
.home .angled-gradient{position:fixed;left:0;right:0;top:-30vh;bottom:-30vh;pointer-events:none;z-index:0;
	background:
		radial-gradient(72% 58% at 88% 96%, rgba(96,0,218,.22) 0%, rgba(96,0,218,0) 62%),
		radial-gradient(52% 44% at 12% 96%, rgba(255,107,0,.18) 0%, rgba(255,107,0,0) 62%),
		linear-gradient(18deg, rgba(255,255,255,.06) 0%, rgba(255,255,255,.02) 36%, rgba(255,255,255,0) 72%);
	transform:skewY(-4deg);
	will-change: transform;
}
@media (max-width: 900px){
	/* Mobile fallback avoids fixed-layer artifacts and stretches behind content */
	.home .angled-gradient{position:absolute;left:-10vw;right:-10vw;top:-28vh;height:220vh;bottom:auto}
}
.home .hero{position:relative;z-index:1;display:grid;grid-template-columns:1.2fr 1fr;gap:20px;align-items:start;margin-top:0}
@media (max-width: 900px){
	.home .hero{grid-template-columns:1fr;align-items:start;gap:14px}
	/* Reorder: show image first, text second */
	.home .hero > div:first-child{order:2}
	.home .hero > div:last-child{order:1}
	.home .hero-title{font-size:34px;line-height:1.12;margin-bottom:6px}
	.home .hero-sub{font-size:16px;margin-bottom:10px}
	.home .hero-logo{width:min(88vw, 560px);margin-top:0}
}
.home .hero-title{font-size:48px;line-height:1.1;margin:0 0 2px 0;font-weight:800}
.home .hero-sub{font-size:18px;color:#e9e9e9;margin-bottom:12px}
@media (max-width: 900px){.home .hero-title{font-size:30px;line-height:1.12}.home .hero-sub{font-size:15px;line-height:1.4}}
.home .hero-sub{font-size:16px;color:#e9e9e9;margin-bottom:12px}
.home .pill{display:inline-flex;align-items:center;gap:8px;background:rgba(96,0,218,.15);border:1px solid rgba(96,0,218,.35);padding:6px 10px;border-radius:999px;font-size:14px}
.home .hero-card{display:flex;flex-direction:column;gap:12px;align-items:center;justify-content:center}
.home .hero-logo{width:clamp(540px, 46vw, 900px);max-width:100%;
	/* Dialed-back glow to prevent washout */
	filter:
		drop-shadow(0 12px 40px rgba(96,0,218,.45))
		drop-shadow(0 6px 20px rgba(255,107,0,.22))
		brightness(1.01) saturate(1.03);
	margin-top:-18px;
}
.home .cta-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.home .features{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px}
.home .feat{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);padding:12px;border-radius:12px}
.home .downloads{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}
.home .section-title{font-size:24px;font-weight:700;margin:0 0 6px 0}
@media (max-width: 900px){
	body{font-size:16px}
	.title{font-size:20px}
	h3{font-size:20px}
	.home .section-title{font-size:18px}
	.card{padding:12px}
	.score{font-size:32px}
}

/* Results media scaling */
.card img.media, .card video.media{
  max-width:100%;
  height:auto;
  border-radius:12px;
  display:block;
}

/* Compact header bar spacing on results */
.results .small .progress{height:6px}
/* Keep enlarged wordmark sensible on narrow screens */
@media (max-width: 900px){
	.home .hero{grid-template-columns:1fr;align-items:start}
	.home .hero-logo{width:min(92vw, 640px);margin-top:0}
}

/* Subtle outer glow for wordmark only */
.home .header .logo{filter: drop-shadow(0 2px 10px rgba(96,0,218,.35))}

/* Header nav links */
.nav{display:flex;align-items:center;gap:16px}
.nav a{color:#e5e7eb;opacity:.9}
.nav a:hover{color:#ffffff;opacity:1}
.reveal-link{
	color:var(--purple);
	opacity:1;
	display:inline-block;
	position:relative;
	top:-2px; /* nudge upward to align baseline with neighbors on desktop */
	/* Use RQND Pro just for this wordmark when available; fall back to system fonts */
	font-family:'RQND Pro',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
	font-size:25px; /* larger emphasis requested */
	line-height:1.4;
	-webkit-font-smoothing:antialiased;
	/* Subtle persistent purple glow similar to logo */
	text-shadow:0 0 10px rgba(96,0,218,.28), 0 0 4px rgba(96,0,218,.22);
	transition:text-shadow .15s ease, color .15s ease;
}
.reveal-link:hover{
	color:#7d33ff; /* same hover tone as global links/footer */
	text-shadow:0 0 12px rgba(96,0,218,.42), 0 0 5px rgba(255,107,0,.28);
}
/* Ensure desktop nav selector beats .nav a color */
.nav a.reveal-link{
  color:var(--purple);
  opacity:1;
  text-shadow:0 0 10px rgba(96,0,218,.28), 0 0 4px rgba(96,0,218,.22);
}
.nav a.reveal-link:hover{
  color:#7d33ff;
  text-shadow:0 0 12px rgba(96,0,218,.42), 0 0 5px rgba(255,107,0,.28);
}
.nav .sep{opacity:.2}

/* Prevent CTA row from overflowing and looking duplicated when wrapping */
.cta-row{flex-wrap:wrap}
.cta-row .btn{white-space:nowrap}

/* Responsive tables for admin on mobile */
@media (max-width: 700px){
	table.admin-table{display:block;width:100%}
	table.admin-table tr{display:block;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.08)}
	table.admin-table th{display:none}
	table.admin-table td{display:block;min-width:0;padding:2px 0}
	table.admin-table td[data-label]{font-size:16px;line-height:1.4}
	/* Labels above values */
	table.admin-table td[data-label]::before{display:block;content:attr(data-label);color:var(--orange);font-weight:800;margin:0 0 2px 0}
	table.admin-table td:last-child{margin-top:6px}
	table.admin-table a.btn, table.admin-table button.btn{margin-top:4px}
}

/* Admin table headers: orange for distinction */
table.admin-table th{ color: var(--orange) !important; }

/* Text-only pagination arrows with glow */
.pager{
	display:inline-flex;gap:8px;align-items:center
}
.pager a{display:inline-flex;align-items:center;justify-content:center;color:var(--purple);border:1px solid var(--purple);padding:4px 10px;border-radius:10px;box-shadow:0 6px 14px rgba(96,0,218,.24), 0 2px 6px rgba(96,0,218,.18)}
.pager a:hover{color:#b99cff;border-color:#8f5dff;box-shadow:0 10px 22px rgba(96,0,218,.34), 0 5px 12px rgba(96,0,218,.24)}
.pager a[aria-disabled="true"]{opacity:.45;pointer-events:none}

/* Removed page-level orange theme; all buttons use purple accents */

/* Optional: enforce same visual width where needed */
.btn-uniform{min-width:240px}

/* Mobile header tweaks */
@media (max-width: 600px){
	/* Hide wordmark on small screens to save space */
	.header .logo{display:none}
	.nav{gap:10px}
}
/* Mobile type scaling for buttons and wordmark */
@media (max-width: 600px){
	.btn, .btn-outline, .btn-orange, .btn-outline-orange{
		font-size:15px; min-height:40px; padding:8px 12px;
	}
	.reveal-link{font-size:18px; top:0}
}

/* Ensure readable form controls on mobile */
@media (max-width: 700px){
	input[type="text"],
	input[type="email"],
	input[type="password"],
	input[type="search"],
	input[type="tel"],
	input[type="number"],
	input[type="url"],
	input[type="file"],
	textarea,
	select{
		font-size:16px; /* keep >=16px to prevent iOS zoom; consistent readability */
		min-height:38px;
		padding:8px 10px;
	}
	input::placeholder, textarea::placeholder{font-size:16px}
}
@media (max-width: 899px){
	/* Apply gradient behind all pages at small widths */
	body::before{
		content:"";
		position:fixed;left:-10vw;right:-10vw;top:-30vh;bottom:-30vh;z-index:-1;pointer-events:none;
		background:
			radial-gradient(72% 58% at 88% 96%, rgba(96,0,218,.22) 0%, rgba(96,0,218,0) 62%),
			radial-gradient(52% 44% at 12% 96%, rgba(255,107,0,.18) 0%, rgba(255,107,0,0) 62%),
			linear-gradient(18deg, rgba(255,255,255,.06) 0%, rgba(255,255,255,.02) 36%, rgba(255,255,255,0) 72%);
		transform:skewY(-4deg);
	}
}

/* Collapse nav at <=899px; keep profile visible */
@media (max-width: 899px){
	.menu-toggle{display:inline-block !important}
	.nav{display:none}
}

/* Robust mobile background: move gradient to body::before and hide in-page gradient */
@media (max-width: 899px){
	.home .angled-gradient{display:none}
	body::before{
		content:"";
		position:fixed;left:-10vw;right:-10vw;top:-30vh;bottom:-30vh;z-index:-1;pointer-events:none;
		background:
			radial-gradient(72% 58% at 88% 96%, rgba(96,0,218,.22) 0%, rgba(96,0,218,0) 62%),
			radial-gradient(52% 44% at 12% 96%, rgba(255,107,0,.18) 0%, rgba(255,107,0,0) 62%),
			linear-gradient(18deg, rgba(255,255,255,.06) 0%, rgba(255,255,255,.02) 36%, rgba(255,255,255,0) 72%);
		transform:skewY(-4deg);
	}
}