/* Trouve Tes Potes : forêt, crème, jaune et personnages de la marque. */
.brand.brand-official{flex-direction:column;align-items:flex-start;gap:9px;letter-spacing:0}.brand-official .brand-logo{display:block;width:128px;height:128px;flex-shrink:0;object-fit:contain;border-radius:50%}.brand-official small{font-size:9px;letter-spacing:1.5px}.gate-ttp .brand.brand-official{margin-bottom:26px}
@media(max-width:680px){.sidebar .brand.brand-official{flex-direction:row;align-items:center;gap:14px}.sidebar .brand-official .brand-logo{width:76px;height:76px}.gate-ttp .brand-official .brand-logo{width:104px;height:104px}.gate-ttp .brand.brand-official{margin-bottom:24px}}
:root{--green:#04452c;--muted:#526b5b;--line:#d8e1d3;color:#143d2b;background:#f6f3e8}
.sidebar{background:var(--green);color:#fff9e6;border-right:0;box-shadow:4px 0 22px #1738250c}
.sidebar .brand{color:#fff9e6}.sidebar .brand small{color:#d2dbba}.logo{background:#f5d124;color:#04452c;font-weight:800}
.nav button{color:#edf0d8;border-radius:12px}.nav button:hover{background:#ffffff14}.nav button.active{background:#f6d52f;color:#063f28;box-shadow:0 3px 0 #e2b719}
.sidebar .sidefoot{color:#d5dfc7}.sidebar .sidefoot button{margin-top:12px;background:#ffffff0d;border-color:#ffffff40;color:#fff9e6}.sidebar .sidefoot button:hover{background:#ffffff22}.sidebar .dot{background:#f6d52f}
.topline{border-bottom-color:#ccd8c8}.private{background:#e2ead6;color:#17482e;border:1px solid #d0ddbf}.card,.panel{box-shadow:0 5px 20px #143c2506;background:#fffcf3;border-color:#d8e1ce}
.card{border-top:4px solid #04452c}.card .value{color:#04452c;font-weight:750}.card .eyebrow{color:#486544}.datebox,.badge{background:#e5edd6;color:#17492d}
button,.button{border-color:#c8d6bd}button.primary{background:#04452c}button.primary:hover{background:#07603d}button:hover,.button:hover{background:#eaf0dd}.tabs button.active{background:#04452c;border-color:#04452c;color:#fff9e6}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline-color:#c49700}
.hero-home{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(180px,1fr);gap:18px 26px;align-items:center;background:#04452c;color:#fff9e6;border-radius:24px;padding:30px 32px;position:relative;overflow:hidden;border-bottom:6px solid #f2cc29}
.hero-home .hero-copy{grid-column:1;grid-row:1;min-width:0}.hero-home h1{max-width:580px;font-size:clamp(30px,3.2vw,44px);margin-top:10px;letter-spacing:-1.4px}.hero-home .eyebrow{color:#f5d22c}.hero-home .subtitle{color:#e0e7c9;max-width:460px;line-height:1.65}
.hero-home>button.primary{grid-column:1;grid-row:2;justify-self:start;background:#f5d22c;border-color:#f5d22c;color:#073e28;box-shadow:0 3px 0 #c5a00c}.hero-home>button.primary:hover{background:#ffe25f}.hero-pals{grid-column:2;grid-row:1/3;display:block;width:100%;height:auto;filter:drop-shadow(0 8px 0 #001b132a);align-self:center}
.feature{background:#0a5033;color:#fff9e6;border-color:#0a5033}.feature .eyebrow{color:#f5d22c}.feature .subtitle,.feature .pill,.feature .notice,.feature .muted{color:#e0e8cb}.feature .metric-line{border-color:#ffffff33}.feature .metric-line strong{color:#f9dd60}.feature p{line-height:1.7}
.illustration{height:110px;margin:0 0 20px;display:flex;justify-content:center;align-items:center}.illustration img{width:245px;max-width:100%;height:auto;max-height:110px;object-fit:contain}.feature .empty{color:#e0e8cb}
.empty::before{content:"";display:block;background:url('personnages-ttp.png') center / contain no-repeat;width:138px;height:65px;margin:0 auto 14px}.backup-reminder{border-left-color:#b58b00;background:#fff1bb}.note:not(.warning){border-left-color:#71965b;background:#edf1df}
.gate-ttp{max-width:1080px;margin:6vh auto;padding:24px;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:24px;align-items:stretch}
.gate-ttp .gate-welcome{background:#04452c;color:#fff9e6;border-radius:24px;padding:34px 30px 0;display:flex;flex-direction:column;overflow:hidden;border-bottom:6px solid #f5d22c}.gate-ttp .brand{color:#fff9e6;margin-bottom:42px}.gate-ttp .brand small{color:#e0e8cb}.gate-ttp .gate-welcome>.eyebrow{color:#f5d22c;font-size:10px}.gate-ttp .gate-welcome h1{font-size:clamp(34px,3.5vw,44px);letter-spacing:-1.2px;line-height:1.1}.gate-ttp .gate-welcome>.muted{color:#e0e8cb;font-size:15px}
.gate-pals{width:100%;height:auto;display:block;margin:auto 0 0;padding-top:24px;filter:drop-shadow(0 6px 0 #001b132a)}.gate-ttp .gate-formpanel{margin:0;padding:30px;background:#fffcf3;align-self:stretch;display:flex;flex-direction:column;justify-content:center;border-radius:24px}.gate-ttp .gate-formpanel h2{color:#04452c;font-size:23px}.gate-ttp .gate-formpanel .primary{width:100%}.gate-ttp .gate-bottom{grid-column:1/-1;padding:0 8px;font-size:12px}.gate-ttp .gate-bottom p{margin:0 0 8px}.gate-ttp .note{font-size:12px}
@media(max-width:1000px){.hero-home{padding:26px;grid-template-columns:minmax(0,1.5fr) minmax(145px,1fr);gap:16px}.hero-home h1{font-size:34px}.gate-ttp{padding:22px;gap:18px}}
@media(max-width:680px){.sidebar{border-bottom:4px solid #f5d22c;padding-top:18px}.sidebar .nav{border-bottom:0;padding-bottom:13px;justify-content:space-between;gap:2px}.nav button{font-size:11px;min-width:0;padding:9px 10px}.nav button.active{box-shadow:none}.sidebar .brand{margin-bottom:0}.main{padding-top:22px}.hero-home{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;padding:24px 22px 0;border-radius:20px;align-items:start;min-width:0}.hero-home .hero-copy{grid-column:1;grid-row:1}.hero-home h1{font-size:34px;margin-bottom:14px}.hero-home>button.primary{grid-column:1;grid-row:2;width:100%;justify-self:stretch}.hero-pals{grid-column:1;grid-row:3;width:240px;max-width:100%;margin:0 auto -1px;max-height:120px;object-fit:contain}.hero-home .subtitle{font-size:13px}.hero-home .eyebrow{font-size:10px}.card{border-top:0;border-left:4px solid #04452c}.illustration{height:90px}.illustration img{max-height:90px}.gate-ttp{display:block;margin:0 auto;padding:18px;max-width:480px}.gate-ttp .gate-welcome{padding:24px 22px 0;border-radius:20px}.gate-ttp .brand{margin-bottom:24px}.gate-ttp .gate-welcome h1{font-size:34px}.gate-ttp .gate-welcome>.muted{font-size:13px;margin-bottom:0}.gate-pals{width:240px;max-width:100%;max-height:122px;object-fit:contain;margin:0 auto;padding-top:14px}.gate-ttp .gate-formpanel{margin-top:18px;padding:22px;border-radius:20px}.gate-ttp .gate-bottom{padding:18px 4px 6px}.feature .panel-head .badge{background:#f4d752;color:#143d2b}}