/*
 * LAMP · Refonte globale V3 — inspirée du prototype #3 approuvé.
 * Surcouche CSS non destructive : conserve toutes les sections et leurs événements.
 * Logo : une seule lampe visible à la fois (accueil : héros ; autres pages : navigation).
 */
:root{
  --lamp-v3-night:#010b1d;
  --lamp-v3-deep:#06142e;
  --lamp-v3-surface:#081c3c;
  --lamp-v3-blue:#236ef0;
  --lamp-v3-border:rgba(79,150,255,.38);
  --lamp-v3-ink:#f1f7ff;
  --lamp-v3-muted:#b3c5e6;
  --side:204px;
}
html,body{background:var(--lamp-v3-night)}
#app.reference-shell{min-height:100vh;background:var(--lamp-v3-night);color:var(--lamp-v3-ink)}
#app .stage-shell{
  margin-left:var(--side);
  background:radial-gradient(ellipse 72% 48% at 76% 1%,rgba(26,86,226,.19),transparent 80%),linear-gradient(180deg,#051530 0%,#020e24 45%,#010b1d 100%);
}
#app .side-panel{
  width:var(--side);
  background:linear-gradient(180deg,#06152f,#030e23 68%,#020b1a);
  padding:24px 13px 15px;
  border-right:1px solid rgba(71,127,222,.24);
  box-shadow:none;
}
#app .side-brand{display:flex;justify-content:flex-start;align-items:center;gap:11px;padding:0 11px 24px;min-height:48px}
#app .side-brand img{width:42px;height:42px;border-radius:12px;object-fit:cover;box-shadow:0 0 18px rgba(33,108,246,.22)}
#app .side-brand div{display:block}
#app .side-brand b{font-family:system-ui,sans-serif;font-size:18px;letter-spacing:.23em;margin:0;font-weight:760}
#app .side-nav{display:grid;gap:5px}
#app .side-nav button,
#app .side-bottom button{
  display:grid;grid-template-columns:25px 1fr;align-items:center;gap:11px;
  min-height:41px;padding:10px 12px;border-radius:10px;text-align:left;
  color:#becde8;background:transparent;border:1px solid transparent;
  transition:background .18s,border-color .18s,color .18s;
}
#app .side-nav button span,#app .side-nav button .nav-svg{font-size:18px;color:#b4cdf7;min-width:25px}
#app .side-nav button b,#app .side-bottom button b{font-size:12px;font-weight:500;letter-spacing:0}
#app .side-nav button:hover,#app .side-bottom button:hover{background:rgba(33,91,195,.20);color:white}
#app .side-nav button.active{
  background:linear-gradient(90deg,#174caa,#0b2759);
  color:white;border-color:rgba(84,161,255,.36);
  box-shadow:inset 3px 0 0 #489dff,0 9px 22px rgba(0,25,70,.15);
}
#app .side-bottom{border-top:1px solid rgba(79,150,255,.24);padding-top:12px}
#app .side-bottom .language-picker,
#app .side-bottom .side-archives,#app .side-bottom #installBtn,#app .side-bottom #logout{display:initial}
#app .side-bottom .language-picker{display:block}
#app .side-bottom #logout{display:block!important}
#app .side-bottom .side-archives{display:block}
#app .screen{max-width:1460px;margin:0 auto;padding:27px clamp(16px,2.1vw,38px) 85px;color:var(--lamp-v3-ink)}
#app .screen h1,#app .screen h2,#app .screen h3{color:#f8fbff}
#app .screen p{line-height:1.65}
#app .screen .page-head,
#app .screen .explore-head{
  background:radial-gradient(circle at 90% 12%,rgba(35,103,247,.23),transparent 35%),linear-gradient(135deg,#0a2249,#06142e);
  border:1px solid var(--lamp-v3-border);border-radius:20px;
  padding:clamp(22px,3vw,34px);box-shadow:0 18px 50px rgba(0,6,22,.20);
}
#app .screen .page-head h1,#app .screen .explore-head h1{font-family:system-ui,sans-serif;font-size:clamp(30px,4vw,48px);font-weight:700;letter-spacing:-.035em}
#app .screen .page-head>p,#app .screen .explore-head>p{color:var(--lamp-v3-muted);font-size:15px}
#app .card,
#app .explore-gate,#app .discovery-card,#app .field-card,#app .featured-concept-card,
#app .concept-tile,#app .library-card,#app .settings-card,#app .notes-card,
#app .depth-card,#app .history-topic,#app .history-person,#app .history-concept{
  background:linear-gradient(143deg,rgba(12,39,84,.96),rgba(5,21,50,.98));
  border:1px solid rgba(66,133,234,.36);
  box-shadow:0 15px 34px rgba(0,6,22,.20);
  border-radius:17px;color:var(--lamp-v3-ink);
}
#app .explore-gate:hover,#app .discovery-card:hover,#app .field-card:hover,#app .concept-tile:hover,
#app .featured-concept-card:hover,#app .history-topic:hover{border-color:rgba(102,181,255,.80)}
#app .explore-gate p,#app .discovery-card p,#app .field-card small{color:var(--lamp-v3-muted)}
#app :is(button,input,textarea,select,a):focus-visible{outline:2px solid #91c8ff;outline-offset:3px}
#app button.primary,#app .primary,#app .askbox button{
  background:linear-gradient(110deg,#2173f1,#1463e6);
  border:1px solid rgba(147,204,255,.37);border-radius:12px;color:white;
  box-shadow:0 7px 24px rgba(12,80,211,.24);
}
#app .askbox{border:1px solid rgba(100,167,250,.47);background:rgba(11,31,72,.79);box-shadow:inset 0 1px 0 rgba(172,215,255,.06)}
#app .askbox input,#app input,#app textarea{color:var(--lamp-v3-ink)}
#app .askbox input::placeholder{color:#acbfe0;opacity:1}
#app .chip-row button,#app .reference-chips button,#app .settings-langs button,
#app .filter-chip,#app .pill{
  border:1px solid rgba(75,144,248,.40);background:rgba(17,48,104,.60);color:#e2eeff;border-radius:999px;
}
#app .modal-section,#app #detailDialog{color:var(--lamp-v3-ink)}
#detailDialog{background:linear-gradient(145deg,#0b234b,#04142d);color:#f3f7ff;border:1px solid rgba(68,149,255,.45);border-radius:22px}
#detailDialog::backdrop{background:rgba(0,6,24,.76);backdrop-filter:blur(6px)}
#app .notes-area{background:#071b38;border-color:rgba(84,159,255,.34);color:#f4f8ff}
#app .lamp-platon{--lp-line:rgba(85,160,255,.32)}
#app .lamp-platon .lp-panel,#app .lamp-platon .lp-work,#app .lamp-platon .lp-mini{
  background:linear-gradient(145deg,#0c2b58,#06182f);border-color:rgba(85,160,255,.36);
}

