
:root{
  --blue:#143d73;--blue2:#0d5ea6;--green:#19a650;--green2:#36c46d;
  --gold:#f5bc28;--text:#1d2b3a;--muted:#647487;--bg:#f5f9fd;--card:#fff;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,'Segoe UI',Tahoma,sans-serif;background:linear-gradient(180deg,#fff,#f5f9fd);color:var(--text);direction:rtl}
a{text-decoration:none;color:inherit}
.topbar{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.96);backdrop-filter:blur(10px);border-bottom:1px solid #e6eef7}
.topbar-inner{max-width:1150px;margin:auto;padding:13px 20px;display:flex;align-items:center;justify-content:space-between;gap:15px}
.brand{font-weight:900;color:var(--blue);font-size:19px}.brand span{color:var(--green)}
.back{padding:9px 16px;border:1px solid #d9e5f0;border-radius:999px;color:var(--blue);font-weight:800;background:#fff}
.hero-tool{padding:58px 20px 36px;text-align:center;background:
 radial-gradient(circle at 88% 10%,rgba(245,188,40,.17),transparent 25%),
 radial-gradient(circle at 10% 15%,rgba(25,166,80,.12),transparent 28%)}
.hero-tool .emoji{font-size:48px}
.hero-tool h1{font-size:clamp(30px,4vw,48px);color:var(--blue);margin:8px 0 9px}
.hero-tool p{max-width:780px;margin:auto;color:var(--muted);font-size:18px;line-height:1.7}
.container{max-width:1080px;margin:0 auto;padding:25px 20px 70px}
.panel{background:#fff;border:1px solid #e5edf5;border-radius:26px;box-shadow:0 14px 40px rgba(20,61,115,.08);padding:26px;margin-bottom:22px}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
label{display:block;font-weight:800;color:var(--blue);margin-bottom:7px}
input,select,textarea{width:100%;border:1px solid #ccd9e6;border-radius:14px;padding:12px 13px;font-size:16px;font-family:inherit;background:#fff}
input:focus,select:focus,textarea:focus{outline:3px solid rgba(13,94,166,.12);border-color:var(--blue2)}
small.help{display:block;color:var(--muted);margin-top:5px}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
button,.btn{border:0;border-radius:999px;padding:13px 24px;font:800 16px inherit;cursor:pointer}
.primary{background:linear-gradient(135deg,var(--green),var(--green2));color:#fff;box-shadow:0 10px 24px rgba(25,166,80,.22)}
.secondary{background:#eef5fb;color:var(--blue)}
.result{display:none;margin-top:25px;background:linear-gradient(135deg,#f0fff5,#f4f9ff);border:1px solid #dbece2;border-radius:22px;padding:22px}
.result.show{display:block}
.result h2{margin:0 0 10px;color:var(--blue)}
.big-score{font-size:48px;font-weight:900;color:var(--green);line-height:1}
.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}
.metric{background:#fff;border-radius:16px;padding:14px;border:1px solid #e5edf5;text-align:center}
.metric b{display:block;font-size:23px;color:var(--blue)}.metric span{font-size:14px;color:var(--muted)}
.notice{border-right:5px solid var(--gold);background:#fff9e9;border-radius:15px;padding:13px 16px;color:#655528;margin:14px 0}
.good{color:#138b42}.warn{color:#b57a00}.bad{color:#c0392b}
.checklist{display:grid;gap:10px}
.check-item{display:flex;gap:10px;align-items:flex-start;padding:12px;border:1px solid #e5edf5;border-radius:14px;background:#fff}
.check-item input{width:auto;margin-top:4px;transform:scale(1.25)}
table{width:100%;border-collapse:collapse;background:#fff;border-radius:16px;overflow:hidden}
th,td{padding:11px;border-bottom:1px solid #e8eef4;text-align:right}th{background:#eef5fb;color:var(--blue)}
.row-actions{text-align:left}
.footer-cta{margin-top:25px;text-align:center;background:linear-gradient(135deg,var(--blue),var(--blue2));color:#fff;border-radius:24px;padding:25px}
.footer-cta h3{margin:0 0 8px}.footer-cta p{margin:0 0 16px;opacity:.9}
.footer-cta .btn{display:inline-block;background:#fff;color:var(--blue)}
@media(max-width:760px){.grid,.grid3,.metrics{grid-template-columns:1fr}.panel{padding:18px}.topbar-inner{padding:10px 14px}}
@media print{.topbar,.actions,.footer-cta,.back{display:none!important}.panel{box-shadow:none}.container{max-width:none}.result{display:block!important}}
