@font-face{
    font-family:"iransans";
    src:url("../fonts/IranianSans.ttf");
}

:root{
    --primary:#2dd4bf;
    --secondary:#38bdf8;
    --accent:#f59e0b;
    --surface:rgba(255,255,255,.78);
    --surface-strong:rgba(255,255,255,.92);
    --glass:rgba(255,255,255,.62);
    --border:rgba(15,23,42,.10);
    --text:#0f172a;
    --text-muted:#475569;
    --shadow:0 18px 45px rgba(15,23,42,.12);
    --shadow-soft:0 8px 24px rgba(15,23,42,.08);
}

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    font-family:iransans,sans-serif;
    background:
        radial-gradient(circle at top left, rgba(45,212,191,.20), transparent 28%),
        radial-gradient(circle at top right, rgba(56,189,248,.18), transparent 26%),
        radial-gradient(circle at bottom left, rgba(245,158,11,.10), transparent 24%),
        linear-gradient(135deg,#f8fbff 0%,#eef6fb 42%,#eefaf8 100%);
    color:var(--text);
    min-height:100vh;
    overflow-x:hidden;
    line-height:1.9;
    width:100%;
    text-rendering:optimizeLegibility;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
}

@keyframes softFloat{
    0%,100%{ transform:translateY(0); }
    50%{ transform:translateY(-3px); }
}

@keyframes shimmerSweep{
    0%{ background-position:0% 50%; }
    100%{ background-position:200% 50%; }
}

@media (prefers-reduced-motion: reduce){
    html{
        scroll-behavior:auto;
    }

    *,
    *::before,
    *::after{
        animation-duration:.01ms !important;
        animation-iteration-count:1 !important;
        transition-duration:.01ms !important;
    }
}

h1,h2,h3,h4,h5,h6,strong,b,th,button{
    font-weight:800;
}

::selection{
    background:rgba(110,231,183,.28);
    color:#fff;
}

.parent{
    overflow-x:hidden;
}

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

a{
    text-decoration:none;
}

.is-hidden{
    display:none !important;
}

body.dark-theme{
    background:
        radial-gradient(circle at top left, rgba(45,212,191,.18), transparent 28%),
        radial-gradient(circle at top right, rgba(56,189,248,.16), transparent 26%),
        linear-gradient(135deg,#0b1220 0%,#111827 55%,#0f172a 100%);
    color:#e5eef8;
}

/* Header */

header{
    position:sticky;
    top:0;
    z-index:1000;
    padding:14px 5%;
    backdrop-filter:blur(22px);
    background:linear-gradient(180deg, rgba(255,255,255,.84), rgba(255,255,255,.70));
    border-bottom:1px solid rgba(15,23,42,.08);
    box-shadow:var(--shadow-soft);
    transition:padding .28s ease, background .28s ease, box-shadow .28s ease, transform .28s ease;
}

header.is-scrolled{
    padding-block:10px;
    background:linear-gradient(180deg, rgba(255,255,255,.94), rgba(255,255,255,.84));
    box-shadow:0 10px 28px rgba(15,23,42,.10);
}

.header-shell{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    flex-wrap:wrap;
}

.header-brand-row{
    display:flex;
    align-items:center;
    gap:14px;
    min-width:0;
    flex:0 0 auto;
}

.brand-link{
    color:var(--text);
    display:inline-flex;
    align-items:center;
    min-width:0;
}

.brand-mark{
    display:inline-flex;
    align-items:center;
    gap:10px;
    font-size:clamp(18px,2.2vw,26px);
    font-weight:900;
    letter-spacing:-.02em;
}

.brand-mark span{
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.menu-toggle{
    display:none;
    width:46px;
    height:46px;
    border-radius:14px;
    border:1px solid rgba(15,23,42,.10);
    background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,255,255,.82));
    box-shadow:0 10px 24px rgba(15,23,42,.10);
    cursor:pointer;
    padding:0;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:5px;
}

.menu-toggle span{
    width:18px;
    height:2px;
    background:var(--text);
    border-radius:999px;
    transition:transform .25s ease, opacity .25s ease, width .25s ease;
}

