[x-cloak] { display: none !important; }
body { font-family: 'Tajawal', sans-serif; }
fieldset { min-width: 0; }
.page-entrance { animation: page-enter .55s ease-out both; }
.login-brand { background-image: radial-gradient(circle at 50% 35%, #087655 0%, #064e3b 70%); }
.login-logo-wrap { display: flex; justify-content: center; }
.login-logo { width: clamp(140px, 42vw, 220px); height: auto; aspect-ratio: 1; border-radius: 50%; border: 4px solid rgba(255, 255, 255, .85); box-shadow: 0 12px 35px rgba(0, 0, 0, .2), 0 0 0 8px rgba(255, 255, 255, .08); animation: logo-enter .8s ease-out both, logo-float 5s ease-in-out 1s infinite; }
@keyframes page-enter { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
@keyframes logo-enter { from { opacity: 0; transform: scale(.88); } to { opacity: 1; transform: scale(1); } }
@keyframes logo-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@media (prefers-reduced-motion: reduce) { .page-entrance, .login-logo { animation: none; } }
.field-label { display: block; margin-bottom: .5rem; font-size: .875rem; font-weight: 700; color: #334155; }
.field-input { display: block; width: 100%; border: 1px solid #cbd5e1; border-radius: .75rem; background: #fff; padding: .75rem; color: #0f172a; outline: none; }
.field-input:focus { border-color: #047857; box-shadow: 0 0 0 3px #d1fae5; }
.choice { display: inline-flex; align-items: center; gap: .5rem; font-size: .875rem; color: #334155; }
.choice input { accent-color: #047857; }
.question-row { display: grid; gap: 1rem; border-bottom: 1px solid #f1f5f9; padding-bottom: 1.25rem; }
@media (min-width: 640px) { .question-row { grid-template-columns: 1fr 1fr; } }
.button-primary, .button-secondary { display: inline-flex; align-items: center; justify-content: center; border-radius: .75rem; padding: .75rem 1.25rem; font-size: .875rem; font-weight: 700; transition: background .15s; }
.button-primary { background: #047857; color: white; }
.button-primary:hover { background: #065f46; }
.button-secondary { border: 1px solid #cbd5e1; background: white; color: #065f46; }
.button-secondary:hover { background: #ecfdf5; }
button:not(:disabled), .button-secondary { transition: transform .15s ease, background .15s ease; }
button:not(:disabled):active, .button-secondary:active { transform: scale(.97); }
.button-spinner { display: inline-block; width: 1rem; height: 1rem; margin-inline-end: .5rem; border: 2px solid currentColor; border-inline-end-color: transparent; border-radius: 50%; animation: spinner-rotate .7s linear infinite; }
@keyframes spinner-rotate { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { button:not(:disabled), .button-secondary { transition: none; } button:not(:disabled):active, .button-secondary:active { transform: none; } .button-spinner { animation: none; border-style: dotted; } }
button:disabled { cursor: not-allowed; opacity: .5; }
.alert-error { border: 1px solid #fecaca; border-radius: .75rem; background: #fef2f2; padding: 1rem; color: #991b1b; font-size: .875rem; }
.report { color: #111827; font-size: 13px; }
.report-header { display: flex; align-items: center; justify-content: center; gap: 1.5rem; border-bottom: 2px solid #065f46; padding-bottom: 1rem; text-align: center; font-weight: 700; }
.report-header img { width: 90px; height: 90px; object-fit: contain; }
.report-header h1 { margin: .4rem 0; font-size: 1.4rem; color: #065f46; }
.report-english { margin-top: .5rem; font-size: 10px; font-weight: 400; }
.report-intro { margin: 1rem 0; line-height: 1.7; }
.report-section { margin-top: 1rem; }
.report-section h2 { margin-bottom: .5rem; background: #e8f4ee; padding: .45rem; color: #064e3b; font-weight: 700; }
.report-section h2 span { display: block; font-size: 10px; direction: ltr; text-align: right; }
.report-section p { margin: .5rem 0; line-height: 1.6; }
.report table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.report th, .report td { border: 1px solid #9ca3af; padding: .4rem; text-align: right; vertical-align: top; overflow-wrap: anywhere; white-space: pre-wrap; }
.report th { font-weight: 700; }
.report tr { break-inside: avoid; }
.signature-space { height: 3rem; }
.stamp-space { margin-top: 1rem; margin-right: auto; width: 220px; min-height: 100px; border: 1px dashed #64748b; padding: .5rem; text-align: center; }
@media screen and (max-width: 480px) {
    .report-header { flex-direction: column; gap: .75rem; }
    .report-header img { width: 70px; height: 70px; }
    .report th, .report td { padding: .3rem; }
    .stamp-space { max-width: 100%; }
}
@page { size: A4; margin: 12mm; }
@media print {
    .page-entrance { animation: none; transform: none; }
    .no-print { display: none !important; }
    body { background: white !important; }
    main { max-width: none !important; padding: 0 !important; }
    .report { max-width: none !important; padding: 0 !important; box-shadow: none !important; font-size: 10pt; }
    .report-section h2 { break-after: avoid; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
    .report-header img { width: 65px; height: 65px; }
}