/* UNIQUE OFFICIAL LOGO: hero on home; original sidebar on all other views.
   CSS :has is supported in current Safari, Chrome and Firefox. */
#app:has(.reference-home) .side-brand img{display:none}
#app:has(.reference-home) .mobile-brand img{display:none}
#app:has(.reference-home) .side-brand{padding-top:10px}
#app:has(.reference-home) .side-brand b{letter-spacing:.33em;font-size:19px}

/* Prototype #3: large hero with the original single lamp image. */
#app .reference-home{
  display:grid;gap:16px;border:0;background:transparent;border-radius:0;
  box-shadow:none;overflow:visible;
}
#app .reference-home .home-hero{
  position:relative;min-height:458px;margin:0;
  border:1px solid rgba(54,127,245,.52);border-radius:20px;overflow:hidden;
  background:
    radial-gradient(ellipse 51% 83% at 69% 15%,rgba(28,119,255,.42),transparent 67%),
    radial-gradient(ellipse 62% 75% at 95% 13%,rgba(7,64,193,.36),transparent 75%),
    linear-gradient(123deg,#041633 0%,#092654 44%,#031632 100%);
  box-shadow:0 24px 72px rgba(0,6,25,.22);
}
#app .reference-home .home-hero::before{
  content:"";position:absolute;z-index:0;inset:auto -20% -60% auto;
  width:68%;aspect-ratio:1/1;border-radius:50%;height:auto;
  background:radial-gradient(circle at 22% 20%,rgba(23,110,255,.40),rgba(8,48,133,.28) 44%,rgba(1,20,55,.08) 61%,transparent 70%);
  border:1px solid rgba(70,148,253,.12);
  transform:rotate(-22deg);pointer-events:none;
}
#app .reference-home .home-hero::after{content:none}
#app .reference-home .hero-profile-btn{display:none}
#app .reference-home .hero-scene{
  position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr);
  align-content:center;gap:30px;min-height:458px;
  padding:clamp(27px,4vw,58px);
}
#app .reference-home .hero-lead{display:flex;align-items:center;gap:clamp(22px,3.6vw,48px);min-width:0}
#app .reference-home .hero-lamp-stage{position:relative;flex:0 0 165px;width:165px;margin:0;align-self:center}
#app .reference-home .hero-lamp-stage::before{content:none}
#app .reference-home .hero-lamp-stage img{
  display:block;width:165px;height:165px;border-radius:25px;object-fit:cover;object-position:50% 39%;
  filter:none;border:1px solid rgba(113,170,255,.47);
  box-shadow:0 0 30px rgba(22,98,232,.20);
}
#app .reference-home .hero-lamp-stage small{display:none}
#app .reference-home .hero-core{position:relative;align-self:center;flex:1;text-align:left;padding:0;margin:0;z-index:1;min-width:0}
#app .reference-home .hero-core .hero-name{
  font:700 clamp(40px,5.4vw,76px)/1.11 system-ui,-apple-system,sans-serif;
  letter-spacing:-.043em;margin:0;color:#fff;text-align:left;
}
#app .reference-home .hero-core .hero-tag{
  margin:19px 0 0;font:400 clamp(14px,1.6vw,18px)/1.65 system-ui,sans-serif;
  color:#b8c9e8;letter-spacing:0;max-width:660px;text-align:left;
}
#app .reference-home .hero-search{display:grid;gap:19px;width:100%;max-width:1110px;margin:0 auto}
#app .reference-home .hero-search .askbox{
  display:grid;grid-template-columns:25px 1fr auto;align-items:center;gap:12px;
  width:100%;max-width:none;min-height:66px;margin:0;
  background:rgba(9,31,77,.81);border:1px solid rgba(91,157,249,.54);
  border-radius:999px;padding:6px 7px 6px 25px;
}
#app .reference-home .hero-search .askbox input{font-size:15px;width:100%;min-height:44px}
#app .reference-home .hero-search .askbox .askmark{font-size:23px;color:#b9ceeb}
#app .reference-home .hero-search .askbox button{
  display:flex;gap:14px;align-items:center;justify-content:center;
  min-width:160px;width:auto;height:51px;min-height:51px;padding:0 23px;
  font-size:15px;line-height:1;border-radius:999px;font-weight:750;
  background:linear-gradient(105deg,#328aff,#1464ee);
}
#app .reference-home .hero-search .askbox button:after{content:"→";display:inline;font-size:23px;line-height:1}
#app .reference-home .reference-chips{justify-content:flex-start;gap:10px;margin:0}
#app .reference-home .reference-chips button{
  padding:9px 16px;border-radius:999px;font-size:13px;
  background:rgba(20,54,119,.58);border:1px solid rgba(68,148,251,.56);
  color:#e8f1ff;box-shadow:none;
}
#app .reference-home .home-action-grid{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;padding:0;background:none;
}
#app .reference-home .home-action{
  position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;
  min-height:235px;gap:14px;padding:clamp(20px,2.4vw,30px);
  text-align:left;overflow:hidden;isolation:isolate;
  background:linear-gradient(135deg,#071c42 0%,#092956 52%,#031937 100%);
  border:1px solid rgba(61,132,249,.52);border-radius:18px;
  color:white;box-shadow:none;transform:none;
}
#app .reference-home .home-action::before{
  content:"";position:absolute;right:-55px;bottom:-104px;width:260px;height:220px;
  border-radius:45% 54% 0 0;z-index:-1;
  background:radial-gradient(ellipse at 22% 20%,rgba(37,120,255,.68),transparent 66%);
  pointer-events:none;
}
#app .reference-home .home-action:nth-child(2)::before{
  bottom:-35px;right:-30px;width:230px;height:170px;border-radius:0;
  background:radial-gradient(circle at 20% 75%,#2783ff 0 2px,transparent 3px),
             radial-gradient(circle at 57% 28%,#2783ff 0 3px,transparent 4px),
             radial-gradient(circle at 79% 75%,#2783ff 0 3px,transparent 4px),
             linear-gradient(140deg,transparent 32%,rgba(48,139,255,.27) 32.2%,transparent 33%),
             linear-gradient(40deg,transparent 60%,rgba(48,139,255,.33) 60.2%,transparent 61%);
}
#app .reference-home .home-action:nth-child(3)::before{
  width:240px;height:200px;right:-72px;bottom:-130px;transform:rotate(-12deg);
  border:1px solid rgba(68,153,255,.28);background:linear-gradient(145deg,#195ac7,#0a337b);
  box-shadow:-28px -17px 0 rgba(35,108,233,.30),-54px -34px 0 rgba(44,119,253,.15);
}
#app .reference-home .home-action .action-icon{font-size:0;line-height:1}
#app .reference-home .home-action .action-icon svg{
  display:block;width:37px;height:37px;fill:none;stroke:#c3dfff;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round;
}
#app .reference-home .home-action h3{
  font:700 clamp(23px,2.35vw,30px)/1.15 system-ui,sans-serif;margin:0;
}
#app .reference-home .home-action p{
  max-width:290px;margin:0;color:#bfd0ed;font-size:14px;line-height:1.6;text-align:left;
}
#app .reference-home .home-action .action-go{
  display:grid;place-items:center;margin-top:auto;width:44px;height:44px;
  background:rgba(49,114,208,.42);border-radius:50%;font-size:23px;color:white;
}
#app .reference-home .home-action:hover{border-color:#79b7ff;transform:translateY(-2px)}
#app .reference-home .home-motto{padding:3px 6px;color:#afc9e6}
#app .reference-home .mobile-portal-grid{display:none}

