:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color-scheme:dark;color:#f7f3f5;background:#111014;font-size:16px}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 85% 0%,#30141a 0%,#111014 43%)}
button,input,select,textarea{font:inherit}button{cursor:pointer}a{color:inherit}h1,h2,p{margin-top:0}h1{font-size:clamp(1.6rem,4vw,2.3rem);line-height:1.15}h2{font-size:1.22rem}.muted{color:#c6b9be}.small{font-size:.84rem}.eyebrow{font-size:.73rem;color:#fb6d7b;letter-spacing:.12em;font-weight:800}
[hidden]{display:none!important}.topbar{height:76px;max-width:1200px;margin:auto;padding:12px 22px;display:flex;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px solid #332b30}.logo{display:flex;align-items:center;gap:10px;font-weight:900;text-decoration:none;line-height:1.05;letter-spacing:.02em}.logo img{border-radius:10px;object-fit:contain}.logo small{display:block;color:#fb6475;letter-spacing:.19em;font-size:.7rem;margin-top:5px}.account{display:flex;align-items:center;gap:10px}.account span{font-size:.73rem;color:#c4b5bc;max-width:145px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.workspace .content{width:min(100%,1090px);margin:0 auto;padding:26px 18px 115px}.heading{display:flex;align-items:end;justify-content:space-between;gap:14px;margin-bottom:25px}.heading h1{margin:0}.primary,.secondary,.small-button{border:1px solid transparent;border-radius:11px;padding:12px 15px;font-weight:800;line-height:1.2}.primary{background:#e34053;color:#fff}.primary:hover{background:#ff5365}.secondary,.small-button{border-color:#55434b;background:#272126;color:#f2ecee}.secondary:hover,.small-button:hover{border-color:#ca7883}.small-button{padding:8px 11px;font-size:.8rem}.primary:disabled{opacity:.5;cursor:wait}.link{display:inline-block;text-decoration:none}
.panel,.stat,.booking-card,.calendar{background:#1b181d;border:1px solid #413239;border-radius:16px;padding:18px}.panel+.panel{margin-top:14px}.panel p:last-child{margin-bottom:0}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-bottom:30px}.stat span{display:block;font-size:.88rem;color:#c4b6bb}.stat strong{display:block;font-size:2rem;margin-top:8px;font-variant-numeric:tabular-nums}.section-header{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:16px 0}.section-header h2{margin:0}.card-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.booking-card{text-align:left;width:100%;color:inherit}.booking-card:hover{border-color:#eb6472;background:#272026}.card-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}.booking-card h3{font-size:1.04rem;margin:0 0 9px}.booking-card p{font-size:.88rem;color:#cbbec3;margin:0 0 7px;overflow-wrap:anywhere}.tag{display:inline-block;padding:5px 8px;border-radius:999px;background:#32262d;font-size:.73rem;color:#ead9e0;font-weight:700}.tag.confirmed{background:#154a36;color:#a8f6ca}.tag.pending{background:#4c361a;color:#ffe1a9}.tag.declined{background:#502a2c;color:#ffbdbd}.date{font-size:.84rem;color:#e4c8ce;font-weight:750}.empty{background:#211c20;border:1px dashed #65515a;border-radius:14px;padding:24px;color:#c9bbc1;grid-column:1/-1}
label{display:block;margin:12px 0 4px;font-weight:700;font-size:.86rem}input,textarea,select{width:100%;background:#19161b;border:1px solid #65525c;border-radius:9px;color:#fff;padding:11px;outline-offset:3px}input:focus,textarea:focus,select:focus{border-color:#f26b77;outline-color:#a64a58}textarea{resize:vertical}
.login-shell{min-height:calc(100vh - 76px);display:grid;place-items:center;padding:30px 18px}.login-panel{width:min(100%,490px);padding:28px}.login-panel h1{margin-bottom:12px}.login-panel .full{width:100%;margin-top:20px}.text-button{border:none;background:none;text-decoration:underline;color:#ff8793;margin-top:15px}
.notice{position:sticky;top:0;z-index:10;margin:0 auto;background:#482833;border:1px solid #ce7081;max-width:800px;padding:12px 18px;border-radius:0 0 12px 12px;color:#fff;font-size:.91rem}
.bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:9;background:#181418;box-shadow:0 -8px 30px #0008;border-top:1px solid #483942;display:flex;align-items:stretch;justify-content:center;padding-bottom:env(safe-area-inset-bottom)}.bottom-nav button{background:none;color:#b8a9b0;border:none;padding:10px 8px;min-width:0;width:110px;display:flex;flex-direction:column;gap:4px;align-items:center;font-size:.72rem}.bottom-nav button span{font-size:1.4rem;line-height:1}.bottom-nav button.active{color:#ff7180;font-weight:800}
.calendar{padding:12px;margin:15px 0}.cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}.cal-grid .weekday{text-align:center;color:#c0aeb6;font-size:.77rem;padding:9px 0}.day{min-height:50px;border:1px solid #3d3037;border-radius:8px;padding:6px;text-align:left;background:#221d22;color:#f2e7eb;display:flex;flex-direction:column;justify-content:space-between}.day.today{border-color:#ff7884}.day.has-bookings{background:#3a222b}.day:disabled{opacity:.15}.dots{display:flex;flex-wrap:wrap;gap:3px}.dot{width:6px;height:6px;border-radius:50%;background:#ff7a85}.dot.confirmed{background:#74e4a8}.dot.pending{background:#ffd17e}
dialog{width:min(95vw,740px);max-height:92vh;overflow:auto;background:#1c181d;border:1px solid #7a535e;color:#fff;border-radius:17px;padding:24px}dialog::backdrop{background:#09080bdc}.modal-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.modal-top h2{margin:0}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.modal-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap;margin-top:20px}
@media(max-width:730px){.workspace .content{padding:20px 13px 120px}.stats{grid-template-columns:repeat(2,1fr);gap:9px}.card-list{grid-template-columns:1fr}.stat{padding:14px}.stat span{font-size:.78rem}.stat strong{font-size:1.8rem}.heading .primary{font-size:.85rem}.bottom-nav button{flex:1;padding:10px 1px 8px;font-size:.62rem}.bottom-nav button span{font-size:1.25rem}.field-row{grid-template-columns:1fr;gap:0}dialog{padding:18px}.account span{display:none}.section-header{align-items:flex-start}.section-header h2{font-size:1.1rem}.section-header input,.section-header select{max-width:175px}}

/* Comptes individuels : formulaires confortables sur téléphone. */
.login-panel input { margin-bottom: 8px; }
.member-list { margin: 12px 0 22px; display: grid; gap: 8px; }
.member-row { padding: 10px 12px; border: 1px solid #514149; border-radius: 10px; display: flex; flex-direction: column; gap: 2px; }
#membersPanel h3 { font-size: 1.02rem; margin: 24px 0 10px; }
#membersPanel form { padding: 14px; background: #251e24; border: 1px solid #49363f; border-radius: 12px; margin-bottom: 14px; }
#membersPanel form button { margin-top: 12px; }
@media(max-width:550px) {
  .account { gap: 4px; }
  .account .small-button { padding: 7px 8px; font-size: .68rem; }
  .logo { font-size: .8rem; gap: 6px; }
  .logo img { width: 34px; height: 34px; }
}

/* Accueil BD affiché brièvement après une connexion réussie.
   L'illustration approuvée est servie depuis /admin/klosques-welcome.webp.
   La bulle masque le prénom imprimé dans l'image et affiche le vrai prénom du compte. */
.welcome-shell{min-height:calc(100dvh - 76px);background:#050408;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:14px 9px;overflow:hidden}
.welcome-scene{position:relative;width:min(100%,1024px);aspect-ratio:3/2;overflow:hidden;background:#08060b;border-radius:10px;isolation:isolate}
.welcome-backdrop{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:contain}
.welcome-balloon{position:absolute;top:23.5%;left:38%;width:44.6%;height:38.2%;border:clamp(3px,.62vw,9px) solid #0a0809;box-shadow:0 0 0 3px #fff5;background:#fff;border-radius:51% 49% 49% 51% / 49% 50% 50% 51%;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:2%;transform:rotate(-1deg);color:#0a0708;text-align:center;overflow:hidden}
.welcome-balloon::after{content:'';pointer-events:none;position:absolute;right:2.3%;bottom:3%;width:18%;height:60%;opacity:.95;background-image:radial-gradient(#db101e 1.8px,transparent 2px);background-size:12px 12px;mask-image:linear-gradient(to right,transparent 8%,#000 100%);}
.welcome-bienvenue{font-family:"Trebuchet MS",Arial,sans-serif;font-size:clamp(12px,3.8vw,57px);font-weight:1000;font-style:italic;line-height:.95;letter-spacing:-.045em;transform:rotate(-3deg);z-index:1}
.welcome-first-name{position:relative;color:#d30c19;font-family:"Trebuchet MS",Arial,sans-serif;font-size:clamp(17px,5.1vw,75px);font-weight:1000;font-style:italic;line-height:1.08;letter-spacing:-.055em;z-index:1;max-width:100%;overflow-wrap:anywhere;text-shadow:.5px .5px 0 #b0131e}
.welcome-first-name::after{content:'';position:absolute;bottom:-7%;left:20%;height:4px;width:66%;border-radius:50%;background:#d30c19;transform:rotate(-5deg)}
.welcome-progress{position:absolute;bottom:4.0%;left:29.0%;width:42.0%;height:4px;overflow:hidden;border-radius:6px}
.welcome-progress span{display:block;width:25%;height:100%;background:linear-gradient(90deg,#fff3,#fff);border-radius:6px;animation:klosques-loader 1.65s linear infinite}
.welcome-screenreader{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
@keyframes klosques-loader{from{transform:translateX(-120%)}to{transform:translateX(520%)}}
@media(min-width:1025px){.welcome-bienvenue{font-size:55px}.welcome-first-name{font-size:72px}}
@media(max-width:580px){.welcome-shell{padding:14px 2px;justify-content:center}.welcome-scene{width:100%;border-radius:0}.welcome-balloon{border-width:3px;box-shadow:none}.welcome-bienvenue{font-size:clamp(12px,4.1vw,24px)}.welcome-first-name{font-size:clamp(15px,6vw,31px)}.welcome-first-name::after{height:2px}.welcome-balloon::after{background-size:6px 6px;background-image:radial-gradient(#d41120 1px,transparent 1.2px)}}
@media(prefers-reduced-motion:reduce){.welcome-progress span{animation:none;width:100%}}
