:root {
    --designer-deep: #0A4031;
    --designer-green: #32A664;
    --designer-mint: #88BF9B;
    --designer-blue: #2A828C;
    --designer-pale: #B8D9D5;
}

body.designer-shell {
    min-height: 100vh;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

body.designer-catalog { background-image: linear-gradient(rgba(184,217,213,.28), rgba(10,64,49,.42)), url("../img/designer/fon_web.jpg"); }
body.designer-detail { background-image: linear-gradient(rgba(184,217,213,.22), rgba(10,64,49,.16)), url("../img/designer/Fon_cyrs.jpg"); }
body.designer-auth { background-image: linear-gradient(rgba(184,217,213,.16), rgba(10,64,49,.18)), url("../img/designer/Fon_registr.jpg"); }
body.designer-profile { background-image: linear-gradient(rgba(184,217,213,.18), rgba(10,64,49,.2)), url("../img/designer/Fon_profile.jpg"); }

.designer-shell .site-header {
    top: 14px;
    width: min(96%, 1500px);
    min-height: 76px;
    margin: 14px auto 0;
    padding: 12px 28px;
    border: 4px solid var(--designer-green);
    border-radius: 20px;
    background: rgba(136,191,155,.64);
    box-shadow: 0 10px 34px rgba(10,64,49,.24);
    backdrop-filter: blur(12px);
}

.designer-shell .brand {
    display: grid;
    min-width: 118px;
    min-height: 42px;
    place-items: center;
    border: 2px solid var(--designer-green);
    border-radius: 9px;
    background: linear-gradient(256deg, rgba(42,130,140,.5), rgba(10,64,49,.75));
    color: var(--designer-pale);
    font-family: Georgia, "Times New Roman", serif;
    font-weight: 500;
}

.designer-shell .main-nav a:not(.button),
.designer-shell .link-button {
    padding: 8px 15px;
    border: 2px solid var(--designer-green);
    border-radius: 8px;
    background: linear-gradient(256deg, rgba(42,130,140,.42), rgba(10,64,49,.78));
    color: var(--designer-pale);
    font-family: Georgia, "Times New Roman", serif;
}

.designer-shell .button {
    border: 2px solid var(--designer-green);
    background: linear-gradient(256deg, rgba(42,130,140,.68), rgba(10,64,49,.9));
    color: var(--designer-pale);
    box-shadow: 0 7px 20px rgba(10,64,49,.22);
}

.designer-shell .page-header {
    margin-top: 52px;
    padding: 42px;
    border: 3px solid var(--designer-green);
    border-radius: 22px;
    background: rgba(136,191,155,.55);
    box-shadow: 0 14px 38px rgba(10,64,49,.2);
    backdrop-filter: blur(12px);
}

.designer-shell .page-header h1 {
    margin-bottom: 26px;
    color: var(--designer-deep);
    font-family: Georgia, "Times New Roman", serif;
    text-shadow: 0 2px 14px rgba(184,217,213,.5);
}

.designer-shell .eyebrow { color: var(--designer-deep); }

.designer-shell .catalog-filters {
    padding: 18px;
    border: 2px solid var(--designer-green);
    border-radius: 16px;
    background: rgba(10,64,49,.42);
}

.designer-shell .catalog-filters input,
.designer-shell .catalog-filters select,
.designer-shell .form-field input {
    border: 2px solid var(--designer-green);
    background: rgba(10,64,49,.76);
    color: var(--designer-pale);
}

.designer-shell .catalog-filters input::placeholder,
.designer-shell .form-field input::placeholder { color: rgba(184,217,213,.8); }

.designer-shell .course-grid { gap: 24px; }
.designer-shell .course-card {
    position: relative;
    border: 3px solid var(--designer-green);
    border-radius: 18px;
    background: rgba(136,191,155,.68);
    box-shadow: 0 14px 36px rgba(10,64,49,.26);
    backdrop-filter: blur(10px);
}

.designer-shell .course-cover { background: linear-gradient(135deg, rgba(136,191,155,.72), rgba(10,64,49,.92)); }
.designer-shell .course-card h3 a,
.designer-shell .course-card p,
.designer-shell .course-meta { color: var(--designer-deep); }
.designer-shell .course-tags span { border-color: var(--designer-green); background: rgba(10,64,49,.75); color: var(--designer-pale); }

.designer-detail .course-hero {
    width: min(96%, 1500px);
    margin: 52px auto 0;
    padding: 56px 0;
    border: 3px solid var(--designer-green);
    border-radius: 24px;
    background: rgba(136,191,155,.6);
    box-shadow: 0 14px 40px rgba(10,64,49,.24);
    backdrop-filter: blur(12px);
}

.designer-detail .course-hero h1 { color: var(--designer-deep); font-family: Georgia, "Times New Roman", serif; }
.designer-detail .detail-cover { border: 4px solid var(--designer-green); background: linear-gradient(135deg, rgba(136,191,155,.8), rgba(10,64,49,.9)); }
.course-showcase { display:grid;grid-template-columns:1.2fr .8fr;gap:28px;align-items:start }.course-showcase h2{font-family:Georgia,serif}.presentation-player video{display:block;width:100%;max-height:540px;border-radius:3px 28px 3px 28px;background:#202326;box-shadow:0 18px 45px rgba(33,37,39,.18)}.course-gallery>div{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.course-gallery figure{margin:0;overflow:hidden;border-radius:2px 17px 2px 17px;background:#fff;box-shadow:0 9px 25px rgba(40,44,45,.1)}.course-gallery img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}.course-gallery figcaption{padding:8px 10px;color:#72767a;font-size:11px}.module-list li small{color:#5d9771}
@media(max-width:760px){.course-showcase{grid-template-columns:1fr}.course-gallery>div{grid-template-columns:1fr 1fr}}
.designer-detail .detail-layout > * { padding: 28px; border: 3px solid var(--designer-green); border-radius: 20px; background: rgba(136,191,155,.68); backdrop-filter: blur(12px); }
.designer-detail .module-list details { border: 2px solid var(--designer-green); background: rgba(10,64,49,.72); color: var(--designer-pale); }

.designer-auth .auth-page { background: transparent; }
.designer-auth .auth-card {
    border: 4px solid var(--designer-green);
    border-radius: 20px;
    background: rgba(136,191,155,.66);
    box-shadow: 0 20px 56px rgba(10,64,49,.32);
    backdrop-filter: blur(14px);
}
.designer-auth .auth-card h1 { color: var(--designer-deep); font-family: Georgia, "Times New Roman", serif; }
.designer-auth .form-field label { color: var(--designer-deep); }
.designer-auth .form-field small { color: #174f40; }
.designer-role-switch { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin: 0 0 20px; padding: 4px; border: 2px solid var(--designer-green); border-radius: 999px; background: rgba(10,64,49,.54); color: var(--designer-pale); text-align: center; }
.designer-role-switch span { padding: 8px 14px; border-radius: 999px; }
.designer-role-switch span:first-child { background: rgba(50,166,100,.75); }

.designer-profile .dashboard-list article,
.designer-profile .empty-state {
    border: 3px solid var(--designer-green);
    background: rgba(136,191,155,.7);
    box-shadow: 0 12px 34px rgba(10,64,49,.2);
    backdrop-filter: blur(10px);
}
.designer-profile .dashboard-list article h2 a,
.designer-profile .dashboard-list article p { color: var(--designer-deep); }

.designer-shell .site-footer {
    margin-top: 60px;
    border-top: 3px solid var(--designer-green);
    background: rgba(10,64,49,.9);
    color: var(--designer-pale);
}

@media (max-width: 760px) {
    .designer-shell .site-header { top: 6px; align-items: center; width: calc(100% - 20px); min-height: 68px; margin-top: 6px; padding: 9px 12px; border-width: 3px; }
    .designer-shell .brand { min-width: 76px; min-height: 38px; }
    .designer-shell .main-nav { gap: 6px; }
    .designer-shell .main-nav a:not(.button), .designer-shell .link-button { padding: 6px 8px; font-size: 12px; }
    .designer-shell .main-nav .button { min-height: 36px; padding: 6px 10px; font-size: 12px; }
    .designer-shell .page-header { margin-top: 30px; padding: 24px 18px; }
    .designer-detail .course-hero { margin-top: 30px; padding: 34px 0; }
    .designer-detail .detail-layout > * { padding: 20px; }
    .designer-role-switch { font-size: 12px; }
}