.site-nav{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    flex-wrap:nowrap;
    min-width:0;
    flex:1 1 auto;
}

.header-name{
    display:flex;
    align-items:center;
    gap:12px;
    font-size:clamp(18px,3vw,28px);
    font-weight:900;
}

.name-svg{
    width:35px;
    transition:.5s;
}

.header-name:hover .name-svg{
    transform:rotate(360deg) scale(1.15);
}

nav{
    display:flex;
}

.site-nav a,
nav a{
    color:var(--text);
    position:relative;
    transition:.3s;
    padding:11px 15px;
    border-radius:999px;
    background:rgba(255,255,255,.82);
    border:1px solid rgba(15,23,42,.08);
    white-space:nowrap;
}

.site-nav a::after,
nav a::after{
    content:"";
    position:absolute;
    bottom:-5px;
    right:0;
    width:0;
    height:2px;
    background:linear-gradient(90deg,var(--secondary),var(--primary));
    transition:.3s;
}

.site-nav a:hover,
nav a:hover{
    color:var(--primary);
    background:rgba(45,212,191,.10);
    box-shadow:0 0 0 1px rgba(45,212,191,.18) inset;
    border-color:rgba(45,212,191,.20);
}

.site-nav a:hover::after,
nav a:hover::after{
    width:100%;
}

.session-area{
    margin-inline-start:auto;
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:nowrap;
    flex:0 0 auto;
}

.session-badge{
    display:flex;
    flex-direction:column;
    gap:2px;
    padding:10px 14px;
    border-radius:999px;
    background:rgba(255,255,255,.88);
    border:1px solid rgba(15,23,42,.08);
    color:var(--text);
    min-width:150px;
}

.session-badge strong{
    font-size:14px;
}

.session-badge span{
    font-size:12px;
    color:var(--text-muted);
}

.session-link,
.session-logout{
    padding:10px 14px;
    border-radius:999px;
    border:1px solid rgba(15,23,42,.10);
    background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,250,252,.88));
    color:var(--text);
    transition:.3s;
    box-shadow:0 8px 18px rgba(0,0,0,.16);
}

.session-link:hover,
.session-logout:hover{
    transform:translateY(-2px);
    background:linear-gradient(135deg, rgba(45,212,191,.14), rgba(56,189,248,.14));
    border-color:rgba(45,212,191,.26);
}

.header-shell .session-area{
    margin-inline-start:auto;
    flex-wrap:nowrap;
}

/* Sections */

.description{
    width:min(1200px,92%);
    margin:40px auto;
    padding:30px;
    background:linear-gradient(180deg, rgba(255,255,255,.90), rgba(255,255,255,.76));
    backdrop-filter:blur(28px);
    border:1px solid rgba(15,23,42,.08);
    border-radius:24px;
    box-shadow:var(--shadow);
    transition:.4s;
}

.description:hover{
    transform:translateY(-5px);
    box-shadow:0 24px 60px rgba(0,0,0,.35);
}

.welcome-banner,
.auth-card,
.auth-hero,
.admin-panel,
.stat-card,
.content-card{
    width:min(1200px,92%);
    margin:30px auto;
    padding:28px;
    background:linear-gradient(180deg, rgba(255,255,255,.90), rgba(255,255,255,.78));
    backdrop-filter:blur(26px);
    border:1px solid rgba(15,23,42,.08);
    border-radius:24px;
    box-shadow:var(--shadow);
}

.welcome-banner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    overflow:hidden;
    position:relative;
}

.welcome-banner__text{
    min-width:0;
    max-width:100%;
}

.welcome-banner__text h2,
.auth-hero h2,
.admin-hero h2,
.custom-content-heading h2{
    color:var(--text);
    margin-bottom:10px;
    font-size:clamp(22px,3vw,32px);
    text-shadow:0 2px 16px rgba(0,0,0,.22);
}

.welcome-banner__text p,
.auth-hero p,
.admin-hero p,
.custom-content-heading p{
    color:var(--text-muted);
}

