:root{--bg:#05070d;--panel:#0d1424;--panel2:#111b31;--line:#24324f;--text:#edf4ff;--muted:#9fb0d0;--brand:#16f2b3;--brand2:#8b5cf6;--warn:#facc15;--danger:#f43f5e;--radius:22px;--shadow:0 24px 80px rgba(0,0,0,.35)}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 20% 0%,rgba(22,242,179,.14),transparent 34%),radial-gradient(circle at 80% 10%,rgba(139,92,246,.18),transparent 30%),var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}.container{width:min(1180px,calc(100% - 32px));margin-inline:auto}.site-header{position:sticky;top:0;z-index:20;background:rgba(5,7,13,.82);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.08)}.nav-shell{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:18px}.brand{display:flex;align-items:center;gap:12px;font-size:1.1rem}.brand span{display:flex;flex-direction:column;line-height:1}.brand strong{letter-spacing:.02em}.brand em{font-style:normal;color:var(--brand);font-size:.9rem}.site-nav{display:flex;align-items:center;gap:18px;color:var(--muted);font-weight:650}.site-nav a:hover{color:var(--brand)}.nav-toggle{display:none;background:var(--panel2);color:#fff;border:1px solid var(--line);border-radius:12px;padding:8px 12px}.hero,.page-hero,.recipe-hero{padding:72px 0 44px}.hero-grid,.recipe-hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:42px;align-items:center}.eyebrow{margin:0 0 10px;color:var(--brand);text-transform:uppercase;letter-spacing:.16em;font-weight:800;font-size:.78rem}.hero h1,.page-hero h1,.recipe-hero h1{font-size:clamp(2.6rem,8vw,5.7rem);line-height:.96;margin:.1em 0 .24em;letter-spacing:-.06em}.lead{font-size:1.16rem;color:#c6d4ef;max-width:720px}.search-bar{display:flex;gap:10px;margin-top:28px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:8px;max-width:660px}.search-bar input{flex:1;background:transparent;border:0;color:#fff;font-size:1rem;padding:12px;outline:0}.search-bar button,.btn,button.primary{background:linear-gradient(135deg,var(--brand),#6cf7d4);color:#02100c;border:0;border-radius:13px;padding:12px 18px;font-weight:850;cursor:pointer}.hero-card,.content-panel,.scaler-panel,.side-card,.admin-card{background:linear-gradient(180deg,rgba(17,27,49,.92),rgba(9,14,26,.92));border:1px solid rgba(255,255,255,.1);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow)}.hero-card{min-height:280px;display:flex;flex-direction:column;justify-content:end;position:relative;overflow:hidden}.hero-card:before{content:"";position:absolute;inset:-80px;background:radial-gradient(circle,rgba(22,242,179,.28),transparent 32%),radial-gradient(circle at 80% 40%,rgba(139,92,246,.25),transparent 28%);filter:blur(5px)}.hero-card>*{position:relative}.pulse{width:78px;height:78px;border-radius:50%;border:2px solid var(--brand);box-shadow:0 0 40px var(--brand);margin-bottom:42px}.section{padding:32px 0 56px}.section-title{display:flex;justify-content:space-between;align-items:end;gap:16px;margin-bottom:18px}.section-title h2{font-size:clamp(1.8rem,4vw,3rem);margin:0;letter-spacing:-.04em}.recipe-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.featured-grid{grid-template-columns:repeat(3,1fr)}.recipe-card{background:rgba(17,27,49,.78);border:1px solid rgba(255,255,255,.1);border-radius:22px;overflow:hidden;box-shadow:var(--shadow);transition:.2s transform,.2s border-color}.recipe-card:hover{transform:translateY(-4px);border-color:rgba(22,242,179,.6)}.recipe-image-wrap{aspect-ratio:16/10;overflow:hidden;background:#101729}.recipe-image-wrap img{width:100%;height:100%;object-fit:cover}.recipe-card-body{padding:18px}.meta-row,.tag-row{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;color:var(--muted);font-size:.86rem}.recipe-card h3{font-size:1.25rem;line-height:1.18;margin:10px 0}.recipe-card p{color:#bdcae3;margin:0 0 14px}.tag-row{justify-content:flex-start}.tag-row span,.recipe-stats div,.ad-slot{border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.055);border-radius:999px;padding:5px 10px}.recipe-hero-img{border-radius:28px;border:1px solid rgba(255,255,255,.12);box-shadow:var(--shadow);aspect-ratio:16/11;object-fit:cover}.recipe-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:26px}.recipe-stats div{border-radius:16px;padding:14px}.recipe-stats span{display:block;color:var(--muted);font-size:.82rem}.recipe-stats strong{display:block;font-size:1.05rem}.recipe-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:28px;padding:12px 0 70px}.recipe-content{display:grid;gap:20px}.recipe-sidebar{display:grid;gap:20px;align-content:start;position:sticky;top:96px}.scaler-panel label{font-weight:800;display:block;margin-bottom:10px}.serving-controls{display:flex;gap:8px;align-items:center;max-width:260px}.serving-controls button{width:44px;height:44px;border-radius:12px;background:var(--panel2);color:#fff;border:1px solid var(--line);font-size:1.2rem}.serving-controls input{width:100%;height:44px;text-align:center;background:#05070d;color:#fff;border:1px solid var(--line);border-radius:12px}.note{color:#d9fced}.content-panel h2,.ai-note h2{margin-top:0}.ingredients-list{list-style:none;padding:0;margin:0;display:grid;gap:10px}.ingredients-list li{padding:12px 14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:14px}.ingredients-list strong{color:var(--brand)}.method-list{display:grid;gap:12px;padding-left:22px}.method-list li{padding-left:8px}.ai-note{background:rgba(22,242,179,.09);border:1px solid rgba(22,242,179,.25);border-radius:var(--radius);padding:24px}.ad-slot{margin:18px auto;padding:12px;text-align:center;border-radius:14px;color:var(--muted);overflow:hidden}.site-footer{border-top:1px solid rgba(255,255,255,.1);padding:36px 0;background:#03050a;color:var(--muted)}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1.4fr;gap:24px}.site-footer h2,.site-footer h3{color:#fff}.site-footer a{display:block;color:var(--brand);margin:6px 0}.empty{color:var(--muted)}
.admin-body{background:#070a12}.admin-layout{display:grid;grid-template-columns:270px minmax(0,1fr);min-height:100vh}.admin-sidebar{background:#080d19;border-right:1px solid var(--line);padding:22px;position:sticky;top:0;height:100vh;overflow:auto}.admin-main{padding:28px}.admin-nav{display:grid;gap:7px;margin-top:24px}.admin-nav a{padding:10px 12px;border-radius:12px;color:var(--muted)}.admin-nav a:hover,.admin-nav a.active{background:rgba(22,242,179,.1);color:var(--brand)}.admin-top{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:20px}.admin-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.table-wrap{overflow:auto;background:var(--panel);border:1px solid var(--line);border-radius:18px}table{width:100%;border-collapse:collapse}th,td{padding:12px 14px;border-bottom:1px solid rgba(255,255,255,.08);text-align:left;vertical-align:top}th{color:#cbd7ef;background:rgba(255,255,255,.03)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.field{display:grid;gap:6px}.field.full{grid-column:1/-1}.field input,.field select,.field textarea,.login-card input{background:#05070d;color:#fff;border:1px solid var(--line);border-radius:12px;padding:11px;width:100%}.field textarea{min-height:110px}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.danger{background:#33101b;color:#ffd7df;border:1px solid #7f1d35;border-radius:12px;padding:10px 14px}.muted{color:var(--muted)}.flash{padding:12px 14px;border-radius:12px;margin-bottom:16px;background:rgba(22,242,179,.1);border:1px solid rgba(22,242,179,.25)}.login-shell{min-height:100vh;display:grid;place-items:center;padding:24px}.login-card{width:min(440px,100%);background:var(--panel);border:1px solid var(--line);border-radius:24px;padding:28px;box-shadow:var(--shadow)}.login-card .brand{margin-bottom:22px}.badge{display:inline-block;background:rgba(139,92,246,.15);color:#d8caff;border:1px solid rgba(139,92,246,.3);border-radius:999px;padding:4px 9px;font-size:.82rem}.checkbox-list{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.checkbox-list label{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);padding:10px;border-radius:12px}.code-box{background:#05070d;border:1px solid var(--line);padding:12px;border-radius:12px;word-break:break-all;color:var(--brand)}.totp-setup{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;align-items:center}.qr-wrap{display:inline-flex;background:#fff;border-radius:18px;padding:12px;border:1px solid rgba(255,255,255,.14);box-shadow:0 16px 50px rgba(0,0,0,.28)}.qr-svg{display:block;max-width:220px;width:220px;height:220px}.reset-line{display:block;margin-top:14px}
@media(max-width:900px){.hero-grid,.recipe-hero-grid,.recipe-layout,.footer-grid,.admin-layout{grid-template-columns:1fr}.recipe-grid,.featured-grid,.admin-grid{grid-template-columns:1fr 1fr}.recipe-sidebar{position:static}.admin-sidebar{position:static;height:auto}.site-nav{display:none;position:absolute;top:76px;left:16px;right:16px;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:14px;flex-direction:column;align-items:flex-start}.site-nav.open{display:flex}.nav-toggle{display:block}.recipe-stats{grid-template-columns:repeat(2,1fr)}}@media(max-width:620px){.totp-setup{grid-template-columns:1fr}.qr-svg{width:190px;height:190px}.recipe-grid,.featured-grid,.admin-grid,.form-grid,.checkbox-list{grid-template-columns:1fr}.hero,.page-hero,.recipe-hero{padding-top:42px}.hero h1,.page-hero h1,.recipe-hero h1{font-size:2.7rem}.search-bar{flex-direction:column}.recipe-stats{grid-template-columns:1fr}}


/* Brand/image refresh */
.brand img,
.admin-brand img {
    max-height: 54px;
    width: auto;
    display: block;
}

.recipe-card__image,
.recipe-hero__image,
.recipe-image,
.card-image {
    aspect-ratio: 16 / 9;
    object-fit: cover;
    background: #0b1114;
}

.recipe-card img,
.recipe-hero img {
    object-fit: cover;
}

.site-logo-wordmark {
    letter-spacing: .02em;
}






/* Logo/header fix v3 - user-selected monogram logo */
.brand.brand-logo {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    gap: 0;
    min-width: 0;
}

.brand.brand-logo img {
    display: block;
    width: auto;
    height: 60px;
    max-width: 300px;
    object-fit: contain;
}

.admin-logo img {
    display: block;
    width: auto;
    height: 58px;
    max-width: 260px;
    object-fit: contain;
}

@media (max-width: 700px) {
    .brand.brand-logo img {
        height: 48px;
        max-width: 240px;
    }

    .admin-logo img {
        height: 48px;
        max-width: 220px;
    }
}


/* Bootstrap-style responsive recipe cards */
.recipe-card-enhanced {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.recipe-card-enhanced .recipe-image-wrap {
    position: relative;
    display: block;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: #101729;
}

.recipe-card-enhanced .recipe-image-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .25s ease;
}

.recipe-card-enhanced:hover .recipe-image-wrap img {
    transform: scale(1.035);
}

.recipe-card-enhanced .recipe-card-body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
}

.recipe-card-kicker {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 9px;
}

.recipe-card-kicker span {
    border: 1px solid rgba(255, 255, 255, .18);
    background: rgba(5, 7, 13, .74);
    color: #eafdf8;
    border-radius: 999px;
    padding: 5px 9px;
    font-size: .75rem;
    font-weight: 800;
    line-height: 1;
}

.recipe-card-kicker span:first-child {
    color: var(--brand);
    border-color: rgba(22, 242, 179, .32);
    background: rgba(22, 242, 179, .09);
}

.recipe-card-enhanced h3 {
    margin: 0 0 9px;
}

.recipe-card-description {
    margin-bottom: 14px;
}

.recipe-card-info-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
    margin: 0 0 14px;
}

