:root{
    --myradio-bg:#0f0b17;
    --myradio-bg-soft:#171124;
    --myradio-bg-deep:#130d1e;
    --myradio-panel:rgba(255,255,255,0.05);
    --myradio-panel-strong:rgba(255,255,255,0.08);
    --myradio-border:rgba(255,255,255,0.12);
    --myradio-border-strong:rgba(255,255,255,0.18);
    --myradio-text:#f4efff;
    --myradio-muted:#c8bcdf;
    --myradio-accent:#a672ff;
    --myradio-accent-2:#7d53d6;
    --myradio-accent-soft:rgba(166,114,255,0.18);
    --myradio-link:#dccaff;
    --myradio-link-hover:#ffffff;

    --myradio-good:#45c27c;
    --myradio-good-soft:rgba(69,194,124,0.14);

    --myradio-bad:#e26d6d;
    --myradio-bad-soft:rgba(226,109,109,0.12);

    --myradio-warn:#e4b95b;
    --myradio-warn-soft:rgba(228,185,91,0.12);

    --myradio-unknown:#7fb3ff;
    --myradio-unknown-soft:rgba(127,179,255,0.12);

    --myradio-shadow:0 16px 40px rgba(0,0,0,0.28);
    --myradio-radius-sm:12px;
    --myradio-radius-md:16px;
    --myradio-radius-lg:20px;
    --myradio-radius-xl:22px;

    --myradio-width:1180px;
    --myradio-width-search:1100px;
}

*{
    box-sizing:border-box;
}

html,
body{
    margin:0;
    padding:0;
}

html{
    scroll-behavior:smooth;
}

body{
    font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    background:
        radial-gradient(circle at top left, var(--myradio-accent-soft), transparent 30%),
        linear-gradient(180deg, var(--myradio-bg) 0%, var(--myradio-bg-deep) 100%);
    color:var(--myradio-text);
    line-height:1.6;
    min-height:100vh;
}

img{
    max-width:100%;
    height:auto;
    display:block;
}

a{
    color:var(--myradio-link);
    text-decoration:none;
    transition:color .18s ease, background-color .18s ease, border-color .18s ease, transform .18s ease;
}

a:hover{
    color:var(--myradio-link-hover);
}

a:focus-visible,
button:focus-visible,
input:focus-visible{
    outline:2px solid rgba(166,114,255,0.65);
    outline-offset:2px;
}

code{
    font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;
    background:rgba(255,255,255,0.06);
    border:1px solid var(--myradio-border);
    border-radius:8px;
    padding:2px 6px;
    color:#f2e9ff;
}

strong{
    color:#fff;
}

.site-shell{
    width:min(var(--myradio-width), calc(100% - 28px));
    margin:0 auto;
    padding:28px 0 48px;
}

.site-shell.search-shell{
    width:min(var(--myradio-width-search), calc(100% - 28px));
    padding:32px 0 56px;
}

.brand-wrap{
    display:grid;
    grid-template-columns:1.5fr 1fr;
    gap:18px;
    align-items:start;
    margin-bottom:20px;
}

.eyebrow{
    margin:0 0 6px;
    color:var(--myradio-muted);
    text-transform:uppercase;
    letter-spacing:.08em;
    font-size:.8rem;
}

h1{
    margin:0 0 8px;
    font-size:clamp(2rem,4vw,3rem);
    line-height:1.08;
    color:#fff;
}

h2,
h3{
    color:#fff;
    line-height:1.15;
}

h2{
    margin:0 0 10px;
    font-size:1.35rem;
}

h3{
    margin:0 0 8px;
    font-size:1.05rem;
}

p{
    margin:0 0 12px;
}

.subtext{
    margin:0;
    color:var(--myradio-muted);
}

.hero,
.card,
.main-card,
.side-card,
.jump-form,
.result-card{
    background:var(--myradio-panel);
    border:1px solid var(--myradio-border);
    box-shadow:var(--myradio-shadow);
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
}

.hero,
.card{
    border-radius:var(--myradio-radius-xl);
    padding:24px;
}

.main-card,
.side-card{
    border-radius:var(--myradio-radius-lg);
    padding:20px;
}

.jump-form{
    border-radius:18px;
    padding:16px;
}

.hero{
    margin-bottom:18px;
}

.content-grid{
    display:grid;
    grid-template-columns:1.6fr .9fr;
    gap:18px;
}

.grid{
    display:grid;
    grid-template-columns:1.5fr .9fr;
    gap:18px;
}

.results-wrap{
    display:grid;
    grid-template-columns:1.6fr .9fr;
    gap:18px;
}

.results-list{
    display:flex;
    flex-direction:column;
    gap:14px;
}

.result-card{
    border-radius:var(--myradio-radius-lg);
    padding:18px;
}

.result-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:12px;
    flex-wrap:wrap;
}

.result-title{
    margin:0;
    font-size:1.15rem;
    color:#fff;
}

.jump-form label{
    display:block;
    margin-bottom:8px;
    font-weight:600;
    color:#fff;
}

.jump-row,
.search-form{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}

.jump-row input,
.search-form input{
    flex:1;
    min-width:0;
    border:1px solid var(--myradio-border);
    background:rgba(255,255,255,0.04);
    color:var(--myradio-text);
    border-radius:var(--myradio-radius-sm);
    padding:12px 14px;
    outline:none;
    font-size:1rem;
}

.search-form input{
    min-width:240px;
    padding:14px 16px;
    border-radius:14px;
}

