/* FACIL' FACTORY · Edition Atelier Ivoire & Or — V0.3
   Design seulement. Les modules métier restent indépendants du thème. */
:root {
  color-scheme:light;
  --navy:#182133;
  --navy2:#2a3040;
  --mint:#a6751a;
  --lime:#c69b46;
  --ink:#171e30;
  --soft:#747d90;
  --bg:#f7f4ed;
  --line:#e2d6c3;
  --white:#fffdf9;
  --shadow:0 14px 40px rgba(70,49,17,.055);
  --gold:#a6751a;
  --gold-dark:#8d5e0b;
  --panel:#fffefa;
  --serif:'Playfair Display',Georgia,serif;
  --sans:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font:14px/1.6 var(--sans);letter-spacing:-.018em}
::selection{background:#ddc290;color:#171e30}
button,input,select,textarea{font-family:var(--sans)}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:2px solid #ad832e;outline-offset:3px}
a{color:#92640f;text-underline-offset:3px}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{letter-spacing:-.04em}
.shell{min-height:100vh}
.sidebar{
  width:284px;min-width:284px;height:100vh;position:sticky;top:0;
  padding:27px 17px 23px;overflow-y:auto;
  background:linear-gradient(150deg,#f0eadf 0%,#eae3d7 100%);
  color:var(--ink);border-right:1px solid #dfd4c1;
  box-shadow:inset -1px 0 rgba(255,255,255,.5)
}
.brand{align-items:center;padding:6px 10px 38px;gap:14px}
.brand-icon{
  width:54px;height:54px;flex-shrink:0;border-radius:17px;
  background:linear-gradient(145deg,#bd8d32,#8f5d0c);
  box-shadow:0 9px 22px rgba(131,92,25,.25),inset 0 1px 0 #f6ce72;
  color:#fffdf6;font-family:var(--serif);font-size:27px;
  font-weight:700;letter-spacing:-3px
}
.brand-icon span{color:#fce7b2}
.brand strong{font-family:var(--serif);font-size:18px;font-weight:800;color:#171e2d;letter-spacing:-.8px}
.brand em{color:inherit}
.brand small{color:#88909b;letter-spacing:.02em;font-weight:550;font-size:12px;margin-top:2px}
.main-nav{display:grid;gap:8px}
.nav-item{
  min-height:59px;padding:14px 16px;margin:0;border:1px solid transparent;
  display:flex;align-items:center;gap:14px;
  border-radius:15px;color:#687287;font-size:13px;font-weight:650;
  background:transparent;transition:background .18s,color .18s,border .18s,transform .18s
}
.nav-item span{color:#8d8990;font-size:22px;font-weight:400;width:24px}
.nav-item.active{
  color:#141b2d;border-color:#f7f0e6;
  border-left:3px solid #b27c17;
  background:#f5efe5;box-shadow:0 5px 17px rgba(122,86,28,.045)
}
.nav-item.active span{color:#b47b16}
.nav-item:hover:not(.active){background:rgba(255,255,255,.45);color:#273044;transform:translateX(2px)}
.sidebar-foot{
  margin-top:auto;border:1px solid #ded0b9;border-radius:17px;
  padding:17px 18px;color:#353d4e;background:#fffcf7;
  box-shadow:0 8px 20px rgba(94,73,31,.025);font-size:12px
}
.sidebar-foot small{font-size:11px;color:#748096;line-height:1.7}
.dot{background:#249d82;box-shadow:0 0 0 5px rgba(36,157,130,.12)}
.workspace{
  min-width:0;flex:1;min-height:100vh;
  background:linear-gradient(180deg,#f7f4ed 0%,#f7f4ee 100%)
}
.topbar{
  background:rgba(247,244,237,.93);min-height:81px;
  padding:16px 40px;border-bottom:0;gap:15px;
}
.breadcrumb{color:#798195;font-size:12px;letter-spacing:-.02em}
.breadcrumb b{color:#22283a}
.top-actions{gap:12px}
.pill{
  color:#758394;background:transparent;border:1px solid #ded2bc;
  padding:10px 13px;border-radius:24px;font-size:11px;font-weight:600
}
.top-button{
  font-size:12px;font-weight:750;padding:11px 16px;border-radius:12px;
  color:#262b38;background:#fffdfa;border:1px solid #ded2bd;
  transition:transform .17s,box-shadow .17s
}
.top-button:hover{box-shadow:0 6px 16px #98732416;transform:translateY(-1px)}
#backup-factory{background:linear-gradient(130deg,#b48124,#93620e);color:white;border-color:#ae7a1c}
.content{max-width:1500px;padding:10px 42px 80px;margin:0 auto}
.eyebrow{color:#aa761c;font-size:10px;font-weight:850;letter-spacing:2px}
.pagehead{margin:22px 0 26px;gap:15px}
.pagehead h1{
  color:#171d2e;font:700 clamp(27px,2.9vw,39px)/1.22 var(--serif);
  letter-spacing:-1.4px;margin:10px 0 8px
}
.pagehead p{color:#788195;font-size:13px;margin:0;line-height:1.7}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 16px;border-radius:12px;background:#fffdfa;color:#293248;
  border:1px solid #e1d6c6;font-weight:750;font-size:12px;
  transition:transform .18s,box-shadow .18s,background .18s
}
.btn.primary,.btn.mint{
  color:#fff;background:linear-gradient(145deg,#b8882d,#92620d);
  border-color:#aa791d;box-shadow:inset 0 1px rgba(255,255,255,.13)
}
.btn:hover:not(:disabled){filter:none;transform:translateY(-2px);box-shadow:0 8px 18px rgba(103,68,13,.12)}
.btn:active:not(:disabled){transform:translateY(0)}
.btn.ghost{background:#f3ecdf;color:#946613}
.btn.danger{color:#ad374d;border-color:#eccbd0;background:#fffbf9}
.btn.small{padding:8px 11px;font-size:11px}
.hero,.hero.factory-hero{
  position:relative;display:block;overflow:hidden;
  margin:8px 0 43px;min-height:375px;
  padding:48px clamp(26px,4vw,68px);
  border:1px solid #e0d2ba;border-radius:38px;
  background:
    radial-gradient(ellipse 70% 70% at 90% 0%,rgba(216,177,102,.10),transparent 68%),
    linear-gradient(140deg,#fffefa,#f8f3e9);
  box-shadow:0 23px 50px rgba(72,56,30,.095),inset 0 1px 0 white
}
.hero::before{
  content:'F’';position:absolute;right:-13px;bottom:-86px;
  color:#af8741;opacity:.065;font:700 370px/.9 var(--serif);
  pointer-events:none;user-select:none;
  transform:rotate(-10deg)
}
.hero::after{content:none}
.hero > *{position:relative;z-index:1}
.hero h2{
  max-width:960px;color:#171c2c;
  font:700 clamp(40px,4.8vw,69px)/1.16 var(--serif);
  letter-spacing:-2.3px;margin:4px 0 15px
}
.hero p{color:#758096;font-size:14px;line-height:1.85;max-width:680px;margin:0 0 28px}
.factory-hero .hero-copy{max-width:100%;position:relative}
.factory-hero .hero-eyebrow{
  display:inline-block;margin-bottom:11px;font-size:10px;
  color:#a47727;font-weight:800;letter-spacing:2.1px;text-transform:uppercase
}
.quick-create{
  display:flex;align-items:center;gap:10px;max-width:1030px;
  padding:7px 8px 7px 21px;border:1px solid #e0d0b4;border-radius:20px;
  background:#f9f5ed;box-shadow:0 2px 0 rgba(255,255,255,.9) inset
}
.quick-create input{
  flex:1;min-width:0;color:#242a39;
  background:transparent;border:0;outline:0;padding:13px 5px;font:500 13px var(--sans);
}
.quick-create input::placeholder{color:#7c8496}
.quick-create input:focus{outline:none}
.quick-create:focus-within{border-color:#b78936;box-shadow:0 0 0 4px rgba(176,133,54,.12)}
.quick-create .btn{white-space:nowrap;padding:14px 24px;font-size:12px;min-height:49px}
.quick-examples{display:flex;gap:10px;flex-wrap:wrap;margin-top:15px}
.quick-examples button{
  cursor:pointer;border:1px solid #e1d4bd;border-radius:25px;
  background:#fbf8f2;color:#778197;font-size:11px;font-weight:600;
  padding:9px 15px;transition:all .18s
}
.quick-examples button:hover{border-color:#b98930;color:#8e6113;background:#fffdf8}
.section-row{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin:3px 0 20px}
.section-row h2{
  font:700 clamp(23px,2vw,32px)/1.3 var(--serif);
  color:#181e2f;letter-spacing:-.8px;margin:0
}
.section-row p{font-size:12px;color:#788295;margin:5px 0 0}
.stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin-bottom:36px}
.stat{
  min-height:121px;padding:20px 23px;
  background:#fffdfa;border:1px solid #e0d3bc;border-radius:18px;
  box-shadow:none;position:relative;overflow:hidden
}
.stat:after{content:'';position:absolute;bottom:0;left:22px;width:calc(100% - 44px);height:4px;background:#ede4d4;border-radius:5px}
.stat strong{font:700 34px/1.25 var(--serif);display:block;color:#151b2c}
.stat span{color:#7b8394;font-size:12px}
.twocol{gap:20px}
.panel,.app-card,.core-module,.agent-card{
  background:#fffdfa;border:1px solid #e2d5be;
  box-shadow:var(--shadow);color:var(--ink)
}
.panel{border-radius:21px;padding:25px;margin-bottom:20px}
.panel h2{font:700 21px/1.35 var(--serif);color:#192035;margin-bottom:15px}
.panel p{color:#7a8497;font-size:12px;line-height:1.8}
.panelhead h2{margin-bottom:12px}
.project-row{border-color:#eae0d2}
.project-icon{background:#f4ead8;color:#9b721e;border-radius:13px}
.project-copy b{color:#20283a}
.project-copy small,.muted{color:#798396}
.empty{
  border:1px dashed #d8c9ac;background:#fbf8f2;color:#7c8494;
  padding:34px 16px;border-radius:15px
}
.steps{gap:18px}
.step{gap:12px}
.step b{background:#f2e8d5;color:#a07018;font-size:13px;border-radius:9px}
.step strong{color:#252a39}
.step p{margin:4px 0}
.notice{border-left:3px solid #ba8b33;border-radius:0 12px 12px 0;padding:13px 17px;background:#f8f0e4;color:#766b58}
.notice b{color:#5d4b30}
.app-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}
.app-card{
  display:block;overflow:hidden;position:relative;padding:0;border-radius:23px;
  transition:transform .2s,box-shadow .2s,border-color .2s
}
.app-card:hover{transform:translateY(-4px);border-color:#bc913e;box-shadow:0 19px 35px rgba(67,46,16,.12)}
.app-card-cover{
  height:137px;background:
  radial-gradient(circle at 15% 0%,rgba(255,255,255,.16),transparent 52%),
  linear-gradient(130deg,var(--card-from,#225348),var(--card-to,#0f2d28));
}
.app-card-cover[data-tone="violet"]{--card-from:#63316d;--card-to:#26102c}
.app-card-cover[data-tone="blue"]{--card-from:#264e80;--card-to:#12182f}
.app-card-cover[data-tone="green"]{--card-from:#25825b;--card-to:#0d2d2a}
.app-card-cover[data-tone="wine"]{--card-from:#792d4b;--card-to:#2b141c}
.app-card-cover[data-tone="copper"]{--card-from:#955026;--card-to:#2a3118}
.app-card-cover[data-tone="teal"]{--card-from:#1f8191;--card-to:#10283c}
.app-card-icon{
  width:57px;height:57px;display:grid;place-items:center;
  margin:-28px 0 11px 20px;position:relative;z-index:1;
  background:#fffdfa;border:1px solid #e0d1b5;border-radius:16px;
  color:#a4761b;font-size:24px;box-shadow:0 4px 12px rgba(56,36,10,.07)
}
.app-card-body{padding:0 21px 21px;display:flex;flex-direction:column;gap:11px;min-height:207px}
.app-card-title-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.app-card h2{font:800 14px/1.3 var(--sans);color:#22283a;letter-spacing:-.35px;margin:0}
.app-card p{font-size:12px;line-height:1.75;color:#7c8699;flex:1;margin:0}
.flag{background:#f0e9df;color:#8e816f;font-size:10px;border-radius:22px;padding:4px 9px}
.app-card-meta{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:10px;color:#828b9e;border-top:1px solid #efe5d9;padding-top:12px}
.meta-state{color:#1e987d;font-weight:750}
.cardactions{gap:7px;margin-top:7px}
.cardactions .btn{font-size:10px;padding:7px 9px}
.formshell{gap:21px;align-items:start}
.field>span{color:#313c50;font-size:12px}
.field input,.field textarea,.field select{color:#222b3d;background:white;border:1px solid #e2d6c1;border-radius:11px;padding:13px 14px}
.field input:focus,.field textarea:focus,.field select:focus{outline:2px solid rgba(185,138,47,.45);outline-offset:1px}
.field input::placeholder,.field textarea::placeholder{color:#9aa0a8}
.field small{color:#7c8595;line-height:1.6}
.chip{background:#fcfaf6;border:1px solid #e5d8c6;color:#505a6b}
.chip:has(input:checked){color:#865d14;background:#f8ecd8;border-color:#c4a16c}
.chip input{accent-color:#a87822}
.color-row input[type=color]{padding:3px}
.preview-shell{border-color:#e3d7c5;background:#f4eee5}
.preview-top{background:#fffefa;border-color:#e5d9c7;color:#2a3345}
.preview-frame{background:#fafafa}
.core-grid{gap:14px}
.core-module{border-radius:16px;padding:21px}
.core-module b{color:#273145}
.core-module p{color:#818a9a}
.agent-card{border-radius:18px;background:linear-gradient(135deg,#fffefa,#f6efe5);padding:26px}
.agent-card b{color:#222d3c}
.agent-card p{color:#788396}
.status{color:#956c1c;background:#fcf4df;border-color:#e9d8b4}
.panel.warning{background:#fffbf1;border-color:#ebd9b5}
.panel.warning p{color:#83725a}
.toast{color:#fff;background:#4b3718;border-radius:13px;box-shadow:0 13px 30px rgba(43,25,8,.24)}
.mobile-menu{color:#293245}
@media(max-width:1100px){
  .sidebar{width:248px;min-width:248px}
  .content{padding:10px 24px 55px}
  .topbar{padding:14px 25px}
  .hero{padding:39px 36px}
}
@media(max-width:740px){
  .sidebar{width:min(300px,86vw);min-width:0;position:fixed;inset:0 auto 0 0;height:100dvh;z-index:20;transform:translateX(-105%);box-shadow:18px 0 55px rgba(37,27,8,.25)}
  .sidebar.open{transform:translateX(0)}
  .topbar{min-height:68px;padding:12px 14px}
  .mobile-menu{display:inline-flex;align-items:center;justify-content:center;border:1px solid #e4d9c7;border-radius:10px;background:#fffaf1;font-size:18px;width:37px;height:37px;margin-right:5px}
  .breadcrumb{font-size:10px}
  .top-actions{gap:6px}
  .top-button{padding:8px 10px;font-size:10px}
  .top-actions .pill{display:none}
  .content{padding:10px 15px 50px}
  .hero,.hero.factory-hero{margin:13px 0 32px;padding:32px 23px;min-height:0;border-radius:27px}
  .hero::before{font-size:250px;right:-50px;bottom:-35px}
  .hero h2{font-size:clamp(37px,8.2vw,54px);letter-spacing:-1.2px}
  .hero p{font-size:12px}
  .quick-create{flex-direction:column;align-items:stretch;padding:7px 8px 8px 16px;border-radius:17px;gap:0}
  .quick-create input{min-height:50px;font-size:12px}
  .quick-create .btn{width:100%;min-height:45px}
  .quick-examples button{font-size:10px;padding:8px 12px}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .stat{padding:18px;min-height:110px}
  .stat:last-child{grid-column:span 2}
  .stat strong{font-size:30px}
  .stat span{font-size:10px}
  .section-row h2{font-size:25px}
  .pagehead{align-items:flex-start;flex-direction:column;margin-top:18px}
  .pagehead h1{font-size:31px}
  .twocol,.formshell,.core-grid{grid-template-columns:1fr}
  .app-grid{grid-template-columns:repeat(auto-fill,minmax(245px,1fr))}
  .panel{padding:19px}
  .preview-frame{height:450px}
}
@media(max-width:390px){
  .breadcrumb{max-width:125px;display:inline-block;vertical-align:middle;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .top-button{padding:7px;font-size:9px}
  .hero h2{font-size:35px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .nav-item,.btn,.app-card,.top-button{transition:none}
  .nav-item:hover,.btn:hover,.app-card:hover,.top-button:hover{transform:none}
}

/* V0.3.1 — Galerie FACIL’ restaurée */
.catalog-card .app-card-icon{font-size:26px;}
.catalog-card .app-card-body{min-height:200px;}
.catalog-card .cardactions{margin-top:5px;}
.catalog-card .cardactions a.btn{text-decoration:none;display:inline-flex;align-items:center;}
.catalog-card .app-card-meta{gap:12px;}
.catalog-card .meta-state{white-space:nowrap;}
.catalog-note{color:#8f918e;font-size:11px;margin-top:7px;}
.catalog-disclaimer{margin:0 0 32px;padding:12px 16px;border:1px solid #e5d8c2;border-radius:11px;background:#f9f4e9;color:#827666;font-size:11px;line-height:1.65;}
@media(max-width:740px){.catalog-disclaimer{padding:11px 13px;margin-bottom:24px;}.catalog-card .meta-state{white-space:normal;}}

/* FACTORY · Atelier des missions GPT + Claude */
.mission-panel { background:linear-gradient(145deg,#fffcf7 0%,#f9f4e8 100%); }
.mission-panel .panelhead {align-items:center; margin-bottom:11px;}
.mission-panel .field textarea{min-height:105px; resize:vertical;}
.mission-panel .field-grid{align-items:start;}
.mission-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px;margin-bottom:26px;}
.mission-card{
 border:1px solid #e1d4be;border-radius:20px;background:linear-gradient(150deg,#fffefb,#f9f4eb);
 padding:22px;min-height:240px;box-shadow:0 11px 26px rgba(76,53,17,.035);
 display:flex;flex-direction:column;gap:7px;
}
.mission-card h3{font:700 20px/1.35 var(--serif);color:#202437;margin:7px 0 0;}
.mission-card p{color:#7b8291;font-size:12px;line-height:1.7;margin:0 0 7px;}
.mission-card .mission-target{color:#956b20;font-weight:800;font-size:11px;margin:0;}
.mission-card .cardactions{margin-top:auto;padding-top:12px;}
.mission-meta{display:flex;gap:10px;justify-content:space-between;align-items:center;color:#8d8490;font-size:11px;}
.mission-label{
 display:inline-flex;align-items:center;background:#f3e8cf;color:#997021;
 border:1px solid #e7d4aa;border-radius:18px;padding:6px 10px;font:800 10px var(--sans);
}
@media(max-width:740px){.mission-grid{grid-template-columns:1fr}.mission-card{padding:19px}.mission-panel .field-grid{grid-template-columns:1fr}}
