@font-face {
    font-family:Vazirmatn;
    src:url('/fonts/admin/Vazirmatn.woff2') format('woff2');
    font-weight:100 900;
    font-display:swap;
}

:root {
    --paper:#f4f7fb;
    --white:#fff;
    --ink:#142342;
    --blue:#1238a5;
    --muted:#52617b;
    --line:#d9e2ef;
    --lime:#d4ec80;
    --pale-blue:#e9effc;
    --danger:#9d2432;
    --radius:18px;
    --shadow:0 16px 45px #172c5810;
    color-scheme:light;
    font-family:Vazirmatn,Tahoma,sans-serif;
    color:var(--ink);
    background:var(--paper);
}

* {
    box-sizing:border-box;
}

html {
    scroll-padding-top:2rem;
}

body {
    margin:0;
    line-height:1.85;
    font-size:16px;
}

button,input,textarea,select {
    font:inherit;
}

a {
    color:inherit;
    text-decoration:none;
}

button,a,input,textarea {
    touch-action:manipulation;
    -webkit-tap-highlight-color:#1238a522;
}

a,button {
    transition:background-color .15s,color .15s,box-shadow .15s;
}

a:hover {
    color:var(--blue);
}

button {
    cursor:pointer;
}

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

h1,h2,h3,p {
    margin:0;
}

h1,h2,h3 {
    line-height:1.55;
    text-wrap:balance;
}

h1 {
    font-size:clamp(2rem,4vw,3.8rem);
    font-weight:850;
    letter-spacing:-.04em;
}

h2 {
    font-size:clamp(1.35rem,2.2vw,2rem);
    font-weight:750;
}

h3 {
    font-size:1.25rem;
}

p {
    overflow-wrap:anywhere;
}

input,textarea {
    min-width:0;
}

::selection {
    background:var(--lime);
    color:var(--ink);
}

:focus-visible {
    outline:3px solid var(--blue);
    outline-offset:4px;
    box-shadow:0 0 0 6px var(--lime);
}

.container {
    width:min(1160px,calc(100% - 2.5rem));
    margin-inline:auto;
}

.eyebrow {
    font-size:.85rem;
    font-weight:650;
    color:var(--blue);
    margin-block-end:.7rem;
}

.lead {
    font-size:1.08rem;
    color:var(--muted);
    max-width:54ch;
}

.number {
    direction:ltr;
    unicode-bidi:isolate;
    font-variant-numeric:tabular-nums;
    display:inline-block;
}

.fine-print,.field-help {
    font-size:.83rem;
    color:var(--muted);
}

.skip-link {
    position:fixed;
    z-index:50;
    inset-block-start:1rem;
    inset-inline-start:1rem;
    padding:.7rem 1rem;
    background:var(--white);
    border:2px solid var(--blue);
    transform:translateY(-180%);
}

.skip-link:focus {
    transform:translateY(0);
}

.site-header {
    background:var(--white);
    border-bottom:1px solid var(--line);
}

.header-inner {
    display:flex;
    align-items:center;
    gap:1rem;
    flex-wrap:wrap;
    padding-block:1.2rem;
}

.brand {
    display:flex;
    align-items:center;
    gap:.65rem;
    font-size:1.5rem;
    font-weight:850;
    line-height:1.4;
    margin-inline-end:auto;
}

.brand small {
    display:block;
    font-weight:450;
    font-size:.65rem;
    color:var(--muted);
}

.public-nav {
    display:flex;
    gap:1rem;
    flex-wrap:wrap;
    width:100%;
    order:3;
    font-size:.82rem;
}

.login-links {
    display:flex;
    gap:.65rem;
    flex-wrap:wrap;
}

.button {
    display:inline-flex;
    justify-content:center;
    align-items:center;
    gap:1rem;
    min-height:48px;
    border:1px solid var(--blue);
    border-radius:10px;
    background:var(--blue);
    color:var(--white);
    font-weight:650;
    padding:.65rem 1.4rem;
}

.button:hover {
    background:#092b86;
    color:white;
    box-shadow:0 4px 12px #1238a520;
}

.button-outline {
    background:transparent;
    color:var(--blue);
}

.button-outline:hover {
    background:var(--pale-blue);
    color:var(--blue);
}

.button-small {
    font-size:.88rem;
    padding:.45rem 1rem;
}

.text-link {
    text-decoration:underline;
    text-underline-offset:5px;
    font-size:.93rem;
    font-weight:600;
    color:var(--blue);
}

.text-link:hover {
    text-decoration-thickness:2px;
}