.welcome-banner__action{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:140px;
    max-width:100%;
    padding:12px 18px;
    border-radius:999px;
    color:#042f2e;
    background:linear-gradient(135deg,#f8fafc, rgba(45,212,191,.40) 55%, rgba(56,189,248,.32));
    font-weight:800;
    box-shadow:0 14px 30px rgba(45,212,191,.16);
    white-space:nowrap;
}

.description h2{
    color:#0f766e;
    margin-bottom:20px;
    font-size:clamp(20px,3vw,30px);
}

.description p,
.description2{
    color:var(--text-muted);
    text-align:justify;
    font-size:clamp(14px,2vw,17px);
}

/* Images */

.img-div{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:20px;
    margin-bottom:25px;
    align-items:start;
}

.img-main,
.img-main1,
.img-main2,
.img-main3,
.mostanad-img{
    width:100%;
    height:100%;
    aspect-ratio:1/1;
    object-fit:cover;
    border-radius:20px;
    transition:transform .35s ease, box-shadow .35s ease, filter .35s ease, opacity .35s ease;
    box-shadow:0 10px 25px rgba(0,0,0,.18);
    will-change:transform;
    backface-visibility:hidden;
    transform:translateZ(0);
}

.img-div > a,
.img-div > img{
    display:block;
    width:100%;
    height:100%;
    border-radius:20px;
    overflow:hidden;
    background:rgba(255,255,255,.04);
}

.img-main:hover,
.img-main1:hover,
.img-main2:hover,
.img-main3:hover,
.mostanad-img:hover{
    transform:translateY(-3px) scale(1.02);
    box-shadow:0 15px 34px rgba(15,23,42,.16);
    filter:saturate(1.05);
}

/* Contact */

ul{
    list-style:none;
    padding:35px 5%;
    background:rgba(255,255,255,.78);
}

.email{
    display:flex;
    align-items:center;
    gap:10px;
    margin:15px 0;
    flex-wrap:wrap;
}

/* Footer */

.footer-link{
    padding:35px 5%;
    background:rgba(255,255,255,.82);
    backdrop-filter:blur(20px);
    border-top:1px solid rgba(15,23,42,.08);
}

.footer-link p{
    margin-bottom:10px;
}

.footer-link a{
    display:inline-block;
    color:var(--text);
    margin:10px 15px 10px 0;
    transition:.3s;
}

.footer-link a:hover{
    color:var(--primary);
    transform:translateY(-3px);
}

.footer-p{
    margin-top:20px;
    color:#aaa;
}

/* Auth */

.auth-layout,
.admin-layout{
    width:min(1260px,94%);
    margin:30px auto 0;
}

.auth-layout{
    display:grid;
    grid-template-columns:1fr 1.1fr;
    gap:24px;
    align-items:start;
}

.auth-hero,
.auth-card{
    width:auto;
    margin:0;
}

.eyebrow{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 14px;
    border-radius:999px;
    background:rgba(110,231,183,.12);
    color:var(--secondary);
    font-size:13px;
    margin-bottom:18px;
}

.auth-card{
    padding:22px;
}

.auth-tabs{
    display:flex;
    gap:12px;
    margin-bottom:18px;
    flex-wrap:wrap;
}

.auth-tab{
    border:1px solid rgba(15,23,42,.10);
    background:rgba(255,255,255,.88);
    color:var(--text);
    padding:11px 18px;
    border-radius:999px;
    cursor:pointer;
    transition:.3s;
}

.auth-tab.is-active{
    background:linear-gradient(135deg, rgba(45,212,191,.30), rgba(56,189,248,.30));
    color:#042f2e;
    font-weight:700;
    box-shadow:0 12px 24px rgba(110,231,183,.14);
}

.auth-form,
.content-form{
    display:grid;
    gap:12px;
}

.auth-form h3,
.panel-head h3{
    color:#fff;
    font-size:20px;
}

.auth-form label,
.content-form label{
    color:var(--text-muted);
    font-size:14px;
}

.auth-form input,
.auth-form textarea,
.content-form input,
.content-form textarea{
    width:100%;
    padding:14px 16px;
    border-radius:16px;
    border:1px solid rgba(15,23,42,.10);
    background:rgba(255,255,255,.90);
    color:var(--text);
    outline:none;
    font-family:inherit;
}

.auth-form input::placeholder,
.content-form input::placeholder,
.content-form textarea::placeholder{
    color:#64748b;
}

.auth-form input:focus,
.auth-form textarea:focus,
.content-form input:focus,
.content-form textarea:focus{
    border-color:rgba(45,212,191,.55);
    box-shadow:0 0 0 4px rgba(45,212,191,.12);
}

.auth-submit{
    border:0;
    border-radius:16px;
    padding:14px 18px;
    background:linear-gradient(135deg,var(--primary),var(--secondary));
    color:#fff;
    font-weight:800;
    cursor:pointer;
    transition:.3s;
    box-shadow:0 14px 28px rgba(110,231,183,.16);
}

.auth-submit:hover{
    transform:translateY(-2px);
    box-shadow:0 18px 30px rgba(110,231,183,.22);
}

.content-editor{
    gap:18px;
    width:100%;
}

.content-editor__meta,
.content-builder{
    display:grid;
    gap:12px;
    width:100%;
}

.content-builder__toolbar{
    display:grid;
    gap:10px;
    padding:16px;
    border-radius:18px 18px 12px 12px;
    border:1px solid rgba(110,231,183,.22);
    background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(0,0,0,.08));
    box-shadow:0 14px 30px rgba(0,0,0,.16);
}

