:root{
  --ink:#10130f;--muted:#667067;--paper:#f7f7f3;--white:#fff;--green:#0b4f34;--green2:#0d6b45;--lime:#d8e8b8;--line:#dfe3dc;--accent:#214dff;--orange:#f17b34;
  --radius:24px;--shadow:0 18px 55px rgba(16,19,15,.08)
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",system-ui,sans-serif}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}
.site-header{height:82px;padding:0 clamp(20px,5vw,80px);display:flex;align-items:center;justify-content:space-between;background:rgba(247,247,243,.88);backdrop-filter:blur(18px);position:sticky;top:0;z-index:20;border-bottom:1px solid rgba(223,227,220,.7)}
.brand{display:flex;align-items:center;gap:10px;font-weight:600;font-size:17px;white-space:nowrap}.brand b{font-family:Manrope;font-weight:800}.brand-mark{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--green);overflow:hidden;flex:none;box-shadow:0 3px 12px rgba(11,79,52,.14)}.brand-mark img{width:31px;height:24px;object-fit:contain;display:block;filter:brightness(0) invert(1)}.desktop-nav{display:flex;gap:34px;font-size:14px;color:#495048}.desktop-nav a:hover{color:var(--green)}
.header-actions{display:flex;align-items:center;gap:14px}.lang-toggle{display:flex;background:#ecefe9;border-radius:999px;padding:3px}.lang-toggle button{border:0;background:transparent;border-radius:999px;padding:9px 13px;color:#657064;cursor:pointer;font-size:12px}.lang-toggle button.active{background:var(--white);color:var(--ink);box-shadow:0 2px 8px #00000012}.login-link{font-size:14px}
.btn{border:0;border-radius:999px;padding:14px 20px;font-weight:700;display:inline-flex;gap:10px;align-items:center;justify-content:center;cursor:pointer;transition:.2s transform,.2s box-shadow}.btn:hover{transform:translateY(-2px)}.btn-primary{background:var(--green);color:#fff;box-shadow:0 8px 22px rgba(11,79,52,.2)}.btn-dark{background:var(--ink);color:#fff}.btn-ghost{background:#fff;border:1px solid var(--line)}.btn-outline{background:transparent;border:1px solid var(--line)}.btn-sm{padding:10px 16px;font-size:13px}.full{width:100%}
.hero{min-height:calc(100vh - 82px);display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:5vw;padding:70px clamp(24px,8vw,140px);overflow:hidden}.eyebrow,.section-kicker{font-size:11px;font-weight:800;letter-spacing:.17em;color:var(--green2)}h1,h2,h3{font-family:Manrope,sans-serif}.hero h1{font-size:clamp(48px,6.2vw,90px);line-height:.98;letter-spacing:-.055em;margin:18px 0 24px}.hero h1 span{color:var(--green2)}.hero-lead{font-size:18px;line-height:1.7;max-width:650px;color:#5c665d}.hero-ctas{display:flex;gap:12px;margin:30px 0 38px;flex-wrap:wrap}.verse{font-size:14px;line-height:1.7;max-width:630px;padding-left:16px;border-left:2px solid var(--green2)}.verse small{color:var(--green2);font-weight:700}.hero-art{position:relative;min-height:570px;display:grid;place-items:center}.art-ring{width:min(500px,42vw);aspect-ratio:1;border-radius:50%;padding:14px;background:conic-gradient(from 20deg,#0b4f34,#d6e8b5,#0b4f34,#d6e8b5,#0b4f34);box-shadow:0 35px 90px rgba(11,79,52,.18)}.art-inner{width:100%;height:100%;border-radius:50%;display:grid;place-items:center;align-content:center;text-align:center;background:radial-gradient(circle at 50% 50%,#fff 0 54%,#eef3e8 55% 100%);border:5px solid var(--green);overflow:hidden}.hero-logo{width:72%;height:auto;max-height:72%;object-fit:contain;display:block}.art-caption{font-size:11px;letter-spacing:.2em;font-weight:800;color:#253329}.floating-card{position:absolute;bottom:60px;left:4%;background:#fff;padding:14px 18px;border-radius:18px;box-shadow:var(--shadow);display:flex;align-items:center;gap:10px;font-size:13px}.floating-card span{width:34px;height:34px;display:grid;place-items:center;background:var(--lime);border-radius:50%;font-family:"Noto Naskh Arabic";font-size:20px}.floating-card b{font-size:12px}
.intro{padding:110px clamp(24px,9vw,150px);display:grid;grid-template-columns:1fr 1fr;gap:10vw;background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.intro h2,.section-head h2{font-size:clamp(38px,4.5vw,62px);line-height:1.02;letter-spacing:-.045em;margin:14px 0}.intro h2 em{font-style:normal;color:var(--green2)}.intro p{font-size:18px;line-height:1.8;color:var(--muted);max-width:580px;margin-top:35px}
.explore,.featured{padding:110px clamp(24px,8vw,140px)}.section-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:42px}.search{background:#fff;border:1px solid var(--line);border-radius:999px;padding:4px 17px;display:flex;align-items:center;gap:8px;width:min(340px,100%)}.search span{font-size:25px}.search input{border:0;outline:0;background:transparent;padding:10px;width:100%;font-size:13px}.category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.category-card{min-height:390px;padding:28px;border-radius:var(--radius);background:#fff;border:1px solid var(--line);position:relative;display:flex;flex-direction:column;transition:.25s transform,.25s box-shadow}.category-card:hover{transform:translateY(-7px);box-shadow:var(--shadow)}.dark-card{background:#fff;color:var(--ink);border-color:var(--line)}.cat-icon{height:145px;border-radius:18px;background:#edf1e9;display:grid;place-items:center;color:var(--green);font-family:"Noto Naskh Arabic";font-size:74px;margin-bottom:25px}.audio-icon{font-family:Manrope;font-size:70px;color:var(--orange)}.book-icon{font-family:Manrope;font-size:64px}.number{font-size:11px;letter-spacing:.12em;opacity:.6}.category-card h3{font-size:25px;margin:10px 0 8px}.category-card h3 small{font:inherit;font-size:14px;opacity:.7}.category-card p{color:#667067;line-height:1.55;font-size:14px;margin:0}.arrow{margin-top:auto;font-size:22px;align-self:flex-end}.featured{background:#f0f2eb}.text-link{font-weight:700;color:var(--green);font-size:14px}.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.post-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:25px;min-height:240px}.post-meta{display:flex;justify-content:space-between;color:#748077;font-size:11px;text-transform:uppercase;letter-spacing:.08em}.post-card h3{font-size:23px;line-height:1.15;margin:18px 0 12px}.post-card p{color:#687269;line-height:1.6;font-size:14px}.post-author{margin-top:25px;font-size:12px;color:var(--green);font-weight:700}
.contribute{margin:0 clamp(20px,6vw,100px) 110px;background:var(--lime);border-radius:32px;padding:70px clamp(30px,7vw,100px);display:grid;grid-template-columns:.7fr 1.3fr;align-items:center;gap:50px}.contribute h2{font-size:clamp(38px,4vw,60px);line-height:1.02;margin:14px 0}.contribute p{color:#4f5b51;line-height:1.7;max-width:650px}.contribute-art{height:250px;border-radius:50%;background:radial-gradient(circle,#fff 0 13%,transparent 14%),repeating-conic-gradient(#0b4f34 0 4deg,#d6e8b5 4deg 8deg);display:grid;place-items:center;max-width:250px;aspect-ratio:1;margin:auto}.mini-orbit{width:80px;height:80px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-size:30px}
.footer{background:var(--ink);color:#fff;padding:50px clamp(24px,7vw,120px)}.footer-top{display:flex;justify-content:space-between;gap:30px;align-items:center;padding-bottom:40px;border-bottom:1px solid #ffffff20}.footer-top p{color:#a9b3aa}.footer-bottom{display:flex;justify-content:space-between;gap:20px;padding-top:25px;color:#8e9990;font-size:12px}.footer-brand{color:#fff}
.auth-page{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 15% 15%,#dfecc8,transparent 35%),var(--paper)}.auth-shell{width:min(470px,92vw)}.auth-shell>.brand{margin-bottom:25px}.auth-card{background:#fff;border:1px solid var(--line);border-radius:28px;padding:38px;box-shadow:var(--shadow)}.auth-card h1{font-size:48px;letter-spacing:-.05em;margin:10px 0}.auth-card>p{color:var(--muted);line-height:1.6;margin-bottom:28px}.auth-card form{display:grid;gap:15px}.auth-card label,.panel label{font-size:12px;font-weight:700;color:#495149;display:grid;gap:7px}.auth-card input,.panel input,.panel textarea,.panel select{width:100%;border:1px solid var(--line);border-radius:13px;padding:12px 13px;outline:0;background:#fbfcf9}.auth-card input:focus,.panel input:focus,.panel textarea:focus,.panel select:focus{border-color:var(--green)}.auth-switch{text-align:center;margin-top:22px;color:var(--muted);font-size:13px}.auth-switch a{color:var(--green);font-weight:700}.form-msg{font-size:13px;color:#b3261e;min-height:18px}.user-name{font-size:13px;font-weight:700}
.dashboard,.library{max-width:1240px;margin:auto;padding:70px 24px 100px}.dash-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:45px}.dash-head h1,.library h1{font-size:clamp(48px,6vw,80px);line-height:1;margin:12px 0}.dash-head p,.library-hero p{color:var(--muted);font-size:17px}.dash-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.panel{background:#fff;border:1px solid var(--line);border-radius:25px;padding:30px}.panel h2{font-size:28px;margin:0 0 24px}.panel form{display:grid;gap:15px}.panel textarea{resize:vertical}.muted{color:var(--muted);font-size:13px;line-height:1.6}.security-note{margin-top:25px;padding:15px;border-radius:15px;background:#eef4e6;display:grid;gap:4px;font-size:12px;color:#526052}.library-hero{padding:25px 0 55px}.library-hero h1{max-width:800px}.filter-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:30px}.filter{border:1px solid var(--line);background:#fff;border-radius:999px;padding:10px 16px;cursor:pointer}.filter.active{background:var(--green);color:#fff;border-color:var(--green)}.resource-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.resource-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px}.resource-type{display:inline-flex;padding:6px 9px;border-radius:999px;background:#edf2e9;color:var(--green);font-size:10px;font-weight:800;text-transform:uppercase}.resource-card h3{font-size:22px;line-height:1.15}.resource-card p{color:var(--muted);font-size:13px;line-height:1.6}.resource-card audio{width:100%;margin-top:12px}.resource-card .download{display:inline-flex;margin-top:12px;color:var(--green);font-size:13px;font-weight:800}.library-posts{margin-top:100px}.loading{padding:35px;background:#fff;border-radius:20px;color:var(--muted);text-align:center;grid-column:1/-1}
@media(max-width:1050px){.category-grid{grid-template-columns:repeat(2,1fr)}.hero{grid-template-columns:1fr}.hero-art{min-height:430px}.art-ring{width:min(460px,70vw)}.post-grid,.resource-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.site-header{height:auto;min-height:72px;gap:12px;padding:13px 18px}.desktop-nav,.login-link{display:none}.header-actions{margin-left:auto}.hero{padding:55px 22px 75px;min-height:auto}.hero h1{font-size:51px}.hero-lead{font-size:16px}.hero-art{min-height:360px}.art-ring{width:300px}.intro{grid-template-columns:1fr;padding:75px 24px;gap:10px}.explore,.featured{padding:75px 22px}.section-head{align-items:start;flex-direction:column}.search{width:100%}.category-grid,.post-grid,.resource-grid,.dash-grid{grid-template-columns:1fr}.category-card{min-height:330px}.contribute{grid-template-columns:1fr;padding:45px 28px;margin:0 18px 70px}.contribute-art{height:190px}.footer-top,.footer-bottom,.dash-head{flex-direction:column;align-items:start}.dashboard,.library{padding-top:45px}.auth-card{padding:28px 22px}.auth-card h1{font-size:40px}}

.footer-brand .brand-mark img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:5px;
  display:block;
}
.footer-signature{
  margin-top:22px;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.12);
  font-size:13px;
  color:#9aa39d;
  text-align:center;
  letter-spacing:.01em;
}
.footer-signature strong{color:#fff;font-weight:600}

.quran-icon img{width:76%;height:76%;object-fit:contain;display:block;}
@media(max-width:760px){
  .desktop-nav{display:none}
  .header-actions .lang-toggle{display:flex}
  .lang-toggle{padding:2px;gap:0}
  .lang-toggle button{padding:7px 8px;font-size:10px}
  .header-actions{margin-left:auto;gap:6px}
  .site-header .brand{font-size:15px;gap:8px}
  .site-header .brand-mark{width:36px;height:36px}
}


/* Mobile language switch fix */
@media (max-width:760px){
  .site-header{height:auto;min-height:72px;padding:12px 14px;gap:8px;}
  .site-header .brand{font-size:14px;gap:7px;min-width:0;}
  .site-header .brand-mark{width:34px;height:34px;}
  .site-header .brand > span:last-child{overflow:hidden;text-overflow:ellipsis;}
  .header-actions{display:flex;align-items:center;margin-left:auto;flex:0 0 auto;}
  .header-actions .lang-toggle{display:flex!important;visibility:visible!important;opacity:1!important;white-space:nowrap;}
  .lang-toggle{padding:2px;gap:0;}
  .lang-toggle button{display:block!important;padding:7px 9px;font-size:10px;line-height:1;white-space:nowrap;}
  .lang-toggle button.active{display:block!important;}
}

/* Contribution section without artwork */
.contribute{grid-template-columns:1fr;}
.contribute > div:last-child{max-width:900px;}
@media(max-width:760px){
  .contribute{grid-template-columns:1fr;padding:45px 28px;margin:0 18px 70px;}
}

/* Compassion Month — one preview on the home page, full gallery on click */
.compassion-feed{padding:78px clamp(18px,6vw,90px);background:#f8f9f6;border-top:1px solid var(--line);}
.compassion-head{display:block;text-align:center;max-width:720px;margin:0 auto 28px;}
.compassion-head h2{font-size:clamp(34px,4vw,54px);line-height:1.04;letter-spacing:-.04em;margin:12px 0 10px;}
.compassion-intro{max-width:620px;margin:0 auto;color:var(--muted);font-size:15px;line-height:1.6;}
.compassion-preview{position:relative;display:block;width:min(760px,100%);margin:0 auto;padding:0;border:1px solid var(--line);border-radius:20px;background:#fff;overflow:hidden;cursor:zoom-in;line-height:0;box-shadow:0 12px 35px rgba(20,48,35,.08);}
.compassion-preview img{display:block;width:100%;height:auto;transition:transform .25s ease;}
.compassion-preview:hover img{transform:scale(1.01);}
.compassion-preview-overlay{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);display:inline-flex;align-items:center;gap:8px;padding:11px 16px;border-radius:999px;background:rgba(5,55,35,.9);color:#fff;font-size:12px;font-weight:800;letter-spacing:.03em;line-height:1;box-shadow:0 8px 25px rgba(0,0,0,.18);}

.image-viewer{position:fixed;inset:0;z-index:1000;background:rgba(5,12,9,.96);opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease;}
.image-viewer.open{opacity:1;visibility:visible;}
body.viewer-open{overflow:hidden;}
.viewer-gallery{height:100%;width:100%;overflow-y:auto;overflow-x:hidden;scroll-snap-type:y mandatory;scroll-snap-stop:always;overscroll-behavior:contain;scrollbar-width:thin;padding:0 0 2vh;}
.viewer-item{height:100vh;min-height:100vh;display:grid;place-items:center;scroll-snap-align:start;padding:58px 54px 76px;box-sizing:border-box;}
.viewer-stage{width:min(92vw,1200px);height:calc(100vh - 134px);display:grid;place-items:center;overflow:hidden;touch-action:pan-y;cursor:default;}
.viewer-stage img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;transform-origin:center center;user-select:none;-webkit-user-drag:none;transition:transform .16s ease;cursor:zoom-in;}
.viewer-stage img.is-zoomed{max-width:none;max-height:none;cursor:grab;}
.viewer-stage:has(img.is-zoomed){cursor:grab;}
.viewer-close,.viewer-controls button{border:0;color:#fff;background:rgba(255,255,255,.12);backdrop-filter:blur(10px);cursor:pointer;}
.viewer-close{position:absolute;top:18px;right:22px;width:44px;height:44px;border-radius:50%;font-size:30px;line-height:1;z-index:5;}
.viewer-controls{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);display:flex;gap:7px;padding:6px;border-radius:999px;background:rgba(255,255,255,.1);backdrop-filter:blur(10px);z-index:5;}
.viewer-controls button{min-width:42px;height:36px;border-radius:999px;font-weight:700;}
.viewer-controls button:nth-child(2){min-width:60px;font-size:11px;}
.viewer-count{position:absolute;top:25px;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.82);font-size:12px;font-weight:700;letter-spacing:.08em;z-index:5;pointer-events:none;}
@media(max-width:760px){
  .compassion-feed{padding:55px 12px;}
  .compassion-head{margin-bottom:22px;padding:0 8px;}
  .compassion-head h2{font-size:36px;}
  .compassion-intro{font-size:14px;}
  .compassion-preview{border-radius:14px;}
  .compassion-preview-overlay{bottom:14px;font-size:11px;padding:10px 14px;}
  .viewer-item{padding:52px 10px 70px;}
  .viewer-stage{width:100vw;height:calc(100vh - 122px);}
  .viewer-close{top:12px;right:12px;}
  .viewer-controls{bottom:14px;}
}

.gallery-admin-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.gallery-admin-card{background:#f8f9f6;border:1px solid var(--line);border-radius:16px;overflow:hidden}.gallery-admin-card img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover}.gallery-admin-card .gallery-admin-meta{padding:10px}.gallery-admin-card .gallery-admin-name{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--muted);margin-bottom:8px}@media(max-width:900px){.gallery-admin-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:600px){.gallery-admin-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Watch — clean video + Shorts section */
.watch-section{padding:105px clamp(22px,8vw,140px);background:#fff;border-top:1px solid var(--line);}
.watch-hero{max-width:850px;margin-bottom:58px;}
.watch-hero h2{font-family:Manrope,sans-serif;font-size:clamp(48px,5.6vw,78px);line-height:.98;letter-spacing:-.055em;margin:18px 0 18px;color:var(--ink);}
.watch-hero p{font-size:20px;line-height:1.6;color:var(--muted);margin:0;max-width:720px;}
.watch-group{margin-top:52px;}
.watch-group-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:25px;}
.watch-group-head h3{font-family:Manrope,sans-serif;font-size:34px;letter-spacing:-.035em;margin:0;}
.watch-link{border:1px solid var(--line);border-radius:999px;padding:13px 20px;color:var(--green);font-weight:700;font-size:13px;white-space:nowrap;}
.video-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;}
.video-card,.short-card{border:1px solid var(--line);border-radius:20px;overflow:hidden;background:#fff;box-shadow:0 8px 28px rgba(20,48,35,.05);}
.video-thumb{display:block;position:relative;aspect-ratio:16/9;background:#163c2d;overflow:hidden;}
.video-thumb img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .35s ease;}
.video-thumb:hover img{transform:scale(1.025);}
.play-button{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:rgba(0,0,0,.68);color:#fff;font-size:20px;padding-left:3px;box-shadow:0 8px 24px rgba(0,0,0,.25);}
.duration{position:absolute;right:12px;bottom:12px;background:rgba(0,0,0,.82);color:#fff;border-radius:7px;padding:5px 7px;font-size:11px;font-weight:800;}
.video-copy{padding:22px 22px 24px;}
.video-copy h4{font-family:Manrope,sans-serif;font-size:22px;line-height:1.2;margin:0 0 8px;letter-spacing:-.025em;}
.video-copy p{font-size:15px;line-height:1.55;color:var(--muted);margin:0;min-height:46px;}
.video-date{font-size:13px;color:#6e786f;margin-top:20px;}
.shorts-group{margin-top:70px;}
.shorts-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;}
.short-card .video-thumb{aspect-ratio:9/14;}
.short-card .video-copy{padding:18px 18px 20px;}
.short-card .video-copy h4{font-size:18px;}
.short-card .video-copy p{font-size:13px;min-height:40px;}
.shorts-badge{position:absolute;left:11px;top:11px;background:rgba(255,255,255,.95);color:#111;border-radius:8px;padding:6px 8px;font-size:10px;font-weight:800;}
@media(max-width:1050px){.shorts-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:760px){
 .watch-section{padding:72px 22px;}
 .watch-hero{margin-bottom:42px;}
 .watch-hero h2{font-size:46px;line-height:1;}
 .watch-hero p{font-size:17px;}
 .watch-group{margin-top:42px;}
 .watch-group-head{align-items:flex-start;flex-direction:column;}
 .watch-group-head h3{font-size:30px;}
 .watch-link{padding:11px 16px;}
 .video-grid{grid-template-columns:1fr;}
 .shorts-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
 .short-card{border-radius:16px;}
 .short-card .video-copy{padding:14px;}
 .short-card .video-copy h4{font-size:16px;}
 .short-card .video-copy p{font-size:12px;}
}
@media(max-width:760px){#videoForm{grid-template-columns:1fr!important;}#videoForm label[style*="grid-column"]{grid-column:auto!important;}.watch-link{white-space:normal;}}


/* Homepage flow: identity → watch → gallery → library */
.hero{position:relative;background:var(--paper);}
.watch-section{scroll-margin-top:82px;background:#fff;}
.compassion-feed{scroll-margin-top:82px;background:#f7f8f4;}
.intro,.explore,.featured,.contribute{scroll-margin-top:82px;}
.eyebrow{max-width:560px;line-height:1.5;}
#prophetTeachingsBtn{min-width:205px;}
.watch-section + .compassion-feed{border-top:0;}
.compassion-feed + .intro{border-top:1px solid var(--line);}
@media(max-width:760px){
  .eyebrow{font-size:10px;letter-spacing:.13em;}
  #prophetTeachingsBtn{min-width:0;}
}

/* Self-hosted Watch player */
.site-player{position:relative;aspect-ratio:16/9;background:#102d22;overflow:hidden;isolation:isolate;}
.site-player-video{display:block;width:100%;height:100%;object-fit:cover;background:#102d22;cursor:pointer;}
.site-player-iframe{display:block;width:100%;height:100%;border:0;background:#000;}
.site-player-youtube{background:#000;}
.site-player-youtube .shorts-badge{z-index:3;}

.short-card .site-player{aspect-ratio:9/14;}
.short-card .site-player-video{object-fit:cover;}
.player-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:64px;height:64px;border:0;border-radius:50%;background:rgba(0,0,0,.72);color:#fff;font-size:20px;display:grid;place-items:center;cursor:pointer;z-index:3;transition:transform .2s ease,opacity .2s ease;box-shadow:0 10px 28px rgba(0,0,0,.28);}
.player-center:hover{transform:translate(-50%,-50%) scale(1.06);}
.site-player.is-playing .player-center{opacity:0;pointer-events:none;}
.player-controls{position:absolute;left:0;right:0;bottom:0;z-index:4;display:flex;align-items:center;gap:10px;padding:12px 14px;background:linear-gradient(transparent,rgba(0,0,0,.82));color:#fff;opacity:0;transform:translateY(6px);transition:opacity .2s ease,transform .2s ease;}
.site-player:hover .player-controls,.site-player:focus-within .player-controls,.site-player.is-playing .player-controls{opacity:1;transform:none;}
.player-controls button{border:0;background:rgba(255,255,255,.13);color:#fff;width:32px;height:32px;border-radius:8px;cursor:pointer;display:grid;place-items:center;font-size:13px;flex:0 0 auto;}
.player-controls button:hover{background:rgba(255,255,255,.23);}
.player-progress{appearance:none;height:4px;flex:1;min-width:40px;background:rgba(255,255,255,.3);border-radius:99px;cursor:pointer;}
.player-progress::-webkit-slider-thumb{appearance:none;width:12px;height:12px;border-radius:50%;background:#fff;}
.player-progress::-moz-range-thumb{width:12px;height:12px;border:0;border-radius:50%;background:#fff;}
.player-time{font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap;opacity:.9;}
.site-player:fullscreen{width:100vw;height:100vh;aspect-ratio:auto;border-radius:0;display:grid;place-items:center;background:#000;}
.site-player:fullscreen .site-player-video{object-fit:contain;}
.site-player:fullscreen .player-controls{padding:18px 22px;}
.site-player:fullscreen .player-center{width:72px;height:72px;}
@media(max-width:760px){
 .player-controls{padding:9px 10px;gap:7px;}
 .player-controls button{width:30px;height:30px;}
 .player-time{font-size:10px;}
 .player-center{width:54px;height:54px;font-size:17px;}
}