:root{
    --background:hsl(222, 18%, 11%);
    --foreground:hsl(210, 40%, 98%);
    --card:hsl(222, 20%, 14%);
    --card-foreground:hsl(210, 40%, 98%);
    --popover:hsl(222, 20%, 14%);
    --popover-foreground:hsl(210, 40%, 98%);
    --primary:hsl(158, 64%, 52%);
    --primary-foreground:hsl(210, 40%, 2%);
    --secondary:hsl(215, 30%, 28%);
    --secondary-foreground:hsl(210, 40%, 98%);
    --muted:hsl(215, 30%, 15%);
    --muted-foreground:hsl(215, 25%, 75%);
    --accent:hsl(158, 64%, 52%);
    --accent-foreground:hsl(210, 40%, 2%);
    --destructive:hsl(0, 84%, 60%);
    --destructive-foreground:hsl(210, 40%, 98%);
    --border:hsl(215, 30%, 28%);
    --input:hsl(215, 30%, 20%);
    --ring:hsl(158, 64%, 52%);
    --radius:0.875rem;
    --font-sans:"Inter", system-ui, -apple-system, sans-serif;
    --shadow-sm:0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.08);
    --shadow-md:0 4px 8px -2px rgba(0, 0, 0, 0.15), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --shadow-lg:0 10px 20px -5px rgba(0, 0, 0, 0.2), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    --shadow-xl:0 20px 30px -10px rgba(0, 0, 0, 0.25), 0 8px 12px -4px rgba(0, 0, 0, 0.1);
}

[data-theme="light"] {
    --background:hsl(0, 0%, 100%);
    --foreground:hsl(222, 84%, 5%);
    --card:hsl(0, 0%, 100%);
    --card-foreground:hsl(222, 84%, 5%);
    --popover:hsl(0, 0%, 100%);
    --popover-foreground:hsl(222, 84%, 5%);
    --primary:hsl(158, 64%, 52%);
    --primary-foreground:hsl(210, 40%, 98%);
    --secondary:hsl(210, 40%, 96%);
    --secondary-foreground:hsl(222, 84%, 5%);
    --muted:hsl(210, 40%, 96%);
    --muted-foreground:hsl(215, 16%, 55%);
    --accent:hsl(158, 64%, 52%);
    --accent-foreground:hsl(210, 40%, 98%);
    --destructive:hsl(0, 84%, 60%);
    --destructive-foreground:hsl(210, 40%, 98%);
    --border:hsl(214, 32%, 91%);
    --input:hsl(214, 32%, 91%);
    --ring:hsl(158, 64%, 52%);
    --shadow-sm:0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --shadow-md:0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --shadow-lg:0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    --shadow-xl:0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}
*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    border-color:var(--border);
}
.loading-screen{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100vh;
    background:linear-gradient(135deg, 
        hsl(222, 18%, 8%) 0%, 
        hsl(222, 20%, 12%) 50%, 
        hsl(222, 18%, 8%) 100%);
    display:flex;
    align-items:center;
    justify-content:center;
    z-index:9999;
    transition:opacity 0.8s ease-out, visibility 0.8s ease-out;
}
.loading-screen.fade-out{
    opacity:0;
    visibility:hidden;
}
.loading-content{
    text-align:center;
    animation:fadeInUp 1s ease-out;
}
.loading-logo{
    margin-bottom:3rem;
}
.loading-logo-text{
    font-size:4rem;
    font-weight:700;
    background:linear-gradient(45deg, 
        hsl(158, 64%, 52%), 
        hsl(200, 100%, 60%), 
        hsl(280, 100%, 65%), 
        hsl(320, 100%, 70%), 
        hsl(158, 64%, 52%));
    background-size:300% 300%;
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    background-clip:text;
    animation:gradientFlow 3s ease-in-out infinite, pulse 2s ease-in-out infinite;
    margin-bottom:1rem;
}
.loading-subtitle{
    font-size:1.5rem;
    color:var(--muted-foreground);
    font-weight:300;
    letter-spacing:0.1em;
    opacity:0.8;
}
.loading-message{
    margin-bottom:3rem;
    animation:fadeInUp 1s ease-out 0.5s both;
}
.greeting-text{
    font-size:2rem;
    font-weight:600;
    color:var(--foreground);
    margin-bottom:1rem;
    animation:textGlow 2s ease-in-out infinite alternate;
}
.greeting-subtext{
    font-size:1.125rem;
    color:var(--muted-foreground);
    font-weight:400;
    line-height:1.6;
}
.loading-spinner{
    animation:fadeInUp 1s ease-out 1s both;
}
.spinner{
    width:50px;
    height:50px;
    border:4px solid var(--muted);
    border-top:4px solid var(--primary);
    border-radius:50%;
    animation:spin 1s linear infinite;
    margin:0 auto;
}
.main-content{
    transition:opacity 0.8s ease-in, visibility 0.8s ease-in;
}
.main-content.show{
    opacity:1;
    visibility:visible;
}
body{
    background-color:var(--background);
    color:var(--foreground);
    font-family:var(--font-sans);
    line-height:1.7;
    direction:rtl;
    font-size:16px;
}
.container{
    max-width:1200px;
    margin:0 auto;
    padding:1.5rem;
}
.header{
    text-align:center;
    margin-bottom:2rem;
    animation:fadeInDown 0.6s ease-out;
    position:relative;
}

