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

:root { --bg-primary:#0b0b0b; --bg-secondary:#161616; --bg-elevated:#1d1d1d; --bg-card:rgba(255,255,255,.03); --accent:#ff5a1f; --accent-hot:#ff3b1f; --accent-glow:#ffa366; --text-primary:#f5f5f5; --text-secondary:#a0a0a0; --text-muted:#767676; --border:#2a2a2a; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--text-primary); background:radial-gradient(circle at 92% 0%,rgba(255,59,31,.12),transparent 26%),var(--bg-primary); font-family:Outfit,Arial,sans-serif; line-height:1.55; }
a { color:inherit; }
.site-header { max-width:1280px; min-height:88px; padding:16px 30px; margin:auto; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--border); }
.brand { display:flex; align-items:center; gap:12px; text-decoration:none; letter-spacing:.05em; }
.brand img { width:48px; height:48px; object-fit:contain; }
.brand strong { display:block; font-size:.9rem; letter-spacing:.11em; }
.brand em { display:block; margin-top:1px; color:var(--accent-glow); font-size:.63rem; font-style:normal; font-family:'DM Mono',monospace; letter-spacing:.13em; }
nav { display:flex; align-items:center; gap:24px; font-size:.88rem; color:var(--text-secondary); } nav a { text-decoration:none; } nav a:hover { color:var(--accent-glow); }
main { max-width:1280px; margin:auto; padding:0 30px 72px; }.hero { max-width:820px; padding:104px 0 92px; }.eyebrow { margin:0 0 13px; color:var(--accent-glow); font:500 .7rem 'DM Mono',monospace; letter-spacing:.16em; }.hero h1 { max-width:760px; margin:0; font-size:clamp(2.8rem,7vw,5.7rem); line-height:.98; letter-spacing:-.055em; }.lede { max-width:660px; margin:25px 0 30px; color:var(--text-secondary); font-size:1.14rem; }.actions { display:flex; align-items:center; gap:24px; }.button,button { display:inline-block; cursor:pointer; border:0; padding:13px 18px; background:linear-gradient(100deg,var(--accent-hot),var(--accent)); color:#fff; font:600 .85rem Outfit,sans-serif; text-decoration:none; border-radius:2px; }.text-link { color:var(--accent-glow); text-underline-offset:5px; }.section { padding:70px 0; border-top:1px solid var(--border); }.section-heading { max-width:620px; margin-bottom:31px; }.section-heading h2,.privacy-note h2 { margin:0; font-size:clamp(1.9rem,3.6vw,3rem); letter-spacing:-.04em; line-height:1.05; }.section-heading p:not(.eyebrow) { color:var(--text-secondary); }.tool-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }.tool-card { min-height:250px; padding:28px; background:var(--bg-card); border:1px solid var(--border); position:relative; }.tool-card-active { grid-row:span 2; border-color:rgba(255,90,31,.75); background:linear-gradient(145deg,rgba(255,90,31,.1),rgba(255,255,255,.02) 45%); }.tool-icon { display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px; border:1px solid var(--accent); color:var(--accent-glow); font:500 .77rem 'DM Mono',monospace; }.status { position:absolute; top:30px; right:28px; color:var(--text-muted); font:500 .64rem 'DM Mono',monospace; letter-spacing:.08em; }.status.live { color:var(--accent-glow); }.tool-card h3 { margin:27px 0 8px; font-size:1.45rem; letter-spacing:-.03em; }.tool-card p { margin:0; color:var(--text-secondary); font-size:.94rem; }.tool-card form { margin-top:23px; display:grid; gap:13px; }.tool-card label { color:var(--text-secondary); font-size:.77rem; }.tool-card input[type=url],.tool-card input[type=text] { display:block; width:100%; margin-top:5px; padding:11px; color:var(--text-primary); background:#101010; border:1px solid #393939; font:400 .85rem 'DM Mono',monospace; }.tool-card input:focus { outline:1px solid var(--accent-glow); border-color:var(--accent-glow); }.toggle { display:flex; gap:9px; align-items:flex-start; }.toggle input { margin-top:4px; accent-color:var(--accent); }.tool-card button { justify-self:start; }.qr-result { margin-top:22px; padding-top:20px; border-top:1px solid var(--border); }.qr-result img { display:block; width:min(100%,260px); height:auto; padding:9px; background:#fff; }.qr-result code { display:block; overflow-wrap:anywhere; color:var(--accent-glow); font:.75rem 'DM Mono',monospace; margin:10px 0; }.download { color:var(--accent-glow); font-size:.88rem; }.error { color:#ff8e8e; }.resources { padding-bottom:85px; }.resource-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }.resource-grid a { min-height:190px; padding:25px; text-decoration:none; border:1px solid var(--border); background:var(--bg-card); display:flex; flex-direction:column; gap:15px; }.resource-grid a:hover { border-color:var(--accent); }.resource-grid span { color:var(--accent); font:.75rem 'DM Mono',monospace; }.resource-grid strong { font-size:1.15rem; }.resource-grid small { color:var(--text-secondary); font-size:.85rem; }.privacy-note { padding:52px; background:var(--bg-elevated); border-left:3px solid var(--accent); }.privacy-note p:last-child { max-width:730px; color:var(--text-secondary); } footer { max-width:1280px; margin:auto; padding:24px 30px; border-top:1px solid var(--border); display:flex; justify-content:space-between; align-items:center; gap:12px; color:var(--text-muted); font-size:.75rem; } footer a { color:var(--accent-glow); }

/* Hero support banner */
.hero-support-banner { display:flex; align-items:flex-start; gap:12px; margin-top:28px; padding:18px 22px; background:var(--bg-elevated); border-left:3px solid var(--accent); border-radius:2px; }
.hero-support-banner .banner-icon { font-size:1.4rem; line-height:1; flex-shrink:0; margin-top:2px; }
.hero-support-banner p { margin:0; color:var(--text-secondary); font-size:.92rem; line-height:1.55; }
.hero-support-banner p strong { color:var(--text-primary); }
.hero-support-banner p a { color:var(--accent-glow); text-underline-offset:3px; }

/* Donation / Support Section */
.donation-section { padding-top:80px; padding-bottom:80px; }
.donation-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-bottom:36px; }
.donation-card { padding:32px 24px; background:var(--bg-elevated); border:1px solid var(--border); text-align:center; display:flex; flex-direction:column; align-items:center; gap:12px; transition:border-color .2s; }
.donation-card:hover { border-color:var(--accent); }
.donation-icon { font-size:2.2rem; line-height:1; }
.donation-card h3 { margin:0; font-size:1.15rem; letter-spacing:-.02em; }
.donation-card p { margin:0; color:var(--text-secondary); font-size:.85rem; }
.donation-btn { margin-top:8px; font-size:.82rem; padding:11px 20px; }