.quiet-button {
    background:none;
    border:0;
    color:var(--blue);
    padding:.6rem .4rem;
    min-height:44px;
    text-decoration:underline;
    text-underline-offset:4px;
}

.quiet-button:hover {
    background:var(--pale-blue);
}

.actions {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:1.3rem;
    margin-block:1.8rem;
}

.hero {
    padding-block:3rem 4rem;
    display:grid;
    gap:2.7rem;
}

.hero h1 {
    font-size:clamp(3rem,7vw,5rem);
    line-height:1.5;
    margin-block:.8rem 1.5rem;
}

.highlight {
    position:relative;
    z-index:0;
    white-space:nowrap;
}

.highlight:after {
    content:'';
    position:absolute;
    inset-inline:-.12em;
    inset-block-end:.16em;
    height:.35em;
    background:var(--lime);
    z-index:-1;
    border-radius:6px;
}

.ink-dot {
    display:inline-block;
    width:7px;
    height:7px;
    border-radius:50%;
    background:var(--blue);
    margin-inline-end:.4rem;
}

.curriculum-notebook {
    background:var(--white);
    border:1px solid var(--line);
    border-radius:24px;
    box-shadow:var(--shadow);
    padding:1.5rem;
    align-self:center;
    position:relative;
}

.notebook-top {
    display:flex;
    justify-content:space-between;
    gap:1rem;
    align-items:center;
    padding-bottom:1rem;
    border-bottom:1px solid var(--line);
    font-weight:700;
}

.notebook-tab {
    font-size:.7rem;
    color:var(--muted);
    font-weight:450;
}

.curriculum-path {
    list-style:none;
    margin:1.5rem 0;
    padding:0;
    position:relative;
}

.curriculum-path:before {
    content:'';
    position:absolute;
    inset-inline-start:10px;
    top:25px;
    bottom:25px;
    width:2px;
    background:var(--blue);
}

.curriculum-path li {
    position:relative;
    display:flex;
    align-items:center;
    gap:1.1rem;
    padding:.7rem 0;
}

.path-node {
    width:22px;
    height:22px;
    background:var(--white);
    border:2px solid var(--blue);
    border-radius:7px;
    flex-shrink:0;
}

.curriculum-path li:last-child .path-node {
    background:var(--lime);
}

.curriculum-path strong {
    display:block;
    font-size:1.3rem;
}

.curriculum-path small {
    font-size:.79rem;
    color:var(--muted);
}

.notebook-bottom {
    border-top:1px solid var(--line);
    padding-top:1rem;
}

.notebook-bottom p {
    font-size:.78rem;
    color:var(--muted);
}

.paper-label {
    display:block;
    color:var(--blue);
    font-size:.87rem;
    font-weight:600;
}

.capability-strip {
    background:var(--pale-blue);
    border-block:1px solid var(--line);
}

.capability-strip .container {
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:.6rem 1.5rem;
    padding-block:1.5rem;
}

.capability-strip p {
    font-weight:750;
    width:100%;
}

.capability-strip span {
    font-size:.82rem;
    color:var(--muted);
}

.section-block {
    padding-block:4rem;
}

.section-heading {
    max-width:700px;
    margin-bottom:2rem;
}

.section-heading p:last-child {
    color:var(--muted);
    margin-top:1rem;
}

.feature-rows {
    border-top:1px solid var(--line);
}

.feature-rows article {
    display:grid;
    grid-template-columns:40px 1fr;
    gap:1rem;
    padding:1.8rem 0;
    border-bottom:1px solid var(--line);
}

.feature-symbol {
    display:grid;
    place-items:center;
    background:var(--lime);
    color:var(--blue);
    width:40px;
    height:40px;
    border-radius:10px;
    font-size:1.6rem;
}

.feature-rows p {
    color:var(--muted);
    font-size:.94rem;
    margin-top:.5rem;
    max-width:70ch;
}

.feature-rows .text-link {
    grid-column:2;
}

.assessment-note {
    display:flex;
    flex-wrap:wrap;
    gap:1.5rem;
    align-items:center;
    background:var(--white);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:1.7rem;
}

.assessment-note>div {
    flex:1 1 320px;
}

.assessment-note h2 {
    margin-block:.8rem;
}

.assessment-note p {
    color:var(--muted);
    max-width:68ch;
}

.badge {
    display:inline-block;
    padding:.15rem .65rem;
    background:var(--pale-blue);
    color:var(--blue);
    border-radius:6px;
    font-size:.76rem;
    line-height:1.9;
}

.closing-block {
    padding-block:4rem 5rem;
    text-align:center;
}