.theme-toggle-container{
    position:absolute;
    top:0;
    left:0;
    z-index:10;
}

.theme-toggle{
    background-color:var(--secondary);
    color:var(--secondary-foreground);
    border:2px solid var(--border);
    border-radius:50%;
    width:3rem;
    height:3rem;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    font-size:1.25rem;
    transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow:var(--shadow-sm);
    backdrop-filter:blur(4px);
}

.theme-toggle:hover{
    background-color:var(--primary);
    color:var(--primary-foreground);
    border-color:var(--primary);
    transform:scale(1.1) rotate(15deg);
    box-shadow:var(--shadow-md);
}

.theme-toggle:focus{
    outline:none;
    box-shadow:0 0 0 3px hsl(158 64% 52% / 0.25);
}

.theme-icon{
    transition:transform 0.3s ease;
}

.theme-toggle:hover .theme-icon{
    transform:scale(1.2);
}
.logo{
    font-size:2.5rem;
    font-weight:700;
    color:var(--primary);
    margin-bottom:1rem;
    background:linear-gradient(45deg, 
        hsl(158, 64%, 52%), 
        hsl(200, 100%, 60%), 
        hsl(280, 100%, 65%), 
        hsl(320, 100%, 70%), 
        hsl(158, 64%, 52%));
    background-size:300% 300%;
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    background-clip:text;
    display:inline-block;
    animation:waveTextFlow 4s ease-in-out infinite, gradientFlow 3s ease-in-out infinite;
    cursor:pointer;
    transition:all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    opacity:1;
    transform-origin:center center;
    position:relative;
}
.logo:hover{
    transform:scale(1.05);
}
.subtitle{
    color:var(--muted-foreground);
    font-size:1.125rem;
    font-weight:400;
    letter-spacing:0.025em;
}
.nav{
    margin-bottom:2rem;
    animation:fadeInUp 0.6s ease-out;
}
.nav-buttons{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:0.75rem;
}
.nav-button{
    padding:1rem 2rem;
    border-radius:var(--radius);
    background-color:var(--secondary);
    color:var(--secondary-foreground);
    border:2px solid transparent;
    cursor:pointer;
    font-family:inherit;
    font-size:1rem;
    font-weight:600;
    transition:all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    position:relative;
    overflow:hidden;
    box-shadow:var(--shadow-sm);
    backdrop-filter:blur(4px);
}
.nav-button:hover{
    background-color:var(--primary);
    color:var(--primary-foreground);
    transform:translateY(-3px);
    box-shadow:var(--shadow-lg);
    border-color:var(--primary);
}
.nav-button.active{
    background-color:var(--primary);
    color:var(--primary-foreground);
    border-color:var(--primary);
    box-shadow:var(--shadow-md), 0 0 0 3px hsl(158 64% 52% / 0.2);
    transform:translateY(-1px);
}
.nav-button:focus{
    outline:none;
    box-shadow:0 0 0 3px hsl(158 64% 52% / 0.5);
}
.view{
    display:none;
    animation:fadeIn 0.4s ease-out;
}
.view.active{
    display:block;
}
.card{
    background-color:var(--card);
    border-radius:var(--radius);
    padding:2rem;
    box-shadow:var(--shadow-md);
    border:1px solid var(--border);
    transition:all 0.16s cubic-bezier(0.4, 0, 0.2, 1);
    backdrop-filter:blur(8px);
    position:relative;
    max-width:100%;
}
.card:hover{
    box-shadow:var(--shadow-xl);
    transform:translateY(-1px);
    border-color:hsl(158 64% 52% / 0.3);
}
.section-title{
    font-size:1.875rem;
    font-weight:700;
    text-align:center;
    margin-bottom:2.5rem;
    color:var(--foreground);
    position:relative;
}
.section-title::after{
    content:'';
    position:absolute;
    bottom:-0.5rem;
    left:50%;
    transform:translateX(-50%);
    width:4rem;
    height:3px;
    background:linear-gradient(90deg, var(--primary), var(--accent));
    border-radius:2px;
}
.subsection-title{
    font-size:1.25rem;
    font-weight:600;
    margin-bottom:1.5rem;
    color:var(--primary);
}
.weight-section,
.score-section{
    margin-bottom:2.5rem;
    padding:1.75rem;
    background:linear-gradient(135deg, var(--muted) 0%, transparent 100%);
    border-radius:var(--radius);
    border:1px solid var(--border);
    transition:all 0.3s ease;
}
.weight-section:hover,
.score-section:hover{
    border-color:var(--primary);
    background:linear-gradient(135deg, var(--muted) 0%, hsl(158 64% 52% / 0.05) 100%);
}
.calculator-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));
    gap:1.5rem;
    margin-bottom:1.5rem;
}
.input-group{
    display:flex;
    flex-direction:column;
    position:relative;
}
.input-label{
    font-size:0.875rem;
    font-weight:500;
    margin-bottom:0.5rem;
    color:var(--foreground);
    transition:color 0.2s ease;
}
.input-field{
    background-color:var(--input);
    border:2px solid var(--border);
    border-radius:calc(var(--radius) - 2px);
    padding:0.875rem 1.125rem;
    color:var(--foreground);
    font-family:inherit;
    font-size:1rem;
    transition:all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    font-weight:500;
    box-shadow:var(--shadow-sm);
    will-change:transform, box-shadow, border-color;
}
.input-field:focus{
    outline:none;
    border-color:var(--primary);
    box-shadow:0 0 0 3px hsl(158 64% 52% / 0.4), var(--shadow-md);
    transform:translateY(-1px) scale(1.01);
    background-color:hsl(215, 30%, 22%);
}
.input-field:hover{
    border-color:var(--accent);
}
.weight-sum-display{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:1rem;
    margin-bottom:1.5rem;
    padding:1rem;
    background:linear-gradient(135deg, var(--card) 0%, var(--muted) 100%);
    border-radius:var(--radius);
    border:1px solid var(--border);
}
.weight-sum-label{
    font-size:0.875rem;
    color:var(--muted-foreground);
    font-weight:500;
}
.weight-sum-value{
    font-size:1.25rem;
    font-weight:700;
    color:var(--primary);
    transition:all 0.3s ease;
}
.weight-sum-value.warning{
    color:var(--destructive);
    animation:pulse 1s infinite;
}
.weight-warning{
    color:var(--destructive);
    font-size:0.875rem;
    font-weight:500;
    animation:slideInRight 0.3s ease;
}
.preset-buttons{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
    gap:0.75rem;
    margin-bottom:2rem;
}
.preset-chip{
    background-color:var(--muted);
    color:var(--muted-foreground);
    padding:1rem;
    border-radius:calc(var(--radius) - 2px);
    border:2px solid transparent;
    cursor:pointer;
    font-family:inherit;
    font-size:0.875rem;
    line-height:1.4;
    text-align:center;
    transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    font-weight:500;
    position:relative;
    overflow:hidden;
}
.preset-chip::before{
    content:'';
    position:absolute;
    top:0;
    left:-100%;
    width:100%;
    height:100%;
    background:linear-gradient(90deg, transparent, hsl(158 64% 52% / 0.2), transparent);
    transition:left 0.5s;
}
.preset-chip:hover::before{
    left:100%;
}
.preset-chip:hover{
    background-color:var(--accent);
    color:var(--accent-foreground);
    transform:translateY(-2px);
    box-shadow:0 8px 25px hsl(158 64% 52% / 0.15);
}
.preset-chip.active{
    background-color:var(--primary);
    color:var(--primary-foreground);
    border-color:var(--primary);
    transform:scale(1.05);
    box-shadow:0 8px 25px hsl(158 64% 52% / 0.25);
}
.preset-chip:focus{
    outline:none;
    box-shadow:0 0 0 3px hsl(158 64% 52% / 0.5);
}
.action-buttons{
    display:flex;
    flex-direction:column;
    gap:1.25rem;
    align-items:center;
    margin-bottom:2.5rem;
}
.btn-primary{
    background:linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
    color:var(--primary-foreground);
    padding:1.125rem 3rem;
    border-radius:var(--radius);
    border:none;
    cursor:pointer;
    font-family:inherit;
    font-size:1.125rem;
    font-weight:700;
    transition:all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow:var(--shadow-lg);
    position:relative;
    overflow:hidden;
    backdrop-filter:blur(8px);
    letter-spacing:0.025em;
}
.btn-primary:hover{
    transform:translateY(-4px) scale(1.02);
    box-shadow:var(--shadow-xl);
    filter:brightness(1.1);
}
.btn-primary:active{
    transform:translateY(-1px);
}
.btn-primary:focus{
    outline:none;
    box-shadow:0 0 0 3px hsl(158 64% 52% / 0.5), var(--shadow-lg);
}
.btn-secondary{
    background-color:var(--secondary);
    color:var(--secondary-foreground);
    padding:0.875rem 2.25rem;
    border-radius:var(--radius);
    border:2px solid var(--border);
    cursor:pointer;
    font-family:inherit;
    font-size:1rem;
    font-weight:600;
    transition:all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow:var(--shadow-sm);
    backdrop-filter:blur(4px);
}
.btn-secondary:hover{
    background-color:var(--muted);
    border-color:var(--primary);
    transform:translateY(-2px);
    box-shadow:var(--shadow-md);
    color:var(--primary);
}
.btn-secondary:focus{
    outline:none;
    box-shadow:0 0 0 3px hsl(158 64% 52% / 0.5);
}
.result-container{
    margin-top:1rem;
    animation:slideInUp 0.5s ease;
}
.result-card{
    background:linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
    color:var(--primary-foreground);
    border-radius:var(--radius);
    padding:2rem;
    text-align:center;
    position:relative;
    overflow:hidden;
    box-shadow:0 8px 32px hsl(158 64% 52% / 0.3);
}
.result-card::before{
    content:'';
    position:absolute;
    top:-50%;
    left:-50%;
    width:200%;
    height:200%;
    background:linear-gradient(45deg, transparent, rgba(255,255,255,0.1), transparent);
    transform:rotate(45deg);
    animation:shimmer 3s infinite;
}
.result-title{
    font-size:1.25rem;
    font-weight:700;
    margin-bottom:0.5rem;
}
.result-score{
    font-size:2.5rem;
    font-weight:700;
    margin-bottom:1rem;
    text-shadow:0 2px 4px rgba(0,0,0,0.1);
}
.result-formula{
    font-size:0.875rem;
    opacity:0.9;
    font-weight:500;
}
.search-filter-section{
    margin-bottom:2.5rem;
    padding:1.75rem;
    background:linear-gradient(135deg, var(--card) 0%, var(--muted) 100%);
    border-radius:var(--radius);
    border:1px solid var(--border);
}
.search-filter-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
    gap:1.5rem;
}
.data-container{
    display:grid;
    gap:1.75rem;
    animation:fadeInStagger 0.6s ease;
}
.data-card{
    background-color:var(--card);
    border:1px solid var(--border);
    border-radius:var(--radius);
    padding:1.75rem;
    transition:all 0.16s cubic-bezier(0.4, 0, 0.2, 1);
    position:relative;
    overflow:hidden;
    box-shadow:var(--shadow-sm);
    backdrop-filter:blur(4px);
    max-width:100%;
}
.data-card::before{
    content:'';
    position:absolute;
    top:0;
    left:-100%;
    width:100%;
    height:100%;
    background:linear-gradient(90deg, transparent, hsl(158 64% 52% / 0.05), transparent);
    transition:left 0.5s;
}
.data-card:hover::before{
    left:100%;
}
.data-card:hover{
    border-color:var(--primary);
    box-shadow:var(--shadow-lg);
    transform:translateY(-1px);
    background-color:hsl(222, 22%, 16%);
}
.data-card-title{
    font-size:1.25rem;
    font-weight:600;
    color:var(--primary);
    margin-bottom:0.75rem;
    line-height:1.4;
}
.data-card-subtitle{
    font-size:0.875rem;
    color:var(--accent);
    font-weight:500;
    margin-bottom:0.75rem;
    font-style:italic;
}
.data-card-meta{
    font-size:0.875rem;
    color:var(--muted-foreground);
    margin-bottom:0.75rem;
    font-weight:500;
}
.data-card-description{
    color:var(--muted-foreground);
    font-size:0.875rem;
    line-height:1.7;
    max-width:65ch;
}
.empty-state{
    text-align:center;
    padding:3rem 2rem;
    background:linear-gradient(135deg, var(--muted) 0%, transparent 100%);
}
.empty-state-hint{
    margin-top:0.75rem;
    font-size:0.8rem;
    color:var(--muted-foreground);
    font-style:italic;
}
.university-card{
    display:flex;
    flex-direction:column;
    gap:1rem;
}
.university-header{
    display:flex;
    flex-direction:column;
    gap:0.75rem;
}
.university-info{
    display:flex;
    flex-direction:column;
    gap:0.5rem;
}
.university-type{
    display:inline-block;
    padding:0.375rem 0.75rem;
    border-radius:calc(var(--radius) - 4px);
    font-size:0.75rem;
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:0.025em;
    margin-top:0.5rem;
}
.university-type.public{
    background-color:hsl(158 64% 52% / 0.15);
    color:hsl(158 64% 52%);
    border:1px solid hsl(158 64% 52% / 0.3);
}
.university-type.private{
    background-color:hsl(217 91% 60% / 0.15);
    color:hsl(217 91% 60%);
    border:1px solid hsl(217 91% 60% / 0.3);
}
.university-type.technical{
    background-color:hsl(25 95% 53% / 0.15);
    color:hsl(25 95% 53%);
    border:1px solid hsl(25 95% 53% / 0.3);
}
.university-type.military{
    background-color:hsl(60 9% 98% / 0.15);
    color:hsl(60 9% 98%);
    border:1px solid hsl(60 9% 98% / 0.3);
}
.university-divider{
    height:1px;
    background:linear-gradient(90deg, transparent, var(--border), transparent);
    margin:0.5rem 0;
}
.university-footer{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:1rem;
}
.university-region{
    font-size:0.875rem;
    color:var(--muted-foreground);
    font-weight:500;
}
.university-link{
    color:var(--primary);
    text-decoration:none;
    font-size:0.875rem;
    font-weight:600;
    transition:all 0.2s ease;
    padding:0.5rem 1rem;
    border-radius:calc(var(--radius) - 4px);
    border:1px solid transparent;
}
.university-link:hover{
    background-color:var(--primary);
    color:var(--primary-foreground);
    border-color:var(--primary);
    transform:scale(1.05);
}
.university-link.disabled{
    color:var(--muted-foreground);
    cursor:not-allowed;
    opacity:0.6;
}
.university-link.disabled:hover{
    background-color:transparent;
    color:var(--muted-foreground);
    border-color:transparent;
    transform:none;
}
.test-group{
    margin-bottom:3rem;
}
.test-group-title{
    font-size:1.5rem;
    font-weight:700;
    color:var(--primary);
    margin-bottom:1.5rem;
    padding-bottom:0.75rem;
    border-bottom:2px solid var(--primary);
    background:linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    background-clip:text;
}
.test-header{
    display:flex;
    justify-content:space-between;
    align-items:start;
    gap:1rem;
    margin-bottom:1rem;
}
.test-badge{
    padding:0.25rem 0.75rem;
    border-radius:calc(var(--radius) - 4px);
    font-size:0.75rem;
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:0.025em;
    white-space:nowrap;
}
.test-badge.approved{
    background-color:hsl(158 64% 52% / 0.15);
    color:var(--primary);
    border:1px solid hsl(158 64% 52% / 0.3);
}
.test-badge.additional{
    background-color:hsl(45 93% 47% / 0.15);
    color:hsl(45 93% 47%);
    border:1px solid hsl(45 93% 47% / 0.3);
}
.scholarship-card{
    background:var(--card);
    border:1px solid var(--border);
    transition:all 0.3s ease;
}
.scholarship-card:hover{
    border-color:var(--primary);
    box-shadow:var(--shadow-md);
}
.scholarship-group{
    margin-bottom:3rem;
}
.scholarship-group-title{
    font-size:1.5rem;
    font-weight:700;
    color:var(--primary);
    margin-bottom:1.5rem;
    padding-bottom:0.75rem;
    border-bottom:2px solid var(--primary);
    background:linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    background-clip:text;
}
.scholarship-header{
    margin-bottom:1rem;
}
.scholarship-info{
    display:flex;
    flex-direction:column;
    gap:0.75rem;
}
.scholarship-type{
    display:inline-block;
    padding:0.375rem 0.75rem;
    border-radius:calc(var(--radius) - 4px);
    font-size:0.875rem;
    font-weight:600;
    text-align:center;
    width:fit-content;
}
.external-badge{
    background-color:hsl(200, 100%, 60%, 0.1);
    color:hsl(200, 100%, 60%);
    border:1px solid hsl(200, 100%, 60%, 0.3);
}
.internal-badge{
    background-color:hsl(158, 64%, 52%, 0.1);
    color:hsl(158, 64%, 52%);
    border:1px solid hsl(158, 64%, 52%, 0.3);
}
.scholarship-divider{
    height:1px;
    background:linear-gradient(90deg, transparent 0%, var(--border) 50%, transparent 100%);
    margin:1rem 0;
}
.scholarship-requirements{
    margin-bottom:1.25rem;
}
.scholarship-requirements h4{
    font-size:1rem;
    font-weight:600;
    margin-bottom:1rem;
    color:var(--primary);
}
.requirements-list{
    list-style:none;
    margin:0;
    padding:0;
}
.requirements-list li{
    font-size:0.875rem;
    color:var(--muted-foreground);
    margin-bottom:0.75rem;
    line-height:1.5;
    padding-left:1rem;
    position:relative;
}
.requirements-list li::before{
    content:'✓';
    position:absolute;
    left:0;
    color:var(--primary);
    font-weight:bold;
}
.scholarship-footer{
    display:flex;
    justify-content:flex-end;
    padding-top:1rem;
    border-top:1px solid var(--border);
}
.footer{
    text-align:center;
    margin-top:4rem;
    padding-top:2rem;
    border-top:1px solid var(--border);
    animation:fadeIn 0.6s ease 0.3s both;
}
.footer-text{
    color:var(--muted-foreground);
    font-size:0.875rem;
    font-weight:500;
}
.footer-subtext{
    color:var(--muted-foreground);
    font-size:0.75rem;
    margin-top:0.5rem;
    opacity:0.8;
}