/* Goal tracker */
.goal-tracker { padding:28px 32px; background:var(--bg-elevated); border:1px solid var(--border); }
.goal-text { font-size:.95rem; margin-bottom:14px; color:var(--text-secondary); }
.goal-text strong { color:var(--text-primary); }
.goal-bar { width:100%; height:10px; background:var(--bg-primary); border:1px solid var(--border); border-radius:2px; overflow:hidden; }
.goal-fill { height:100%; background:linear-gradient(90deg,var(--accent-hot),var(--accent)); border-radius:2px; transition:width .6s ease; }
.goal-caption { margin-top:10px; font-size:.78rem; color:var(--text-muted); font-family:'DM Mono',monospace; }
.sponsor-section { padding:10px 0 44px; }
.sponsor-cta { text-align:center; }
.sponsor-note { color:var(--text-muted); font-size:.72rem; margin-top:10px; }
.ad-slot { transition:opacity .3s; }
.ad-slot:empty { display:none; }

/* Tool cards - live & new badge */
.tool-card-live { border-color:rgba(255,90,31,.35); }
.tool-card-live:hover { border-color:var(--accent); }
.tool-link { color:inherit; text-decoration:none; }
.tool-link:hover { color:var(--accent-glow); text-decoration:underline; text-underline-offset:3px; }
.badge-new { position:absolute; top:28px; right:90px; background:var(--accent); color:#fff; font:600 .58rem 'DM Mono',monospace; letter-spacing:.08em; padding:4px 10px; border-radius:2px; text-transform:uppercase; }

/* Referral / Recommended Tools */
.referral-section { padding-bottom:60px; }
.referral-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.referral-card { padding:28px; text-decoration:none; background:var(--bg-card); border:1px solid var(--border); display:flex; flex-direction:column; gap:10px; transition:border-color .2s; }
.referral-card:hover { border-color:var(--accent); }
.referral-icon { font-size:1.6rem; line-height:1; color:var(--accent-glow); }
.referral-card strong { font-size:1.1rem; }
.referral-card small { color:var(--text-secondary); font-size:.85rem; line-height:1.5; }
.referral-label { color:var(--accent); font:500 .7rem 'DM Mono',monospace; letter-spacing:.08em; margin-top:auto; }

/* Footer */
.footer-donate { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.footer-donate-label { color:var(--text-secondary); font-size:.75rem; }
.footer-donate a { padding:5px 12px; background:rgba(255,90,31,.15); border:1px solid rgba(255,90,31,.3); border-radius:2px; font-size:.73rem; text-decoration:none; transition:background .2s, border-color .2s; }
.footer-donate a:hover { background:rgba(255,90,31,.3); border-color:var(--accent); }

/* Mobile */
@media (max-width:720px) { .site-header,main,footer { padding-left:18px; padding-right:18px; }.site-header { align-items:flex-start; flex-direction:column; } nav { gap:12px; flex-wrap:wrap; }.hero { padding:67px 0 60px; }.tool-grid,.resource-grid { grid-template-columns:1fr; }.tool-card-active { grid-row:auto; }.privacy-note { padding:28px; } footer { align-items:flex-start; flex-direction:column; } .donation-grid,.referral-grid { grid-template-columns:1fr; } .badge-new { right:auto; left:auto; position:static; display:inline-block; margin-top:4px; } .hero-support-banner { flex-direction:column; gap:8px; } .footer-donate { gap:10px; } }
