/* kit.css — the frame shared by the twelve app illustrations of /plateforme, one document per
   iframe. Ported from the design board « Plateforme · tour en chapitres » (2026-09-22); the
   generator that wrote it is not in the repository, so this file is now the source. */
:root{--slate-50:#f8fafc;--slate-100:#f1f5f9;--slate-200:#e2e8f0;--slate-300:#cbd5e1;--slate-400:#94a3b8;--slate-500:#64748b;--slate-600:#475569;--slate-700:#334155;--slate-800:#1e293b;--slate-900:#0f172a;--slate-950:#020617;--gray-50:#f9fafb;--gray-100:#f3f4f6;--gray-200:#e5e7eb;--gray-300:#d1d5db;--gray-400:#9ca3af;--gray-500:#6b7280;--gray-600:#4b5563;--gray-700:#374151;--gray-800:#1f2937;--gray-900:#111827;--gray-950:#030712;--zinc-50:#fafafa;--zinc-100:#f4f4f5;--zinc-200:#e4e4e7;--zinc-300:#d4d4d8;--zinc-400:#a1a1aa;--zinc-500:#71717a;--zinc-600:#52525b;--zinc-700:#3f3f46;--zinc-800:#27272a;--zinc-900:#18181b;--zinc-950:#09090b;--neutral-50:#fafafa;--neutral-100:#f5f5f5;--neutral-200:#e5e5e5;--neutral-300:#d4d4d4;--neutral-400:#a3a3a3;--neutral-500:#737373;--neutral-600:#525252;--neutral-700:#404040;--neutral-800:#262626;--neutral-900:#171717;--neutral-950:#0a0a0a;--red-50:#fef2f2;--red-100:#fee2e2;--red-200:#fecaca;--red-300:#fca5a5;--red-400:#f87171;--red-500:#ef4444;--red-600:#dc2626;--red-700:#b91c1c;--red-800:#991b1b;--red-900:#7f1d1d;--red-950:#450a0a;--orange-50:#fff7ed;--orange-100:#ffedd5;--orange-200:#fed7aa;--orange-300:#fdba74;--orange-400:#fb923c;--orange-500:#f97316;--orange-600:#ea580c;--orange-700:#c2410c;--orange-800:#9a3412;--orange-900:#7c2d12;--orange-950:#431407;--amber-50:#fffbeb;--amber-100:#fef3c7;--amber-200:#fde68a;--amber-300:#fcd34d;--amber-400:#fbbf24;--amber-500:#f59e0b;--amber-600:#d97706;--amber-700:#b45309;--amber-800:#92400e;--amber-900:#78350f;--amber-950:#451a03;--yellow-50:#fefce8;--yellow-100:#fef9c3;--yellow-200:#fef08a;--yellow-300:#fde047;--yellow-400:#facc15;--yellow-500:#eab308;--yellow-600:#ca8a04;--yellow-700:#a16207;--yellow-800:#854d0e;--yellow-900:#713f12;--yellow-950:#422006;--lime-50:#f7fee7;--lime-100:#ecfccb;--lime-200:#d9f99d;--lime-300:#bef264;--lime-400:#a3e635;--lime-500:#84cc16;--lime-600:#65a30d;--lime-700:#4d7c0f;--lime-800:#3f6212;--lime-900:#365314;--lime-950:#1a2e05;--green-50:#f0fdf4;--green-100:#dcfce7;--green-200:#bbf7d0;--green-300:#86efac;--green-400:#4ade80;--green-500:#22c55e;--green-600:#16a34a;--green-700:#15803d;--green-800:#166534;--green-900:#14532d;--green-950:#052e16;--emerald-50:#ecfdf5;--emerald-100:#d1fae5;--emerald-200:#a7f3d0;--emerald-300:#6ee7b7;--emerald-400:#34d399;--emerald-500:#10b981;--emerald-600:#059669;--emerald-700:#047857;--emerald-800:#065f46;--emerald-900:#064e3b;--emerald-950:#022c22;--teal-50:#f0fdfa;--teal-100:#ccfbf1;--teal-200:#99f6e4;--teal-300:#5eead4;--teal-400:#2dd4bf;--teal-500:#14b8a6;--teal-600:#0d9488;--teal-700:#0f766e;--teal-800:#115e59;--teal-900:#134e4a;--teal-950:#042f2e;--cyan-50:#ecfeff;--cyan-100:#cffafe;--cyan-200:#a5f3fc;--cyan-300:#67e8f9;--cyan-400:#22d3ee;--cyan-500:#06b6d4;--cyan-600:#0891b2;--cyan-700:#0e7490;--cyan-800:#155e75;--cyan-900:#164e63;--cyan-950:#083344;--sky-50:#f0f9ff;--sky-100:#e0f2fe;--sky-200:#bae6fd;--sky-300:#7dd3fc;--sky-400:#38bdf8;--sky-500:#0ea5e9;--sky-600:#0284c7;--sky-700:#0369a1;--sky-800:#075985;--sky-900:#0c4a6e;--sky-950:#082f49;--blue-50:#eff6ff;--blue-100:#dbeafe;--blue-200:#bfdbfe;--blue-300:#93c5fd;--blue-400:#60a5fa;--blue-500:#3b82f6;--blue-600:#2563eb;--blue-700:#1d4ed8;--blue-800:#1e40af;--blue-900:#1e3a8a;--blue-950:#172554;--indigo-50:#eef2ff;--indigo-100:#e0e7ff;--indigo-200:#c7d2fe;--indigo-300:#a5b4fc;--indigo-400:#818cf8;--indigo-500:#6366f1;--indigo-600:#4f46e5;--indigo-700:#4338ca;--indigo-800:#3730a3;--indigo-900:#312e81;--indigo-950:#1e1b4b;--violet-50:#f5f3ff;--violet-100:#ede9fe;--violet-200:#ddd6fe;--violet-300:#c4b5fd;--violet-400:#a78bfa;--violet-500:#8b5cf6;--violet-600:#7c3aed;--violet-700:#6d28d9;--violet-800:#5b21b6;--violet-900:#4c1d95;--violet-950:#2e1065;--purple-50:#faf5ff;--purple-100:#f3e8ff;--purple-200:#e9d5ff;--purple-300:#d8b4fe;--purple-400:#c084fc;--purple-500:#a855f7;--purple-600:#9333ea;--purple-700:#7e22ce;--purple-800:#6b21a8;--purple-900:#581c87;--purple-950:#3b0764;--fuchsia-50:#fdf4ff;--fuchsia-100:#fae8ff;--fuchsia-200:#f5d0fe;--fuchsia-300:#f0abfc;--fuchsia-400:#e879f9;--fuchsia-500:#d946ef;--fuchsia-600:#c026d3;--fuchsia-700:#a21caf;--fuchsia-800:#86198f;--fuchsia-900:#701a75;--fuchsia-950:#4a044e;--pink-50:#fdf2f8;--pink-100:#fce7f3;--pink-200:#fbcfe8;--pink-300:#f9a8d4;--pink-400:#f472b6;--pink-500:#ec4899;--pink-600:#db2777;--pink-700:#be185d;--pink-800:#9d174d;--pink-900:#831843;--pink-950:#500724;--rose-50:#fff1f2;--rose-100:#ffe4e6;--rose-200:#fecdd3;--rose-300:#fda4af;--rose-400:#fb7185;--rose-500:#f43f5e;--rose-600:#e11d48;--rose-700:#be123c;--rose-800:#9f1239;--rose-900:#881337;--rose-950:#4c0519}
/* Tailwind v3 preflight, scoped */
html,body{margin:0;padding:0}
.ax-body{background:transparent;width:1024px;height:836px;overflow:hidden}
.ax-frame,.ax-frame *,.ax-frame ::before,.ax-frame ::after{box-sizing:border-box;border:0 solid var(--gray-200);margin:0;padding:0}
.ax-frame{width:1024px;height:836px;overflow:hidden;position:relative;border-radius:12px;background:#fff;
  font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
  font-size:16px;line-height:1.5;-webkit-text-size-adjust:100%;tab-size:4;color:#000;font-feature-settings:normal;font-variation-settings:normal}
.ax-frame h1,.ax-frame h2,.ax-frame h3,.ax-frame h4,.ax-frame h5,.ax-frame h6{font-size:inherit;font-weight:inherit}
.ax-frame a{color:inherit;text-decoration:inherit}
.ax-frame b,.ax-frame strong{font-weight:bolder}
.ax-frame code,.ax-frame kbd,.ax-frame pre,.ax-frame samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;font-size:1em}
.ax-frame button,.ax-frame input,.ax-frame select,.ax-frame textarea{font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;letter-spacing:inherit;background-color:transparent;background-image:none;text-transform:none}
.ax-frame button{cursor:pointer}
.ax-frame ol,.ax-frame ul,.ax-frame menu{list-style:none}
.ax-frame img,.ax-frame svg,.ax-frame video,.ax-frame canvas{display:block;vertical-align:middle}
.ax-frame svg{flex-shrink:0}
.ax-frame table{text-indent:0;border-color:inherit;border-collapse:collapse}
.ax-tabular{font-variant-numeric:tabular-nums}
.ax-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace}