/* Harmonisation des interfaces secondaires, sans masquer les sections. */
#app :is(.explore-shell,.concept-hub,.concept-feature-page,.science-shell,.geo-mountain-shell,.lamp-platon){color:#eaf4ff}
#app .concept-hub,#app .concept-feature-page{background:linear-gradient(165deg,#071b3d,#03142d);border-color:rgba(71,138,244,.35)}
#app .concept-hub-head h1,#app .concept-feature-body h1{color:#fff}
#app .section-head,#app .section-head h2,#app .explore-section-head h2{color:#f3f8ff}
#app .lamp-platon .lp-hero{
  background:radial-gradient(circle at 90% 0%,rgba(34,108,248,.33),transparent 40%),linear-gradient(120deg,#0a2b60,#04152e);
  border-color:rgba(78,149,245,.45);
}
#app .lamp-platon .lp-work:hover,#app .lamp-platon .lp-mini:hover{background:linear-gradient(145deg,#103b79,#071d3a)}
#app .history-topic,#app .history-person{color:#f4f8ff}
#app .auth{background:linear-gradient(165deg,#0d2b5e,#061833);border:1px solid rgba(65,147,255,.42);border-radius:22px;box-shadow:0 30px 90px rgba(0,6,30,.35)}
#app .auth input,.auth input{border-color:rgba(82,151,247,.42);border-radius:12px}
#app .notes-area:focus{border-color:#84b8ff}
#app .mobile-topbar{
  background:rgba(3,17,41,.96);border-bottom:1px solid rgba(69,141,247,.26);
}
#app .mobile-nav{background:rgba(3,15,35,.96);border-top:1px solid rgba(85,151,241,.26)}
#app .mobile-nav button.active{color:#77b7ff}