.copyright{
    margin-top:1.5rem;
    padding-top:1rem;
    border-top:1px solid var(--border);
}

.copyright-text{
    color:var(--muted-foreground);
    font-size:0.875rem;
    font-weight:500;
    text-align:center;
    animation:fadeIn 0.6s ease 0.5s both;
}

.copyright-text:hover{
    color:var(--primary);
    transition:color 0.3s ease;
}
.hidden{
    display:none;
}
.warning{
    color:var(--destructive);
}
@keyframes fadeIn{
    from{opacity:0}
    to{opacity:1}
}
@keyframes fadeInDown{
    from{
        opacity:0; 
        transform:translateY(-30px); 
    }
    to{
        opacity:1; 
        transform:translateY(0); 
    }
}
@keyframes fadeInUp{
    from{
        opacity:0; 
        transform:translateY(30px); 
    }
    to{
        opacity:1; 
        transform:translateY(0); 
    }
}
@keyframes slideInUp{
    from{
        opacity:0; 
        transform:translateY(50px); 
    }
    to{
        opacity:1; 
        transform:translateY(0); 
    }
}
@keyframes slideInRight{
    from{
        opacity:0; 
        transform:translateX(30px); 
    }
    to{
        opacity:1; 
        transform:translateX(0); 
    }
}
@keyframes pulse{
    0%, 100%{transform:scale(1)}
    50%{transform:scale(1.05)}
}
@keyframes shimmer{
    0%{transform:translateX(-100%) translateY(-100%) rotate(45deg)}
    100%{transform:translateX(100%) translateY(100%) rotate(45deg)}
}
@keyframes fadeInStagger{
    0%{opacity:0; transform:translateY(20px)}
    100%{opacity:1; transform:translateY(0)}
}
@keyframes waveTextFlow{
    0%, 100%{
        transform:translateY(0px) rotateZ(0deg) scale(1);
    }
    15%{
        transform:translateY(-12px) rotateZ(2deg) scale(1.02);
    }
    30%{
        transform:translateY(-6px) rotateZ(-1deg) scale(1.01);
    }
    45%{
        transform:translateY(-15px) rotateZ(1.5deg) scale(1.03);
    }
    60%{
        transform:translateY(-4px) rotateZ(-0.5deg) scale(1.01);
    }
    80%{
        transform:translateY(-10px) rotateZ(1deg) scale(1.02);
    }
}
@keyframes gradientFlow{
    0%, 100%{
        background-position:0% 50%;
        filter:hue-rotate(0deg) saturate(1.2);
    }
    25%{
        background-position:100% 25%;
        filter:hue-rotate(90deg) saturate(1.4);
    }
    50%{
        background-position:50% 100%;
        filter:hue-rotate(180deg) saturate(1.6);
    }
    75%{
        background-position:25% 0%;
        filter:hue-rotate(270deg) saturate(1.3);
    }
}
@keyframes textFade{
    0%{opacity:1}
    45%{opacity:1}
    55%{opacity:0}
    100%{opacity:0}
}
@keyframes textFadeIn{
    0%{opacity:0}
    45%{opacity:0}
    55%{opacity:1}
    100%{opacity:1}
}
@keyframes spin{
    0%{transform:rotate(0deg)}
    100%{transform:rotate(360deg)}
}
@keyframes textGlow{
    0%{
        text-shadow:0 0 5px hsl(158 64% 52% / 0.3);
        transform:scale(1);
    }
    100%{
        text-shadow:0 0 20px hsl(158 64% 52% / 0.6), 0 0 30px hsl(158 64% 52% / 0.4);
        transform:scale(1.02);
    }
}
@media (max-width:768px){
    .nav-buttons{
        flex-direction:column;
        gap:0.5rem;
    }
    .nav-button{
        width:100%;
        padding:1rem;
    }
    .calculator-grid,
    .search-filter-grid{
        grid-template-columns:1fr;
        gap:1.25rem;
    }
    .preset-buttons{
        grid-template-columns:1fr;
    }
    .action-buttons{
        flex-direction:column;
        width:100%;
        gap:1.5rem;
    }
    .btn-primary,
    .btn-secondary{
        width:100%;
        padding:1.125rem 2rem;
    }
    .container{
        padding:1.25rem;
    }
    .card{
        padding:1.75rem;
    }
    .logo{
        font-size:2rem;
    }
    .header{
        text-align:center;
        margin-bottom:1.5rem;
    }
    .logo{
        font-size:2.2rem;
        margin-bottom:0.75rem;
    }
    .university-header{
        text-align:center;
    }
    .university-footer{
        flex-direction:column;
        gap:0.75rem;
        align-items:center;
    }
    .scholarship-info{
        align-items:center;
        text-align:center;
    }
    .scholarship-footer{
        justify-content:center;
    }
    .test-header{
        flex-direction:column;
        align-items:start;
        gap:0.75rem;
    }
    .result-score{
        font-size:2rem;
    }
    .loading-logo-text{
        font-size:3rem;
    }
    .greeting-text{
        font-size:1.5rem;
    }
    .greeting-subtext{
        font-size:1rem;
    }
    .loading-subtitle{
        font-size:1.25rem;
    }
}
@media (min-width:640px){
    .action-buttons{
        flex-direction:row;
        justify-content:center;
    }
}
@media (min-width:1024px){
    .container{
        padding:2rem;
    }
    .card{
        padding:2.5rem;
    }
    .data-container{
        grid-template-columns:repeat(auto-fit, minmax(400px, 1fr));
        gap:2rem;
    }
}