.editor-ribbon{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    padding:8px;
    border-radius:8px;
    background:rgba(255,255,255,.88);
    border:1px solid rgba(15,23,42,.08);
}

.editor-tool{
    min-width:42px;
    height:38px;
    padding:0 10px;
    border:1px solid rgba(255,255,255,.16);
    border-radius:6px;
    background:#fff;
    color:var(--text);
    font-family:inherit;
    font-weight:800;
    cursor:pointer;
    transition:.2s;
    box-shadow:0 8px 16px rgba(15,23,32,.08);
}

.editor-tool:hover{
    background:rgba(45,212,191,.14);
    border-color:rgba(45,212,191,.36);
}

.content-builder__toolbar-row{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    align-items:center;
}

.content-block-type,
.content-block__type-select{
    width:100%;
    min-width:180px;
    padding:12px 14px;
    border-radius:14px;
    border:1px solid rgba(15,23,42,.10);
    background:rgba(255,255,255,.90);
    color:var(--text);
    font-family:inherit;
}

.content-canvas{
    padding:18px;
    border-radius:0 0 22px 22px;
    background:#fff;
    border:1px solid rgba(15,23,42,.08);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 18px 40px rgba(15,23,42,.10);
    min-height:520px;
    overflow:auto;
}

.content-builder__add{
    min-width:190px;
}

.content-blocks-list{
    display:grid;
    gap:16px;
    background:transparent;
}

.content-editor-shell{
    display:grid;
    gap:12px;
    background:#fff;
    border:1px solid rgba(0,0,0,.08);
    border-radius:22px;
    box-shadow:0 22px 60px rgba(0,0,0,.18);
    overflow:hidden;
    min-height:560px;
    width:100%;
}

.editor-ribbon--primary{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:6px;
    padding:10px 12px;
    border-bottom:1px solid rgba(0,0,0,.08);
    background:linear-gradient(180deg, #fbfcfe, #eef4f8);
}

.editor-statusbar{
    display:flex;
    justify-content:space-between;
    gap:12px;
    padding:10px 14px 0;
    color:#51606b;
    font-size:13px;
}

.article-editor{
    min-height:460px;
    padding:22px 24px 28px;
    outline:none;
    direction:rtl;
    line-height:1.9;
    color:#1c2430;
    font-size:17px;
    background:#fff;
    width:100%;
    box-sizing:border-box;
    border-radius:0 0 22px 22px;
}

.article-editor img{
    max-width:100%;
    height:auto;
    border-radius:12px;
}

.article-editor iframe,
.article-editor video{
    width:100%;
    min-height:360px;
    border:0;
    border-radius:12px;
}

.article-editor:focus{
    box-shadow:inset 0 0 0 2px rgba(0,125,255,.08);
}

.article-editor h2,
.article-editor h3,
.article-editor h4{
    margin:0 0 14px;
    line-height:1.45;
}

.article-editor p{
    margin:0 0 14px;
}

.article-editor blockquote{
    margin:14px 0;
    padding:12px 16px;
    border-right:4px solid #0f766e;
    background:#eef9f8;
    color:#0f3340;
    border-radius:10px;
}

.article-editor ul,
.article-editor ol{
    margin:14px 0;
    padding-right:22px;
}

.article-editor a{
    color:#0b63ce;
    text-decoration:underline;
}

.article-editor,
.content-editor-shell{
    border-color:rgba(110,231,183,.22);
}

.content-block{
    padding:18px;
    border-radius:18px;
    background:#f8fbff;
    border:1px solid rgba(3,19,26,.08);
    color:#0f1720;
}

.content-block__header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-bottom:16px;
}

