/* Baitunnahwi V7: presentation only; learning and account logic remain in the original app. */
:root{--wow-ink:#20364a;--wow-purple:#7544aa;--wow-teal:#087666;--wow-blue:#2867b2;--wow-coral:#b34957;--wow-gold:#e7b650;--wow-paper:#fcfaf7;--wow-line:#e4deee}
html{scroll-behavior:smooth;scroll-padding-top:110px}
body{background:radial-gradient(ellipse at 5% 15%,#ece3f7 0,transparent 42%),radial-gradient(ellipse at 100% 35%,#dff4ef 0,transparent 45%),#fcfaf7!important;color:var(--wow-ink)!important}
body:before{opacity:.035!important;pointer-events:none!important}
body .app{background:transparent!important;min-height:100vh}
body .app .topbar{background:linear-gradient(110deg,#163f46,#125b55 52%,#493462)!important;border-bottom:1px solid #ffffff24!important;box-shadow:0 8px 30px #20364a15!important;padding-block:.65rem!important;gap:1rem!important}
body .app .topbar .brand{gap:.6rem!important}
body .app .brand-logo-new{background:#fff!important;border-radius:16px!important;padding:5px!important;width:52px!important;height:52px!important;flex-basis:52px!important}
body .app .brand-title-text{font-size:1rem!important;letter-spacing:.06em!important}
body .app .brand-subtitle-text{color:#d3eee3!important;font-weight:500!important}
body .header-controls{gap:.5rem!important}
body .topbar .home-nav-button,body .topbar .bn-mastery-nav{background:#ffffff10!important;color:#fff!important;border:1px solid #ffffff35!important;border-radius:12px!important;min-height:44px!important;box-shadow:none!important}
body .topbar .language-choice select{border-radius:12px!important;min-height:44px!important}
body .home-stage{max-width:1440px!important;margin:auto!important;padding:clamp(14px,3vw,42px)!important}
body .app .home-hero.journey-hero{display:grid!important;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr)!important;gap:24px!important;align-items:stretch!important;background:none!important;padding:0!important;border:0!important;box-shadow:none!important}
body .app .journey-hero .hero-copy{position:relative!important;isolation:isolate!important;display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:center!important;padding:clamp(24px,3vw,48px)!important;border:1px solid #ffffff50!important;border-radius:34px!important;background:radial-gradient(ellipse at 5% 0,#8a6aab55,transparent 50%),radial-gradient(ellipse at 100% 100%,#14957855,transparent 55%),linear-gradient(150deg,#263e53,#184f4b 70%,#176152)!important;box-shadow:0 24px 60px #233c4820!important;overflow:hidden!important;text-align:center!important}
body .app .journey-hero .hero-copy:before{content:""!important;position:absolute!important;inset:14px!important;border:1px solid #ecd49e40!important;border-radius:24px!important;background:none!important;pointer-events:none!important;z-index:-1!important}
body .app .journey-hero .hero-copy:after{content:""!important;position:absolute!important;inset:0!important;background:url('../islamic-pattern.svg') center/210px!important;opacity:.045!important;pointer-events:none!important;z-index:-1!important}
body .app .journey-hero .hero-copy .hero-official-logo{width:min(270px,80%)!important;padding:12px!important;background:#fffffff2!important;border-radius:24px!important;border:1px solid #f0d994!important;box-shadow:0 12px 34px #061f342a!important;margin:0 auto 1.5rem!important}
body .app .journey-hero .hero-copy .hero-welcome,body .app .journey-hero .hero-copy .hero-welcome *{color:#f3dca7!important;font-size:1rem!important;font-weight:600!important;letter-spacing:.01em!important}
body .app .journey-hero .hero-copy #baitunnahwi-title{color:#fff!important;font-size:clamp(1.9rem,3.1vw,3.1rem)!important;line-height:1.2!important;letter-spacing:.025em!important;margin:.45rem 0 1rem!important;text-shadow:none!important;white-space:normal!important}
body .app .journey-hero .hero-copy .hero-summary,body .app .journey-hero .hero-copy .hero-summary *{color:#e3eee9!important;font-size:1.02rem!important;line-height:1.85!important;max-width:440px!important;text-align:center!important;font-weight:400!important}
body .app .journey-hero .journey-home-actions{justify-content:center!important;width:100%!important}
body .app .journey-hero .journey-guide-actions>button{min-height:48px!important;border-radius:16px!important;background:#ffffff0d!important;border:1px solid #ffffff45!important;box-shadow:none!important;max-width:360px!important}
body .app .journey-hero .journey-guide-actions>button *,body .app .journey-hero .journey-guide-actions .bn-front-book-icon{color:#f6edda!important}
body .app .home-stage .hero-start{width:100%!important;max-width:360px!important;min-height:68px!important;gap:.75rem!important;background:linear-gradient(110deg,#f3d68d,#efba59)!important;color:#27434c!important;border:1px solid #ffe2a1!important;border-radius:18px!important;box-shadow:0 8px 0 #062e2b55,0 15px 35px #061c2930!important;transition:transform .2s,box-shadow .2s!important;margin-top:.6rem!important}
body .app .home-stage .hero-start *{color:#27434c!important}
body .app .home-stage .hero-start:hover{transform:translateY(-3px)!important;box-shadow:0 11px 0 #062e2b55,0 20px 38px #061c2940!important}
body .app .home-stage .hero-start:active{transform:translateY(3px)!important;box-shadow:0 3px 0 #062e2b55!important}
body .app .home-stage .hero-house-wrap{position:relative!important;background:radial-gradient(ellipse at 50% 40%,#eee4ff 0,transparent 65%),linear-gradient(155deg,#fff,#fbf5e8)!important;border:1px solid #e7dcef!important;border-radius:34px!important;box-shadow:0 24px 60px #45345612!important;padding:clamp(16px,2.4vw,34px)!important;overflow:hidden!important;perspective:1200px}
body .app .journey-house{transform:rotateX(var(--wow-rx,0deg)) rotateY(var(--wow-ry,0deg));transition:transform .25s ease;max-width:610px!important;filter:drop-shadow(0 20px 16px #3e265412)}
body .app .jh-building{background:linear-gradient(90deg,#e9dff2,#fffaf4 40%,#f4e7ee)!important;border:2px solid #d9c8dc!important;box-shadow:inset 0 2px 0 #fff,0 13px 0 #d8c9db,0 22px 28px #6c477323!important;border-radius:0 0 22px 22px!important}
body .app .jh-roof .jh-roof-tile{background:linear-gradient(180deg,#ae82cc,#77529c 60%,#503870)!important;box-shadow:inset 0 2px 1px #d9b9f0,inset 0 -3px 2px #3e295f,1px 2px 3px #32213c55!important}
body .app .jh-roof .jh-ridge-cap{background:linear-gradient(90deg,#765291,#ba96d2,#73508d)!important}
body .app .jh-roof .jh-gable-title{background:#fff8e8!important;color:#684284!important;border:1px solid #d8b96c!important;box-shadow:0 3px 8px #40255825!important}
body .app .jh-floor{--floor:#7544aa;--floor-soft:#f0e7fa;background:linear-gradient(100deg,var(--floor-soft),#fffaf6)!important;border-bottom:6px solid #e0cddd!important}
body .app .jh-floor:nth-child(2){--floor:#2867b2;--floor-soft:#e6effc}
body .app .jh-floor:nth-child(3){--floor:#087666;--floor-soft:#dff2eb}
body .app .jh-floor-label,body .app .jh-floor-label *{color:var(--floor)!important;font-weight:750!important;letter-spacing:.02em!important}
body .app .jh-room{background:#ffffffb5!important;border:1px solid #c6b9d7!important;border-radius:17px!important;box-shadow:0 5px 12px #45285208!important;transition:transform .2s,box-shadow .2s,border-color .2s!important}
body .app .jh-room:disabled{opacity:.67!important;filter:saturate(.6);cursor:not-allowed!important}
body .app .jh-room:not(:disabled):hover,body .app .jh-room:focus-visible{transform:translateY(-5px);box-shadow:0 10px 20px #45285222!important;border-color:var(--floor)!important}
body .app .jh-room-name,body .app .jh-room-name *,body .app .jh-room-status,body .app .jh-room-status *{color:#3c4056!important}
body .app .jh-door{background:linear-gradient(110deg,var(--floor),#382c59)!important;color:#ffe0a1!important}
body .app .jh-door-frame{border-color:#d7b979!important;box-shadow:0 4px 7px #34243b30!important}
body .app .jh-room.jh-done{border-color:#229a76!important;background:#ebfaf3!important}
body .app .jh-entrance{background:linear-gradient(90deg,#ece1f2,#fff7e9,#e9e2f0)!important;border-color:#decfe1!important}
body .app .jh-key-collection{margin-top:1.4rem!important;background:#ffffffa6!important;border:1px solid #e6dcea!important;border-radius:18px!important;padding:1rem .5rem!important}
body .app .jh-key-collection .bi>[lang],body .app .jh-progress-label{color:#58426b!important}
body .app .jh-key-row>span{background:#eee8f3!important;color:#746382!important;border-radius:9px!important}
body .app .jh-key-row>span.collected{background:#ffedbc!important;color:#805313!important;box-shadow:inset 0 0 0 1px #e7c982!important}
body .app .cloud-status{background:#f3f6f5!important;color:#456258!important;border-bottom:1px solid #e3ebe6!important;font-size:.8rem!important}
/* Learning: colour groups keep meaning and increase visual separation. */
body .app .reading-shell{background:transparent!important;padding-bottom:100px!important}
body .app .reading-shell .lesson-panel{background:#fff!important;border:1px solid #e1d9e9!important;border-radius:28px!important;box-shadow:0 16px 50px #55416f0c!important;padding:clamp(18px,3vw,38px)!important}
body .app .reading-shell :is(h1,h2,h3,h4){color:#344457!important}
body .app .reading-shell .step-track{background:#ffffffce!important;padding:.65rem!important;border:1px solid #e4dfeb!important;border-radius:20px!important;box-shadow:0 8px 24px #36254808!important}
body .app .reading-shell .step-track button{--step:#7544aa;min-height:52px!important;background:#fff!important;border:1px solid #e7e0ef!important;border-top:4px solid var(--step)!important;color:#55566a!important;transition:transform .2s,background .2s!important}
body .app .reading-shell .step-track button:nth-child(2){--step:#087666}
body .app .reading-shell .step-track button:nth-child(3){--step:#2867b2}
body .app .reading-shell .step-track button:nth-child(4){--step:#b34957}
body .app .reading-shell .step-track button:nth-child(5){--step:#89600f}
body .app .reading-shell .step-track button:nth-child(6){--step:#b15d29}
body .app .reading-shell .step-track button:nth-child(7){--step:#4f4293}
body .app .reading-shell .step-track button.current{background:var(--step)!important;color:white!important;box-shadow:0 6px 16px #4a375723!important;transform:translateY(-2px)}
body .app .reading-shell .step-track button.current *{color:white!important}
body .app .reading-shell .step-track button:disabled{opacity:.6!important}
body .app :is(.ig-node,.ig-rule-panel,.ig-summary-card,.t1-card,.gloss-card,.learning-space){--tile:#7544aa;--tile-bg:#f4edfc;border:1px solid #e2daeb!important;border-top:4px solid var(--tile)!important;background:linear-gradient(145deg,#fff,var(--tile-bg))!important;border-radius:22px!important;box-shadow:0 7px 20px #422b5d08!important;transition:transform .2s,box-shadow .2s!important}
body .app :is(.ig-node,.ig-rule-panel,.ig-summary-card,.t1-card,.gloss-card,.learning-space):nth-child(3n+2){--tile:#087666;--tile-bg:#eaf8f1}
body .app :is(.ig-node,.ig-rule-panel,.ig-summary-card,.t1-card,.gloss-card,.learning-space):nth-child(3n){--tile:#2867b2;--tile-bg:#edf3ff}
body .app .reading-shell .ig-node-trigger{background:transparent!important;color:#344457!important;min-height:48px!important}
body .app .reading-shell :is(.ig-example,.colored-example,.example){background:linear-gradient(120deg,#eef4ff,#f5f2fd)!important;border:1px solid #cbd9ed!important;border-inline-start:5px solid #6188c4!important;border-radius:18px!important;color:#284567!important;padding:1rem!important}
body .app .reading-shell :is(.note,.ig-attention,.vn-tip){background:linear-gradient(130deg,#fff8e9,#fff0d0)!important;border-color:#e9cf93!important;color:#77561c!important;border-radius:18px!important}
body .app .reading-shell .flash{background:linear-gradient(130deg,#f3eafd,#e9effe)!important;border:2px solid #c5b0e2!important;border-radius:24px!important;box-shadow:0 8px 0 #e5d9f3!important;transition:background .35s,transform .3s!important}
body .app .reading-shell .flash:active{background:#dff5eb!important;transform:scale(.98)}
body .app .reading-shell .flash[aria-pressed="true"],body .app .reading-shell .flash.wow-flipped{background:linear-gradient(130deg,#dcf5e9,#e4f3fd)!important;border-color:#79bea8!important;box-shadow:0 8px 0 #cee7de!important}
body .app .topic-row{border:1px solid #e2dfea!important;border-radius:18px!important;background:#fff!important;box-shadow:0 4px 14px #453a5806!important;margin-bottom:.7rem!important;transition:transform .2s}
body .app .topic-number{background:#eee5f8!important;color:#7544aa!important;border-radius:13px!important}
body .app .topic-row:nth-child(3n+2) .topic-number{background:#e0f3ed!important;color:#126d59!important}
body .app .topic-row:nth-child(3n) .topic-number{background:#e7effb!important;color:#2867b2!important}
body .app .topic-number.finished{background:#087666!important;color:#fff!important}
body .app .login-dialog,body .app .jr-dialog{border:1px solid #dfcce9!important;border-radius:28px!important;background:linear-gradient(145deg,#fff,#f8f3fc)!important;box-shadow:0 30px 100px #1e273a55!important}
body .app dialog::backdrop{background:#182f40b8!important;backdrop-filter:blur(9px)!important}
body .app .login-submit{background:linear-gradient(110deg,#674390,#177a69)!important;color:#fff!important;border:0!important;border-radius:14px!important;min-height:50px!important}
body .app .login-submit *{color:#fff!important}
body .app input:focus-visible,body .app select:focus-visible{outline:3px solid #b6a1de!important;outline-offset:3px!important}
body :is(button,a,summary):focus-visible{outline:3px solid #bd8b29!important;outline-offset:4px!important}
/* Companion reference page. */
body #bn-mastery-root{background:transparent!important}
body #bn-mastery-root :is(.bn-hero-card,.bn-panel,.bn-side-card){border:1px solid #e4daec!important;border-radius:26px!important;box-shadow:0 14px 40px #48375c0d!important}
body #bn-mastery-root .bn-hero-card{background:linear-gradient(125deg,#f0e9fa,#f9fcfa 60%,#e6f5ef)!important}
body #bn-mastery-root .bn-card.theme1{background:linear-gradient(130deg,#fff,#efe5fb)!important;border-top:4px solid #8051ad!important}
body #bn-mastery-root .bn-card.theme2{background:linear-gradient(130deg,#fff,#e6f0fd)!important;border-top:4px solid #4477b8!important}
body #bn-mastery-root .bn-card.theme3{background:linear-gradient(130deg,#fff,#e0f4ec)!important;border-top:4px solid #198264!important}
body #bn-mastery-root .bn-card.theme4{background:linear-gradient(130deg,#fff,#fff0d5)!important;border-top:4px solid #b48828!important}
body #bn-mastery-root .bn-card.theme5{background:linear-gradient(130deg,#fff,#fde8e8)!important;border-top:4px solid #b95869!important}
body #bn-mastery-root .bn-card{border-radius:21px!important;transition:transform .2s,box-shadow .2s}
body #bn-mastery-root .bn-tab.on{background:linear-gradient(110deg,#7544aa,#385590)!important}
body #bn-mastery-root .bn-progress-bar{background:linear-gradient(90deg,#9160b9,#5384bf,#22a27c)!important}
/* App-independent reading controls. No modification to lesson state. */
#wow-reading-tools{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);z-index:90;display:flex;align-items:center;gap:5px;padding:7px;border:1px solid #e2d8e9;border-radius:18px;background:#ffffffed;box-shadow:0 8px 30px #36204a25;backdrop-filter:blur(15px);max-width:calc(100vw - 24px)}
#wow-reading-tools[hidden]{display:none}
#wow-reading-tools button{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:8px 12px;border:0;border-radius:12px;background:#f0eaf6;color:#57377a;font:600 14px system-ui;white-space:nowrap}
#wow-reading-tools button[aria-pressed="true"]{background:#63418e;color:#fff}
#wow-reading-tools button:disabled{opacity:.4;cursor:not-allowed}
#wow-reading-tools .wow-focus{background:#e5f3ec;color:#17624f}
body.wow-focus-mode .reading-shell{max-width:940px!important;margin-inline:auto!important}
body.wow-focus-mode .reading-shell .lesson-panel{box-shadow:none!important}
body.wow-focus-mode .reading-shell .house-note-link{display:none!important}
body[data-wow-text="1"] .reading-shell .lesson-panel :is(p,li,.bi>[lang],.ar){font-size:1.15rem!important}
body[data-wow-text="2"] .reading-shell .lesson-panel :is(p,li,.bi>[lang],.ar){font-size:1.3rem!important}
.wow-spark{position:fixed;width:9px;height:13px;pointer-events:none;z-index:9999;border-radius:3px;animation:wowConfetti 1.1s ease-out forwards;background:var(--spark-color)}
@keyframes wowConfetti{from{transform:translate(0,0) rotate(0);opacity:1}to{transform:translate(var(--spark-x),var(--spark-y)) rotate(250deg);opacity:0}}
@keyframes wowPanelIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
body .app .lesson-panel,body #bn-mastery-root .bn-panel{animation:wowPanelIn .35s ease-out}
@media(hover:hover){body .app .ig-node:hover,body .app .learning-space:not(:disabled):hover,body #bn-mastery-root .bn-card:hover{transform:translateY(-4px);box-shadow:0 12px 26px #48375c18!important}body .app .topic-row:hover{transform:translateX(3px)}}
@media(max-width:1100px){body .app .home-hero.journey-hero{grid-template-columns:1fr!important}body .app .journey-hero .hero-copy{padding:30px 24px!important}body .app .journey-hero .hero-copy .hero-official-logo{width:210px!important}body .app .home-stage .hero-house-wrap{padding:25px!important}body .app .journey-hero .hero-copy #baitunnahwi-title{font-size:clamp(1.85rem,5vw,2.8rem)!important}}
@media(max-width:600px){body .app .topbar{padding:.5rem .75rem!important;flex-wrap:wrap!important;justify-content:center!important}body .header-controls{justify-content:center!important;flex-wrap:wrap!important;max-width:100%}body .app .brand-logo-new{width:42px!important;height:42px!important;flex-basis:42px!important}body .app .home-hero.journey-hero{gap:16px!important}body .app .journey-hero .hero-copy,body .app .home-stage .hero-house-wrap{border-radius:25px!important}body .app .journey-hero .hero-copy{padding:27px 20px!important}body .app .home-stage .hero-house-wrap{padding:18px 8px!important}body .app .jh-room{border-radius:12px!important}body .app .jh-room-name{font-size:.65rem!important}body .app .reading-shell .lesson-panel{padding:18px 14px!important}body .app .reading-shell .step-track{overflow-x:auto!important;justify-content:flex-start!important}#wow-reading-tools{bottom:10px}#wow-reading-tools button{padding:7px 9px}body .app .hero-summary{overflow-wrap:anywhere}body #bn-mastery-root{padding-bottom:85px!important}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}body .app *,body .app *:before,body .app *:after,body #bn-mastery-root *,body .wow-spark{animation:none!important;transition:none!important}body .app .journey-house{transform:none!important}.wow-spark{display:none}}

body[data-wow-text="1"] .reading-shell .lesson-panel [lang="ar"]{font-size:1.55rem!important}body[data-wow-text="2"] .reading-shell .lesson-panel [lang="ar"]{font-size:1.75rem!important}