.recipe-card-info-grid div {
    border: 1px solid rgba(255, 255, 255, .1);
    background: rgba(255, 255, 255, .045);
    border-radius: 14px;
    padding: 10px 11px;
}

.recipe-card-info-grid span {
    display: block;
    color: var(--muted);
    font-size: .76rem;
    margin-bottom: 2px;
}

.recipe-card-info-grid strong {
    display: block;
    color: #fff;
    font-size: .94rem;
    line-height: 1.2;
}

.recipe-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    color: var(--muted);
    font-size: .82rem;
    border-top: 1px solid rgba(255, 255, 255, .08);
    padding-top: 12px;
    margin-top: auto;
}

.recipe-card-footer a {
    color: var(--brand);
    font-weight: 800;
    white-space: nowrap;
}

.recipe-card-footer a:hover {
    color: #fff;
}

/* Mobile-first correction: do not squeeze desktop cards onto phones. */
@media (max-width: 720px) {
    .hero,
    .page-hero,
    .recipe-hero {
        padding: 34px 0 24px;
    }

    .hero-grid,
    .recipe-hero-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .hero h1,
    .page-hero h1,
    .recipe-hero h1 {
        font-size: clamp(1.85rem, 9vw, 2.8rem);
        line-height: 1.05;
    }

    .lead {
        font-size: 1rem;
    }

    .search-bar {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .recipe-grid,
    .featured-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .section {
        padding-block: 24px;
    }

    .section-title {
        align-items: flex-start;
        gap: 8px;
        margin-bottom: 14px;
    }

    .mobile-recipe-card {
        display: grid;
        grid-template-columns: 108px minmax(0, 1fr);
        align-items: stretch;
        min-height: 132px;
        border-radius: 18px;
    }

    .mobile-recipe-card .mobile-recipe-card-image {
        aspect-ratio: auto;
        height: 100%;
        min-height: 132px;
        border-radius: 18px 0 0 18px;
    }

    .mobile-recipe-card .mobile-recipe-card-image img {
        height: 100%;
    }

    .mobile-recipe-card .mobile-recipe-card-body {
        min-width: 0;
        padding: 11px 12px;
        justify-content: space-between;
    }

    .mobile-recipe-tags {
        gap: 6px;
        margin-bottom: 5px;
    }

    .mobile-recipe-tags span {
        font-size: .68rem;
        padding: 4px 7px;
    }

    .mobile-recipe-card h3 {
        font-size: .98rem;
        line-height: 1.15;
        margin: 0 0 7px;
    }

    .mobile-recipe-card h3 a {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .mobile-recipe-card .recipe-card-description {
        display: none;
    }

    .mobile-recipe-meta {
        grid-template-columns: 1fr 1fr;
        gap: 6px;
        margin: 0;
    }

    .mobile-recipe-meta div {
        border-radius: 10px;
        padding: 7px 8px;
    }

    .mobile-recipe-meta span {
        font-size: .66rem;
        margin-bottom: 1px;
    }

    .mobile-recipe-meta strong {
        font-size: .8rem;
        line-height: 1.1;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .mobile-recipe-footer {
        border-top: 0;
        padding-top: 7px;
        margin-top: 0;
        justify-content: flex-end;
    }

    .mobile-recipe-footer span {
        display: none;
    }

    .mobile-recipe-footer a {
        font-size: .83rem;
    }
}

@media (max-width: 390px) {
    .container {
        width: min(100% - 22px, 1180px);
    }

    .mobile-recipe-card {
        grid-template-columns: 96px minmax(0, 1fr);
        min-height: 124px;
    }

    .mobile-recipe-card .mobile-recipe-card-image {
        min-height: 124px;
    }

    .mobile-recipe-card .mobile-recipe-card-body {
        padding: 10px;
    }

    .mobile-recipe-meta {
        grid-template-columns: 1fr;
    }

    .mobile-recipe-tags span:nth-child(2) {
        display: none;
    }
}


/* Mobile CSS loading/layout hardening */
@media (max-width: 720px) {
    .site-header .nav-shell {
        min-height: auto;
        padding: 10px 0;
        flex-wrap: wrap;
        align-items: flex-start;
    }

    .site-header .brand.brand-logo img {
        height: auto;
        max-height: none;
        max-width: 260px;
    }

    .site-header .nav-toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin-top: 10px;
    }

    .site-header .site-nav {
        width: 100%;
        gap: 10px 14px;
        flex-wrap: wrap;
        padding-bottom: 8px;
        font-size: .95rem;
    }
}