.content-block__title{
    color:#0b6d72;
    font-size:16px;
}

.content-block__actions{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    align-items:center;
}

.block-icon-button{
    width:38px;
    height:38px;
    border:1px solid var(--border);
    border-radius:12px;
    background:#fff;
    color:#12313b;
    cursor:pointer;
}

.block-icon-button--danger{
    background:rgba(217,65,65,.18);
    border-color:rgba(217,65,65,.35);
}

.content-block__body{
    display:grid;
    gap:12px;
}

.content-field{
    display:grid;
    gap:8px;
}

.content-field span{
    color:#4b5563;
    font-size:14px;
}

.content-field input,
.content-field textarea,
.content-field select{
    width:100%;
    padding:12px 14px;
    border-radius:14px;
    border:1px solid var(--border);
    background:#fff;
    color:#0f1720;
    font-family:inherit;
    border:1px solid rgba(15,23,32,.12);
    box-shadow:0 1px 2px rgba(0,0,0,.04);
}

.content-field textarea{
    min-height:120px;
    resize:vertical;
}

.content-image,
.content-video,
.content-video--embed{
    max-width:280px;
    width:auto;
    border-radius:14px;
}

.content-block,
.consultation-card,
.stat-card,
.welcome-banner,
.auth-card,
.auth-hero,
.admin-panel,
.content-card{
    transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.content-block:hover,
.consultation-card:hover,
.stat-card:hover,
.content-card:hover{
    transform:translateY(-4px);
    box-shadow:0 20px 44px rgba(0,0,0,.18);
}

.article-block--figure{
    display:grid;
    gap:10px;
    justify-items:start;
    width:fit-content;
    max-width:100%;
}

.article-block--figure .content-image,
.article-block--figure .content-video,
.article-block--figure .content-video--embed{
    max-width:var(--media-size,128px);
    width:100%;
    aspect-ratio:1 / 1;
    object-fit:cover;
}

.article-block--link{
    margin:0;
}

.article-block--link a{
    color:var(--primary);
    font-weight:800;
    word-break:break-word;
}

.article-block--link a:hover{
    text-decoration:underline;
}

.article-block--list{
    margin:0;
    padding-inline-start:22px;
    display:grid;
    gap:10px;
    color:#0f1720;
}

.article-block--list li{
    padding-inline-start:4px;
}

.article-block--list-bullet{
    list-style:disc;
}

.article-block--list-number{
    list-style:decimal;
}

.profile-section{
    width:min(1200px,92%);
    margin:0 auto 24px;
}

.profile-page .admin-layout{
    width:min(1200px,92%);
    margin:0 auto;
    padding:24px 0 48px;
}

.profile-hero{
    width:min(1200px,92%);
    margin:24px auto 18px;
}

.profile-panel{
    display:grid;
    gap:18px;
    padding:24px;
    border-radius:22px;
    background:rgba(255,255,255,.08);
    border:1px solid var(--border);
    box-shadow:0 18px 42px rgba(0,0,0,.16);
}

.profile-info{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
    gap:12px;
}

.profile-info > div,
.consultation-card{
    padding:14px 16px;
    border-radius:16px;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.08);
}

.profile-info span,
.consultation-card span{
    display:block;
    color:var(--text-muted);
    font-size:13px;
}

.consult-form{
    display:grid;
    gap:12px;
}

