/* CBSE Class XII 2027 notice + Board Exams Counter. Self-contained, scoped to .bx-*. */
html.bx-open{overflow:hidden}
dialog.bx{padding:0;border:0;background:transparent;color:#eaf1ff;max-width:none;max-height:none;width:100vw;height:100dvh;overflow:hidden;font-family:Manrope,system-ui,sans-serif}
dialog.bx::backdrop{background:radial-gradient(ellipse at 50% 30%,rgba(20,60,160,.55),rgba(2,6,20,.94) 70%);backdrop-filter:blur(3px)}
.bx-wrap{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:10px}
.bx-card{position:relative;width:min(1180px,100%);max-height:calc(100dvh - 20px);overflow:auto;overscroll-behavior:contain;border-radius:22px;background:linear-gradient(160deg,#071533 0%,#0a1f4f 55%,#06122c 100%);border:1.5px solid #2f7bff;box-shadow:0 0 0 1px rgba(255,200,60,.25),0 0 46px rgba(47,123,255,.55),0 30px 90px rgba(0,0,0,.65);animation:bx-in .7s cubic-bezier(.2,.9,.25,1) both}
@keyframes bx-in{from{opacity:0;transform:translateY(26px) scale(.94);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
.bx-particles{position:absolute;inset:0;overflow:hidden;pointer-events:none;border-radius:inherit}
.bx-particles i{position:absolute;bottom:-12px;width:4px;height:4px;border-radius:50%;background:#7fb2ff;opacity:0;box-shadow:0 0 8px #4a90ff;animation:bx-rise linear infinite}
.bx-particles i:nth-child(3n){background:#ffd24a;box-shadow:0 0 8px #ffb800}
@keyframes bx-rise{0%{transform:translateY(0);opacity:0}15%{opacity:.8}100%{transform:translateY(-110vh);opacity:0}}
.bx-top{position:sticky;top:0;z-index:5;display:flex;justify-content:flex-end;padding:8px 8px 4px;background:linear-gradient(180deg,#071533 70%,rgba(7,21,51,0));pointer-events:none}
.bx-top .bx-close{pointer-events:auto}
.bx-close{display:flex;width:max-content;margin:0;align-items:center;gap:6px;min-height:44px;padding:0 16px;border-radius:999px;border:1.5px solid #ffd24a;background:rgba(7,21,51,.92);color:#ffd24a;font:800 14px Manrope,sans-serif;cursor:pointer;box-shadow:0 0 14px rgba(255,200,60,.35)}
.bx-close:hover,.bx-close:focus-visible{background:#ffd24a;color:#071533;outline:none}
.bx-body{position:relative;display:grid;grid-template-columns:1fr;gap:18px;padding:18px 16px 22px}
.bx-head{text-align:center;padding-top:0}
.bx-badge{display:inline-block;padding:7px 20px;border-radius:999px;font:900 clamp(15px,3.6vw,22px)/1 Manrope,sans-serif;letter-spacing:.04em;color:#fff;background:linear-gradient(180deg,#ff3b3b,#b30d0d);box-shadow:0 0 22px rgba(255,50,50,.6);animation:bx-pulse 2s ease-in-out infinite}
@keyframes bx-pulse{50%{box-shadow:0 0 34px rgba(255,70,70,.95)}}
.bx-head h2{margin:12px 0 4px;font:900 clamp(20px,5vw,38px)/1.1 Manrope,sans-serif;color:#fff;letter-spacing:.01em}
.bx-head h2 b{display:block;color:#ffd24a}
.bx-sub{margin:6px 0 0;font:700 clamp(12px,2.7vw,15px) Manrope,sans-serif;color:#9fc2ff}
.bx-tag{margin:10px 0 0;font:800 clamp(14px,3.4vw,19px) Manrope,sans-serif;color:#ffd24a}
.bx-poster{display:flex;flex-direction:column;align-items:center;gap:8px}
.bx-posterbtn{padding:0;border:1.5px solid #2f7bff;border-radius:16px;background:#000;cursor:zoom-in;overflow:hidden;box-shadow:0 0 30px rgba(47,123,255,.5);width:min(100%,430px);line-height:0}
.bx-posterbtn img{width:100%;height:auto;display:block}
.bx-posterbtn:focus-visible{outline:3px solid #ffd24a;outline-offset:3px}
.bx-view{min-height:44px;padding:0 18px;border-radius:999px;border:1.5px solid #2f7bff;background:rgba(47,123,255,.15);color:#cfe0ff;font:800 14px Manrope,sans-serif;cursor:pointer}
.bx-view:hover,.bx-view:focus-visible{background:#2f7bff;color:#fff;outline:none}
.bx-pwarn{margin:0;max-width:430px;text-align:center;font:600 12.5px/1.45 Manrope,sans-serif;color:#ffe49a;background:rgba(255,210,74,.1);border:1px solid rgba(255,210,74,.5);border-radius:12px;padding:8px 12px}
.bx-pwarn b{color:#ffd24a}
.bx-src{margin:0;text-align:center;font:600 11.5px/1.45 Manrope,sans-serif;color:#8fa9d6}
.bx-src a{color:#9fc2ff;text-decoration:underline}
.bx-days .sub{display:block;font:600 11px Manrope,sans-serif;color:#8fa9d6;margin-top:2px}
.bx-cl{margin:12px 0 0;text-align:center;font:800 11px Manrope,sans-serif;color:#9fc2ff;letter-spacing:.12em}
.bx-note{font:600 12px/1.45 Manrope,sans-serif;color:#8fa9d6;text-align:center;max-width:430px;margin:0}
.bx-panel{display:flex;flex-direction:column;gap:14px;min-width:0}
.bx-dash{border-radius:18px;padding:16px;background:rgba(255,255,255,.06);backdrop-filter:blur(10px);border:1.5px solid rgba(47,123,255,.7);box-shadow:inset 0 0 30px rgba(47,123,255,.12),0 0 24px rgba(47,123,255,.3)}
.bx-dash h3{margin:0 0 12px;text-align:center;font:900 clamp(16px,4vw,22px) Manrope,sans-serif;color:#ffd24a;letter-spacing:.05em}
.bx-next{display:grid;gap:4px;text-align:center}
.bx-next .k{font:800 12px Manrope,sans-serif;color:#9fc2ff;letter-spacing:.14em;text-transform:uppercase}
.bx-next .subj{font:900 clamp(22px,6vw,34px)/1.15 Manrope,sans-serif;color:#fff}
.bx-next .subj em{font-style:normal;color:#ffd24a}
.bx-next .when{font:700 clamp(13px,3.2vw,16px) Manrope,sans-serif;color:#cfe0ff}
.bx-days{text-align:center;margin:12px 0 4px}
.bx-days .k{display:block;font:800 12px Manrope,sans-serif;color:#9fc2ff;letter-spacing:.14em}
.bx-days .n{display:inline-block;font:900 clamp(40px,12vw,64px)/1.1 Manrope,sans-serif;color:#ff3b3b;text-shadow:0 0 18px rgba(255,59,59,.65);font-variant-numeric:tabular-nums}
.bx-days .u{font:900 clamp(14px,3.6vw,20px) Manrope,sans-serif;color:#ff6b6b;margin-left:6px}
.bx-clock{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:8px}
.bx-clock div{border-radius:12px;padding:10px 4px 8px;text-align:center;background:linear-gradient(180deg,rgba(255,40,40,.16),rgba(0,0,0,.35));border:1px solid rgba(255,80,80,.55)}
.bx-clock b{display:block;font:900 clamp(26px,8vw,44px)/1 Manrope,sans-serif;color:#ff3b3b;text-shadow:0 0 14px rgba(255,59,59,.6);font-variant-numeric:tabular-nums}
.bx-clock span{font:800 10px Manrope,sans-serif;color:#cfe0ff;letter-spacing:.16em}
.bx-state{margin:10px 0 0;text-align:center;font:800 13px Manrope,sans-serif;color:#7dffb0;min-height:1em}
.bx-flip{animation:bx-flip .6s ease both}
@keyframes bx-flip{from{opacity:0;transform:rotateX(70deg) translateY(8px)}to{opacity:1;transform:none}}
.bx-done{text-align:center;padding:20px 8px}
.bx-done b{display:block;font:900 clamp(20px,5.4vw,30px) Manrope,sans-serif;color:#ffd24a}
.bx-done span{font:800 clamp(14px,3.6vw,18px) Manrope,sans-serif;color:#fff}
.bx-list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.bx-list li{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:8px 12px;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid rgba(47,123,255,.35);font:700 13px Manrope,sans-serif}
.bx-list li .d{color:#cfe0ff;white-space:nowrap}
.bx-list li .s{color:#fff}
.bx-list li .s small{color:#8fa9d6;font-weight:700}
.bx-list li .c{font:900 10px Manrope,sans-serif;letter-spacing:.1em;padding:3px 8px;border-radius:999px;color:#9fc2ff;border:1px solid #3b5fa8}
.bx-list li.next{border-color:#ffd24a;background:rgba(255,210,74,.1)}
.bx-list li.next .c{color:#071533;background:#ffd24a;border-color:#ffd24a}
.bx-list li.live .c{color:#071533;background:#7dffb0;border-color:#7dffb0}
.bx-list li.done{opacity:.55}
.bx-list li.done .s{text-decoration:line-through}
.bx-time{margin:0;text-align:center;font:700 12px Manrope,sans-serif;color:#8fa9d6}
.bx-final{margin:0;text-align:center;font:800 clamp(13px,3.2vw,16px) Manrope,sans-serif;color:#ffd24a}
.bx-warn{margin:0;text-align:center;font:600 11.5px/1.45 Manrope,sans-serif;color:#8fa9d6}
@media (min-width:900px){
 .bx-body{grid-template-columns:minmax(300px,420px) 1fr;align-items:start;gap:26px;padding:20px 28px 28px}
 .bx-head{grid-column:1/-1}
 .bx-posterbtn{width:100%}
}
/* full-size viewer */
dialog.bx-zoom{padding:0;border:0;background:transparent;max-width:none;max-height:none;width:100vw;height:100dvh;overflow:hidden}
dialog.bx-zoom::backdrop{background:rgba(0,0,0,.94)}
.bx-zoomscroll{width:100%;height:100%;overflow:auto;display:flex;padding:56px 8px 16px;box-sizing:border-box;-webkit-overflow-scrolling:touch}
.bx-zoomscroll img{margin:auto;width:min(960px,100%);height:auto;flex:none;cursor:zoom-in}
.bx-zoomscroll.full img{width:auto;max-width:none;width:1440px;cursor:zoom-out}
.bx-zoom .bx-close{position:fixed;z-index:9;top:8px;right:8px;margin:0}
/* reopen chip */
#bx-chip{position:fixed;left:12px;bottom:14px;z-index:90;min-height:44px;padding:0 14px;border-radius:999px;border:1.5px solid #2f7bff;background:rgba(7,21,51,.94);color:#ffd24a;font:800 13px Manrope,sans-serif;cursor:pointer;box-shadow:0 0 16px rgba(47,123,255,.5);display:inline-flex;align-items:center;gap:8px}
#bx-chip:hover,#bx-chip:focus-visible{background:#2f7bff;color:#fff;outline:none}
#bx-chip[hidden]{display:none}
@media (max-width:480px){.bx-wrap{padding:0}.bx-card{border-radius:0;max-height:100dvh;min-height:100dvh}.bx-body{padding:14px 12px 22px}#bx-chip{font-size:12px;padding:0 12px}}
@media (prefers-reduced-motion:reduce){.bx-card,.bx-badge,.bx-flip{animation:none}.bx-particles{display:none}}
/* keep the notice looking the same in Devil mode */
body.devil dialog.bx button.bx-close,body.devil dialog.bx-zoom button.bx-close{background:rgba(7,21,51,.92);color:#ffd24a;border-color:#ffd24a;box-shadow:0 0 14px rgba(255,200,60,.35)}
body.devil dialog.bx button.bx-close:hover,body.devil dialog.bx button.bx-close:focus-visible{background:#ffd24a;color:#071533}
body.devil dialog.bx .bx-view,body.devil dialog.bx .bx-posterbtn{background-color:transparent}