/* shared brand style: SAME as loader */
.brand-shared{
  background: linear-gradient(45deg, 
    hsl(158, 64%, 52%), 
    hsl(200, 100%, 60%), 
    hsl(280, 100%, 65%), 
    hsl(320, 100%, 70%), 
    hsl(158, 64%, 52%));
  background-size: 300% 300%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: gradientFlow 3s ease-in-out infinite, pulse 2s ease-in-out infinite;
  font-weight: 700;
}

/* lock center to prevent visual drift */
#logo-text.brand-shared,
.hero .brand-shared{
  display: inline-block;
  transform-origin: center center;
  line-height: 1em;
  will-change: transform, filter, background-position;
  translate: 0 0;
}

/* hero lock: strip any inherited motion from containers */
.hero .logo,
#logo-text,
.hero .brand-shared{
  animation: none !important;
  transform: none !important;
  transition: none !important;
}

/* re-apply ONLY the loader-style animation on hero text */
.hero #logo-text.brand-shared,
.hero .brand-shared{
  animation: gradientFlow 3s ease-in-out infinite, pulse 2s ease-in-out infinite !important;
  transform-origin: center center;
  display: inline-block;
  line-height: 1em;
  translate: 0 0;
  backface-visibility: hidden;
  will-change: transform, filter, background-position;
  background-attachment: local;
  background-repeat: no-repeat;
}