.closing-block h2 {
    font-size:clamp(2rem,3.6vw,3rem);
}

.closing-block>p:not(.eyebrow) {
    color:var(--muted);
    margin:1.2rem auto;
    max-width:50ch;
}

.closing-block .button {
    margin-top:.5rem;
}

.site-footer {
    border-top:1px solid var(--line);
    background:var(--white);
    padding-block:2rem;
    padding-bottom:calc(2rem + env(safe-area-inset-bottom));
}

.footer-inner {
    display:flex;
    gap:1.5rem;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
}

.wordmark {
    font-size:1.4rem;
    font-weight:850;
    color:var(--blue);
}

.site-footer p {
    font-size:.8rem;
    color:var(--muted);
}

.site-footer nav {
    display:flex;
    gap:1.3rem;
    font-size:.85rem;
    flex-wrap:wrap;
}

.footer-note {
    width:100%;
}

.content-page {
    padding-block:3rem 5rem;
    max-width:820px;
    min-height:65vh;
}

.page-heading {
    margin-bottom:2.2rem;
}

.page-heading h1 {
    margin-bottom:.75rem;
}

.prose h2 {
    margin-block:2rem .7rem;
}

.prose p {
    color:var(--muted);
}

.prose+.button {
    margin-top:2rem;
}

.note-panel {
    background:var(--pale-blue);
    border-inline-start:3px solid var(--blue);
    border-radius:0 10px 10px 0;
    padding:1.5rem;
    margin-block:1.7rem;
}

.note-panel p {
    color:var(--muted);
    margin-block:.5rem 1rem;
}

.steps {
    list-style:none;
    counter-reset:steps;
    padding:0;
}

.steps li {
    counter-increment:steps;
    position:relative;
    padding:1.5rem 3.8rem 1.5rem 0;
    border-bottom:1px solid var(--line);
}

.steps li:before {
    content:counter(steps,persian);
    position:absolute;
    inset-inline-start:0;
    top:1.5rem;
    display:grid;
    place-items:center;
    width:40px;
    height:40px;
    background:var(--lime);
    color:var(--blue);
    border-radius:10px;
    font-weight:750;
}

.steps p {
    color:var(--muted);
    margin-top:.6rem;
}

.login-shell {
    display:grid;
    gap:2.5rem;
    padding-block:3rem 4.5rem;
    min-height:70vh;
}

.login-intro .lead {
    margin-block:1.2rem;
}

.login-intro>p:not(.eyebrow) {
    color:var(--muted);
    max-width:50ch;
}

.login-intro .text-link {
    display:inline-block;
    margin-top:1rem;
}

.login-panel {
    padding:1.6rem;
    background:var(--white);
    border:1px solid var(--line);
    border-radius:var(--radius);
    box-shadow:var(--shadow);
}

.form-stack {
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:.6rem;
    margin-block:1.3rem;
}

.form-stack label {
    font-size:.88rem;
    font-weight:650;
}

.form-stack input,.form-stack textarea {
    border:1px solid #9facbf;
    border-radius:9px;
    padding:.75rem .9rem;
    background:var(--white);
    color:var(--ink);
    width:100%;
}

.form-stack input {
    font-size:1.2rem;
    letter-spacing:.04em;
    min-height:52px;
}

.form-stack textarea {
    resize:vertical;
    min-height:150px;
}

.form-stack [aria-invalid=true] {
    border-color:var(--danger);
}

.form-stack .button {
    margin-top:.7rem;
    align-self:flex-start;
}

.login-panel .form-stack .button {
    width:100%;
}

.field-error {
    font-size:.85rem;
    color:var(--danger);
}

.login-secondary {
    display:flex;
    justify-content:space-between;
    gap:.8rem;
    flex-wrap:wrap;
    border-top:1px solid var(--line);
    padding-block:1rem;
}

.notice {
    background:var(--pale-blue);
    padding:1rem 1.2rem;
    border:1px solid var(--line);
    border-radius:10px;
    margin-block:1rem;
    overflow-wrap:anywhere;
}

.notice-error {
    background:#fff3f3;
    color:var(--danger);
    border-color:#e8b9bf;
}

.notice-error ul {
    margin-block:.3rem 0;
}

.dashboard-shell {
    display:grid;
    gap:1.5rem;
    padding-block:2rem 4rem;
    min-height:75vh;
}

.dashboard-nav {
    min-width:0;
}

.dashboard-nav nav {
    display:flex;
    flex-wrap:wrap;
    gap:.5rem;
}

