@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&family=VT323&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#0c0c16;--fg:#f7f5ff;--muted:#aaa7bf;--accent:#fd477d;--cyan:#72e9e0;--line:#30283e}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font-family:'Space Grotesk',system-ui,sans-serif;font-size:16px;line-height:1.6}body:before{content:'';position:fixed;inset:0;pointer-events:none;background:linear-gradient(transparent 98%,#ffffff03 98%);background-size:100% 5px;z-index:4}a{color:inherit;text-decoration:none}button{font:inherit}a:focus-visible,button:focus-visible{outline:3px solid var(--cyan);outline-offset:5px}.shell{max-width:1200px;margin:auto;padding:0 36px}header{display:flex;align-items:center;justify-content:space-between;padding:24px 0;gap:24px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;font-size:14px;font-weight:700;letter-spacing:1px}.mark{display:grid;place-items:center;width:42px;height:42px;border:2px solid var(--accent);box-shadow:4px 4px 0 #733858;color:var(--cyan);font-size:24px;font-weight:bold}.header-note{color:var(--muted);font-size:13px;letter-spacing:2px}.channel{margin-top:26px;padding:18px 22px;display:flex;align-items:center;justify-content:space-between;background:#181321;border:1px solid #493147;gap:20px}.channel small{color:var(--accent);letter-spacing:2px;font-weight:700}.channel strong{display:block;font-size:20px}.channel em{font-style:normal;color:var(--muted);font-size:14px}.channel .cta{white-space:nowrap;background:var(--accent);color:#180b16;font-weight:700;padding:10px 18px;box-shadow:4px 4px 0 #5a284b}nav{display:flex;gap:8px;padding:25px 0;flex-wrap:wrap}nav a{padding:9px 16px;color:var(--muted);font-size:14px;border:1px solid transparent}nav a:hover{color:white;border-color:var(--line)}nav a.active{background:var(--cyan);color:#0c1620;font-weight:700}.intro{padding:30px 0 38px;max-width:850px}.eyebrow{font-size:13px;letter-spacing:3px;color:var(--cyan);font-weight:700;text-transform:uppercase}h1{font-size:clamp(38px,6vw,72px);line-height:1.1;letter-spacing:-2px;margin:17px 0 22px}h1 span{color:var(--accent)}.intro p{color:var(--muted);font-size:18px;margin:0}.select-label{display:flex;justify-content:space-between;gap:10px;border-top:1px solid var(--line);padding:20px 0;color:var(--muted);font-size:13px;letter-spacing:2px}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.card{min-height:265px;padding:25px 22px;background:linear-gradient(145deg,#242035,#13111e);border:1px solid var(--line);display:flex;flex-direction:column;position:relative;transition:transform .2s,border-color .2s}.card:hover{transform:translateY(-5px);border-color:var(--tone)}.card .number{font-family:monospace;font-size:46px;color:var(--tone);font-weight:700;line-height:1;margin-bottom:45px}.card h2{font-size:24px;line-height:1.2;margin:0 0 10px}.card p{font-size:14px;color:var(--muted);margin:0}.card .enter{margin-top:auto;padding-top:20px;color:var(--tone);font-size:13px;font-weight:700;letter-spacing:2px}.bottom{display:flex;justify-content:space-between;gap:22px;margin:40px 0;padding:25px;border:1px solid var(--line)}.bottom h2{font-size:20px;margin:0 0 5px}.bottom p{color:var(--muted);font-size:14px;margin:0}.chips{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.chips a{border:1px solid #59445f;padding:8px 14px;font-size:14px}.chips a:hover{border-color:var(--accent)}footer{display:flex;justify-content:space-between;gap:20px;padding:25px 0;border-top:1px solid var(--line);color:var(--muted);font-size:13px}.group{margin:0 0 35px}.group h2{font-size:22px;margin:0 0 18px}.links{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.link{border:1px solid var(--line);background:#171321;padding:20px;display:grid;grid-template-columns:1fr auto;gap:5px 14px;transition:border-color .2s}.link:hover{border-color:var(--accent)}.platform{color:var(--cyan);font-size:14px;font-weight:700}.link-name{grid-column:1;font-size:17px;overflow-wrap:anywhere}.open{grid-column:2;grid-row:1 / 3;align-self:center;font-size:14px;color:var(--muted)}.identities{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.identity{padding:20px;border:1px solid var(--line)}.identity small{color:var(--muted)}.identity strong{display:block;overflow-wrap:anywhere}.notice{font-size:14px;color:var(--muted);border-left:2px solid var(--accent);padding:8px 18px;margin:0 0 32px}.relics{background:#171321;border:1px solid var(--line);padding:22px;color:var(--muted)}.relics strong{color:white}@media(max-width:900px){.cards{grid-template-columns:repeat(2,1fr)}.bottom{flex-direction:column}.header-note{display:none}}@media(max-width:600px){.shell{padding:0 18px}header{padding:20px 0}.channel{align-items:flex-start;flex-direction:column}.channel .cta{width:100%;text-align:center}.channel strong{font-size:18px}nav{gap:4px}nav a{padding:8px 10px}.intro{padding-top:15px}h1{letter-spacing:-1px}.cards{gap:10px}.card{padding:20px 16px;min-height:240px}.card h2{font-size:21px}.card .number{margin-bottom:30px}.links,.identities{grid-template-columns:1fr}.select-label span:last-child{display:none}footer{flex-direction:column;gap:5px}.open{font-size:13px}.link{padding:16px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
/* L’Arcade du Tonton */
body{background:radial-gradient(ellipse at top right,#30152e 0,transparent 48%),#090a12}.intro{max-width:none;position:relative;isolation:isolate;padding:44px 38px;margin:4px 0 28px;border:1px solid #664058;background:#0c0c16;overflow:hidden;min-height:285px}.intro:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#0b0b15f5 0%,#0b0b15dd 36%,#0b0b1555 75%),url('/pixel-party-v5.png') center 55%/cover no-repeat}.intro h1{max-width:680px;text-shadow:0 2px 18px #000}.intro p{max-width:590px;color:#ddd5e2}.eyebrow{color:#86fff0}.card{box-shadow:0 7px 0 #05060a;border-top:3px solid var(--tone);background:linear-gradient(145deg,#292036,#11111d)}.card:hover{box-shadow:0 9px 24px #0008,0 0 18px color-mix(in srgb,var(--tone) 18%,transparent)}.channel{border-left:4px solid var(--accent);background:linear-gradient(90deg,#251425,#121621)}.mark{background:#191323;text-shadow:0 0 12px #72e9e066}.link:hover{background:#211829}nav a.active{box-shadow:3px 3px 0 #28645f}@media(max-width:600px){.intro{padding:28px 22px;min-height:270px}.intro:before{background:linear-gradient(90deg,#0b0b15e8,#0b0b1599),url('/pixel-party-v5.png') 65% center/cover no-repeat}.intro h1{font-size:40px}}

.gate{max-width:460px;display:grid;gap:14px;padding:24px;border:1px solid var(--line);margin-bottom:40px}.gate input{width:100%;padding:12px;background:#0c0c16;color:white;border:1px solid #65516c;font:inherit}.gate button{padding:12px;border:0;background:var(--cyan);color:#081614;font-weight:700;cursor:pointer}.error{color:#ff9eb7}.private-exit{margin:25px 0;display:inline-block;color:var(--cyan);border:1px solid var(--line);padding:10px 20px}.chips{min-width:0}.chips a{overflow-wrap:anywhere}

/* Dorures et fond arcade bleu nuit */
:root{--bg:#172b42;--line:#927448;--muted:#c8c3cd;--gold:#e8c57e}body{background:radial-gradient(ellipse at 85% 0%,#68395388,transparent 55%),radial-gradient(ellipse at 0% 65%,#345d7e88,transparent 60%),linear-gradient(135deg,#1a344b,#252b48 55%,#402c40);background-attachment:fixed}header,footer{border-color:#d2ad6466}.channel{background:linear-gradient(110deg,#34394b,#403042);border:1px solid #d2ad6488;border-left:4px solid var(--gold);box-shadow:0 8px 24px #12213433}.channel small{color:var(--gold)}.card{border:1px solid #dab66d99;border-top:3px solid var(--gold);background:linear-gradient(145deg,#354155,#342b44);box-shadow:0 6px 0 #172438,0 12px 28px #10233933}.card:hover{border-color:#ffe2a1;box-shadow:0 9px 28px #10233955,0 0 18px #e8c57e22}.intro{border-color:#d2ad6488}.link,.identity,.bottom,.relics,.gate{background:linear-gradient(135deg,#303d51,#3b3045);border:1px solid #d2ad6480;box-shadow:0 5px 18px #10233922}.link:hover{border-color:#ffe2a1;background:#443b50}.chips a{border-color:#d2ad6488}.chips a:hover{border-color:#ffe2a1}.platform-panel{border:1px solid #e8c57eaa;padding:28px;margin-top:38px;background:linear-gradient(120deg,#354456,#493444);box-shadow:0 8px 30px #12213433}.panel-heading h2{margin:5px 0 22px;font-size:28px}.panel-heading .eyebrow{color:var(--gold)}.platform-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.platform-account{min-height:120px;border-color:#e8c57e66}.platform-account:first-child{grid-row:span 2;display:flex;flex-direction:column;justify-content:center;background:linear-gradient(145deg,#365c6c,#3f3550)}.platform-account strong{font-size:18px}.platform-account span{display:block;color:var(--muted);font-size:14px;margin-top:6px}.platform-account .account-action{color:var(--gold);margin-top:20px}.platform-account small{color:#efd69f}.platform-account[href]:hover{border-color:#ffe2a1}.gate input{background:#203247;border-color:#d2ad64}.select-label{border-color:#d2ad6466}@media(max-width:800px){.platform-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.platform-account:first-child{grid-row:auto;grid-column:1/-1}}@media(max-width:600px){.platform-panel{padding:20px}.platform-grid{grid-template-columns:1fr}.platform-account:first-child{grid-column:auto}.platform-account{min-height:auto}.panel-heading h2{font-size:24px}}

/* Le groupe du Tonton en pixel art */
body{background:linear-gradient(#172b42aa,#252b48bb),url('/pixel-party-v5.png') center center/cover no-repeat fixed;background-color:#26374e}.party-banner{margin:4px 0 25px;border:2px solid #e8c57e;border-radius:3px;overflow:hidden;box-shadow:0 10px 32px #10233955}.party-banner img{display:block;width:100%;height:auto;image-rendering:pixelated}.intro:before{background:linear-gradient(90deg,#172538f5 0%,#172538df 45%,#172538aa 100%),url('/pixel-party-v5.png') center/cover no-repeat}.channel,.card,.link,.identity,.bottom,.relics,.gate,.platform-panel{background-color:#28364d}header,footer{background:#203049dd;padding-left:16px;padding-right:16px}nav{background:#203049dd;padding-left:12px;padding-right:12px;margin:18px 0}.intro{min-height:220px}a.brand{color:white}@media(max-width:600px){body{background-attachment:scroll;background-size:auto 100vh}.party-banner{margin-bottom:18px}.intro{min-height:220px}.intro:before{background:linear-gradient(90deg,#172538f5,#172538dd),url('/pixel-party-v5.png') center/cover no-repeat}}

/* Texte RPG intégré à la bannière */
.party-banner{position:relative;isolation:isolate}.party-banner:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#101d3abb 0%,#101d3a88 33%,transparent 55%);z-index:0}.pixel-caption{position:absolute;z-index:1;left:4%;top:11%;width:44%;color:#fff4d4;text-shadow:2px 2px 0 #101427,4px 4px 0 #101427}.pixel-brand{font-family:'Press Start 2P',monospace;font-size:clamp(12px,1.15vw,16px);line-height:1.9;color:#ffe0a1;margin-bottom:28px}.pixel-caption h1{font-family:'Press Start 2P',monospace;font-weight:400;font-size:clamp(18px,2.05vw,29px);line-height:1.85;letter-spacing:0;margin:0 0 24px}.pixel-caption h1 span{color:#ffe0a1}.pixel-caption p{font-family:'VT323',monospace;font-size:clamp(20px,2.2vw,30px);line-height:1.35;color:#fff7e3;margin:0;max-width:440px}@media(min-width:601px) and (max-width:900px){.pixel-caption{top:7%;left:3%;width:46%}.pixel-brand{margin-bottom:12px;font-size:12px}.pixel-caption h1{font-size:18px;line-height:1.65;margin-bottom:12px}.pixel-caption p{font-size:20px}}@media(max-width:600px){.party-banner img{height:570px;object-fit:cover;object-position:74% center}.party-banner:after{background:linear-gradient(0deg,#101d3afa 0%,#101d3ac9 27%,transparent 60%)}.pixel-caption{left:6%;right:6%;top:auto;bottom:22px;width:auto}.pixel-brand{font-size:12px;line-height:1.8;margin-bottom:14px}.pixel-caption h1{font-size:18px;line-height:1.7;margin-bottom:14px}.pixel-caption p{font-size:24px;line-height:1.2;max-width:100%}}

.gaming-banner .pixel-caption{width:35%;top:10%}.gaming-banner .pixel-brand{font-size:clamp(12px,1.05vw,14px);line-height:2.1}.gaming-banner .pixel-caption h1{font-size:clamp(20px,2.2vw,30px)}.gaming-banner:after{background:linear-gradient(90deg,#12182abc,transparent 50%)}@media(max-width:600px){.gaming-banner img{height:auto;object-fit:contain;object-position:center}.gaming-banner .pixel-caption{position:relative;inset:auto;width:auto;padding:22px;background:#26334b}.gaming-banner .pixel-brand{font-size:12px}.gaming-banner .pixel-caption h1{font-size:22px}.gaming-banner:after{display:none}}

.travel-banner .pixel-caption{left:auto;right:4%;top:auto;bottom:6%;width:39%;padding:16px;background:#172538d9}.travel-banner:after{display:none}@media(max-width:600px){.travel-banner .pixel-caption{inset:auto;position:relative;width:auto;background:#26334b;padding:22px}}

/* Les petits compagnons du Tonton */
.card{min-height:350px;padding-bottom:22px}.card .number{margin-bottom:20px}.mini-stage{position:relative;display:block;height:106px;margin:8px -22px 0;overflow:hidden;flex:1;min-height:105px}.pixel-grass{position:absolute;bottom:0;left:0;right:0;height:25px;background:url('/grass-v10.webp') repeat-x left bottom;background-size:auto 25px;image-rendering:pixelated}.mini-party{position:absolute;left:-145px;bottom:16px;display:flex;gap:6px;animation:cross-card 8s linear infinite}.runner{display:block;width:64px;height:64px;background-image:url('/runners-v10.webp');background-size:256px 384px;image-rendering:pixelated;animation:run-frames .55s steps(4) infinite}.runner.julien{background-position-y:0}.runner.jeanne{background-position-y:-64px}.runner.rousse{background-position-y:-128px}.runner.gargio{background-position-y:-192px}.runner.jambi{background-position-y:-256px}.runner.chocobo{background-position-y:-320px}.card:nth-child(2) .mini-party{animation-delay:-2s}.card:nth-child(3) .mini-party{animation-delay:-4s}.card:nth-child(4) .mini-party{animation-delay:-6s}.mini-star{position:absolute;font-size:19px;color:#ffe5a5;text-shadow:0 0 9px #ffd775;animation:sparkle 2.4s ease-in-out infinite}.star-a{left:18%;top:14px}.star-b{left:67%;top:6px;animation-delay:-.8s}.star-c{left:86%;top:35px;animation-delay:-1.6s}.visit-counter{display:flex;align-items:center;gap:10px;flex-wrap:wrap;border:1px solid #d2ad6499;padding:10px 14px;background:#25374d;color:#f7dda5}.counter-label{font-size:12px;letter-spacing:1px}.visit-counter strong{font-family:'Press Start 2P',monospace;font-size:16px;line-height:1.8;min-width:42px}.visit-counter small{font-size:12px;color:#c8c3cd}footer{align-items:center;flex-wrap:wrap}@keyframes run-frames{from{background-position-x:0}to{background-position-x:-256px}}@keyframes cross-card{from{left:-145px}to{left:100%}}@keyframes sparkle{0%,100%{opacity:.35;transform:scale(.8)}50%{opacity:1;transform:scale(1.2)}}@media(max-width:600px){.card{min-height:330px}.mini-stage{margin-left:-16px;margin-right:-16px}.visit-counter{margin-top:8px}.runner{width:56px;height:56px;background-size:224px 336px}.runner.jeanne{background-position-y:-56px}.runner.rousse{background-position-y:-112px}.runner.gargio{background-position-y:-168px}.runner.jambi{background-position-y:-224px}.runner.chocobo{background-position-y:-280px}@keyframes run-frames{from{background-position-x:0}to{background-position-x:-224px}}}@media(prefers-reduced-motion:reduce){.mini-party,.runner,.mini-star{animation:none}.mini-party{left:16px}}

/* Les héros invités dans chaque encadré */
.pixel-box{position:relative;isolation:isolate;overflow:hidden;padding-bottom:96px}.game-cameo{position:absolute;bottom:10px;right:16px;width:144px;height:72px;pointer-events:none;user-select:none;z-index:0}.game-sprite{display:block;width:144px;height:72px;background-image:url('/heroes-v13.webp');background-size:432px 144px;background-repeat:no-repeat;image-rendering:pixelated;animation:cameo-life 2.5s ease-in-out infinite}.cameo-0 .game-sprite{background-position:0 0}.cameo-1 .game-sprite{background-position:-144px 0}.cameo-2 .game-sprite{background-position:-288px 0;animation:cameo-dash 3s ease-in-out infinite}.cameo-3 .game-sprite{background-position:0 -72px}.cameo-4 .game-sprite{background-position:-144px -72px}.cameo-5 .game-sprite{background-position:-288px -72px}.cameo-star{position:absolute;left:6px;top:4px;color:#ffe5a5;font-size:16px;text-shadow:0 0 8px #ffc45e;animation:sparkle 2.4s ease-in-out infinite}.channel.pixel-box{padding-bottom:96px}.card.pixel-box{padding-bottom:96px}.intro.pixel-box{padding-bottom:96px}.visit-counter.pixel-box{padding-bottom:90px}.platform-panel.pixel-box{padding-bottom:100px}.game-cameo:before{content:'';position:absolute;bottom:0;left:0;right:0;height:12px;background:url('/grass-v10.webp') bottom left/auto 20px repeat-x;image-rendering:pixelated;opacity:.7}.link.pixel-box .open{align-self:start}.pixel-box> .game-cameo~*{position:relative;z-index:1}.pixel-box> .game-cameo~.mini-stage{position:relative}.pixel-box:nth-child(2n) .game-sprite{animation-delay:-1s}@keyframes cameo-life{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}@keyframes cameo-dash{0%,100%{transform:translateX(-8px)}50%{transform:translateX(8px)}}@media(max-width:600px){.game-cameo{right:10px}.channel.pixel-box{padding-bottom:96px}.intro.pixel-box{padding-bottom:96px}}@media(prefers-reduced-motion:reduce){.game-sprite,.cameo-star{animation:none!important}}
nav a.pixel-nav,.chips a.pixel-nav{position:relative;overflow:hidden;padding-right:65px;min-height:44px}.pixel-nav .game-cameo{left:auto;right:-79px;top:50%;bottom:auto;transform:translateY(-50%) scale(.36);transform-origin:left center}.pixel-nav .game-cameo:before{display:none}

/* Titres directement sur les images de voyage et du grenier */
.travel-banner .pixel-caption{background:none;padding:0;bottom:7%;right:4%;width:42%;text-shadow:2px 2px 0 #101427,-1px -1px 0 #101427,0 3px 12px #101427}.travel-banner:after{display:block;background:linear-gradient(0deg,#101d3ac9,transparent 55%)}.attic-banner .pixel-caption{left:4%;top:13%;width:43%}.attic-banner:after{background:linear-gradient(90deg,#101d3ab8,transparent 60%)}
@media(max-width:600px){.travel-banner img{height:470px;object-fit:cover;object-position:58% center}.travel-banner .pixel-caption{position:absolute;left:6%;right:6%;bottom:22px;top:auto;width:auto;background:none;padding:0}.travel-banner:after{display:block;background:linear-gradient(0deg,#101d3ae8,transparent 65%)}.attic-banner img{height:520px;object-fit:cover;object-position:75% center}.attic-banner .pixel-caption{position:absolute;left:6%;right:6%;bottom:22px;top:auto;width:auto;padding:0;background:none}.attic-banner:after{display:block;background:linear-gradient(0deg,#101d3ae8,transparent 65%)}.attic-banner .pixel-brand{margin-bottom:14px}.attic-banner .pixel-caption h1{font-size:19px}.attic-banner .pixel-caption p{font-size:23px}}

/* Portrait du Tonton à la place de l’initiale */
.brand .profile-avatar{display:block;width:76px;height:76px;object-fit:cover;object-position:center;border:2px solid #e8c57e;border-radius:8px;image-rendering:pixelated;box-shadow:4px 4px 0 #172438;flex-shrink:0}@media(max-width:600px){.brand .profile-avatar{width:64px;height:64px}.brand{letter-spacing:.7px}}

.channel-main{display:flex;align-items:center;gap:1.5rem;flex:1;min-width:0;color:inherit;text-decoration:none}.discord-link{display:inline-flex;align-items:center;justify-content:center;padding:.8rem 1rem;border:1px solid #d9b76b;border-radius:8px;white-space:normal;text-align:center;color:#ffe3a0;text-decoration:none}.discord-link:hover{background:#d9b76b22}.channel{flex-wrap:wrap}.channel-main .cta{margin-left:auto}@media(max-width:650px){.channel-main{flex-wrap:wrap}.discord-link{width:100%}}