.consult-form label{
    display:grid;
    gap:8px;
    color:#fff;
}

.consult-form input,
.consult-form textarea{
    width:100%;
    padding:12px 14px;
    border-radius:14px;
    border:1px solid var(--border);
    background:rgba(0,0,0,.18);
    color:#fff;
    font-family:inherit;
}

.consultations-list{
    display:grid;
    gap:12px;
}

.consultation-card p{
    margin-top:8px;
    color:var(--text-muted);
    white-space:pre-wrap;
}

.article-render{
    display:grid;
    gap:16px;
    margin-top:18px;
}

.content-card__summary{
    color:#d8fef7;
    font-size:15px;
    line-height:1.8;
    margin-top:10px;
}

.article-block{
    width:100%;
}

.article-block--heading{
    color:var(--primary);
    line-height:1.4;
    margin:0;
}

.article-block--paragraph{
    color:var(--text-muted);
    text-align:justify;
    margin:0;
}

.article-block--quote{
    padding:16px 18px;
    border-radius:18px;
    border-right:4px solid var(--primary);
    background:rgba(0,0,0,.18);
    color:#fff;
}

.article-block--quote cite{
    display:block;
    margin-top:10px;
    color:var(--text-muted);
    font-style:normal;
}

.article-block--figure{
    margin:0;
    display:grid;
    gap:10px;
}

.article-block--code{
    overflow:auto;
    margin:0;
    padding:16px;
    border-radius:18px;
    background:#0b1020;
    color:#d7fdf4;
    border:1px solid rgba(110,231,183,.14);
}

.article-block--code code{
    white-space:pre-wrap;
    word-break:break-word;
}

.auth-hint{
    margin-top:18px;
    padding:14px 16px;
    border-radius:16px;
    background:rgba(110,231,183,.08);
    border:1px solid rgba(110,231,183,.18);
    color:#d9fffa;
}

/* Admin */

.admin-hero{
    width:auto;
    margin:0;
    padding:0 0 22px;
}

.stats-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
    gap:16px;
    margin-top:18px;
}

.stat-card{
    width:auto;
    margin:0;
    padding:18px;
}

.stat-card span{
    display:block;
    color:var(--text-muted);
    margin-bottom:8px;
    font-size:14px;
}

.stat-card strong{
    color:var(--primary);
    font-size:28px;
}

.admin-grid{
    display:grid;
    grid-template-columns:1.05fr .95fr;
    gap:24px;
    margin:24px 0;
}

.admin-panel{
    width:auto;
    margin:0;
}

.panel-head{ 
    margin-bottom:18px;
}

.panel-head p{
    color:var(--text-muted);
    margin-top:6px;
}

.table-wrap{
    overflow:auto;
    border-radius:18px;
    border:1px solid var(--border);
}

.admin-table{
    width:100%;
    min-width:680px;
    border-collapse:collapse;
    background:rgba(0,0,0,.16);
}

.admin-table th,
.admin-table td{
    padding:14px 16px;
    border-bottom:1px solid rgba(255,255,255,.08);
    text-align:right;
}

.admin-table th{
    color:var(--primary);
    background:rgba(255,255,255,.04);
    font-size:14px;
}

.admin-table td{
    color:var(--text-muted);
}

.empty-cell,
.empty-state{
    color:var(--text-muted);
    text-align:center;
    padding:24px;
}

.posts-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
    gap:18px;
}

.posts-grid--home{
    margin-top:16px;
}

.custom-content-section{
    width:min(1320px,94%);
    margin:44px auto;
    padding:18px 0 0;
}

.published-section{
    margin:28px 0 44px;
    padding:0;
    border-radius:0;
    background:none;
    border:0;
    box-shadow:none;
}

.custom-content-heading{
    margin-bottom:22px;
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:14px;
}

.custom-content-heading h2{
    position:relative;
    padding-inline-start:16px;
    margin:0;
    display:inline-block;
}

.custom-content-heading h2::before{
    content:"";
    position:absolute;
    inset-inline-start:0;
    top:.25em;
    width:5px;
    height:1.2em;
    border-radius:999px;
    background:linear-gradient(180deg, var(--secondary), var(--primary), var(--secondary));
    background-size:200% 100%;
    box-shadow:0 0 0 6px rgba(45,212,191,.08);
    animation:shimmerSweep 8s linear infinite;
}

