/* Écran de connexion : palette du salon, styles limités au login. */
#login-gate{background:radial-gradient(ellipse at 8% 12%,#dfeade 0,transparent 48%),radial-gradient(ellipse at 95% 95%,#f0dfd0 0,transparent 45%),#f7f5f0;padding:40px 24px;overflow-y:auto}
#login-gate .login-box{display:grid;grid-template-columns:1fr 1fr;width:100%;max-width:1120px;min-height:690px;padding:0;border-radius:28px;overflow:hidden;text-align:left;box-shadow:0 24px 80px #29443718;border:1px solid #ffffffb3;flex-shrink:0;margin:auto}
.login-welcome{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;padding:44px;background:linear-gradient(145deg,#243d34,#345749 70%,#456b55);color:#fff}
.login-welcome::after{content:"";position:absolute;z-index:-1;width:330px;height:330px;right:-120px;bottom:-65px;border:1px solid #b6ceb52e;border-radius:50%;box-shadow:0 0 0 35px #bbd2b509,0 0 0 75px #bbd2b507,0 0 0 115px #bbd2b505}
.login-brand{display:flex;align-items:center;gap:16px}.login-brand strong{display:block;font-family:'Fredoka One',cursive;font-size:1.65rem;font-weight:400}.login-brand span{display:block;font-size:.6rem;letter-spacing:.19em;margin-top:5px;color:#d4e3d5}
#login-gate .login-logo-img,#login-gate .login-logo-fallback{width:76px;height:76px;margin:0;border-radius:18px;flex-shrink:0;background:#f7f5f0;padding:7px;color:#456b55}
.login-welcome-copy{margin:auto 0;padding:64px 0 58px}
#login-gate .login-eyebrow{font-size:.61rem;font-weight:900;letter-spacing:.17em;margin:0 0 22px;color:#567963;display:flex;align-items:center;gap:9px}
#login-gate .login-eyebrow::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor;flex-shrink:0}
#login-gate .login-welcome .login-eyebrow{color:#d4e3d5}
.login-welcome h2{font-size:clamp(2rem,3.4vw,3.1rem);line-height:1.16;letter-spacing:-.045em;margin:0;font-weight:800}.login-welcome h2 span{color:#e8b58f}
#login-gate .login-description{font-size:.86rem;line-height:1.9;color:#d7e4db;margin:25px 0}
.login-tags{display:flex;flex-wrap:wrap;gap:8px}.login-tags span{font-size:.64rem;border:1px solid #ffffff29;background:#ffffff06;padding:7px 10px;border-radius:7px;color:#e2ece4}
.login-welcome-footer{display:flex;justify-content:space-between;gap:12px;font-size:.5rem;letter-spacing:.16em;color:#c5d7c9}.login-welcome-footer span:first-child::before{content:"";display:inline-block;width:20px;height:1px;background:#e8b58f;vertical-align:middle;margin-right:10px}
.login-paw{position:absolute;z-index:-1;width:175px;right:4px;bottom:44px;fill:#c5dbc51c;transform:rotate(-20deg)}
.login-form-panel{position:relative;display:flex;flex-direction:column;padding:100px 64px 26px;background:var(--white)}
#login-gate .login-theme,#login-gate .login-reveal{display:flex;align-items:center;justify-content:center;padding:0;flex-shrink:0;background:transparent;color:#718577;border:1px solid #e1e8df;width:36px;height:36px;border-radius:50%}
#login-gate .login-theme{position:absolute;top:24px;right:26px}#login-gate svg{width:20px;height:20px}#login-gate .login-paw{width:175px;height:175px}
.login-form{margin:auto 0;width:100%}#login-gate h1{font-family:'Nunito',sans-serif;color:#283e32;font-weight:800;font-size:2.35rem;line-height:1.22;letter-spacing:-.035em;margin:0}
#login-gate .login-intro{font-size:.82rem;line-height:1.6;margin:16px 0 30px;color:var(--text-light)}
.login-form label{display:block;font-size:.73rem;font-weight:700;margin:18px 0 8px;color:var(--text)}
.login-field{position:relative;display:flex;align-items:center}.login-field>svg{position:absolute;left:16px;color:#7b9280;pointer-events:none}
#login-gate .login-field input{margin:0;width:100%;min-width:0;padding:16px 46px;border:1px solid #dfe6dc;border-radius:12px;background:#f8faf7;font-size:.85rem;color:#304637;outline:none;height:54px}
#login-gate .login-field input:focus{border-color:#7b9e87;box-shadow:0 0 0 3px #7b9e8726}
#login-gate .login-reveal{position:absolute;right:8px;border:0}#login-gate .login-reveal:hover,#login-gate .login-theme:hover{background:#7b9e871a}
#login-gate .login-error{font-size:.76rem;min-height:22px;margin:7px 0;color:var(--danger-text,#c0392b)}
#login-gate #login-btn{display:flex;align-items:center;justify-content:space-between;background:linear-gradient(110deg,#345749,#547660);border:1px solid #ffffff14;border-radius:12px;min-height:54px;padding:14px 20px;font-family:inherit;font-size:.8rem;box-shadow:0 6px 16px #29443714;transition:filter .2s,transform .2s}
#login-gate #login-btn span{font-size:1.35rem;color:#e8b58f}#login-gate #login-btn:hover{filter:brightness(1.1);transform:translateY(-1px)}#login-gate #login-btn:disabled{opacity:.6;cursor:wait;transform:none}
#login-gate .login-security{font-size:.66rem;text-align:center;line-height:1.8;color:#597462;margin:20px 0 28px}#login-gate .login-security span{font-size:.6rem;color:var(--text-light)}
.login-form-footer{display:flex;justify-content:space-between;gap:10px;border-top:1px solid #7b9e8726;padding-top:17px;margin-top:20px;font-size:.58rem;color:var(--text-light)}
#login-gate button:focus-visible{outline:3px solid #bd9068;outline-offset:3px}
body.dark-mode #login-gate{background:radial-gradient(ellipse at 10% 10%,#2b4032,transparent 60%),#191f1b}body.dark-mode #login-gate .login-box{border-color:#465349}body.dark-mode #login-gate h1{color:#f0f3f0}body.dark-mode #login-gate .login-form .login-eyebrow,body.dark-mode #login-gate .login-security{color:#afcbb5}body.dark-mode #login-gate .login-field input{background:#1f2422;color:#f0f3f0;border-color:#526157}body.dark-mode #login-gate .login-theme,body.dark-mode #login-gate .login-reveal{color:#b7cbbb;border-color:#526157}
@media(max-width:1000px){.login-welcome{padding:36px}.login-form-panel{padding:90px 38px 25px}.login-brand strong{font-size:1.4rem}}
@media(max-width:700px){#login-gate{padding:20px 14px;align-items:flex-start}#login-gate .login-box{grid-template-columns:1fr;max-width:460px;min-height:0;border-radius:22px}.login-welcome{padding:24px}.login-brand strong{font-size:1.45rem}#login-gate .login-logo-img,#login-gate .login-logo-fallback{width:56px;height:56px;border-radius:13px}.login-welcome-copy{padding:26px 0 0}.login-welcome h2{font-size:1.9rem}.login-welcome h2 br{display:none}.login-welcome h2 span{display:block}.login-welcome h2 br::after{content:" "}#login-gate .login-welcome .login-eyebrow,.login-tags,.login-welcome-footer,#login-gate .login-description{display:none}.login-paw{bottom:-20px}.login-form-panel{padding:58px 26px 22px}#login-gate .login-theme{top:16px;right:20px}#login-gate h1{font-size:2rem}#login-gate .login-intro{margin-bottom:24px}.login-form-footer{margin-top:0}.login-form-footer span:last-child{max-width:140px;text-align:right}}
@media(max-width:700px){.login-welcome h2 br{display:initial}.login-welcome h2 br::after{content:none}}
/* Le logo clair reste sur le fond vert pour conserver son contraste. */
#login-gate .login-logo-img{width:160px;height:160px;background:transparent;padding:0;border-radius:0;filter:drop-shadow(0 2px 3px #10291b33)}
.login-brand{gap:20px}
.login-form-footer{align-items:center;flex-wrap:wrap;font-size:.65rem;line-height:1.6}
.login-form-footer a{color:#456b55;font-weight:900;text-decoration:underline;text-decoration-color:#7b9e8766;text-underline-offset:3px}
.login-form-footer a:hover{color:#304d3c;text-decoration-color:currentColor}
.login-form-footer a:focus-visible{outline:2px solid #bd9068;outline-offset:4px;border-radius:2px}
body.dark-mode .login-form-footer a{color:#b9d6bf}
@media(max-width:1000px) and (min-width:701px){.login-brand{gap:14px;flex-wrap:wrap}.login-brand strong{font-size:1.2rem}#login-gate .login-logo-img{width:132px;height:132px}}
@media(max-width:700px){#login-gate .login-logo-img{width:120px;height:120px}.login-brand{gap:14px;flex-wrap:wrap}.login-brand strong{font-size:clamp(1rem,4.8vw,1.45rem)}.login-form-footer span:last-child{max-width:none}}
@media(prefers-reduced-motion:reduce){#login-gate,#login-gate .login-box,#login-gate #login-btn{transition:none}}