.dashboard-nav nav a {
    background:var(--white);
    padding:.45rem .8rem;
    font-size:.86rem;
    border-radius:8px;
    border:1px solid var(--line);
    min-height:44px;
    display:flex;
    gap:1rem;
    align-items:center;
    justify-content:space-between;
}

.dashboard-nav nav a>span {
    display:none;
}

.dashboard-nav nav a[aria-current=page],.filter-links a[aria-current=page] {
    background:var(--blue);
    border-color:var(--blue);
    color:white;
}

.dashboard-nav form {
    margin-top:.5rem;
}

.dashboard-content {
    min-width:0;
}

.dashboard-content .page-heading h1 {
    font-size:clamp(1.9rem,3vw,2.7rem);
    overflow-wrap:anywhere;
}

.account-summary {
    background:var(--blue);
    color:white;
    border-radius:var(--radius);
    padding:1.6rem;
    display:flex;
    flex-wrap:wrap;
    gap:1.7rem;
    justify-content:space-between;
}

.account-summary .eyebrow {
    color:var(--lime);
}

.account-summary p:not(.balance) {
    font-size:.8rem;
    color:#d1dcfb;
}

.balance {
    display:flex;
    align-items:baseline;
    gap:.7rem;
    margin-block:.6rem;
}

.balance b {
    font-size:clamp(1.8rem,3vw,2.6rem);
    overflow-wrap:anywhere;
}

.balance span {
    font-size:.85rem;
}

.account-identity {
    display:grid;
    gap:.3rem;
    align-content:center;
}

.account-identity span {
    font-size:.76rem;
    color:#d1dcfb;
}

.account-identity bdi {
    font-size:1rem;
}

.account-identity time {
    font-size:.85rem;
}

.summary-grid {
    display:grid;
    gap:1rem;
    margin-block:1.3rem;
}

.summary-grid>div {
    padding:1.3rem;
    background:white;
    border:1px solid var(--line);
    border-radius:12px;
}

.summary-grid dt {
    font-size:.9rem;
}

.summary-grid dd {
    font-size:2rem;
    font-weight:750;
    margin:0;
    color:var(--blue);
}

.summary-grid .summary-help {
    font-size:.75rem;
    font-weight:400;
    margin-block-start:.75rem;
    color:var(--muted);
}

.panel {
    background:var(--white);
    border:1px solid var(--line);
    padding:1.5rem;
    border-radius:var(--radius);
    margin-block:1.5rem;
}

.panel h2 {
    font-size:1.2rem;
}

.activity-row {
    display:flex;
    justify-content:space-between;
    gap:1rem;
    padding-block:.8rem;
    border-bottom:1px solid var(--line);
}

.activity-row strong {
    color:var(--blue);
    font-size:1.15rem;
}

.panel .fine-print {
    margin-top:.8rem;
}

.dashboard-shortcuts {
    display:grid;
    gap:1rem;
}

.shortcut {
    background:white;
    border:1px solid var(--line);
    border-radius:12px;
    padding:1.4rem;
    position:relative;
    display:block;
}

.shortcut:hover {
    border-color:var(--blue);
}

.shortcut h2 {
    font-size:1.1rem;
}

.shortcut p {
    font-size:.85rem;
    color:var(--muted);
}

.shortcut>span {
    display:block;
    color:var(--blue);
    margin-top:.6rem;
}

.record-row {
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:1rem;
    padding:1.3rem;
    background:white;
    border:1px solid var(--line);
    border-radius:12px;
    margin-bottom:.85rem;
    content-visibility:auto;
    contain-intrinsic-size:auto 140px;
}

.record-body {
    flex:1 1 220px;
    min-width:0;
    overflow-wrap:anywhere;
}

.record-body h2 {
    font-size:1.1rem;
    margin-bottom:.35rem;
}

.record-body h3 {
    font-size:1rem;
}

.record-body p {
    color:var(--muted);
    font-size:.83rem;
}

.record-body .badge {
    margin-bottom:.5rem;
}

.record-body .text-link {
    display:inline-block;
    margin-top:.5rem;
}

.media-type {
    font-size:.75rem;
    background:var(--pale-blue);
    color:var(--blue);
    padding:.65rem;
    border-radius:8px;
}

.record-body .change-note {
    background:var(--pale-blue);
    padding:.6rem;
    border-radius:6px;
    margin-top:.6rem;
}

.section-link {
    display:inline-block;
    margin-bottom:1.5rem;
}

.empty-state {
    text-align:center;
    background:white;
    border:1px dashed #9facbf;
    border-radius:var(--radius);
    padding:2.5rem 1.4rem;
    margin-block:1rem;
}