.custom-content-heading p{
    margin:0;
    max-width:70ch;
    line-height:1.8;
}

.content-card{
    width:auto;
    margin:0;
    padding:22px;
    min-width:0;
    overflow:hidden;
    position:relative;
    isolation:isolate;
    animation:softFloat 7s ease-in-out infinite;
    animation-play-state:paused;
}

.content-card::before{
    content:"";
    position:absolute;
    inset:0;
    background:
        linear-gradient(135deg, rgba(45,212,191,.08), transparent 36%),
        linear-gradient(315deg, rgba(14,165,233,.06), transparent 30%);
    opacity:.7;
    pointer-events:none;
    z-index:-1;
}

.content-card__header{
    display:flex;
    flex-direction:column;
    gap:6px;
    margin-bottom:16px;
}

.content-card__header h3{
    color:var(--text);
    font-size:clamp(18px,2vw,24px);
    line-height:1.5;
    margin:0;
}

.content-card__meta{
    color:#7dd3fc;
    font-size:12px;
    letter-spacing:.02em;
    display:inline-flex;
    flex-wrap:wrap;
    gap:8px;
    align-items:center;
}

.content-card__text{
    color:var(--text-muted);
    margin-bottom:14px;
    text-align:justify;
    line-height:1.9;
}

.content-card__figure,
.content-card__media{
    margin-bottom:14px;
}

.content-image,
.content-video,
.content-video--embed{
    width:100%;
    border-radius:16px;
    display:block;
    box-shadow:0 12px 26px rgba(0,0,0,.16);
    transition:transform .35s ease, box-shadow .35s ease, filter .35s ease;
}

.content-image{
    object-fit:cover;
    aspect-ratio:16/10;
}

.content-video{
    background:#000;
    min-height:240px;
}

.content-video--embed{
    min-height:260px;
    border:0;
}

.content-card__code{
    overflow:auto;
    padding:14px;
    border-radius:16px;
    background:linear-gradient(180deg, rgba(15,23,42,.92), rgba(2,6,23,.96));
    color:#d7fdf4;
    border:1px solid rgba(110,231,183,.18);
    margin-top:14px;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}

.content-card__actions{
    display:flex;
    justify-content:flex-start;
    margin-top:16px;
}

.danger-button{
    border:0;
    border-radius:999px;
    padding:10px 16px;
    background:linear-gradient(135deg,#ef4444,#b91c1c);
    color:#fff;
    cursor:pointer;
    font-weight:800;
    box-shadow:0 12px 24px rgba(185,28,28,.22);
    transition:transform .2s ease, box-shadow .2s ease, filter .2s ease;
}

.danger-button:hover{
    transform:translateY(-2px);
    filter:saturate(1.08);
    box-shadow:0 16px 28px rgba(185,28,28,.3);
}

.content-card:hover{
    transform:translateY(-4px);
    box-shadow:0 22px 46px rgba(0,0,0,.18);
    border-color:rgba(45,212,191,.14);
    animation-play-state:running;
}

.published-section:hover{
    opacity:1;
}

.posts-grid--home{
    grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
}

.article-render{
    gap:18px;
}

.article-block--paragraph,
.article-block--quote,
.article-block--list{
    font-size:15px;
    line-height:1.95;
}

.article-block--paragraph{
    color:var(--text-muted);
}

.article-block--quote{
    border-right:3px solid var(--secondary);
    background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025));
}

.article-block--list{
    padding:12px 16px 12px 0;
    border-radius:16px;
    background:rgba(255,255,255,.025);
    border:1px solid rgba(255,255,255,.05);
}

.article-block--link a{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:9px 13px;
    border-radius:999px;
    background:rgba(45,212,191,.10);
    border:1px solid rgba(45,212,191,.18);
    text-decoration:none;
    transition:transform .2s ease, background .2s ease, border-color .2s ease;
}

.article-block--link a:hover{
    background:rgba(45,212,191,.14);
    transform:translateY(-1px);
    border-color:rgba(45,212,191,.26);
}