/* Browser chrome (36px) — not part of the app */
.ax-chrome{height:36px;display:flex;align-items:center;gap:8px;padding:0 14px;background:#f1f2f7;border-bottom:1px solid #e3e5ee}
.ax-chrome i{width:11px;height:11px;border-radius:999px;background:#d9dbe6;display:block}
.ax-url{margin:0 auto;display:flex;align-items:center;gap:6px;height:22px;padding:0 14px;border-radius:7px;background:#fff;border:1px solid #e3e5ee;
  font-size:11px;color:var(--gray-500);min-width:360px;justify-content:center;transform:translateX(-24px)}
.ax-url svg{color:var(--gray-400)}

/* The app at 1280 × 800, cropped to its <main> (Jordan, 22/09: no Sidebar in the previews) — ClientLayout's `bg-gray-50` */
.ax-app{position:relative;width:1024px;height:800px;overflow:hidden;display:flex;background:var(--gray-50)}

/* Sidebar.tsx — fixed w-64, bg-indigo-700, text-white */
.ax-sidebar{position:absolute;left:0;top:0;z-index:30;width:256px;height:800px;display:flex;flex-direction:column;background:var(--indigo-700);color:#fff}
.ax-logo{height:64px;display:flex;align-items:center;padding:0 16px;background:var(--indigo-800);flex-shrink:0}
.ax-logo span{margin-left:8px;font-size:20px;line-height:28px;font-weight:700}
.ax-nav{flex:1;min-height:0;padding:24px 16px;display:flex;flex-direction:column;gap:4px}
.ax-item{display:flex;align-items:center;width:100%;padding:8px 16px;font-size:14px;line-height:20px;border-radius:8px;color:#fff}
.ax-item svg{margin-right:12px}
.ax-item.is-active{background:#fff;color:var(--indigo-700);font-weight:600}
.ax-item.is-soon{color:rgb(199 210 254/.75)}
.ax-item.is-soon .ax-lbl{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ax-soon{margin-left:8px;font-size:9px;line-height:13.5px;font-weight:500;color:rgb(199 210 254/.7)}
.ax-user{padding:16px;border-top:1px solid var(--indigo-600);display:flex;flex-direction:column;gap:8px;flex-shrink:0}
.ax-plan{display:flex;min-height:40px;width:100%;align-items:center;gap:12px;border-radius:8px;padding:0 16px;font-size:14px;line-height:20px;color:var(--indigo-100)}
.ax-plan .ax-lbl{flex:1;min-width:0;text-align:left}
.ax-plan .ax-plan-name{font-size:9px;line-height:13.5px;font-weight:600;opacity:.7}
.ax-more{display:flex;flex-direction:column;gap:4px}
.ax-more div{display:flex;min-height:40px;align-items:center;border-radius:8px;padding:0 16px;font-size:14px;line-height:20px;color:rgb(199 210 254/.75)}
.ax-more svg{margin-right:12px}
.ax-more .ax-lbl{flex:1;min-width:0}
.ax-more .ax-soon{margin-left:0;color:inherit}
.ax-signout{display:flex;align-items:center;padding:8px 16px;font-size:14px;line-height:20px;border-radius:8px;width:100%;color:var(--red-200)}
.ax-signout svg{margin-right:12px}

/* <main className="min-w-0 flex-1 md:ml-64"> — 1024px wide, laid out as beside the 256px Sidebar */
.ax-main{position:absolute;left:0;top:0;width:1024px;height:800px;overflow:hidden}
/* GlassPageBackground at the GlassProvider defaults: angle .375 → 135deg, intensity 1, 'current' palette */
.ax-bg{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(135deg,rgba(107,114,128,.200),rgba(99,102,241,.250) 33%,rgba(59,130,246,.250) 66%,rgba(139,92,246,.200))}
.ax-orb{position:absolute;border-radius:999px;display:block}
.ax-orb-indigo{top:-160px;left:-160px;width:700px;height:700px;background:radial-gradient(circle,rgba(99,102,241,.12) 0%,transparent 70%)}
.ax-orb-violet{top:33.3333%;right:-80px;width:600px;height:600px;background:radial-gradient(circle,rgba(139,92,246,.09) 0%,transparent 70%)}
.ax-orb-blue{bottom:25%;left:25%;width:550px;height:550px;background:radial-gradient(circle,rgba(59,130,246,.07) 0%,transparent 70%)}

/* ClientWorkspaceLayout: `relative z-10 flex gap-3 md:h-full md:flex-row md:p-5` */
.ax-shell{position:relative;z-index:10;display:flex;flex-direction:row;gap:12px;padding:20px;height:100%}
.ax-rail{width:30%;max-width:320px;flex-shrink:0;height:100%}
.ax-panel{flex:1;min-width:0;min-height:0;height:100%}

/* LiquidGlassCard at the GlassProvider defaults (glassOpacity .17, blur 23.04px, inner .09 / 25.92px).
   `rounded-3xl` + the caller's `rounded-xl`: rounded-3xl is emitted later by Tailwind and wins (24px). */
.ax-glass{position:relative;border-radius:24px;overflow:hidden;background:rgba(255,255,255,.17);
  -webkit-backdrop-filter:blur(23.04px) saturate(1.96);backdrop-filter:blur(23.04px) saturate(1.96);
  border:1px solid rgba(255,255,255,.284);box-shadow:0 4px 24px rgba(0,0,0,.236),inset 0 1px 0 rgba(255,255,255,.284);
  --glass-card-bg:rgba(255,255,255,.171);--glass-card-border:rgba(255,255,255,0);--glass-card-hover-bg:rgba(255,255,255,.271);--glass-card-hover-border:rgba(255,255,255,.05);
  --glass-accent-bg:rgba(245,243,255,.221);--glass-accent-border:rgba(196,181,253,.04);--glass-accent-hover-bg:rgba(245,243,255,.371);--glass-accent-hover-border:rgba(196,181,253,.09)}
.ax-glass-in{position:relative;z-index:1;height:100%;display:flex;flex-direction:column;min-height:0}
.ax-rail-card{height:100%}
.ax-panel-card{height:100%;padding:4px}
/* src/index.css Tier-2 classes (no own blur) */
.glass-card{background:var(--glass-card-bg,rgba(255,255,255,.30));border:1px solid var(--glass-card-border,rgba(255,255,255,.20))}
.glass-card-accent{background:var(--glass-accent-bg,rgba(245,243,255,.35));border:1px solid var(--glass-accent-border,rgba(196,181,253,.25))}

/* Left rail: greeting zone `px-3 pt-3 pb-1.5` + ShellGreeting */
.ax-greeting{padding:12px 12px 6px;flex-shrink:0}
.ax-greet-1{font-size:15px;line-height:22.5px;font-weight:700;color:var(--indigo-900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ax-greet-2{font-size:15px;line-height:1.375;font-weight:600;color:var(--indigo-900);min-height:2.75em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* PersistentStatsStack (desktop) */
.ax-stats{flex-shrink:0}
.ax-stats-cov{padding:0 12px 6px}
.ax-stats-row{margin-bottom:2px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.ax-stats-row span:first-child{font-size:9px;line-height:13.5px;color:var(--indigo-900)}
.ax-stats-row span:last-child{font-size:10px;line-height:15px;font-weight:500;font-variant-numeric:tabular-nums;color:var(--indigo-900)}
.ax-bar{width:100%;height:6px;border-radius:999px;background:rgb(238 242 255/.5);box-shadow:0 0 0 1px rgb(129 140 248/.7)}
.ax-bar > i{display:block;height:6px;border-radius:999px;background:linear-gradient(to right,var(--indigo-500),var(--violet-500))}
.ax-divider{margin:0 12px;height:1px;background:rgb(165 180 252/.25);flex-shrink:0}
.ax-divider-body{margin:4px 12px}
.ax-xp{display:flex;align-items:center;gap:8px;padding:6px 12px}
.ax-xp span:first-child{border-radius:999px;padding:2px 6px;font-size:9px;line-height:13.5px;color:var(--indigo-600);box-shadow:0 0 0 1px rgb(196 181 253/.4)}
.ax-xp span:last-child{font-size:9px;line-height:13.5px;color:rgb(129 140 248/.7)}
/* the portaled left body (inside the shell's ScrollableDropdown, h-full) */
.ax-leftbody{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}

/* ---- Illustration frame (Jordan, 22/09: « un juste milieu entre rendu exact et illustration ») ----
   860 × 555 = the chapter preview slot at 1440, so the illustration is authored at its display size. */
.ai-body{width:860px;height:555px}
.ax-frame.ai-frame{width:860px;height:555px;border-radius:16px;background:var(--gray-50)}
.ai-frame > .ax-bg{position:absolute;inset:0}
.ai-stage{position:absolute;inset:0;overflow:hidden}
/* the one illustrative device besides cropping: grey strokes for secondary copy (the site's MockText grammar) */
.ai-gk{display:block;height:7px;border-radius:999px;background:rgb(165 180 252/.38)}
.ai-gk.is-meta{height:5px;background:rgb(165 180 252/.28)}
.ai-gk.is-title{height:10px;background:rgb(99 102 241/.30)}

/* Full-screen routes (session, results, Forge) render straight into <main>, outside the shell */
.ax-full{position:absolute;inset:0;overflow:hidden}