/* NONLU V3 : identité universelle et fonds propres à chaque conversation.
   Thème purement visuel : aucun choix lié au genre du joueur. */
:root{
  --bg:#0d131d;--surface:#17202b;--surface2:#223040;--line:#344252;
  --ink:#f4f0e8;--soft:#aebbc9;--pink:#c1a073;--pink2:#e1c594;
  --green:#41c38a;--amber:#efae52;--red:#a36b77;
}
html,body{background:#0c121b;color:var(--ink)}
body{background:radial-gradient(circle at 12% 10%,#182f44 0%,transparent 40%),radial-gradient(circle at 88% 85%,#1c2737 0%,transparent 45%),#0c121b}
button:focus-visible,input:focus-visible,select:focus-visible{outline-color:#e7bc83}
a{color:#edcd9e}
.app-shell{grid-template-columns:minmax(370px,565px) minmax(0,460px);gap:44px}
.device{max-width:565px;background:linear-gradient(150deg,#141d28,#111923);border:1px solid #344354;box-shadow:0 20px 75px #0007}
.top{background:#151e29;border-bottom:1px solid #314154;padding:0 15px}
.wordmark{display:flex;align-items:center;padding:0;width:161px;height:69px;overflow:hidden;justify-content:start}
.wordmark img{height:61px;width:161px;max-width:none;object-fit:cover;object-position:center;filter:brightness(1.09)}
.top-right{gap:10px}.demo-pill{color:#b4bbbf;font-size:9px}
.round{background:#263443;border-color:#b69b78;color:#f6ead4}
.bottom-nav{background:#131d28;border-top:1px solid #354557}
.bottom-nav button{color:#a5b4c2}.bottom-nav button.active{color:#e5c08b}
.bottom-nav .bubble,.bubble,.unread{background:#e83d52!important;color:white;box-shadow:0 0 0 2px #14202b;font-weight:700}
.navicon{font-weight:500}.kicker,.side-kicker{color:#d6b385}.welcome h1,.heading h1{font-family:Georgia,serif;color:#f3eee6}
.swipe-card{background:#172333;border:1px solid #455467}.swipe-actions .choice{background:#162232;border-color:#566a79}
.choice.pass{color:#e2e8ef}.choice.like{color:#e7b989;border-color:#b9a27b}.choice:hover{background:#293c4f}
.button{background:#c4a272;color:#111a24}.button:hover,.send:hover{filter:brightness(1.12)}
.button.secondary{background:#233242;border:1px solid #526477;color:#e6e9eb}
.incoming,.conversation{background:#172331;border-color:#34485a}
.conversation:hover{border-color:#be9c73}.avatar-frame>img{border-color:#b9a27b}
.contact-tag{background:#283a47;color:#dfd0b5}.empty{background:#17243080;border-color:#45576b}.big-icon{color:#d2a66e}
.chat-header{background:#192431;border-bottom-color:#384757}
.chat-header>img{border-color:#958575}.back,.more{color:#e5d3b7}.more{font-size:25px}
.chat-messages{background:linear-gradient(155deg,#162331,#101923 55%,#0d151e)!important}
.message{background:#263746;color:#f2f4f5;border:1px solid #52607040}
.message.mine{background:linear-gradient(145deg,#30465a,#263c51);border-color:#65758763;color:#f5f1e9}
.message time{color:#d0d9d8a9}
.composer{background:#172431;border-top:1px solid #384757}
.composer input{background:#233142;color:#f4f0e9;border:1px solid #526174}
.send{background:#cba770;color:#12202b;border:0}
.modal{background:#18232f;border:1px solid #5c6b7b}
.info-popup .subdued,.subdued{color:#b1bdc8}
.settings,.setting-row{border-color:#334453}
.setting-row .toggle input:checked+span{background:#bd986b}
.profile-short{background:#3c4c5d}
/* Logo supplied by the creator, only cropped and compressed, not recreated. */
.onboard{background:#0d1520;grid-template-columns:minmax(390px,1fr) minmax(350px,490px)}
.onboard-hero{min-height:100dvh;justify-content:center;padding:70px 26px 44px;gap:36px;background:radial-gradient(ellipse at 52% 39%,#15324b 0%,#0d1726 53%,#090e18 100%)}
.onboard-logo{width:min(96%,910px);height:auto;object-fit:contain;z-index:1;filter:drop-shadow(0 14px 26px #0006)}
.onboard-portraits{display:flex;justify-content:center;gap:12px;width:100%;max-width:580px}
.onboard-portraits img{width:24%;height:clamp(125px,21vh,230px);object-fit:cover;object-position:center 18%;border-radius:18px;border:1px solid #bfa37e80;box-shadow:0 13px 32px #0006}
.onboard-portraits img:nth-child(even){transform:translateY(14px)}
.onboard-hero>p{font-size:15px;letter-spacing:.08em;color:#d8caba;margin:7px 0 0;text-align:center}
.start-panel{padding:7vh 43px 28px;max-width:490px;background:#131c27}
.start-panel h1{font-size:29px;color:#f5eee5}
.start-panel form>label:not(.check){color:#dce2e8}
.start-panel input:not([type=checkbox]),.start-panel select{background:#243343;color:#f4f2ee;border-color:#506174}
.start-panel input[type=checkbox]{accent-color:#c2a178}
/* A calmer desktop composition: real profile portraits, not a false chat transcript. */
.desktop-side{padding-top:9vh;color:#e8e4df}
.desktop-side .side-logo{display:block;width:96%;height:auto;max-height:170px;object-fit:contain;object-position:left center;margin:0 0 24px;filter:drop-shadow(0 10px 20px #0007)}
.desktop-side h2{font-size:clamp(31px,3vw,48px);margin:12px 0;color:#f4eee6}
.desktop-side p{color:#b9c4cd;font-size:15px}
.side-portraits{display:flex;gap:10px;margin-top:22px}
.side-portraits img{width:31%;height:180px;object-fit:cover;object-position:center 20%;border-radius:16px;border:1px solid #7e756a;filter:saturate(.83)}
.side-portraits img:nth-child(2){transform:translateY(12px)}
.desktop-side .side-disclaimer{font-size:11px;color:#a6b2c2}
/* Individual chat wallpapers. Busy photographs are dimmed behind opaque bubbles. */
.chat-messages.wallpaper-default{background:linear-gradient(155deg,#162331,#101923 55%,#0d151e)!important}
.chat-messages.wallpaper-prairie,.wallpaper-thumb.wallpaper-prairie,.wallpaper-preview.wallpaper-prairie{
 background-image:linear-gradient(180deg,#74a9ca 0%,#aad6e9 32%,#d9ebd1 50%,#7ca579 51%,#325d44 77%,#19392f 100%)!important;background-position:center;background-size:cover}
.chat-messages.wallpaper-sea,.wallpaper-thumb.wallpaper-sea,.wallpaper-preview.wallpaper-sea{
 background-image:linear-gradient(180deg,#4c849f 0%,#a0cada 40%,#d9ddc1 49%,#3c8798 50%,#22667b 74%,#13374e 100%)!important;background-position:center;background-size:cover}
.chat-messages.wallpaper-city,.wallpaper-thumb.wallpaper-city,.wallpaper-preview.wallpaper-city{
 background-image:url('/assets/scenes/nuit.webp')!important;background-position:center;background-size:cover}
.chat-messages.wallpaper-haunted,.wallpaper-thumb.wallpaper-haunted,.wallpaper-preview.wallpaper-haunted{
 background-image:url('/assets/scenes/vieux-manoir.webp')!important;background-position:center;background-size:cover}
.chat-messages.wallpaper-stars,.wallpaper-thumb.wallpaper-stars,.wallpaper-preview.wallpaper-stars{
 background-image:radial-gradient(circle at 22% 13%,#f8ddae 0 1px,transparent 2px),radial-gradient(circle at 73% 25%,#f2e9bb 0 1px,transparent 2px),radial-gradient(circle at 66% 62%,#e9d9cb 0 1px,transparent 2px),radial-gradient(circle at 35% 54%,#faf0d2 0 1px,transparent 2px),radial-gradient(circle at 70% 19%,#cdb586 0 30px,transparent 31px),linear-gradient(150deg,#34486b,#0e1e35 54%,#071324)!important;background-size:cover}
.chat-messages.wallpaper-cosy,.wallpaper-thumb.wallpaper-cosy,.wallpaper-preview.wallpaper-cosy{
 background-image:url('/assets/media/h01-hall.webp')!important;background-position:center;background-size:cover}
.wallpaper-thumb.wallpaper-default,.wallpaper-preview.wallpaper-default{background:linear-gradient(140deg,#263b53,#131e2c)}
.chat-messages:not(.wallpaper-default){background-blend-mode:normal;position:relative}
.chat-messages:not(.wallpaper-default) .message{position:relative;border:1px solid #81919b63;background:#172939ee;box-shadow:0 2px 15px #07111a7c}
.chat-messages:not(.wallpaper-default) .message.mine{background:#24455bf2}
.chat-messages:not(.wallpaper-default) .system-message{background:#101a27df;color:#f5f0e5;border-radius:50px;padding:6px 10px}
.chat-messages:not(.wallpaper-default) .typing{background:#142838eb;padding:8px 11px;border-radius:20px}
/* Softened scrim keeps both landscapes and text legible. */
.chat-messages.wallpaper-prairie,.chat-messages.wallpaper-sea{background-blend-mode:multiply;box-shadow:inset 0 0 0 200vmax #0d1b2c34}
.chat-messages.wallpaper-city,.chat-messages.wallpaper-haunted,.chat-messages.wallpaper-stars,.chat-messages.wallpaper-cosy{box-shadow:inset 0 0 0 200vmax #09142250}
/* Info sheet with personalized wallpapers and media from this contact only. */
.contact-settings{display:grid;gap:15px}
.contact-settings .info-head{display:grid;grid-template-columns:88px 1fr;gap:16px;align-items:center}
.contact-settings .info-head>img{width:88px;height:96px;object-fit:cover;border-radius:15px;border:1px solid #8a8072}
.contact-settings h2{font:550 25px Georgia,serif;color:#f6efe7;margin:0 0 6px}
.contact-settings .info-head p{margin:4px 0 8px;font-size:12px}
.info-section{padding-top:11px;border-top:1px solid #344759}
.info-section h3{font-size:14px;font-weight:680;margin:3px 0 4px;color:#f4ece2}
.info-section p{font-size:12px;margin:3px 0 11px;color:#b8c5ce}
.wallpaper-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.wallpaper-option{display:grid;gap:5px;align-content:start;background:#182634;border:1px solid #35485c;border-radius:12px;padding:5px;color:#ced8df;font-size:10px;min-width:0}
.wallpaper-option.selected{border-color:#f1ca8d;box-shadow:0 0 0 2px #f1ca8d66;color:#fff3df}
.wallpaper-option .wallpaper-thumb{display:block;width:100%;aspect-ratio:3/4;border-radius:9px;background-size:cover;background-position:center}
.wallpaper-preview{min-height:135px;border-radius:14px;background-size:cover;background-position:center;position:relative;padding:18px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:10px;overflow:hidden;border:1px solid #5b6e7a}
.wallpaper-preview:before{content:'';position:absolute;inset:0;background:#0b172235;pointer-events:none}
.wallpaper-preview .preview-message{position:relative;z-index:1;background:#193146f0;border-radius:11px 11px 11px 4px;padding:7px 11px;color:#fff;font-size:12px;max-width:85%}
.wallpaper-preview .preview-message.own{align-self:end;background:#36536cf3;border-radius:11px 11px 4px 11px}
.setting-wallpaper-actions{display:flex;justify-content:space-between;gap:10px;margin-top:11px}
.shared-media{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-top:10px}
.shared-media button{border-radius:10px;overflow:hidden;padding:0;background:#152538;border:1px solid #4b6173;aspect-ratio:1}
.shared-media img{width:100%;height:100%;object-fit:cover}
/* Mobile: keep hero concise, chat full screen, and sheet scrollable. */
@media(max-width:880px){
 .app-shell{grid-template-columns:minmax(0,565px);background:#101923;padding:0}
 .device{background:#111b27;min-height:100dvh;border:0;max-width:565px}
 .top{padding:0 16px}.wordmark{width:138px;height:64px}.wordmark img{width:138px;height:53px}
 .onboard{grid-template-columns:1fr}.onboard-hero{min-height:255px;height:33vh;padding:10px 15px;justify-content:center;gap:4px}
 .onboard-logo{height:140px;width:100%;object-fit:contain}.onboard-portraits{display:none}
 .onboard-hero>p{font-size:12px;margin:-5px 0 0}
 .start-panel{max-width:none;padding:28px 25px 38px;align-self:stretch}
 .start-panel h1{font-size:28px}
 .side-logo,.side-portraits{display:none}
 .contact-settings .info-head{grid-template-columns:66px 1fr}
 .contact-settings .info-head>img{width:66px;height:76px}
 .wallpaper-options{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
 .wallpaper-option{font-size:9px;padding:4px}
 .wallpaper-preview{min-height:118px}
}
@media(max-width:390px){.wallpaper-options{grid-template-columns:repeat(3,minmax(0,1fr))}.modal{padding:13px}.onboard-logo{height:117px}}
