@font-face{font-family:Tajawal;src:url("fonts/Tajawal-Arabic-Regular.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:Tajawal;src:url("fonts/Tajawal-Latin-Regular.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Tajawal;src:url("fonts/Tajawal-Arabic-Medium.woff2") format("woff2");font-style:normal;font-weight:500;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:Tajawal;src:url("fonts/Tajawal-Latin-Medium.woff2") format("woff2");font-style:normal;font-weight:500;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Tajawal;src:url("fonts/Tajawal-Arabic-Bold.woff2") format("woff2");font-style:normal;font-weight:700;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:Tajawal;src:url("fonts/Tajawal-Latin-Bold.woff2") format("woff2");font-style:normal;font-weight:700;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Tajawal;src:url("fonts/Tajawal-Arabic-ExtraBold.woff2") format("woff2");font-style:normal;font-weight:800;font-display:swap;unicode-range:U+0600-06FF,U+0750-077F,U+0870-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:Tajawal;src:url("fonts/Tajawal-Latin-ExtraBold.woff2") format("woff2");font-style:normal;font-weight:800;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{--burgundy:#7b1e36;--burgundy-dark:#64162c;--burgundy-soft:#f7e9ed;--gray-900:#303238;--gray-700:#62656c;--gray-500:#898c92;--gray-300:#d8d9dc;--gray-200:#e9e9eb;--white:#fff;--shadow:0 16px 42px rgba(41,39,42,.08)}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;min-height:100vh;background:#fafafa;color:var(--gray-900);font-family:Tajawal,"Segoe UI",Tahoma,Arial,sans-serif;font-weight:400}
.site-header{height:76px;display:flex;align-items:center;background:#fff;border-bottom:1px solid var(--gray-200);padding-inline:clamp(18px,4vw,64px)}
.brand{display:flex;align-items:center;gap:10px;color:var(--burgundy-dark);font-size:18px;font-weight:750;text-decoration:none}
.brand-logo{width:44px;height:44px;display:block;flex:none;object-fit:contain;border-radius:50%;background:#fff}
.brand-muted{color:var(--gray-700);font-weight:500}
.draw-page{width:100%;min-height:calc(100vh - 76px);padding:clamp(16px,3vh,30px) clamp(16px,4vw,64px)}
.draw-panel{width:100%;min-height:calc(100vh - 108px);padding:clamp(24px,3.5vw,52px);border:1px solid var(--gray-200);border-radius:9px;background:#fff;box-shadow:var(--shadow)}
.panel-heading{text-align:center;margin-bottom:30px}
.eyebrow{margin:0 0 8px;color:var(--burgundy);font-size:20px;font-weight:750}
.panel-heading h1{margin:0;color:var(--gray-900);font-size:clamp(27px,3vw,40px);font-weight:800;line-height:1.4}
#drawForm{display:flex;flex-direction:column;width:min(100%,980px);margin-inline:auto}
.field-label{display:block;margin:0 0 9px;font-size:15px;font-weight:700}
.text-input,.duration-input{height:48px;border:1px solid var(--gray-300);border-radius:6px;background:#fff;color:var(--gray-900);font:inherit}
.text-input{width:100%;padding:0 14px;outline:none}
.text-input:focus,.duration-input:focus-within{border-color:var(--burgundy);box-shadow:0 0 0 3px var(--burgundy-soft)}
.file-label{margin-top:22px}
.upload-box{position:relative;min-height:125px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;border:1.5px dashed #c8a3ad;border-radius:7px;background:#fcf9fa;text-align:center;cursor:pointer;transition:background .18s,border-color .18s}
.upload-box:hover,.upload-box.dragging{background:var(--burgundy-soft);border-color:var(--burgundy)}
.upload-box.loaded{border-style:solid;border-color:#9b6a79;background:#fdfafb}
.upload-box input{position:absolute;width:1px;height:1px;overflow:hidden;opacity:0;clip:rect(0,0,0,0);white-space:nowrap}
.upload-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:var(--burgundy-soft);color:var(--burgundy);font-size:23px;font-weight:600}
.upload-title{max-width:100%;padding:0 14px;font-size:15px;font-weight:700;overflow-wrap:anywhere}
.upload-hint,.file-status{color:var(--gray-500);font-size:13px}
.file-status{min-height:19px;margin:9px 0 18px}
.settings-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.number-input{appearance:textfield}
.number-input::-webkit-inner-spin-button,.number-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.duration-input{display:flex;align-items:center;gap:8px;padding:0 14px}
.duration-input input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--gray-900);font:inherit}
.duration-input span{color:var(--gray-500);font-size:13px;white-space:nowrap}
.draw-button{height:50px;margin-top:24px;border:0;border-radius:6px;background:var(--burgundy);color:#fff;font:inherit;font-size:16px;font-weight:750;cursor:pointer;transition:background .15s,transform .15s}
.draw-button:hover:not(:disabled){transform:translateY(-1px);background:var(--burgundy-dark)}
.draw-button:disabled{opacity:.48;cursor:not-allowed}
.draw-button span{margin-left:8px}
.privacy-note{margin:12px 0 0;color:var(--gray-500);font-size:12px;text-align:center}
.results{width:100%;margin-top:30px;padding-top:24px;border-top:1px solid var(--gray-200)}
.results[hidden]{display:none}
.results-heading{margin-bottom:18px;text-align:center}
.results-heading h2{margin:0;font-size:clamp(21px,2.4vw,30px);overflow-wrap:anywhere}
.draw-balls{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));justify-items:center;gap:20px;padding:8px 0 14px}
.draw-ball{display:grid;justify-items:center;gap:9px;animation:ball-bounce .55s ease-in-out infinite alternate}
.draw-ball:nth-child(2n){animation-delay:.12s}.draw-ball:nth-child(3n){animation-delay:.24s}
.draw-ball-number{width:82px;aspect-ratio:1;display:grid;place-items:center;border:5px solid #fff;border-radius:50%;background:radial-gradient(circle at 32% 26%,#b65a70,#8b2942 44%,#64162c);box-shadow:0 0 0 2px #8c3048,0 9px 20px rgba(100,22,44,.2);color:#fff;font-size:25px;font-weight:800;font-variant-numeric:tabular-nums}
.draw-ball-caption{color:var(--gray-500);font-size:12px}
.toast{position:fixed;bottom:22px;left:50%;z-index:5;transform:translate(-50%,12px);opacity:0;pointer-events:none;padding:12px 18px;border-radius:5px;background:var(--gray-900);color:#fff;font-size:14px;transition:opacity .2s,transform .2s}
.toast.show{transform:translate(-50%,0);opacity:1}
@keyframes ball-bounce{from{transform:translateY(0) scale(1)}to{transform:translateY(-5px) scale(1.035)}}
@keyframes winner-arrive{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(prefers-reduced-motion:reduce){.draw-ball,.winner-list .winner-row{animation:none}}
@media(max-width:600px){.panel-heading{margin-bottom:24px}.panel-heading h1{font-size:22px}.field-label{font-size:14px}.settings-row{gap:11px}.upload-box{min-height:120px}.winner-list:not(.draw-balls){grid-template-columns:1fr;gap:10px}.winner-list:not(.draw-balls) .winner-row{min-height:92px;padding:13px 16px}.winner-list:not(.draw-balls) .winner-number{width:62px;height:62px;font-size:20px}.draw-balls{grid-template-columns:repeat(auto-fit,minmax(78px,1fr));gap:12px}.draw-ball-number{width:66px;font-size:20px}}