@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Instrument+Serif:ital@0;1&display=swap');
:root{color-scheme:dark;--bg:#141621;--panel:#201e2d;--line:#f4d9ac26;--gold:#f2ce90;--soft:#c3bac7;--ink:#fff0d7}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 75% 0,#302337,transparent 55%),var(--bg);color:var(--ink);font:15px 'DM Sans',system-ui,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;background:#292536;border:1px solid var(--line);border-radius:12px;padding:10px 14px;cursor:pointer}button:hover{border-color:#f2ce9099}button:focus-visible,a:focus-visible{outline:2px solid #ffe194;outline-offset:3px}button:disabled{cursor:default}header{min-height:76px;border-bottom:1px solid var(--line);padding:12px max(5vw,20px);display:flex;justify-content:space-between;align-items:center;background:#151621bb}.brand{display:flex;align-items:center;gap:12px}.seal{display:grid;place-items:center;width:43px;height:43px;border:1px solid #f2ce9070;border-radius:50%;color:var(--gold);font-size:26px}.brand strong{font:27px 'Instrument Serif',Georgia,serif}.brand small{display:block;color:var(--gold);font-size:9px;letter-spacing:.22em}header button span{margin-left:9px;color:var(--gold)}main{max-width:1520px;margin:auto;padding:24px max(5vw,20px) 40px}.intro{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:24px}h1,h2{font-family:'Instrument Serif',Georgia,serif;font-weight:400;margin:0}h1{font-size:clamp(39px,5.3vw,69px);line-height:1.03}.intro p,.invhead p,.dialoghead p{color:var(--soft);margin:8px 0 0}.progress{min-width:135px;text-align:right}.progress strong{display:block;font-size:23px;color:var(--gold)}small{letter-spacing:.13em;font-weight:700;font-size:10px;color:var(--gold)}progress{display:block;width:100%;height:5px;margin-top:8px;accent-color:#edc787}.layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(285px,320px);gap:16px}.world,.lesson,.inventory{border:1px solid var(--line);border-radius:20px;overflow:hidden}.world{position:relative;aspect-ratio:10/7;background:#182e27 url('garden.webp') center/100% 100%;isolation:isolate}.world:before{content:'';position:absolute;inset:0;background:linear-gradient(#111522b0,transparent 25%,transparent 72%,#111522be);z-index:-1}.world.day:before{background:#ffc9772b;mix-blend-mode:screen}.world canvas,.world #plots{position:absolute;inset:0;width:100%;height:100%}.worldtop,.worldbottom{position:absolute;z-index:2;left:12px;right:12px;pointer-events:none}.worldtop{top:12px;display:flex;justify-content:space-between;align-items:center}.worldtop span,.worldtop button,.worldbottom{background:#171d28e8;border:1px solid #e8cc8d55;color:#ffe1a8;border-radius:10px;padding:8px 12px;font-size:11px}.worldtop button{pointer-events:auto}.worldbottom{bottom:12px;width:max-content;max-width:calc(100% - 24px)}.plot{position:absolute;transform:translate(-50%,-50%);width:5.7%;height:5.1%;padding:0;border:0;background:transparent;border-radius:50%;color:transparent}.plot.open{border:1px dashed #fff4b6ad;background:#eacb6928}.plot:hover,.plot:focus-visible{background:#fff1a84d;border:1px solid #ffdf9b}.lesson{background:radial-gradient(ellipse at top,#3e2b43,transparent 72%),var(--panel);padding:25px 23px;display:flex;flex-direction:column;align-items:center;text-align:center;min-height:400px}.lesson #arabic{font:clamp(38px,4.7vw,63px)/1.5 Georgia,serif;color:var(--gold);margin:12px 0 0}.lesson h2{font-size:40px;line-height:1.05}.lesson p{margin:8px 0;color:var(--soft);line-height:1.5}.lesson #meaning{color:#ffdfad;font-weight:600}.lesson #reflection{margin-bottom:15px}.lesson #gift{margin:auto 0 12px;background:#ffffff09;border:1px solid var(--line);border-radius:12px;padding:9px 12px;width:100%;font-size:13px;color:var(--gold)}.primary{width:100%;background:#ecc78b;color:#24192a;font-weight:700;border-color:#ecc78b}.primary:hover{background:#ffdda5}.primary span{margin-left:7px}#question{width:100%;margin-bottom:12px}#question p{font-size:13px}#question button{width:100%;margin-top:5px;font-size:13px;padding:6px 9px}#question button.correct{background:#334f3c;border-color:#8db99a}#question button.incorrect{border-color:#f296a6}.inventory{background:#201d2b;padding:15px 18px;margin-top:16px}.invhead{display:flex;align-items:center;gap:12px;justify-content:space-between}.invhead h2{font-size:28px}.invhead p{margin:0;text-align:right;font-size:13px}#gifts{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:7px;margin-top:10px}.item{min-width:0;padding:8px 3px;font-size:11px;display:grid;gap:4px;place-items:center;position:relative}.item .icon{font-size:22px}.item.selected{border-color:var(--gold);background:#493c42}.item:disabled{opacity:.56}.quantity{position:absolute;right:5px;top:4px;color:var(--gold);font-size:10px}dialog{max-width:min(540px,calc(100vw - 28px));width:100%;max-height:82vh;padding:22px;border:1px solid #e6bf7a75;border-radius:18px;background:#252031;color:var(--ink)}dialog::backdrop{background:#10101bd9}dialog h2{font-size:35px}.dialoghead{display:flex;justify-content:space-between;gap:10px;align-items:start}.note,dialog p{color:var(--soft)}a{color:var(--gold)}#entries{padding-left:27px}#entries li{padding:8px 4px;border-top:1px solid var(--line)}#entries b[lang=ar]{float:right;color:var(--gold);font-size:22px}.actions{display:flex;gap:8px}.actions .primary{width:auto}.actions button{white-space:nowrap}[hidden]{display:none!important}
@media(max-width:920px){.layout{grid-template-columns:minmax(0,1fr) 270px}.lesson{padding:17px 15px;min-height:350px}}@media(max-width:700px){main{padding-top:18px}.layout{grid-template-columns:1fr}.lesson{min-height:340px}.intro p{font-size:13px}.progress{min-width:78px}.progress small{font-size:8px}#gifts{grid-template-columns:repeat(3,1fr)}.worldbottom{font-size:10px}.worldtop span,.worldtop button{padding:5px 8px}}

#reading{width:100%}.source{margin:8px 0 4px;padding:10px 11px;border:1px solid var(--line);border-radius:10px;background:#16152259;text-align:left}.source p,.lesson .source p{font-size:13px;line-height:1.4;margin:5px 0}.source a{font-size:12px}.source small{font-size:9px}.source + p{font-size:13px}#entries summary{cursor:pointer}.item:not(:disabled),#giftArt{touch-action:none;cursor:grab}.item:active,#giftArt:active{cursor:grabbing}#workshop{display:flex;align-items:center;gap:14px;margin-top:12px;padding:8px 14px;background:#171623;border:1px solid var(--line);border-radius:14px}#workshop label{display:grid;gap:4px;color:var(--gold);font-size:12px}#workshop input,#workshop select{min-width:0;max-width:100%;background:#292536;color:var(--ink);border:1px solid var(--line);border-radius:9px;padding:9px;font:inherit}#workshop .primary{width:auto;margin-left:auto;white-space:nowrap}#giftArt{width:66px;height:66px;background:#ffffff08;border:1px dashed #f2ce9066;border-radius:10px;flex:none}.drag-preview{position:fixed;z-index:1000;pointer-events:none;transform:translate(-50%,-83%);filter:drop-shadow(0 2px 5px #19151cbb)}.plot.drop-target{background:#ffe0a875;border:2px solid #ffeab1}.plot.open{touch-action:manipulation}
@media(max-width:700px){#workshop{display:grid;grid-template-columns:66px minmax(0,1fr);gap:8px 11px}#giftArt{grid-row:span 2}#workshop .primary{width:100%;grid-column:1/-1}.lesson #arabic{margin-top:4px}}
.source details{margin:6px 0 8px;font-size:12px}.source details summary{color:var(--gold);cursor:pointer}.source details p[lang=ar]{font:22px/1.9 Georgia,serif;color:var(--ink);margin:5px 0}.source-note:before{content:'In brief · ';color:var(--gold)}
.builder-nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.quiet-link{border:1px solid #edce9255;background:#493348;color:#ffe3a5;border-radius:12px;padding:10px 14px;text-decoration:none;font-size:13px}.garden-switch{pointer-events:auto}.garden-switch select{appearance:auto;background:#171d28ed;color:#ffe1a8;border:1px solid #e8cc8d55;border-radius:9px;padding:7px;font:inherit;font-size:12px}.garden-switch .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.item img{width:min(100%,65px);height:52px;object-fit:contain;pointer-events:none}.item:disabled img{filter:saturate(.55)}@media(max-width:700px){header{flex-wrap:wrap;gap:9px}.builder-nav button,.quiet-link{padding:6px 8px;font-size:11px}.garden-switch select{font-size:10px}}

.verse-media{margin:9px 0;text-align:left;min-width:0}
.verse-media audio{display:block;width:100%;height:38px;margin:0 0 3px}
.verse-media .verse-credit{display:block;letter-spacing:0;text-transform:none;font-weight:400;font-size:11px;color:var(--soft);line-height:1.4}
.verse-media .verse-translation{margin:8px 0 0;padding:7px 0 0;border-top:1px solid var(--line)}
.verse-media .verse-translation summary{cursor:pointer;color:var(--gold);font-size:12px;font-weight:600}
.verse-media .verse-translation p,.listen .verse-media .verse-translation p{font-size:13px;line-height:1.48;margin:6px 0;color:var(--ink)}
.verse-media .verse-error{font-size:12px;color:#ffdfad}
.lesson .name-reflection,.listen .name-reflection{font:italic 21px/1.32 'Instrument Serif',Georgia,serif;color:#ffe3ac;margin:10px 0}