.jump-row input::placeholder,
.search-form input::placeholder{
    color:#b7a9d2;
}

.jump-row button,
.search-form button{
    border:0;
    background:linear-gradient(180deg, var(--myradio-accent), var(--myradio-accent-2));
    color:#fff;
    font-weight:700;
    cursor:pointer;
    transition:transform .18s ease, filter .18s ease;
}

.jump-row button{
    border-radius:var(--myradio-radius-sm);
    padding:12px 16px;
}

.search-form button{
    border-radius:14px;
    padding:14px 18px;
}

.jump-row button:hover,
.search-form button:hover{
    transform:translateY(-1px);
    filter:brightness(1.06);
}

.jump-note,
.small,
.notice,
.footer,
.site-footer{
    color:var(--myradio-muted);
}

.jump-note{
    margin:10px 0 0;
    font-size:.9rem;
}

.status-row,
.pills,
.inline-links,
.entry-nav,
.actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}

.status-row{
    margin-bottom:14px;
}

.status-pill,
.pill{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    padding:7px 12px;
    font-size:.85rem;
    font-weight:700;
    border:1px solid transparent;
    white-space:nowrap;
}

.status-pill.good{
    background:var(--myradio-good-soft);
    color:#9ce1b8;
    border-color:rgba(69,194,124,.25);
}

.status-pill.bad{
    background:var(--myradio-bad-soft);
    color:#f0a0a0;
    border-color:rgba(226,109,109,.22);
}

.status-pill.warn{
    background:var(--myradio-warn-soft);
    color:#efd08a;
    border-color:rgba(228,185,91,.22);
}

.status-pill.unknown{
    background:var(--myradio-unknown-soft);
    color:#add0ff;
    border-color:rgba(127,179,255,.22);
}

.status-pill.neutral,
.pill{
    background:rgba(255,255,255,.06);
    color:#ece4ff;
    border-color:rgba(255,255,255,.12);
}

.pill.fm{
    background:rgba(116,184,255,.12);
    color:#b8daff;
    border-color:rgba(116,184,255,.2);
}

.pill.am{
    background:rgba(255,191,112,.12);
    color:#ffd6a6;
    border-color:rgba(255,191,112,.2);
}

.meta-grid,
.meta{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
    gap:12px;
    margin:18px 0 22px;
}

.meta{
    grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
    margin:14px 0;
}

.meta-card,
.meta div{
    background:var(--myradio-panel-strong);
    border:1px solid var(--myradio-border);
    border-radius:var(--myradio-radius-md);
    padding:14px;
}

.meta div{
    padding:10px 12px;
    border-radius:14px;
}

.meta-card .label,
.label{
    display:block;
    color:var(--myradio-muted);
    font-size:.78rem;
    text-transform:uppercase;
    letter-spacing:.06em;
    margin-bottom:6px;
}

.meta-card .value,
.value{
    font-weight:700;
    color:#fff;
}

.section-title{
    margin:18px 0 8px;
    font-size:1.05rem;
    color:#fff;
}

ul{
    margin:8px 0 0;
    padding-left:18px;
}

ul.clean{
    margin:0;
    padding-left:18px;
}

ul li{
    margin-bottom:6px;
}

.link-list{
    list-style:none;
    padding:0;
    margin:0;
}

.link-list li + li{
    margin-top:10px;
}

.inline-links a,
.entry-nav a,
.actions a,
.link-list a{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:10px 14px;
    border-radius:var(--myradio-radius-sm);
    background:rgba(255,255,255,.05);
    border:1px solid var(--myradio-border);
    color:var(--myradio-link);
}

.link-list a{
    display:block;
    text-align:left;
    background:rgba(255,255,255,.04);
    padding:12px 14px;
}

.inline-links a:hover,
.entry-nav a:hover,
.actions a:hover,
.link-list a:hover{
    color:#fff;
    border-color:var(--myradio-border-strong);
    background:rgba(255,255,255,.08);
}

.notice{
    margin-top:18px;
    background:rgba(255,255,255,.04);
    border:1px solid var(--myradio-border);
    border-radius:var(--myradio-radius-md);
    padding:14px;
}

.notice strong{
    display:block;
    margin-bottom:4px;
}

.entry-nav,
.actions{
    margin-top:22px;
}

.hero .search-form{
    margin-top:18px;
}

.error{
    color:#ffb3b3;
}

.footer{
    margin-top:18px;
    font-size:.95rem;
}

.site-footer{
    margin-top:18px;
    padding:14px 2px 0;
    font-size:.95rem;
}

hr{
    border:0;
    height:1px;
    background:var(--myradio-border);
    margin:20px 0;
}

@media (max-width: 960px){
    .results-wrap{
        grid-template-columns:1fr;
    }
}

@media (max-width: 920px){
    .brand-wrap,
    .content-grid{
        grid-template-columns:1fr;
    }
}

@media (max-width: 900px){
    .grid{
        grid-template-columns:1fr;
    }
}

@media (max-width: 640px){
    .site-shell,
    .site-shell.search-shell{
        width:min(100%, calc(100% - 20px));
        padding-top:20px;
        padding-bottom:36px;
    }

    .hero,
    .card,
    .main-card,
    .side-card{
        padding:18px;
    }

    .jump-form{
        padding:14px;
    }

    .jump-row,
    .search-form{
        flex-direction:column;
    }

    .jump-row button,
    .search-form button{
        width:100%;
    }

    .inline-links a,
    .entry-nav a,
    .actions a{
        width:100%;
    }

    .result-head{
        align-items:stretch;
    }
}