/* Formulaire du créateur de site, version visuelle dans l'esprit de /studio (11/11/2026).
   Chargé après createur-site.css et charte-livret-createur.css. */
@media(min-width:1051px){.workbench{grid-template-columns:420px minmax(0,1fr)!important}}
.editor{background:#fffdf8}
.editor legend,.editor>form>label,.editor form>label{display:block;margin:4px 0 10px;font:400 22px/1.2 Georgia,"Times New Roman",serif!important;color:#303b80;letter-spacing:0;text-transform:none}
.editor .hint{font-size:13px!important;line-height:1.5;color:#6b6d7a}
.editor fieldset{border:0;padding:0;margin:0 0 22px}
.editor .q-num{display:block;margin-bottom:6px;font:700 11px/1 system-ui,Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#a8794b}

/* Métiers : grandes cartes à icône (les 8 premiers), les autres dans la liste */
.editor .types{display:grid!important;grid-template-columns:1fr 1fr;gap:10px;margin:4px 0 12px}
.editor .types[hidden]{display:grid!important}
.editor .types button{display:flex!important;flex-direction:column;align-items:flex-start;gap:8px;text-align:left;border:2px solid #e5dfd2!important;background:#fff!important;border-radius:16px!important;padding:14px 14px 13px!important;font:700 14px/1.25 system-ui,Arial,sans-serif!important;color:#303b80!important;cursor:pointer;box-shadow:0 4px 12px rgba(48,59,128,.05);transition:transform .15s,border-color .15s,box-shadow .15s}
.editor .types button:hover{transform:translateY(-2px);border-color:#303b80!important;box-shadow:0 8px 20px rgba(48,59,128,.12)}
.editor .types button span{display:grid;place-items:center;width:44px!important;height:44px;border-radius:12px;background:#fff6d6;font-size:24px!important;line-height:1}
.editor .types button[aria-pressed=true]{border-color:#303b80!important;background:#f4f1fa!important;box-shadow:0 0 0 3px rgba(48,59,128,.12)}
.editor .types button[aria-pressed=true] span{background:#ffd84d}
.editor .types button:nth-child(n+9){display:none!important}
.editor .trade-picker{display:flex;align-items:center;gap:10px;margin:0 0 6px}
.editor .trade-picker label{position:static!important;width:auto!important;height:auto!important;clip:auto!important;overflow:visible!important;white-space:nowrap;font:600 13px/1 system-ui,Arial,sans-serif;color:#6b6d7a}
.editor .trade-picker select{flex:1;min-height:42px;border:1.5px solid #d9d2e8;border-radius:12px;background:#fff;padding:0 12px;font:600 14px system-ui,Arial,sans-serif;color:#303b80}

/* Champs */
.editor input:not([type=checkbox]):not([type=color]):not([type=file]),.editor textarea{font-size:16px!important;border:1.5px solid #d9d2e8!important;border-radius:14px!important;background:#fff!important;padding:13px 14px!important}
.editor input:focus,.editor textarea:focus{outline:none;border-color:#303b80!important;box-shadow:0 0 0 3px rgba(48,59,128,.12)}

/* Idées d'ambiance : grosses pastilles */
.editor .idees button{padding:10px 16px!important;font-size:14px!important;font-weight:600!important;border:1.5px solid #e5dfd2!important;background:#fff!important;color:#303b80!important}
.editor .idees button[aria-pressed="true"]{background:#ffd84d!important;border-color:#ffd84d!important;color:#232b6b!important}

/* Palettes : grandes pastilles */
.editor .palettes{display:grid!important;grid-template-columns:repeat(4,1fr);gap:12px 8px}
.editor .palettes button,.editor .palettes .perso-couleur{display:flex!important;flex-direction:column;align-items:center;gap:6px;padding:4px 0!important;font:600 11.5px/1.2 system-ui,Arial,sans-serif!important;color:#4a4866;text-align:center;cursor:pointer;background:none!important;border:0!important}
.editor .palettes i{display:block;width:40px!important;height:40px!important;border-radius:50%!important;transition:transform .15s,box-shadow .15s}
.editor .palettes button:hover i{transform:scale(1.08)}
.editor .palettes button[aria-pressed=true] i{box-shadow:0 0 0 3px #fff,0 0 0 5px #303b80!important}
.editor .palettes button[aria-pressed=true]{color:#303b80}
.editor .palettes .perso-couleur input{width:40px!important;height:40px!important;border-radius:50%!important;padding:0!important;border:0!important;margin:0!important}

/* Ambiance (éditorial, immersif, essentiel) */
.editor .moods{gap:8px!important}
.editor .moods button{border:2px solid #e5dfd2!important;border-radius:14px!important;padding:14px 6px!important;font:700 13px/1.2 system-ui,Arial,sans-serif!important;color:#303b80;background:#fff!important}
.editor .moods button span{font-size:11px!important;font-weight:500}
.editor .moods button[aria-pressed=true]{background:#303b80!important;border-color:#303b80!important;color:#fff!important}

/* Volets repliés : cartes */
.editor details.perso>summary{list-style:none;cursor:pointer;border:2px solid #e5dfd2;border-radius:16px;background:#fff;padding:14px 44px 14px 16px;position:relative;font:700 15px/1.3 system-ui,Arial,sans-serif;color:#303b80;margin:0 0 12px}
.editor details.perso>summary::-webkit-details-marker{display:none}
.editor details.perso>summary:after{content:"+";position:absolute;right:16px;top:50%;transform:translateY(-50%);width:26px;height:26px;border-radius:50%;background:#ffd84d;color:#232b6b;display:grid;place-items:center;font-size:18px;line-height:1}
.editor details.perso[open]>summary:after{content:"−"}
.editor details.perso>summary span{display:block;margin-top:3px;font-size:12.5px;font-weight:500;color:#6b6d7a}
.editor details.perso>summary:hover{border-color:#303b80}

/* Boutons d'action : gros, jaunes, comme /studio */
.editor .compose{min-height:56px;font-size:17px!important;font-weight:800!important;padding:16px 22px!important;box-shadow:0 8px 20px rgba(255,200,40,.35);justify-content:center!important;gap:10px!important;width:100%!important;max-width:none!important}
.editor .compose:hover{filter:brightness(.97);transform:translateY(-1px)}
.editor .rediger{min-height:52px;font-size:15px!important;font-weight:700!important;justify-content:center!important;gap:10px!important}
.editor .pack{border-radius:16px!important}

@media(max-width:760px){
  .editor legend,.editor form>label{font-size:20px!important}
  .editor .types{grid-template-columns:1fr 1fr;gap:8px}
  .editor .types button{padding:12px!important;font-size:13.5px!important}
  .editor .types button span{width:40px!important;height:40px;font-size:22px!important}
  .editor .palettes{grid-template-columns:repeat(4,1fr)}
}