@media (prefers-reduced-motion: reduce){
  /* Stop decorative animations for users who prefer less motion */
  .brand-shared{ animation: none !important; filter: none !important; text-shadow: none !important; }
  /* Keep loader fade timing; do NOT change loader visibility logic */
}

/* Bilingual Hero Title Animation - Matches mzksa.com Exactly */
.hero-brand {
  /* Parent uses grid for overlap; NO gradient here */
  display: grid;
  place-items: center;
  position: relative;
  line-height: 1.05;
  isolation: isolate;
  font-weight: 700;
  font-size: 2.5rem;
  margin-bottom: 1rem;
  overflow: visible;
  padding-bottom: 0.12em;
}

.hero-brand .label {
  /* Labels overlay via grid and carry static baseline lift */
  grid-area: 1/1;
  white-space: nowrap;
  pointer-events: none;
  overflow: visible;
  transform: translateY(-0.16em);
  will-change: transform, opacity;
  transition: opacity .35s ease;
}

/* CSS-only alternation: Arabic visible first */
.hero-brand .ar {
  opacity: 1;
  animation: heroSwap 7s linear infinite;
}
.hero-brand .en {
  opacity: 0;
  animation: heroSwap 7s linear infinite reverse;
}

@keyframes heroSwap {
  0%, 45% { opacity: 1; }
  50%, 95% { opacity: 0; }
  100% { opacity: 1; }
}

