:root{--serif:"Italiana",serif;--sans:"Montserrat",sans-serif;--night:#061a16;--night-2:#0b2821;--wine:#36101f;--wine-2:#5b1730;--gold:#d3b66d;--gold-soft:#8f7648;--ivory:#f4ead0;--line:#d8bd7666}
body{background:var(--night);color:var(--ivory);font-family:var(--sans);height:100vh;overflow:hidden}
.garden{background:radial-gradient(circle at 68% 42%,#315549 0,#17382f 25%,#0b2620 54%,#041512 100%)}.garden:before{inset:0;background:radial-gradient(ellipse at 69% 47%,#d3b66d15 0 12%,transparent 45%),linear-gradient(90deg,#0004 0 25%,transparent 48%),repeating-linear-gradient(90deg,transparent 0 149px,#d5ba7320 150px);transform:none}.garden:after{background:linear-gradient(125deg,transparent 45%,#d5ba730e 45.2% 45.5%,transparent 45.7%),radial-gradient(circle at 50% 50%,transparent 55%,#0008 100%)}
header{left:auto;right:25px;top:20px;width:54px;height:54px;padding:0;border:0;background:none;box-shadow:none;backdrop-filter:none}header:before,header>button[data-home],header>p{display:none}#login{display:grid;width:50px;height:50px;border:1px solid var(--line);background:radial-gradient(circle at 35% 30%,#755538,#1a332b 48%,#071713);box-shadow:inset 0 0 0 5px #071713,0 0 24px #d4b66d21;color:var(--gold);font:500 12px var(--sans)}#openMap{display:none}
main{height:100vh;min-height:100vh;padding:0;overflow:hidden}.luxe-shell{height:100vh;display:grid;grid-template-columns:320px minmax(500px,1fr) 82px;gap:0}.control-panel{position:relative!important;inset:auto!important;transform:none!important;width:auto!important;height:100vh!important;padding:26px 20px 22px!important;overflow:auto!important;border:0!important;border-right:1px solid var(--line)!important;border-radius:0!important;background:linear-gradient(180deg,#0a2520f5,#061916f7)!important;box-shadow:14px 0 50px #0004!important;backdrop-filter:blur(14px);color:var(--ivory)!important}.control-panel:before{content:""!important;position:absolute!important;inset:14px 10px!important;border:1px solid #d3b66d26!important;border-radius:14px!important;background:none!important;pointer-events:none}.panel-brand{position:relative;text-align:center;padding:0 0 25px;border-bottom:1px solid var(--line)}.panel-brand>span{display:block;color:var(--gold);font-size:19px}.panel-brand h1{margin:4px 0;font:400 32px var(--serif);color:var(--ivory)}.panel-brand small,.panel-kicker{font:500 7px var(--sans);letter-spacing:.25em;color:var(--gold)}.panel-card,.panel-section,.panel-stats,.panel-tip{position:relative;margin-top:18px;padding:17px;border:1px solid #d4b76e42;border-radius:13px;background:linear-gradient(145deg,#15372f91,#071b1782);box-shadow:inset 0 1px #ffffff0d,0 14px 30px #0003}.panel-card.featured{background:radial-gradient(circle at 85% 0,#d4b66d1c,transparent 38%),linear-gradient(145deg,#17382f,#091e19)}.panel-card small,.panel-section>small{font-size:7px;letter-spacing:.18em;color:#aa925c}.panel-card strong{display:block;margin:12px 0 8px;font:400 18px/1.2 var(--serif);color:var(--gold)}.panel-card p,.panel-section p,.panel-tip p{font:300 9px/1.65 var(--sans);color:#c9c4ae}.panel-section h3{margin:8px 0 13px;font:400 17px var(--serif)}.panel-section button,.panel-back{width:100%;height:39px;padding:0 12px;display:flex;align-items:center;justify-content:space-between;border:1px solid #d4b66d52;border-radius:9px;background:linear-gradient(90deg,#192f29,#3b2a24);color:var(--ivory);font:400 8px var(--sans);letter-spacing:.08em;transition:border-color .18s,background .18s}.panel-section button:hover{border-color:var(--gold);background:#44311f}.panel-section button b{color:var(--gold);font-size:18px}.panel-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding:13px 8px}.panel-stats span{text-align:center;font-size:6px;text-transform:uppercase;color:#928d7d}.panel-stats i{display:block;margin-bottom:5px;font:400 15px var(--serif);color:var(--gold)}
.presentation{position:relative;height:100vh;display:grid;place-items:center;padding:25px 40px 20px;overflow:hidden;background:radial-gradient(circle at 50% 45%,#6a26352b 0 15%,transparent 44%)}.presentation:before{content:"";position:absolute;width:min(650px,70%);height:min(720px,83%);border:1px solid #d7b96c36;border-radius:20px;background:radial-gradient(circle at 50% 35%,#86274430,#260c185c 55%,#0718136e);box-shadow:inset 0 0 70px #0005,0 35px 80px #0004}.presentation:after{content:"";position:absolute;width:min(610px,66%);height:min(680px,79%);border:1px solid #d6b97024;border-radius:15px;pointer-events:none}.presentation-head{position:absolute;z-index:3;top:34px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:20px;color:#a9925d;font:500 7px var(--sans);letter-spacing:.22em;white-space:nowrap}.presentation-head i{width:43px;height:43px;display:grid;place-items:center;border:1px solid #d3b66d42;border-radius:12px;transform:rotate(45deg);font-style:normal;color:var(--gold)}.presentation-head i::first-letter{transform:rotate(-45deg)}.portrait-frame{position:absolute;z-index:1;inset:73px 15% 145px;display:flex;justify-content:center;align-items:flex-end;overflow:hidden}.portrait-frame img{position:relative;z-index:2;width:auto;height:100%;object-fit:contain;filter:drop-shadow(0 25px 32px #0008)}.portrait-halo{position:absolute;z-index:1;top:12%;width:340px;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#d5b9714f 0 3%,#75203a42 34%,transparent 69%);border:1px solid #d4b66d42;box-shadow:0 0 0 25px #d5b97108,0 0 65px #b6315740}.hero-caption{position:absolute;z-index:4;bottom:28px;width:min(560px,74%);padding:20px 30px;text-align:center;border:1px solid #d4b66d49;border-radius:14px;background:linear-gradient(180deg,#0d2620e6,#071915f2);box-shadow:0 20px 45px #0008,inset 0 1px #ffffff0d}.hero-caption p{margin:0;color:#a9915a;font-size:6px;letter-spacing:.25em}.hero-caption h2{margin:7px 0 5px;font:400 clamp(23px,2.5vw,36px) var(--serif);color:var(--ivory)}.hero-caption>span{display:block;color:#b8b6a7;font:300 9px/1.5 var(--sans)}.hero-caption button{margin-top:12px;padding:8px 17px;border:1px solid #d4b66d53;border-radius:99px;background:#3b1323;color:#e4c979;font:500 7px var(--sans);letter-spacing:.13em;text-transform:uppercase}
.quick-dock{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;border-left:1px solid var(--line);background:#071a16}.quick-dock:before{content:"MENU";position:absolute;top:29%;font:500 6px var(--sans);letter-spacing:.22em;color:#776f5d}.quick-dock button{width:52px;height:52px;border:1px solid #d4b66d4d;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,#3f3927,#142b24 58%,#081a16);box-shadow:inset 0 0 0 4px #071a16,0 0 16px #d5b86b12;color:var(--gold);transition:border-color .18s,box-shadow .18s}.quick-dock button:hover{border-color:var(--gold);box-shadow:inset 0 0 0 4px #071a16,0 0 22px #d4b66d4d}.quick-dock button span{font-size:15px}.quick-dock button small{position:absolute;margin-top:72px;font-size:5px;letter-spacing:.1em;color:#9c947e}.quick-dock button+button{margin-top:12px}
.collection-number{position:relative;margin:28px 0 4px;font:400 80px/1 var(--serif);color:#4f3a25;text-shadow:0 1px #d4b66d52}.chapter-shell .control-panel>h1{position:relative;margin:8px 0 12px;font:400 35px/.95 var(--serif);color:var(--ivory);overflow-wrap:anywhere}.chapter-shell .control-panel>p:not(.panel-kicker){position:relative;font:300 10px/1.65 var(--sans);color:#bdb9aa}.panel-back{position:relative;width:auto;height:auto;padding:0 0 10px;border:0;border-bottom:1px solid var(--line);border-radius:0;background:none;color:#a9976b}.panel-tip{display:flex;gap:10px}.panel-tip span{color:var(--gold)}.panel-tip p{margin:0}.chapter-presentation .portrait-frame{inset:82px 19% 138px}.chapter-presentation .portrait-frame img{opacity:.9}.chapter-presentation:before{background:radial-gradient(circle at 50% 38%,#d4b66d29,#36101f85 45%,#0718138a)}
.lesson-panel .topic-seal{position:relative;margin:22px auto;padding:20px 10px;text-align:center;border:1px solid #d4b66d42;border-radius:14px;background:radial-gradient(circle,#5a1a2e,#160b12 68%);box-shadow:inset 0 0 35px #0008}.topic-seal strong{display:block;font:400 57px/1 var(--serif);color:var(--gold);overflow-wrap:anywhere}.topic-seal strong.long{font-size:28px}.topic-seal span{display:block;margin-top:6px;font:400 13px var(--serif);color:#dfd4b6}.primary-listen{position:relative;width:100%;height:42px;border:1px solid #d5b76c5c;border-radius:9px;background:linear-gradient(90deg,#4c162a,#25131a);color:#e2c571;font:500 8px var(--sans);letter-spacing:.12em}.lesson-panel .notes{position:relative;display:grid;gap:7px;margin-top:17px}.lesson-panel .notes button{padding:10px;border:1px solid #d4b66d42;border-radius:8px;background:#102721;color:#cfc9b6;font:500 7px var(--sans);letter-spacing:.06em}.lesson-presentation:before{background:radial-gradient(circle at 76% 25%,#d4b66d1d,transparent 34%),linear-gradient(145deg,#310d1dce,#100b10e8)}.lesson-card{position:relative;z-index:2;width:min(670px,83%);min-height:490px;padding:52px 48px;border:1px solid #d4b66d52;border-radius:17px;background:linear-gradient(145deg,#3b1022e8,#130c12ed);box-shadow:inset 0 1px #ffffff10,inset 0 0 60px #0007,0 30px 70px #0008}.lesson-label{margin:0;color:#b79c60;font:500 7px var(--sans);letter-spacing:.24em}.lesson-card>h2{margin:10px 0 30px;font:400 clamp(48px,7vw,92px)/1 var(--serif);color:var(--ivory);overflow-wrap:anywhere}.guide-cameo{position:absolute;right:18px;top:0;width:170px;height:210px;overflow:hidden;opacity:.45;mask-image:linear-gradient(#000 55%,transparent)}.guide-cameo img{width:100%;height:100%;object-fit:cover;object-position:top}.lesson-card .examples{position:relative;z-index:2;border-top:1px solid #d4b66d31}.lesson-card .example{display:grid;grid-template-columns:28px 30px minmax(0,1fr) minmax(0,1fr);align-items:center;padding:17px 0;border-bottom:1px solid #d4b66d24;font:300 13px var(--sans);color:#d5d0be}.lesson-card .example small{color:#8e7b51;font-size:7px}.lesson-card .example button{width:23px;height:23px;border:1px solid #d4b66d55;border-radius:50%;background:#24121a;color:var(--gold);font-size:7px}.lesson-card .example strong{font-weight:500;color:#f0e5c9}.lesson-card .example span{color:#a9a594}
footer{display:none!important}
aside#map{display:none;inset:0;padding:0;background:#041512e8;backdrop-filter:blur(14px);overflow:hidden}aside#map.open{display:block}aside#map:before{content:"CHOISISSEZ VOTRE UNIVERS";position:absolute;z-index:3;left:50%;top:7%;transform:translateX(-50%);color:#a78f58;font:500 7px var(--sans);letter-spacing:.28em}aside#map>div{position:absolute;z-index:4;left:50%;top:50%;width:170px;height:170px;transform:translate(-50%,-50%);display:grid;place-items:center;border:1px solid #d4b66d4a;border-radius:50%;background:radial-gradient(circle,#3b1222,#101c19 67%);box-shadow:0 0 0 12px #d4b66d0c,0 0 60px #6b1d3a55}aside#map>div p{font:400 19px var(--serif);color:var(--gold);text-transform:none}aside#map>div button{position:absolute;right:50%;bottom:-58px;transform:translateX(50%);width:42px;height:42px;border:1px solid #d4b66d58;border-radius:50%;background:#0a201b;color:var(--gold);font:300 23px var(--sans)}#mapContent{position:absolute;left:50%;top:50%;width:690px;height:690px;margin:0;transform:translate(-50%,-50%);display:block}.universe{position:absolute;left:50%;top:50%;width:108px;height:108px;min-height:0;padding:8px;transform:translate(-50%,-50%) rotate(calc(var(--i)*32.727deg)) translateY(-280px) rotate(calc(var(--i)*-32.727deg));border:1px solid hsla(var(--h),65%,72%,.65);border-radius:50%;background:radial-gradient(circle at 38% 30%,hsla(var(--h),55%,48%,.75),#0b211c 62%);box-shadow:inset 0 0 0 6px #071a16,0 0 22px hsla(var(--h),70%,55%,.25);color:var(--ivory);text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:filter .18s,box-shadow .18s}.universe:hover{transform:translate(-50%,-50%) rotate(calc(var(--i)*32.727deg)) translateY(-280px) rotate(calc(var(--i)*-32.727deg));filter:brightness(1.3);box-shadow:inset 0 0 0 6px #071a16,0 0 32px hsla(var(--h),75%,60%,.58)}.universe>span{position:static;font:400 22px var(--serif);color:#f1d889}.universe small{font-size:5px;color:#c7b275}.universe strong{display:block;max-width:90%;margin:3px 0 0;font:400 10px/1.05 var(--serif);color:#fff3d3}.universe em{display:none}
#soundModal{background:#041512e8;backdrop-filter:blur(14px)}#soundModal>section{width:min(880px,92vw);border:1px solid #d4b66d4d;border-radius:18px;background:linear-gradient(145deg,#102a23,#190d14);box-shadow:inset 0 1px #ffffff0e,0 40px 100px #000c}.modal-head{border-bottom:1px solid #d4b66d30}.modal-head small{color:#aa925c}.modal-head h2{font:400 clamp(32px,5vw,54px) var(--serif);color:var(--ivory)}.modal-head button{color:var(--gold)}#soundOptions{grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}#soundOptions button{min-height:102px;border:1px solid #d4b66d37;border-radius:12px;background:linear-gradient(145deg,#18382f,#170e13);box-shadow:inset 0 1px #ffffff0a;color:#d9d2bd}#soundOptions button:hover{transform:translateY(-2px);background:#392018;border-color:#d4b66d70}#soundOptions small{color:#8f7a4f}#soundOptions strong{font:400 28px var(--serif);color:#eddbab}#soundOptions span{color:#8f8b7e}
#noteModal{background:#041512dc;backdrop-filter:blur(14px)}#noteModal section{border:1px solid #d4b66d55;border-radius:16px;background:linear-gradient(145deg,#f5edda,#c4b99b);box-shadow:0 40px 100px #000b;color:#17382f}#noteModal section:before{color:#765e35}.tools{border-color:#8d774b66;background:#eee5d0}.surface{border-color:#9b835669;background:#f3ead7}.tools button.active{background:#4c182b}
@media(max-width:900px){.luxe-shell{grid-template-columns:280px minmax(400px,1fr) 70px}.portrait-frame{inset-inline:8%}.hero-caption{width:82%}.lesson-card{width:88%}}
@media(max-width:780px){body{overflow:hidden}.luxe-shell{height:100svh;display:block;overflow:auto}.control-panel{width:100%!important;height:auto!important;min-height:43svh;padding:18px 14px!important;border-right:0!important;border-bottom:1px solid var(--line)!important}.home-shell .control-panel{padding-bottom:14px!important}.panel-brand{padding-bottom:13px}.panel-brand h1{font-size:25px}.panel-card{display:none}.panel-section,.panel-stats{margin-top:10px}.panel-section{padding:12px}.panel-section h3{margin:5px 0 8px}.presentation{height:57svh;min-height:410px;padding:12px}.presentation:before{width:88%;height:87%}.presentation:after{width:84%;height:83%}.presentation-head{top:16px}.portrait-frame{inset:45px 9% 105px}.portrait-halo{width:210px}.hero-caption{bottom:10px;width:88%;padding:13px 15px}.hero-caption h2{font-size:23px}.hero-caption>span{font-size:7px}.quick-dock{position:fixed;z-index:8;right:8px;bottom:18px;display:flex;flex-direction:row;padding:7px;border:1px solid #d4b66d35;border-radius:99px;background:#061915de;backdrop-filter:blur(10px)}.quick-dock:before,.quick-dock button small{display:none}.quick-dock button{width:42px;height:42px}.quick-dock button+button{margin:0}.collection-number{font-size:54px;margin-top:15px}.chapter-shell .control-panel>h1{font-size:29px}.chapter-presentation{height:57svh}.chapter-presentation .portrait-frame{inset:45px 13% 101px}.lesson-shell .control-panel{min-height:auto}.lesson-panel .topic-seal{margin:12px auto;padding:10px}.topic-seal strong{font-size:40px}.lesson-panel .panel-section{margin-top:10px}.lesson-panel .notes{grid-template-columns:1fr 1fr;margin-bottom:6px}.lesson-presentation{height:60svh;min-height:430px}.lesson-card{width:94%;min-height:360px;padding:38px 18px 25px}.lesson-card>h2{font-size:54px;margin:8px 0 20px}.lesson-card .example{grid-template-columns:20px 27px minmax(0,1fr) minmax(0,1fr);font-size:10px;padding:12px 0}.guide-cameo{width:115px;height:140px}.presentation-head{font-size:5px}.presentation-head i{width:30px;height:30px}aside#map{overflow:auto}aside#map:before{top:18px}aside#map>div{position:relative;left:50%;top:55px;width:130px;height:130px;transform:translateX(-50%)}aside#map>div button{bottom:-49px}#mapContent{position:relative;left:auto;top:auto;width:100%;height:auto;margin:105px auto 35px;transform:none;display:grid;grid-template-columns:repeat(3,1fr);gap:9px;padding:12px}.universe,.universe:hover{position:relative;left:auto;top:auto;width:100%;height:auto;aspect-ratio:1;transform:none}.universe strong{font-size:9px}#soundOptions{grid-template-columns:repeat(2,minmax(0,1fr))}#soundOptions button{min-height:82px}.modal-head h2{font-size:30px}}

/* Final layout guards: the earlier prototype styled every direct child of an
   aside as flex. The game console owns its layout explicitly. */
.control-panel > div{display:block!important}
.control-panel > .panel-stats{display:grid!important}
.control-panel > .panel-tip{display:flex!important}
aside#map{z-index:30!important}
aside#map:before,aside#map>div,#mapContent{left:calc(50% + 160px)}
@media(max-width:780px){aside#map:before,aside#map>div{left:50%}#mapContent{left:auto}.panel-brand small{display:none}}

/* Production layout: occupy the complete browser viewport instead of inheriting
   the shrink-to-fit grid behaviour from the first prototype. */
main#stage{display:block!important;width:100vw!important;max-width:none!important;place-items:initial!important}
.luxe-shell{width:100%!important;max-width:none!important;min-width:0!important}
.luxe-shell>*{min-width:0}
.control-panel,.presentation,.quick-dock{box-sizing:border-box}

/* Antique-gold metal treatment shared by every primary control. */
.panel-section button,.hero-caption button,.primary-listen,.lesson-panel .notes button,
#soundOptions button,.quick-dock button,aside#map>div button{
  border-color:#d8b65f!important;
  background:
    linear-gradient(112deg,transparent 0 25%,rgba(255,249,204,.16) 34%,transparent 43%),
    linear-gradient(145deg,#172f28 0%,#3a2a1b 48%,#111f1b 100%)!important;
  box-shadow:inset 0 1px 0 rgba(255,248,196,.36),inset 0 -1px 0 #5c431c,0 9px 24px rgba(0,0,0,.3)!important;
  color:#f1d783!important;
}
.panel-section button:hover,.hero-caption button:hover,.primary-listen:hover,
.lesson-panel .notes button:hover,#soundOptions button:hover,.quick-dock button:hover,
aside#map>div button:hover{
  border-color:#ffe69a!important;
  background:
    linear-gradient(112deg,transparent 0 18%,rgba(255,255,224,.34) 34%,transparent 50%),
    linear-gradient(145deg,#24443a 0%,#5c4323 48%,#142720 100%)!important;
  color:#fff0b2!important;
}

/* Desktop universe selector: a self-scaling orbit that always remains inside
   the viewport, including 16:9 laptops and browser zoom. */
@media(min-width:781px){
  aside#map{overflow:hidden!important}
  aside#map:before,aside#map>div,#mapContent{left:calc(50% + min(160px,10vw))}
  #mapContent{
    --orbit-radius:min(27vw,31vh,290px);
    width:min(720px,calc(100vw - 350px),96vh);
    height:min(720px,96vh);
    overflow:visible!important;
  }
  aside#map>div{width:clamp(132px,18vh,170px);height:clamp(132px,18vh,170px)}
  .universe,.universe:hover{
    width:clamp(86px,12vh,110px)!important;
    height:clamp(86px,12vh,110px)!important;
    min-width:0!important;
    min-height:0!important;
    overflow:hidden!important;
    transform:translate(-50%,-50%) rotate(calc(var(--i)*32.727deg)) translateY(calc(-1 * var(--orbit-radius))) rotate(calc(var(--i)*-32.727deg))!important;
    border:2px solid #cba34b!important;
    background:
      radial-gradient(circle at 29% 20%,rgba(255,255,224,.48) 0 2%,rgba(255,240,170,.14) 9%,transparent 23%),
      linear-gradient(118deg,transparent 0 28%,rgba(255,231,145,.15) 36%,transparent 46%),
      radial-gradient(circle at 50% 36%,hsla(var(--h),38%,32%,.72),#092019 68%)!important;
    box-shadow:inset 0 0 0 5px #071a16,inset 0 1px 0 #fff2af,0 0 0 1px #654918,0 0 25px hsla(var(--h),45%,52%,.25)!important;
    filter:none!important;
    color:#fff0bd!important;
  }
  .universe:hover{
    border-color:#ffe399!important;
    background:
      linear-gradient(115deg,transparent 0 17%,rgba(255,255,231,.42) 34%,transparent 50%),
      radial-gradient(circle at 50% 36%,hsla(var(--h),43%,38%,.78),#0b281f 69%)!important;
    box-shadow:inset 0 0 0 5px #071a16,inset 0 1px 0 #fff7ca,0 0 0 1px #8d6927,0 0 34px rgba(224,184,85,.45)!important;
    color:#fff6d0!important;
  }
  .universe>span{font-size:clamp(18px,3.1vh,25px)!important;color:#f4d47b!important}
  .universe small{font-size:clamp(4px,.68vh,6px)!important;color:#cfb25f!important}
  .universe strong{max-width:84%!important;margin-top:3px!important;font-size:clamp(8px,1.15vh,10px)!important;line-height:1.08!important;overflow-wrap:anywhere!important;color:#fff0c4!important}
}

@media(min-width:781px) and (max-height:720px){
  .control-panel{padding-top:18px!important;padding-bottom:14px!important}
  .panel-brand{padding-bottom:14px}.panel-card,.panel-section,.panel-stats,.panel-tip{margin-top:10px;padding:12px}
  .panel-card strong{margin:7px 0 4px}.panel-card p,.panel-section p,.panel-tip p{line-height:1.45}
  .portrait-frame{top:54px}.hero-caption{bottom:14px;padding:13px 22px}.hero-caption h2{margin:4px 0 2px}
}

@media(max-width:780px){
  main#stage{width:100%!important;height:100svh!important}
  .luxe-shell{width:100%!important}
  aside#map>div{position:absolute!important;left:50%!important;right:auto!important;top:54px!important;margin:0!important;transform:translateX(-50%)!important}
  #mapContent{grid-template-columns:repeat(2,minmax(0,1fr))!important;max-width:520px;margin-top:235px!important;justify-items:center}
  .universe,.universe:hover{
    width:min(154px,100%)!important;height:min(154px,40vw)!important;aspect-ratio:1!important;min-width:0!important;min-height:0!important;
    padding:10px 7px!important;overflow:hidden!important;
    border:2px solid #cba34b!important;
    background:radial-gradient(circle at 28% 18%,rgba(255,250,211,.35),transparent 22%),linear-gradient(145deg,#234b3b,#081d17 68%)!important;
    box-shadow:inset 0 0 0 4px #071a16,inset 0 1px #fff0aa,0 0 16px rgba(204,165,73,.2)!important;
    color:#fff0c4!important;filter:none!important;
  }
  .universe:hover{border-color:#ffe399!important;background:radial-gradient(circle at 30% 18%,rgba(255,255,223,.44),transparent 24%),linear-gradient(145deg,#315b49,#0b261e 68%)!important}
  .universe>span{color:#f4d47b!important}.universe small{color:#cfb25f!important}
  .universe strong{max-width:92%!important;font-size:clamp(9px,3vw,12px)!important;overflow-wrap:anywhere!important;color:#fff0c4!important}
  .hero-caption h2,.chapter-shell .control-panel>h1,.lesson-card>h2{overflow-wrap:anywhere;word-break:normal}
  .panel-section button,.lesson-panel .notes button{min-width:0;white-space:normal}
}

/* Readability and alignment pass for large desktop displays. */
html,body{width:100%;max-width:100%;min-width:0}
.garden{background:radial-gradient(circle at 62% 42%,#3b6b59 0,#245143 27%,#10352b 56%,#061e19 100%)}
@media(min-width:781px){
  .luxe-shell{grid-template-columns:clamp(350px,21vw,420px) minmax(0,1fr) clamp(96px,6.2vw,118px)!important}
  .control-panel{padding:32px 26px 26px!important;background:linear-gradient(180deg,#11382ff7,#08261ff9)!important}
  .panel-brand{padding-bottom:28px}.panel-brand>span{font-size:24px}.panel-brand h1{font-size:39px}.panel-brand small,.panel-kicker{font-size:9px}
  .panel-card,.panel-section,.panel-stats,.panel-tip{margin-top:20px;padding:20px;background:linear-gradient(145deg,#1d4a3ec4,#0b2a23d9)}
  .panel-card small,.panel-section>small{font-size:9px}.panel-card strong{font-size:23px}.panel-card p,.panel-section p,.panel-tip p{font-size:12px;color:#eee5cf}
  .panel-section h3{font-size:22px}.panel-section button,.panel-back{min-height:48px;font-size:11px}
  .panel-stats span{font-size:8px;color:#c7bfa9}.panel-stats i{font-size:20px}
  .presentation-head{top:30px;font-size:10px;color:#e0bf69}.presentation-head i{width:50px;height:50px}
  .hero-caption{width:min(650px,78%);padding:24px 34px;background:linear-gradient(180deg,#123a30f3,#09281ff8)}
  .hero-caption p{font-size:8px;color:#daba69}.hero-caption h2{font-size:clamp(36px,3.1vw,52px)}.hero-caption>span{font-size:12px;color:#eee5cf}.hero-caption button{font-size:10px;padding:11px 22px}
  .quick-dock:before{font-size:9px;color:#c4a95f}.quick-dock button{width:66px;height:66px}.quick-dock button span{font-size:21px}.quick-dock button small{margin-top:88px;font-size:8px;color:#dcc274}
  .collection-number{font-size:94px}.chapter-shell .control-panel>h1{font-size:43px}.chapter-shell .control-panel>p:not(.panel-kicker){font-size:12px}
  .topic-seal strong{font-size:68px}.topic-seal strong.long{font-size:34px}.topic-seal span{font-size:17px}.primary-listen{height:49px;font-size:11px}
  .lesson-panel .notes button{min-height:42px;font-size:9px}.lesson-label{font-size:9px}.lesson-card .example{font-size:16px}.lesson-card .example small{font-size:9px}

  aside#map:before,aside#map>div,#mapContent{left:50%!important}
  aside#map:before{top:4.5%;font-size:10px;color:#e3c269}
  #mapContent{--orbit-radius:min(30vw,32vh,315px);width:min(780px,96vw,96vh);height:min(780px,96vh)}
  aside#map>div{width:clamp(158px,21vh,205px);height:clamp(158px,21vh,205px)}
  aside#map>div p{font-size:25px;color:#f0cf78}
  .universe,.universe:hover{width:clamp(104px,15vh,126px)!important;height:clamp(104px,15vh,126px)!important}
  .universe>span{font-size:clamp(25px,3.8vh,33px)!important}
  .universe small{font-size:clamp(7px,.9vh,9px)!important}
  .universe strong{font-size:clamp(11px,1.45vh,14px)!important;line-height:1.12!important}
}

@media(min-width:781px) and (max-height:760px){
  .control-panel{padding:18px 20px 14px!important}.panel-brand{padding-bottom:13px}.panel-brand h1{font-size:31px}.panel-brand>span{font-size:19px}
  .panel-card,.panel-section,.panel-stats,.panel-tip{margin-top:9px;padding:11px}.panel-card strong{font-size:18px}.panel-card p,.panel-section p,.panel-tip p{font-size:9px}.panel-section h3{font-size:17px}
  .hero-caption{bottom:12px;padding:13px 24px}.hero-caption h2{font-size:31px}.hero-caption>span{font-size:9px}
}

@media(max-width:780px){
  .control-panel{background:linear-gradient(180deg,#123c32,#08271f)!important}
  .panel-brand h1{font-size:29px}.panel-brand>span{font-size:20px}
  .panel-section h3{font-size:20px}.panel-section button{font-size:10px}.panel-stats span{font-size:7px}.panel-stats i{font-size:18px}
  .hero-caption{background:linear-gradient(180deg,#123a30f5,#09281ff9)}.hero-caption h2{font-size:27px}.hero-caption>span{font-size:9px}
  aside#map:before{font-size:8px;color:#e3c269}.universe>span{font-size:27px!important}.universe small{font-size:7px!important}.universe strong{font-size:12px!important}
  .quick-dock button{width:48px;height:48px}.quick-dock button span{font-size:17px}
  .lesson-panel .notes button{font-size:8px}.lesson-card .example{font-size:12px}
}