/* Compléments pour les pages rendues côté serveur — mêmes codes visuels que le thème du MVP (theme.css). */

/* ---------- Base ---------- */
html,body{overflow-x:clip}
main#contenu{outline:none}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.inline-form{display:inline-flex;flex-wrap:wrap;gap:6px;align-items:center;margin:0}
.plain-list{list-style:none;padding:0;margin:8px 0}
.plain-list li{padding:6px 0;border-bottom:1px solid rgba(166,124,61,.18)}
.small-copy{font-size:.9rem;color:var(--cream-dim)}
code,.verify-code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.92em;background:rgba(166,124,61,.16);padding:1px 6px;border-radius:3px;color:var(--gold-bright)}
.req{color:#e0876a}
.preserve{white-space:pre-wrap;overflow-wrap:anywhere}

/* ---------- Messages flash ---------- */
.flash{position:sticky;top:0;z-index:60;padding:0 20px;transition:opacity .6s}
.flash p{max-width:1180px;margin:12px auto;padding:12px 18px;border:1px solid var(--bronze);border-left:4px solid var(--gold);background:var(--tavern-panel);color:var(--tavern-text);box-shadow:0 6px 18px rgba(0,0,0,.35)}
.flash-error p{border-left-color:#c0503b}
.flash.fade{opacity:0;pointer-events:none}

/* ---------- En-tête de page ---------- */
.page-header{padding:28px 0 18px}
.page-header h1{margin:6px 0 8px;color:var(--gold-bright);font-size:clamp(1.6rem,3vw,2.2rem);line-height:1.2}
.page-header p{max-width:760px;color:var(--cream-dim);font-size:1.08rem;margin:0}
.breadcrumb{font-size:.9rem;color:var(--cream-dim)}
.breadcrumb a{color:var(--cream-dim);text-decoration:underline;text-underline-offset:2px}
.breadcrumb a:hover{color:var(--gold-bright)}

/* ---------- Boutons complémentaires ---------- */
.btn.danger,.button.danger{background:#3d2015;color:#efb698;border-color:#91543b}
.btn.ghost.danger{background:transparent;color:#e39b83;border-color:#91543b}
a.btn{text-decoration:none}
.text-button{background:none;border:0;padding:0;font:inherit;color:inherit;text-decoration:underline;cursor:pointer}
.nav-logout{margin:0}
.nav-logout button{display:block;width:100%;text-align:left;background:none;border:0;padding:9px 12px;color:#eedfc7;font:17px 'EB Garamond',Georgia,serif;cursor:pointer}
.nav-logout button:hover{background:#9c78452e;color:#ffe4a9}
.account-menu>summary#account-button{list-style:none;display:inline-flex;align-items:center;gap:8px}
.account-menu>summary#account-button::after{content:none}
.account-menu .wow-nav-dropdown{left:auto;right:0}
.wow-nav-group>summary.btn::after{content:none}

/* ---------- Formulaires ---------- */
.feature-form .field label,.feature-form fieldset legend{display:block;font-weight:600;color:var(--cream);margin-bottom:5px}
.feature-form .field small{display:block;color:var(--cream-dim);font-size:.88rem;margin-top:4px}
.feature-form input:not([type=checkbox]):not([type=radio]),.feature-form select,.feature-form textarea,.filters input,.filters select,.request-form input{border:1px solid var(--bronze-dim);border-radius:3px;background:var(--panel);color:var(--cream);font:1rem 'EB Garamond',Georgia,serif;padding:10px 11px}
.feature-form input:focus,.feature-form select:focus,.feature-form textarea:focus{outline:2px solid var(--gold);outline-offset:1px}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:4px 16px}
.check{display:flex;gap:10px;margin:12px 0;color:var(--cream)}
.check a{text-decoration:underline}
.notice{border-radius:3px;color:var(--cream)}
.notice a{text-decoration:underline}
.notice-error{border-left-color:#c0503b!important;background:rgba(192,80,59,.12)!important}
.notice-error ul{margin:6px 0 0;padding-left:20px}
.empty-state{margin:18px 0}
.empty-state strong{display:block;font-size:1.1rem;color:var(--gold-bright);margin-bottom:4px}
.empty-state p{margin:0 0 10px}
.emblem-picker{border:1px solid var(--bronze-dim);border-radius:3px;padding:10px 12px;margin:12px 0;display:flex;flex-wrap:wrap;gap:6px}
.emblem-option{position:relative;cursor:pointer}
.emblem-option input{position:absolute;opacity:0;inset:0;cursor:pointer}
.emblem-option span[aria-hidden]{display:grid;place-items:center;width:42px;height:42px;font-size:1.3rem;border:1px solid var(--bronze-dim);border-radius:50%;background:var(--panel)}
.emblem-option input:checked+span{border-color:var(--gold-bright);box-shadow:0 0 0 2px var(--gold),0 0 12px rgba(212,175,90,.4)}
.emblem-option input:focus-visible+span{outline:2px solid var(--gold-bright);outline-offset:2px}
.filters{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:14px 0 22px}
.filters .check{margin:0}
.chip-row{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
a.chip{text-decoration:none}
a.chip:hover{color:var(--gold-bright);border-color:var(--gold)}
.category-chips{padding:0}
.pagination{display:flex;gap:12px;align-items:center;justify-content:center;margin:24px 0;color:var(--cream-dim)}

/* ---------- Grilles de cartes ---------- */
.guide-grid,.video-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.video-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.wow-discover .guide-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:1000px){.guide-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.video-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.video-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.guide-grid,.video-grid{grid-template-columns:1fr}}
.wow-guide .inline-form{margin-left:auto}
.video-card .wow-guide-image img{object-fit:cover}
.video-thumb-twitch{display:grid;place-items:center;width:100%;height:100%;background:radial-gradient(circle at 40% 35%,#6441a5,#1f1233 75%);color:#e6dcff;font-size:2.4rem}
.play-badge{position:absolute;inset:0;margin:auto;width:52px;height:52px;display:grid;place-items:center;border-radius:50%;background:rgba(10,7,4,.72);border:1px solid var(--gold);color:var(--gold-bright);font-size:1.2rem;pointer-events:none}
.video-card h3{font-size:19px!important}
.home-block,.wow-home>.news-block{margin:34px 27px 0}
.wow-home .home-block{margin:34px 27px 0}
.news-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
@media(max-width:860px){.news-grid{grid-template-columns:1fr}}
a.news-card{display:block;text-decoration:none;padding:16px}
a.news-card:hover h4{color:var(--gold-bright)}
.news-card h4{margin:0 0 6px}
.live-banner{display:flex;align-items:center;gap:10px;margin:18px 27px 0;padding:12px 18px;border:1px solid #a7383b;background:linear-gradient(90deg,rgba(167,56,59,.22),transparent);color:var(--cream);text-decoration:none}
.live-dot{display:inline-block;padding:1px 8px;border-radius:10px;background:#c62d34;color:#fff;font:700 .7rem 'Cinzel',serif;letter-spacing:.05em;vertical-align:middle}
.open-seat .wow-creator-info small{opacity:.85}

/* ---------- Guides / articles ---------- */
.guide-sheet{margin-top:6px}
.guide-sheet .tag{display:inline-block}
.guide-lead{font-size:1.15rem;color:var(--cream);margin:10px 0 6px}
.guide-author{color:var(--cream-dim)}
.guide-author a{color:var(--gold-bright)}
.guide-video{padding:0 24px 16px}
.prose{line-height:1.65;color:var(--cream)}
.guide-body{padding:4px 24px 12px;max-width:820px}
.prose h2{color:var(--gold-bright);font-size:1.35rem;margin:26px 0 10px}
.prose h3{color:var(--gold);font-size:1.15rem;margin:20px 0 8px}
.prose p,.prose li{color:var(--cream)}
.prose a{color:var(--gold-bright);text-decoration:underline;text-underline-offset:2px}
.prose blockquote{margin:16px 0;padding:10px 16px;border-left:3px solid var(--gold);background:rgba(212,175,90,.08);color:var(--cream-dim);font-style:italic}
.prose ul,.prose ol{padding-left:22px}
.guide-steps{padding:4px 24px 18px;max-width:820px}
.guide-steps h2{color:var(--gold-bright);font-size:1.2rem;margin:10px 0 6px}
.guide-steps .step{display:flex;gap:14px;padding:10px 0;border-top:1px solid rgba(166,124,61,.15)}
.guide-steps .step:first-of-type{border-top:0}
.badge{color:#a9d39a;background:rgba(90,140,70,.18);border-color:rgba(140,190,120,.45)}
[data-faction=alliance] .badge{color:#2f5a22;background:rgba(90,140,70,.14)}
.guide-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:0 24px 20px}
.guide-actions .save{font-size:1.6rem;background:none;border:0;color:var(--gold);cursor:pointer;padding:0 6px}
.guide-sources{padding:6px 24px 22px;border-top:1px solid rgba(166,124,61,.2)}
.guide-sources h2{font-size:1.05rem;color:var(--gold)}
.guide-sources a{text-decoration:underline}
.in-paths{margin:16px 0;color:var(--cream-dim)}
.in-paths a{color:var(--gold-bright);text-decoration:underline}
.news-article{max-width:860px}
.etape-row{align-items:flex-start}
.etape-main{flex:1;min-width:0}
.etape-title{text-decoration:none;display:block}

/* ---------- Progression (largeurs sans style en ligne, compatibles CSP) ---------- */
.progress-fill,.gauge-fill{width:0}
.pct-0{width:0}.pct-5{width:5%}.pct-10{width:10%}.pct-15{width:15%}.pct-20{width:20%}.pct-25{width:25%}.pct-30{width:30%}.pct-35{width:35%}.pct-40{width:40%}.pct-45{width:45%}.pct-50{width:50%}.pct-55{width:55%}.pct-60{width:60%}.pct-65{width:65%}.pct-70{width:70%}.pct-75{width:75%}.pct-80{width:80%}.pct-85{width:85%}.pct-90{width:90%}.pct-95{width:95%}.pct-100{width:100%}
.xp-gauge{position:relative;background:linear-gradient(#2b2b22,#15150f)}
.gauge-fill{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(#72a93b,#376c1b 45%,#284713)}
.xp-gauge .gauge-label{position:relative;display:block;text-align:center}
.account-frame{margin-top:6px}
.avatar-emblem{display:grid;place-items:center;font-size:1.9rem}
.quest-badge{text-decoration:none}

/* ---------- Vidéos ---------- */
.video-consent{position:relative;aspect-ratio:16/9;border:1px solid var(--bronze-dim);border-radius:4px;overflow:hidden;background:#0d0a07}
.video-consent-inner{position:absolute;inset:0}
.video-consent-inner>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.35) blur(1px)}
.video-consent-text{position:relative;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:16px;text-align:center;color:#f2e7d0}
.video-consent-text p{max-width:520px;font-size:.95rem;color:#e4d6ba;margin:0}
.video-consent-text .feature-actions{justify-content:center}
.video-consent iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-page{padding:16px}
.video-page-info{padding:14px 4px 0}
.profile-head.compact{padding:0 0 10px}
.profile-head.compact h2 a{color:var(--gold-bright);text-decoration:none}
.video-description{max-height:320px;overflow:auto;font-size:.95rem}

/* ---------- Créateurs ---------- */
.creator-list-card{display:block;text-decoration:none}
.creator-list-head{display:flex;gap:12px;align-items:center;margin-bottom:8px}
.creator-list-head .avatar{width:54px;height:54px;font-size:1.4rem}
.creator-list-head h3{margin:0}
.creator-hero{margin-top:6px}
.creator-follow{margin-left:auto}
.creator-bio{padding:0 24px 12px;max-width:760px}
.creator-hero .chip-row{padding:0 24px}
.avatar.large{width:96px;height:96px;font-size:2.2rem}
.banner-quote{margin-bottom:18px}
.benefit-list-plain{padding-left:20px;line-height:1.6}
.benefit-list-plain li{margin:6px 0;color:var(--cream-dim)}
.benefit-list-plain strong{color:var(--cream)}

/* ---------- Classes ---------- */
.class-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media(max-width:760px){.class-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.class-card{display:block;text-decoration:none;text-align:center;padding:22px 16px;border-top:3px solid var(--class-color,var(--gold))}
.class-card .class-icon{font-size:2rem;display:block;margin-bottom:6px}
.class-card h3{color:var(--class-color,var(--gold-bright))!important;font-family:'Cinzel',serif!important}
.class-guerrier{--class-color:#C69B6D}.class-paladin{--class-color:#F48CBA}.class-chasseur{--class-color:#AAD372}.class-voleur{--class-color:#E6D23F}.class-pretre{--class-color:#D8D8D8}.class-chaman{--class-color:#3A8FE8}.class-mage{--class-color:#3FC7EB}.class-demoniste{--class-color:#8788EE}.class-druide{--class-color:#FF7C0A}
[data-faction=alliance] .class-pretre{--class-color:#7d7d7d}[data-faction=alliance] .class-voleur{--class-color:#9b8a12}

/* ---------- Recherche ---------- */
.search-page-form input{flex:1;min-width:220px}
.search-results{display:grid;gap:12px}
.search-result{display:block;padding:14px 18px;text-decoration:none}
.search-result h3{margin:6px 0 4px;color:var(--cream)}
.search-result:hover h3{color:var(--gold-bright)}
.search-result p{margin:0;color:var(--cream-dim);font-size:.95rem}
.tavern-result{text-decoration:none}

/* ---------- Hauts faits ---------- */
.achievement-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.achievement-card{display:flex;gap:14px;align-items:center;padding:14px;opacity:.65}
.achievement-card.unlocked{opacity:1;border-color:var(--gold)}
.achievement-card .ico{font-size:1.8rem;width:52px;height:52px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--bronze);flex-shrink:0;background:radial-gradient(circle at 35% 30%,rgba(240,207,138,.35),transparent 70%)}
.achievement-card h3{margin:0 0 2px;font-size:1.05rem}
.achievement-card p{margin:0 0 4px;font-size:.9rem}
.achievement-card small{color:var(--cream-dim)}
.achievement-toast.simple-toast{padding:12px 20px;color:var(--cream);font-size:.95rem}

/* ---------- Inscription ---------- */
.onboarding{max-width:760px;margin:0 auto;padding:28px 0}
.onboard-panel{padding:34px 40px}
.onboard-panel.narrow{max-width:520px;margin:0 auto}
@media(max-width:600px){.onboard-panel{padding:24px 18px}}
.onboard-steps{display:flex;justify-content:space-between;list-style:none;gap:6px;margin:0 0 24px;padding:0}
.onboard-steps li{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}
.onboard-steps li span{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--bronze-dim);color:var(--cream-dim);font-family:'Cinzel',serif}
.onboard-steps li.current span,.onboard-steps li.done span{border-color:var(--gold);color:var(--ink);background:linear-gradient(#f1d27d,#95712c)}
.onboard-steps small{font-size:.78rem;color:var(--cream-dim)}
.onboard-kicker{color:var(--gold);letter-spacing:.08em;margin:0 0 6px}
.onboard-actions{margin-top:20px}
.role-grid,.follow-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin:12px 0}
.role-card,.follow-option{position:relative;display:flex;flex-direction:column;gap:6px;padding:18px;border:1px solid var(--bronze-dim);cursor:pointer;background:var(--panel)}
.follow-option{flex-direction:row;align-items:center}
.role-card input,.follow-option input{position:absolute;top:12px;right:12px;accent-color:#d7ae54;width:18px;height:18px}
.role-card>span[aria-hidden]{font-size:1.8rem}
.role-card>span:last-child{color:var(--cream-dim)}
.follow-option small{display:block;color:var(--cream-dim)}
.welcome-final h1{color:var(--gold-bright)}

/* ---------- Forum ---------- */
a.forum-thread{text-decoration:none;color:inherit}
.forum-post{display:grid;grid-template-columns:170px minmax(0,1fr);gap:16px;padding:16px;margin:12px 0}
@media(max-width:640px){.forum-post{grid-template-columns:1fr}}
.post-author{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
.post-author a{text-decoration:none;color:var(--gold-bright)}
.post-author .avatar{width:56px;height:56px;font-size:1.4rem}
@media(max-width:640px){.post-author{flex-direction:row;text-align:left}.post-author .avatar{width:36px;height:36px;font-size:1rem}}
.post-meta{font-size:.82rem;color:var(--cream-dim);margin-bottom:6px}
.post-meta a{color:inherit}
.post-body .prose p{margin:0 0 10px}
.post-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-start;margin-top:10px}
.post-actions details{flex-basis:100%}
.post-actions summary{cursor:pointer;color:var(--cream-dim);text-decoration:underline;width:max-content}
.post-actions textarea{width:100%;margin:8px 0}
.deleted{color:var(--cream-dim)}
.staff-badge{color:var(--gold);background:rgba(212,175,90,.14);border-color:rgba(212,175,90,.4)}
.mod-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.forum-topic textarea,.guild-page textarea{width:100%}

/* ---------- Guildes ---------- */
a.guild-card{display:block;text-decoration:none}
.guild-head.compact{padding:0 0 10px;gap:12px}
.guild-head.compact .guild-emblem{width:48px;height:48px;font-size:1.3rem}
.guild-head.compact h3{margin:0}
.guild-join{margin-left:auto}
.event-row h4{margin:6px 0 4px;color:var(--cream)}
.event-sub{color:var(--cream-dim)}
.add-event summary{list-style:none;cursor:pointer;margin-top:12px;width:max-content}
.board-post{align-items:flex-start}
.board-body{flex:1;min-width:0}
.member-row{flex-wrap:wrap}
.member-row .member-actions{margin-left:auto}
.member-name a{color:var(--cream);text-decoration:none}
.danger-zone{border-color:#91543b}
.danger-zone h2{color:#e39b83!important}
.invite-box .invite-link{user-select:all}

/* ---------- Tables (espace créateur, admin) ---------- */
.table-wrap{overflow-x:auto;border:1px solid var(--bronze-dim);border-radius:3px}
.data-table{width:100%;border-collapse:collapse;font-size:.95rem}
.data-table th,.data-table td{padding:9px 10px;border-bottom:1px solid rgba(166,124,61,.18);text-align:left;vertical-align:top}
.data-table th{font-family:'Cinzel',serif;font-size:.78rem;letter-spacing:.04em;color:var(--gold)}
.data-table a{color:var(--gold-bright)}
.data-table select{padding:4px;font-size:.9rem}
.data-table tr.banned td{opacity:.6}
.inline-edit select{max-width:150px}

/* ---------- Administration ---------- */
.admin-nav{overflow-x:auto;flex-wrap:nowrap;white-space:nowrap}
.admin-nav a,.subtabs a{text-decoration:none;color:var(--cream-dim);font-family:'Cinzel',serif;font-size:.8rem;padding:9px 14px;border-bottom:2px solid transparent}
.subtabs a.active,.subtabs a:hover{color:var(--gold-bright);border-bottom-color:var(--gold)}
.subtabs{overflow-x:auto;flex-wrap:nowrap}
.count-badge{display:inline-block;min-width:20px;padding:0 6px;border-radius:10px;background:#a7383b;color:#fff;font:700 .7rem/1.6 sans-serif;text-align:center}
.admin-stats{margin:10px 0 20px}
.checklist{list-style:none;padding:0}
.checklist li{padding:6px 0}
.checklist a{text-decoration:underline}
.admin-card h3{margin:0 0 4px}
.admin-card h3 small{font-weight:400;color:var(--cream-dim);font-size:.85rem}
.admin-actions input[name=note]{width:100%;margin:6px 0}
.admin-video-list{display:grid;gap:12px}
.admin-video{display:grid;grid-template-columns:200px minmax(0,1fr);gap:14px;padding:12px}
@media(max-width:640px){.admin-video{grid-template-columns:1fr}}
.admin-thumb{display:block;aspect-ratio:4/3;overflow:hidden;border:1px solid var(--bronze-dim)}
.admin-thumb img,.admin-thumb .video-thumb-twitch{width:100%;height:100%;object-fit:cover}
.admin-video label{display:flex;flex-direction:column;font-size:.85rem;color:var(--cream-dim)}
.mail-row{padding:8px 0}

/* ---------- Pages d'erreur, pied de page ---------- */
.error-page{text-align:center;max-width:640px;margin:40px auto}
.error-page h1{color:var(--gold-bright)}
.site-footer{max-width:1180px;margin:48px auto 0}
.site-footer .footer-links{justify-content:center}
.footer-motto{font-family:'Cinzel',serif;color:var(--gold)!important}
.request-list{margin:10px 0}
.request-row{padding:9px 0;border-bottom:1px solid rgba(166,124,61,.18)}
.request-tag{font-size:.85rem;color:var(--cream-dim);text-decoration:underline}
.wow-requests.standalone{margin:0;max-width:none}
.tavern-sponsor{text-decoration:none}

/* ---------- Ambiance Alliance (claire) pour les nouveaux composants ---------- */
[data-faction=alliance] .flash p{background:#fcf5e1;color:#342716}
[data-faction=alliance] .feature-form input:not([type=checkbox]):not([type=radio]),[data-faction=alliance] .feature-form select,[data-faction=alliance] .feature-form textarea,[data-faction=alliance] .filters input,[data-faction=alliance] .filters select,[data-faction=alliance] .request-form input{background:#fffaf0;color:#302b23}
[data-faction=alliance] .video-consent-text p{color:#f2e7d0}
[data-faction=alliance] .emblem-option span[aria-hidden],[data-faction=alliance] .role-card,[data-faction=alliance] .follow-option{background:#fcf5e1}
[data-faction=alliance] .page-header h1{color:#243e53}
[data-faction=alliance] .prose h2,[data-faction=alliance] .guide-steps h2{color:#243e53}
[data-faction=alliance] .xp-gauge{background:linear-gradient(#3a3a30,#1d1d15)}
[data-faction=alliance] .live-banner{color:#342716}
[data-faction=alliance] .nav-logout button{color:#eedfc7}

@media(prefers-reduced-motion:reduce){.flash{transition:none}}