/* Pulse layer carries the glow and scale (center-based, no vertical drift) */
.hero-brand .label .pulse {
  display: inline-block;
  background: linear-gradient(45deg, 
    hsl(158, 64%, 52%), 
    hsl(200, 100%, 60%), 
    hsl(280, 100%, 65%), 
    hsl(320, 100%, 70%), 
    hsl(158, 64%, 52%));
  background-size: 300% 300%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  animation: gradientFlow 3s ease-in-out infinite, pulseScale 2s ease-in-out infinite;
  transform-origin: center center;
  will-change: background-position, transform;
}

@keyframes pulseScale {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.05); }
}

@media (prefers-reduced-motion: reduce) {
  .hero-brand .label { animation: none !important; opacity: 1 !important; }
  .hero-brand .label .pulse { animation: none !important; }
}

.tagline {
  color: var(--muted-foreground);
  font-size: 1.125rem;
  font-weight: 400;
  letter-spacing: 0.025em;
}

@media (max-width:768px){
  .gradient-glow {
    font-size: 2rem;
  }
}

/* Focus visibility for keyboard navigation & accessibility */
:where(a,button,[role="button"],[tabindex]:not([tabindex="-1"]),input,select,textarea):focus-visible{
  outline:2px dashed currentColor; outline-offset:2px; border-radius:.25rem;
}
:where(.btn,.chip,[data-focus]):focus-visible{ outline-offset:3px; }