.empty-state h2 {
    font-size:1.2rem;
}

.empty-state p {
    font-size:.9rem;
    color:var(--muted);
    max-width:55ch;
    margin:.7rem auto 1rem;
}

.empty-mark {
    display:block;
    color:var(--blue);
    font-size:2rem;
}

.pagination {
    display:flex;
    gap:1rem;
    justify-content:center;
    align-items:center;
    flex-wrap:wrap;
    margin-block:1.7rem;
    font-size:.88rem;
}

.list-toolbar {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:1rem;
    flex-wrap:wrap;
    margin-bottom:1.4rem;
}

.filter-links {
    display:flex;
    gap:.5rem;
    flex-wrap:wrap;
}

.filter-links a {
    padding:.4rem .75rem;
    border:1px solid var(--line);
    border-radius:7px;
    font-size:.85rem;
    min-height:44px;
    display:flex;
    align-items:center;
}

.support-history>h2 {
    font-size:1.25rem;
    margin-block:2rem 1rem;
}

.conversation {
    display:grid;
    gap:1rem;
}

.message {
    background:var(--white);
    padding:1.2rem;
    border:1px solid var(--line);
    border-radius:12px;
}

.message-support {
    background:var(--pale-blue);
    border-inline-start:3px solid var(--blue);
}

.message header {
    display:flex;
    gap:1rem;
    justify-content:space-between;
    flex-wrap:wrap;
    font-size:.8rem;
}

.message time {
    font-size:.75rem;
    color:var(--muted);
}

.message-body {
    white-space:pre-wrap;
    overflow-wrap:anywhere;
    margin-block:1rem;
}

.message .text-link {
    display:block;
    margin-block:.5rem;
}

[disabled] {
    cursor:wait;
    opacity:.7;
}

form[aria-busy="true"] .button::after {
    content:'';
    width:14px;
    height:14px;
    border:2px solid transparent;
    border-block-color:currentColor;
    border-radius:50%;
    animation:website-spin .7s linear infinite;
}

@keyframes website-spin {
    to { transform:rotate(360deg); }
}

@media(min-width:600px) {
    .summary-grid {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }
    .dashboard-shortcuts {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
    .capability-strip p {
        width:auto;
        margin-inline-end:auto;
    }
    .curriculum-notebook {
        padding:2rem;
    }
}

@media(min-width:900px) {
    .public-nav {
        display:flex;
        width:auto;
        order:0;
        gap:1.6rem;
        align-items:center;
        margin-inline-end:1rem;
        font-size:.88rem;
    }
    .public-nav a[aria-current=page] {
        text-decoration:underline;
        text-underline-offset:7px;
        color:var(--blue);
    }
    .hero {
        grid-template-columns:1.1fr .9fr;
        gap:5rem;
        padding-block:4rem 5rem;
    }
    .curriculum-notebook {
        transform:rotate(-2deg);
    }
    .feature-rows article {
        grid-template-columns:45px 1fr auto;
        align-items:center;
        gap:1.5rem;
    }
    .feature-rows .text-link {
        grid-column:auto;
    }
    .footer-note {
        width:auto;
    }
    .login-shell {
        grid-template-columns:1fr 420px;
        gap:5rem;
        align-items:center;
        padding-block:4.5rem;
    }
    .login-panel {
        padding:2rem;
    }
    .dashboard-shell {
        grid-template-columns:200px minmax(0,1fr);
        gap:2.5rem;
        padding-top:2.8rem;
    }
    .dashboard-nav nav {
        display:grid;
        gap:.5rem;
    }
    .dashboard-nav nav a {
        padding:.6rem 1rem;
    }
    .dashboard-nav nav a>span {
        display:inline;
    }
    .dashboard-nav .eyebrow {
        margin-bottom:1rem;
    }
    .dashboard-nav form {
        margin-top:1.3rem;
    }
}

@media(max-width:380px) {
    .container {
        width:calc(100% - 1.5rem);
    }
    .brand {
        font-size:1.25rem;
    }
    .header-inner>.button,
    .login-links .button {
        padding-inline:.65rem;
        font-size:.8rem;
    }
    .hero h1 {
        font-size:2.8rem;
    }
    .curriculum-notebook {
        padding:1.2rem;
    }
    .account-summary {
        padding:1.2rem;
    }
    .record-row {
        padding:1rem;
    }
}

@media(prefers-reduced-motion:reduce) {
    *,*:before,*:after {
        transition:none!important;
        animation:none!important;
        scroll-behavior:auto!important;
    }
}