/* Responsive */

/* Scrollbar */

::-webkit-scrollbar{
    width:12px;
}

::-webkit-scrollbar-track{
    background:rgba(255,255,255,.05);
}

::-webkit-scrollbar-thumb{
    background:linear-gradient(
        180deg,
        var(--secondary),
        var(--primary)
    );
    border-radius:20px;
}

/* Tablet */

@media (max-width:768px){

    .header-shell{
        width:100%;
        align-items:center;
        gap:12px;
    }

    .header-brand-row{
        width:100%;
        justify-content:space-between;
    }

    .menu-toggle{
        display:inline-flex;
    }

    .site-nav{
        width:100%;
        flex-direction:column;
        align-items:stretch;
        gap:8px;
        order:3;
        overflow:hidden;
        max-height:0;
        opacity:0;
        transform:translateY(-8px);
        pointer-events:none;
        transition:max-height .35s ease, opacity .25s ease, transform .25s ease;
    }

    header.is-nav-open .site-nav{
        max-height:420px;
        opacity:1;
        transform:translateY(0);
        pointer-events:auto;
    }

    nav{ gap:12px; }

    .description{
        padding:20px;
    }

    .img-div{
        grid-template-columns:repeat(2,1fr);
    }

    .auth-layout,
    .admin-grid,
    .welcome-banner{
        grid-template-columns:1fr;
        flex-direction:column;
    }

    .content-builder__toolbar-row{
        flex-direction:column;
    }

    .content-canvas{
        min-height:420px;
    }

    .editor-ribbon{
        justify-content:center;
    }

    .profile-panel{
        padding:18px;
    }

    .profile-info{
        grid-template-columns:1fr;
    }

    .session-area{
        margin-inline-start:0;
        justify-content:flex-start;
        width:100%;
    }

    .session-badge,
    .session-link,
    .session-logout{
        background:rgba(255,255,255,.92);
        color:var(--text);
    }

    .admin-table{
        min-width:560px;
    }
}

/* Mobile */

@media (max-width:480px){

    .header-name{
        font-size:18px;
    }

    .name-svg{
        width:28px;
    }

    nav a{
        padding:6px 0;
    }

    .img-div{
        grid-template-columns:1fr;
    }

    .description{
        width:95%;
        padding:18px;
    }

    .welcome-banner,
    .auth-hero,
    .auth-card,
    .admin-panel,
    .content-card{
        width:95%;
        padding:18px;
    }

    .custom-content-section{
        width:95%;
        margin:28px auto;
        padding:16px;
        border-radius:24px;
    }

    .published-section{
        margin:20px 0 32px;
        padding:16px;
        border-radius:22px;
    }

    .custom-content-heading{
        flex-direction:column;
        align-items:flex-start;
    }

    .description p{
        text-align:right;
    }

    .welcome-banner__action,
    .auth-submit{
        width:100%;
    }

    .welcome-banner{
        align-items:flex-start;
        width:calc(100% - 24px);
        margin-inline:auto;
    }

    .welcome-banner__text{
        width:100%;
        max-width:100%;
        text-align:right;
    }

    .welcome-banner__text h2,
    .welcome-banner__text p{
        max-width:100%;
        overflow-wrap:anywhere;
        word-break:normal;
        white-space:normal;
    }

    .welcome-banner__action{
        width:100%;
        min-width:0;
    }

    ul,
    .footer-link{
        padding:25px;
    }

    .session-area{
        width:100%;
        justify-content:center;
    }

    .auth-tab,
    .session-link,
    .session-logout,
    .auth-submit,
    .danger-button{
        width:100%;
        justify-content:center;
    }

    .content-block__header{
        flex-direction:column;
        align-items:stretch;
    }

    .content-block__actions{
        justify-content:space-between;
    }

    .editor-tool{
        flex:1 1 40px;
    }
}

@media (min-width:1400px){

    .admin-layout,
    .custom-content-section{
        width:min(1380px,90%);
    }

    .posts-grid{
        grid-template-columns:repeat(auto-fit,minmax(340px,1fr));
    }
}