/* ===== UX ENHANCEMENTS: INPUT ERGONOMICS & ACCESSIBILITY ===== */

/* Prevent iOS zoom on focus: ensure inputs have font-size ≥16px */
.input-field,
.btn-primary,
.btn-secondary,
.preset-chip {
  font-size: 16px;
  line-height: 1.5;
}

/* Touch targets: ensure minimum 44px height for comfortable tapping */
.input-field {
  min-height: 44px;
  padding: 0.75rem 1rem;
}

.btn-primary,
.btn-secondary {
  min-height: 44px;
  padding: 0.75rem 1.5rem;
}

.preset-chip {
  min-height: 44px;
  padding: 0.625rem 1rem;
}

/* Scroll margin to avoid inputs being hidden under fixed headers */
.input-field,
.btn-primary,
.btn-secondary {
  scroll-margin-top: 1rem;
}

/* Enhanced focus-visible for inputs (keyboard navigation) */
.input-field:focus-visible {
  outline: 3px solid var(--primary);
  outline-offset: 2px;
}

/* Screen-reader only content (validation feedback) */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

/* Respect reduced motion preferences */
@media (prefers-reduced-motion: reduce) {
  .input-field,
  .btn-primary,
  .btn-secondary {
    transition: none !important;
    animation: none !important;
  }
}

/* Mobile-specific: prevent layout shift when keyboard opens */
@media (max-width: 768px) {
  .input-field:focus {
    transform: none;
    scale: 1;
  }
}

/* Ensure labels are clickable and have comfortable spacing */
.input-label {
  cursor: pointer;
  display: block;
  margin-bottom: 0.5rem;
  user-select: none;
}

/* Hint message styling (inline validation feedback) */
.hint-message {
  color: #d32f2f;
  font-size: 0.85rem;
  margin-top: 0.25rem;
  margin-bottom: 0.5rem;
  padding: 0.375rem 0.5rem;
  border-radius: 0.25rem;
  background-color: rgba(211, 47, 47, 0.1);
  transition: opacity 0.3s ease, height 0.3s ease;
  max-width: 100%;
  line-height: 1.4;
}

.hint-message.hide {
  opacity: 0;
  height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

[data-theme="light"] .hint-message {
  background-color: rgba(211, 47, 47, 0.08);
}

/* Hide number input spinners (for weight inputs) */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type="number"] {
  -moz-appearance: textfield;
}