﻿/* Extracted from archivo.php during CSS cleanup. Keep before newer component/page CSS. */
:root{
        --bg-main:#050007;
        --text-main:#fdf7ff;
        --text-muted:#b7a9d6;
        --accent:#f91fb0;
        --accent-strong:#ff5fd0;
        --accent-cyan:#22e7ff;
    }
    body{
        margin:0;
        background:
            radial-gradient(circle at 18% 0%, rgba(249,31,176,.22), transparent 34%),
            linear-gradient(135deg,#050007,#0b0615 52%,#000);
        color:var(--text-main);
        font-family:var(--tr-font-ui, "TR Inter", Manrope, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
    }
    a{color:inherit;text-decoration:none;}
    .archive-wrap{
        width:min(1200px, calc(100% - 40px));
        margin:0 auto;
        padding:30px 0 70px;
    }
    .archive-hero{
        padding:26px 28px 24px;
        border-radius:8px;
        background:
            radial-gradient(circle at 88% 12%, rgba(34,231,255,.13), transparent 30%),
            radial-gradient(circle at 10% 0%, rgba(249,31,176,.22), transparent 36%),
            linear-gradient(135deg, rgba(0,0,0,.78), rgba(10,15,28,.90) 48%, rgba(26,2,32,.84));
        border:1px solid rgba(34,231,255,.22);
        box-shadow:0 28px 80px rgba(0,0,0,.62);
        overflow:hidden;
        position:relative;
    }
    .archive-hero::after{
        content:"";
        position:absolute;
        inset:0;
        pointer-events:none;
        background:
            linear-gradient(90deg, rgba(34,231,255,.08), transparent 28%, rgba(249,31,176,.10)),
            repeating-linear-gradient(90deg, rgba(255,255,255,.024) 0 1px, transparent 1px 80px);
        opacity:.58;
    }
    .archive-hero > *{
        position:relative;
        z-index:1;
    }
    .archive-hero-main{
        display:grid;
        grid-template-columns:minmax(0,1fr) 330px;
        gap:26px;
        align-items:center;
    }
    .archive-hero-copy{
        min-width:0;
    }
    .archive-kicker{
        display:flex;
        align-items:center;
        gap:10px;
        color:var(--accent-cyan);
        font-size:12px;
        font-weight:900;
        text-transform:uppercase;
    }
    .archive-kicker::before{
        content:"";
        width:38px;
        height:2px;
        background:linear-gradient(90deg,var(--accent-cyan),var(--accent));
    }
    h1{
        margin:14px 0 0;
        font-size:clamp(38px,5vw,64px);
        line-height:1;
        letter-spacing:0;
        text-shadow:0 0 24px rgba(249,31,176,.44);
    }
    .archive-lead{
        max-width:800px;
        margin:14px 0 0;
        color:#d8caef;
        font-size:16px;
        line-height:1.55;
    }
    .archive-search{
        width:min(760px,100%);
        height:54px;
        margin-top:24px;
        display:grid;
        grid-template-columns:42px minmax(0,1fr) 44px;
        align-items:center;
        border:1px solid rgba(34,231,255,.30);
        background:rgba(0,0,0,.46);
        border-radius:8px;
        box-shadow:inset 0 0 0 1px rgba(255,255,255,.03), 0 14px 32px rgba(0,0,0,.35);
        overflow:hidden;
    }
    .archive-search-icon{
        color:var(--accent-cyan);
        font-size:25px;
        line-height:1;
        text-align:center;
    }
    .archive-search input{
        min-width:0;
        width:100%;
        height:100%;
        padding:0;
        border:0 !important;
        outline:0 !important;
        background:transparent !important;
        box-shadow:none !important;
        border-radius:0 !important;
        color:#fff;
        appearance:none;
        -webkit-appearance:none;
        box-sizing:border-box;
        font-family:var(--tr-font-ui, "TR Inter", Manrope, system-ui, sans-serif);
        font-size:15px;
        font-weight:650;
    }
    .archive-search input:focus{
        border:0 !important;
        outline:0 !important;
        box-shadow:none !important;
        background:transparent !important;
    }
    .archive-search input::-webkit-search-decoration,
    .archive-search input::-webkit-search-cancel-button,
    .archive-search input::-webkit-search-results-button,
    .archive-search input::-webkit-search-results-decoration{
        display:none;
    }
    .archive-search input::placeholder{
        color:#cdbdf0;
    }
    .archive-search button{
        width:32px;
        height:32px;
        margin:0 8px 0 4px;
        display:grid;
        place-items:center;
        border:0;
        border-radius:8px;
        background:rgba(255,255,255,.09);
        color:#fff;
        font-size:18px;
        font-weight:900;
        cursor:pointer;
    }
    .archive-search button[hidden]{
        display:none;
    }
    .archive-hero-panel{
        align-self:stretch;
        display:flex;
        flex-direction:column;
        justify-content:space-between;
        gap:12px;
        padding:16px;
        border-radius:8px;
        background:linear-gradient(145deg, rgba(0,0,0,.36), rgba(34,231,255,.06));
        border:1px solid rgba(255,255,255,.09);
        overflow:hidden;
    }
    .archive-now{
        padding:12px;
        border-radius:8px;
        background:rgba(0,0,0,.34);
        border:1px solid rgba(255,255,255,.10);
    }
    .archive-now span{
        display:block;
        color:var(--accent-cyan);
        font-size:10px;
        font-weight:950;
        letter-spacing:.10em;
        text-transform:uppercase;
    }
    .archive-now strong{
        display:block;
        margin-top:5px;
        line-height:1.12;
        color:#fff;
        font-size:16px;
    }
    .archive-highlight-list{
        display:grid;
        gap:8px;
    }
    .archive-highlight-list a{
        display:grid;
        gap:3px;
        padding:11px 12px;
        border-radius:8px;
        background:rgba(0,0,0,.28);
        border:1px solid rgba(34,231,255,.18);
        transition:border-color .15s ease, background .15s ease, transform .15s ease;
    }
    .archive-highlight-list a:hover{
        transform:translateY(-1px);
        border-color:rgba(34,231,255,.55);
        background:rgba(34,231,255,.09);
    }
    .archive-highlight-list span{
        color:var(--accent-cyan);
        font-size:10px;
        font-weight:950;
        letter-spacing:.09em;
        text-transform:uppercase;
    }
    .archive-highlight-list strong{
        min-width:0;
        overflow:hidden;
        color:#fff;
        text-overflow:ellipsis;
        white-space:nowrap;
        font-size:15px;
        line-height:1.12;
    }
    .archive-highlight-list small{
        color:#bdaee0;
        font-size:11px;
        font-weight:850;
    }
    .archive-tabs{
        display:flex;
        gap:8px;
        flex-wrap:wrap;
        margin-top:20px;
    }
    .archive-tab{
        min-height:38px;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        padding:8px 13px;
        border-radius:8px;
        border:1px solid rgba(255,255,255,.12);
        background:rgba(0,0,0,.28);
        color:#fff;
        font-size:12px;
        font-weight:900;
    }
    .archive-tab.is-active{
        border-color:rgba(249,31,176,.58);
        background:rgba(249,31,176,.16);
        box-shadow:0 0 18px rgba(249,31,176,.22);
    }
    .archive-meta{
        margin-top:16px;
        display:grid;
        grid-template-columns:repeat(3,minmax(0,1fr));
        gap:10px;
    }
    .archive-stat{
        padding:13px;
        border-radius:8px;
        background:rgba(0,0,0,.28);
        border:1px solid rgba(255,255,255,.10);
    }
    .archive-stat span{
        display:block;
        color:var(--text-muted);
        font-size:11px;
        text-transform:uppercase;
    }
    .archive-stat strong{
        display:block;
        margin-top:5px;
        font-size:22px;
    }
    .archive-results{
        margin-top:18px;
        padding:18px;
        border-radius:8px;
        border:1px solid rgba(34,231,255,.20);
        background:
            radial-gradient(circle at 100% 0%, rgba(34,231,255,.09), transparent 32%),
            linear-gradient(135deg, rgba(5,12,22,.88), rgba(16,0,22,.70));
    }
    .archive-section-head{
        display:flex;
        justify-content:space-between;
        align-items:flex-end;
        gap:16px;
        margin-bottom:14px;
        padding-bottom:14px;
        border-bottom:1px solid rgba(255,255,255,.10);
    }
    .archive-section-head span{
        color:var(--accent-cyan);
        font-size:11px;
        font-weight:950;
        letter-spacing:.08em;
        text-transform:uppercase;
    }
    .archive-section-head h2{
        margin:5px 0 0;
        font-size:clamp(25px,3vw,38px);
        line-height:1.04;
    }
    .archive-section-head > strong{
        flex:0 0 auto;
        min-height:32px;
        display:inline-flex;
        align-items:center;
        padding:7px 11px;
        border-radius:999px;
        color:#fff;
        background:rgba(0,0,0,.30);
        border:1px solid rgba(34,231,255,.28);
        font-size:12px;
    }
    .archive-grid{
        margin-top:0;
        display:grid;
        grid-template-columns:repeat(auto-fill,minmax(340px,1fr));
        gap:10px;
    }
    .archive-card{
        min-height:88px;
        display:grid;
        grid-template-columns:64px minmax(0,1fr) auto;
        align-items:center;
        gap:12px;
        padding:10px;
        border-radius:8px;
        background:
            linear-gradient(135deg, rgba(0,0,0,.42), rgba(255,255,255,.025)),
            rgba(0,0,0,.34);
        border:1px solid rgba(255,255,255,.10);
        box-shadow:0 12px 30px rgba(0,0,0,.28);
        transition:transform .15s ease,border-color .15s ease;
    }
    .archive-card:hover{
        transform:translateY(-2px);
        border-color:rgba(249,31,176,.55);
    }
    .archive-card img{
        width:64px;
        height:64px;
        aspect-ratio:1/1;
        object-fit:cover;
        display:block;
        border-radius:6px;
        background:#09020d;
    }
    .archive-card-body{
        min-width:0;
        display:flex;
        flex-direction:column;
        justify-content:center;
    }
    .archive-card-title{
        margin:0;
        overflow:hidden;
        display:-webkit-box;
        -webkit-line-clamp:2;
        -webkit-box-orient:vertical;
        font-weight:900;
        font-size:15px;
        line-height:1.16;
    }
    .archive-card-artist{
        margin-top:4px;
        color:var(--text-muted);
        font-size:12px;
        line-height:1.25;
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }
    .archive-card-meta{
        margin-top:7px;
        display:flex;
        gap:6px;
        flex-wrap:wrap;
        color:#fff;
        font-size:10px;
    }
    .archive-card-meta span{
        max-width:190px;
        padding:3px 7px;
        border-radius:999px;
        background:rgba(249,31,176,.12);
        border:1px solid rgba(249,31,176,.24);
        overflow:hidden;
        text-overflow:ellipsis;
        white-space:nowrap;
    }
    .archive-card-action{
        min-height:32px;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        padding:7px 10px;
        border-radius:8px;
        border:1px solid rgba(34,231,255,.35);
        background:rgba(34,231,255,.08);
        color:#fff;
        font-size:11px;
        font-weight:950;
    }
    .archive-card[hidden]{
        display:none;
    }
    .archive-empty{
        margin-top:18px;
        padding:18px;
        border-radius:8px;
        border:1px solid rgba(249,31,176,.28);
        background:rgba(0,0,0,.28);
        color:var(--text-muted);
    }
    .image-rights-note{
        margin-top:16px;
        color:rgba(255,255,255,.66);
        font-size:11px;
        line-height:1.5;
    }
    .image-rights-note a{
        color:var(--cyan);
        text-decoration:none;
        font-weight:850;
    }
    .image-rights-note a:hover{text-decoration:underline;}
    .archive-seo{
        margin-top:20px;
        padding:24px 0;
        border-top:1px solid rgba(34,231,255,.18);
        border-bottom:1px solid rgba(249,31,176,.20);
        display:grid;
        grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);
        gap:28px;
    }
    .archive-portal,
    .archive-discovery{
        margin-top:18px;
        display:grid;
        gap:14px;
    }
    .archive-portal{
        grid-template-columns:1.05fr 1.35fr 1fr;
    }
    .archive-discovery{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
    .portal-panel,
    .discovery-block{
        padding:16px;
        border-radius:8px;
        border:1px solid rgba(34,231,255,.17);
        background:
            radial-gradient(circle at 100% 0%, rgba(34,231,255,.08), transparent 30%),
            linear-gradient(135deg, rgba(7,16,28,.86), rgba(28,3,32,.58));
    }
    .portal-heading{
        display:flex;
        align-items:flex-end;
        justify-content:space-between;
        gap:12px;
        margin-bottom:13px;
    }
    .portal-heading span{
        color:var(--accent-cyan);
        font-size:11px;
        font-weight:950;
        text-transform:uppercase;
        letter-spacing:.08em;
    }
    .portal-heading strong{
        color:#fff;
        font-size:15px;
        text-align:right;
    }
    .portal-links,
    .discovery-grid{
        display:flex;
        flex-wrap:wrap;
        gap:8px;
    }
    .portal-links a,
    .discovery-grid a{
        min-height:36px;
        display:inline-flex;
        align-items:center;
        justify-content:center;
        gap:8px;
        padding:8px 12px;
        border-radius:8px;
        border:1px solid rgba(255,255,255,.12);
        background:rgba(0,0,0,.30);
        color:#fff;
        font-size:12px;
        font-weight:900;
    }
    .portal-links a:hover,
    .discovery-grid a:hover,
    .portal-links a.is-active,
    .discovery-grid a.is-active{
        border-color:rgba(34,231,255,.55);
        background:rgba(34,231,255,.10);
        box-shadow:0 0 18px rgba(34,231,255,.16);
    }
    .portal-links a small{
        color:#bdaee0;
        font-size:10px;
        font-weight:900;
    }
    .portal-links-compact a{
        min-width:64px;
    }
    .portal-links-letters a{
        width:38px;
        padding:8px 0;
    }
    .discovery-grid{
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
    .discovery-grid a{
        justify-content:flex-start;
        align-items:flex-start;
        flex-direction:column;
        gap:4px;
        text-align:left;
    }
    .discovery-grid a span{
        min-width:0;
        max-width:100%;
        overflow:hidden;
        display:-webkit-box;
        -webkit-line-clamp:2;
        -webkit-box-orient:vertical;
        line-height:1.12;
    }
    .discovery-grid a small{
        color:#bdaee0;
        font-size:10px;
        line-height:1.25;
        white-space:normal;
    }
    .archive-seo{
        border-radius:8px;
        padding:22px;
        border:1px solid rgba(255,255,255,.10);
        background:linear-gradient(135deg, rgba(0,0,0,.35), rgba(34,231,255,.05));
    }
    .archive-seo h2,
    .archive-seo h3{
        margin:0;
        letter-spacing:0;
    }
    .archive-seo h2{
        font-size:clamp(25px,3.2vw,42px);
        line-height:1.05;
    }
    .archive-seo h3{
        font-size:15px;
        color:#fff;
    }
    .archive-seo p{
        color:#d8caef;
        line-height:1.62;
        margin:14px 0 0;
    }
    .seo-list{
        display:grid;
        gap:10px;
        margin:16px 0 0;
        padding:0;
        list-style:none;
    }
    .seo-list li{
        padding-left:18px;
        position:relative;
        color:#f8edff;
        line-height:1.45;
    }
    .seo-list li::before{
        content:"";
        position:absolute;
        left:0;
        top:.65em;
        width:7px;
        height:7px;
        border-radius:999px;
        background:var(--accent-cyan);
        box-shadow:0 0 12px rgba(34,231,255,.5);
    }
    .seo-side{
        display:grid;
        gap:20px;
        align-content:start;
    }
    .seo-tags,
    .seo-links{
        display:flex;
        flex-wrap:wrap;
        gap:8px;
        margin-top:12px;
    }
    .seo-tags span,
    .seo-links a{
        min-height:32px;
        display:inline-flex;
        align-items:center;
        padding:7px 10px;
        border-radius:999px;
        border:1px solid rgba(255,255,255,.12);
        background:rgba(0,0,0,.25);
        color:#fff;
        font-size:12px;
        font-weight:800;
    }
    .seo-links a{
        border-color:rgba(34,231,255,.22);
    }
    .seo-links a:hover{
        border-color:rgba(249,31,176,.55);
        box-shadow:0 0 16px rgba(249,31,176,.16);
    }
    @media (max-width:700px){
        .archive-wrap{width:min(100% - 28px, 1180px);padding-top:24px;}
        .archive-hero{padding:18px;}
        .archive-hero-main{grid-template-columns:1fr;}
        .archive-hero-panel{display:none;}
        h1{font-size:clamp(34px,12vw,48px);}
        .archive-lead{font-size:15px;}
        .archive-search{grid-template-columns:38px minmax(0,1fr) 40px;}
        .archive-search input{font-size:14px;}
        .archive-tabs{gap:7px;}
        .archive-tab{min-height:34px;padding:7px 10px;font-size:11px;}
        .archive-meta{grid-template-columns:1fr;}
        .archive-portal,
        .archive-discovery{grid-template-columns:1fr;}
        .portal-heading{align-items:flex-start;flex-direction:column;}
        .portal-heading strong{text-align:left;}
        .discovery-grid{grid-template-columns:1fr;}
        .archive-section-head{align-items:flex-start;flex-direction:column;}
        .archive-grid{grid-template-columns:1fr;}
        .archive-card{grid-template-columns:58px minmax(0,1fr);min-height:80px;}
        .archive-card img{width:58px;height:58px;}
        .archive-card-action{display:none;}
        .archive-card-meta span{max-width:150px;}
        .archive-seo{grid-template-columns:1fr;gap:20px;}
    }