/* Tablet and mobile: preserve all accessible navigation. */
@media(max-width:1020px) and (min-width:901px){
  #app .reference-home .hero-lead{gap:22px}
  #app .reference-home .hero-lamp-stage,#app .reference-home .hero-lamp-stage img{width:128px;height:128px;flex-basis:128px}
  #app .reference-home .hero-core .hero-name{font-size:46px}
  #app .reference-home .home-action{padding:18px;min-height:238px}
}
@media(max-width:900px){
  :root{--side:204px}
  #app .side-panel{width:min(284px,86vw);transform:translateX(-105%)}
  #app.menu-open .side-panel{transform:translateX(0)}
  #app .stage-shell{margin-left:0;padding-top:60px}
  #app .screen{padding:15px 13px 90px}
  #app .reference-home .home-hero{border-radius:17px;min-height:auto}
  #app .reference-home .hero-scene{min-height:auto;padding:33px 23px;gap:23px}
  #app .reference-home .hero-lead{gap:20px}
  #app .reference-home .hero-lamp-stage{flex-basis:110px;width:110px}
  #app .reference-home .hero-lamp-stage img{width:110px;height:110px;border-radius:18px}
  #app .reference-home .hero-core .hero-name{font-size:clamp(27px,5vw,48px)}
  #app .reference-home .hero-core .hero-tag{font-size:13px;margin:9px 0 0}
  #app .reference-home .home-action-grid{display:grid}
  #app .reference-home .home-action{min-height:190px;padding:17px}
  #app .reference-home .home-action h3{font-size:21px}
  #app .reference-home .home-action p{font-size:12px}
  #app .reference-home .mobile-portal-grid{display:grid}
  #app .reference-home .home-motto{display:none}
}
@media(max-width:660px){
  #app .reference-home{gap:11px}
  #app .reference-home .hero-lead{display:flex;align-items:flex-start;gap:14px}
  #app .reference-home .hero-lamp-stage{flex:0 0 80px;width:80px}
  #app .reference-home .hero-lamp-stage img{width:80px;height:80px;border-radius:14px}
  #app .reference-home .hero-core .hero-name{font-size:clamp(29px,7vw,43px)}
  #app .reference-home .hero-core .hero-tag{font-size:12px;line-height:1.5}
  #app .reference-home .hero-scene{gap:22px;padding:25px 15px}
  #app .reference-home .hero-search .askbox{padding:5px 6px 5px 12px;min-height:52px;grid-template-columns:18px minmax(0,1fr) auto;gap:6px}
  #app .reference-home .hero-search .askbox input{font-size:12px;min-width:0;min-height:35px}
  #app .reference-home .hero-search .askbox button{min-width:43px;width:43px;height:40px;min-height:40px;padding:0;border-radius:50%;font-size:0}
  #app .reference-home .hero-search .askbox button::after{font-size:21px}
  #app .reference-home .reference-chips{gap:6px;flex-wrap:wrap}
  #app .reference-home .reference-chips button{font-size:11px;padding:7px 10px}
  #app .reference-home .home-action-grid{grid-template-columns:1fr;gap:11px}
  #app .reference-home .home-action{min-height:142px;padding:20px;gap:10px}
  #app .reference-home .home-action .action-icon svg{width:29px;height:29px}
  #app .reference-home .home-action h3{font-size:22px}
  #app .reference-home .home-action p{font-size:12px;max-width:100%}
  #app .reference-home .home-action .action-go{position:absolute;right:16px;bottom:15px;width:37px;height:37px}
  #app .reference-home .home-action p{padding-right:32px}
  #app .reference-home .mobile-portal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  #app .concept-hub,#app .concept-feature-page{margin:0;padding:19px 13px;border-radius:16px;min-height:auto}
}
@media(prefers-reduced-motion:reduce){
  #app .side-nav button,#app .home-action{transition:none}
  #app .reference-home .home-action:hover{transform:none}
}
