:root {
  --orange:#E69531; --orange-light:#FAA44A; --orange-bg:#FFF8F0; --orange-border:#FED7AA;
  --blue:#2A7DE1; --blue-bg:#EBF4FF;
  --green:#22C55E; --green-bg:#F0FDF4; --green-border:#BBF7D0;
  --red:#EF4444; --red-bg:#FEF2F2;
  --purple:#7C3AED; --purple-bg:#F5F3FF; --purple-border:#DDD6FE;
  --gray-bg:#F8FAFC; --gray-border:#E2E8F0; --gray-text:#94A3B8;
  --dark:#1E293B; --white:#fff;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:'DM Sans',system-ui,sans-serif;background:#F1F5F9;color:var(--dark);min-height:100vh;}
::-webkit-scrollbar{width:6px;height:6px;}
::-webkit-scrollbar-thumb{background:#CBD5E1;border-radius:3px;}

/* HEADER */
.header{background:var(--white);border-bottom:1px solid var(--gray-border);padding:14px 32px;display:flex;align-items:center;gap:14px;position:sticky;top:0;z-index:100;box-shadow:0 1px 4px rgba(0,0,0,0.04);}
.logo-wrap{display:flex;align-items:center;gap:12px;}
.logo-robot{width:42px;height:42px;}
.header h1{font-size:18px;font-weight:800;letter-spacing:-0.02em;background:linear-gradient(135deg,var(--orange),var(--orange-light));-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.header .sub{font-size:11px;color:var(--gray-text);margin-top:1px;letter-spacing:0.02em;}
.header-right{margin-left:auto;display:flex;align-items:center;gap:8px;}
.stat-chip{font-size:11px;font-weight:600;padding:5px 11px;border-radius:8px;display:flex;align-items:center;gap:4px;}
.stat-chip.total{background:var(--gray-bg);color:var(--dark);border:1px solid var(--gray-border);}
.stat-chip.stable{background:var(--green-bg);color:var(--green);border:1px solid var(--green-border);}
.stat-chip.beta{background:var(--orange-bg);color:var(--orange);border:1px solid var(--orange-border);}

/* TOOLBAR */
.toolbar{padding:14px 32px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.search-box{display:flex;align-items:center;gap:8px;background:var(--white);border:1.5px solid var(--gray-border);border-radius:10px;padding:9px 14px;flex:1;min-width:280px;transition:all .15s;}
.search-box:focus-within{border-color:var(--orange);box-shadow:0 0 0 3px rgba(230,149,49,0.1);}
.search-box input{border:none;outline:none;background:transparent;font-size:13px;color:var(--dark);width:100%;font-family:inherit;}
.search-box input::placeholder{color:#CBD5E1;}
.fchip{padding:6px 12px;border-radius:8px;font-size:11px;font-weight:600;cursor:pointer;border:1.5px solid var(--gray-border);background:var(--white);color:var(--gray-text);transition:all .15s;}
.fchip:hover{border-color:var(--orange);color:var(--orange);}
.fchip.on{background:var(--orange);color:#fff;border-color:var(--orange);}
.btn-add{display:flex;align-items:center;gap:5px;padding:8px 16px;border-radius:10px;background:var(--orange);color:#fff;font-size:12px;font-weight:700;border:none;cursor:pointer;font-family:inherit;box-shadow:0 2px 8px rgba(230,149,49,0.3);transition:all .15s;}
.btn-add:hover{transform:translateY(-1px);box-shadow:0 4px 14px rgba(230,149,49,0.4);}

/* TABLE */
.table-wrap{padding:0 32px 40px;}
.table-box{background:var(--white);border-radius:14px;border:1px solid var(--gray-border);overflow-x:auto;box-shadow:0 1px 3px rgba(0,0,0,0.04);}
table{width:100%;border-collapse:collapse;min-width:1100px;}
thead th{padding:12px 14px;font-size:11px;font-weight:700;color:var(--gray-text);text-transform:uppercase;letter-spacing:.06em;text-align:left;background:var(--gray-bg);border-bottom:1px solid var(--gray-border);white-space:nowrap;cursor:pointer;user-select:none;position:sticky;top:0;}
thead th:hover{color:var(--orange);}
tbody tr{border-bottom:1px solid #F1F5F9;transition:background .1s;}
tbody tr:hover{background:#FAFBFE;}
tbody tr:last-child{border-bottom:none;}
td{padding:12px 14px;font-size:14px;vertical-align:middle;white-space:nowrap;}

.c-num{font-family:'JetBrains Mono',monospace;font-size:12px;font-weight:700;color:var(--orange);text-align:center;width:36px;min-width:36px;}
.c-date{font-size:12.5px;color:var(--gray-text);font-family:'JetBrains Mono',monospace;}
.c-name{font-weight:700;color:var(--dark);font-size:14.5px;cursor:pointer;}
.c-name:hover{color:var(--orange);}
.c-ver{font-family:'JetBrains Mono',monospace;font-size:12.5px;font-weight:600;background:var(--gray-bg);padding:4px 10px;border-radius:5px;display:inline-block;}
.c-project{font-size:13px;color:#64748B;}
.c-cnt{font-family:'JetBrains Mono',monospace;font-size:14px;font-weight:600;text-align:center;}

/* BADGES */
.b{display:inline-flex;align-items:center;gap:3px;font-size:11px;font-weight:700;padding:3px 9px;border-radius:5px;white-space:nowrap;}
.b-cat{background:#F1F5F9;color:#475569;border:1px solid var(--gray-border);}
.b-cat.auth{background:var(--purple-bg);color:var(--purple);border-color:var(--purple-border);}
.b-cat.ui{background:var(--blue-bg);color:var(--blue);border-color:#BFDBFE;}
.b-cat.paiement{background:var(--green-bg);color:var(--green);border-color:var(--green-border);}
.b-cat.geoloc{background:#FFF7ED;color:#EA580C;border-color:#FED7AA;}
.b-cat.sync{background:#F0F9FF;color:#0284C7;border-color:#BAE6FD;}
.b-cat.api{background:#ECFDF5;color:#059669;border-color:#A7F3D0;}
.b-cat.ia{background:#FDF4FF;color:#A21CAF;border-color:#F0ABFC;}
.b-cat.base{background:#FFF1F2;color:#E11D48;border-color:#FECDD3;}
.b-lang{font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:600;padding:3px 8px;border-radius:4px;background:#F1F5F9;color:#64748B;}
.b-st{font-size:11px;font-weight:700;padding:4px 10px;border-radius:5px;}
.b-st.stable{background:var(--green-bg);color:var(--green);}
.b-st.beta{background:var(--orange-bg);color:var(--orange);}
.b-st.obsolete{background:var(--red-bg);color:var(--red);}
.b-co{font-size:10px;font-weight:600;padding:3px 6px;border-radius:4px;margin-right:2px;}
.b-co.mobile{background:#EDE9FE;color:#7C3AED;}
.b-co.desktop{background:#E0F2FE;color:#0284C7;}
.b-co.offline{background:#FEF3C7;color:#D97706;}
.b-co.api-tag{background:#ECFDF5;color:#059669;}

.stars{color:var(--orange);font-size:14px;letter-spacing:1px;white-space:nowrap;}
.stars .e{color:#E2E8F0;}

.file-btn{display:inline-flex;align-items:center;gap:3px;padding:4px 10px;border-radius:5px;background:var(--orange-bg);color:var(--orange);font-size:11.5px;font-weight:600;cursor:pointer;border:1px solid var(--orange-border);text-decoration:none;transition:all .12s;}
.file-btn:hover{background:var(--orange);color:#fff;}
.file-btn.disabled{opacity:0.4;pointer-events:none;}
.prompt-btn{display:inline-flex;align-items:center;gap:3px;padding:4px 9px;border-radius:5px;background:var(--purple-bg);color:var(--purple);font-size:11px;font-weight:600;cursor:pointer;border:1px solid var(--purple-border);transition:all .12s;}
.prompt-btn:hover{background:var(--purple);color:#fff;}
.prompt-btn.disabled{opacity:0.4;pointer-events:none;}

/* MODALS */
.overlay{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(15,23,42,.5);z-index:200;justify-content:center;align-items:center;padding:24px;}
.overlay.vis{display:flex;}
.modal{background:var(--white);border-radius:16px;max-width:700px;width:100%;box-shadow:0 25px 60px rgba(0,0,0,.2);overflow:hidden;animation:mIn .25s ease forwards;}
.modal.wide{max-width:840px;}
.modal.view{max-width:760px;height:520px;display:flex;flex-direction:column;}
@keyframes mIn{from{opacity:0;transform:translateY(12px) scale(.98);}to{opacity:1;transform:translateY(0) scale(1);}}
@keyframes rowIn{from{opacity:0;transform:translateY(4px);}to{opacity:1;transform:translateY(0);}}
.m-head{padding:14px 20px;border-bottom:1px solid var(--gray-border);display:flex;align-items:center;justify-content:space-between;}
.m-head h3{font-size:14px;font-weight:700;display:flex;align-items:center;gap:6px;}
.m-close{cursor:pointer;color:var(--gray-text);background:none;border:none;padding:4px;}
.m-close:hover{color:var(--dark);}
.m-body{padding:20px;max-height:70vh;overflow-y:auto;}
.modal.view .m-body{flex:1;overflow-y:auto;}
.m-foot{padding:12px 20px;border-top:1px solid var(--gray-border);display:flex;justify-content:flex-end;gap:8px;}

/* View tabs */
.view-tabs{display:flex;border-bottom:1px solid var(--gray-border);padding:0 20px;gap:0;}
.view-tab{padding:10px 16px;font-size:12px;font-weight:600;color:var(--gray-text);cursor:pointer;border-bottom:2px solid transparent;transition:all .15s;}
.view-tab:hover{color:var(--orange);}
.view-tab.on{color:var(--orange);border-bottom-color:var(--orange);}
.view-text{font-size:13.5px;line-height:1.8;color:var(--dark);white-space:pre-wrap;padding:4px 0;}
.view-text.empty{color:var(--gray-text);font-style:italic;}

/* Prompt modal */
.pm-code{background:#0D0D0F;color:#E2E8F0;font-family:'JetBrains Mono',monospace;font-size:12.5px;line-height:1.7;padding:16px;border-radius:10px;white-space:pre-wrap;max-height:340px;overflow-y:auto;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;}

.mbtn{padding:7px 16px;border-radius:8px;font-size:12px;font-weight:600;cursor:pointer;border:none;font-family:inherit;transition:all .12s;}
.mbtn-primary{background:var(--orange);color:#fff;display:flex;align-items:center;gap:5px;}
.mbtn-primary:hover{transform:translateY(-1px);box-shadow:0 4px 14px rgba(230,149,49,0.4);}
.mbtn-danger{background:var(--red);color:#fff;}
.mbtn-danger:hover{opacity:0.9;}
.mbtn-copy{background:var(--orange);color:#fff;display:flex;align-items:center;gap:5px;}
.mbtn-copy:hover{transform:translateY(-1px);}
.mbtn-close{background:var(--white);color:var(--gray-text);border:1px solid var(--gray-border);}

/* Form modal */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.form-grid .full{grid-column:1/-1;}
.form-group{display:flex;flex-direction:column;gap:4px;}
.form-group label{font-size:10px;font-weight:700;color:var(--gray-text);text-transform:uppercase;letter-spacing:.04em;}
.form-group input,.form-group select,.form-group textarea{padding:8px 12px;border:1.5px solid var(--gray-border);border-radius:8px;font-size:12.5px;font-family:inherit;color:var(--dark);transition:border-color .15s;}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--orange);box-shadow:0 0 0 3px rgba(230,149,49,0.1);}
.form-group textarea{resize:vertical;min-height:60px;}
.form-group .prompt-area{min-height:120px;font-family:'JetBrains Mono',monospace;font-size:11.5px;line-height:1.6;}
.compat-tags{display:flex;gap:6px;flex-wrap:wrap;}
.compat-tag{padding:5px 10px;border-radius:6px;font-size:10.5px;font-weight:600;cursor:pointer;border:1.5px solid var(--gray-border);background:var(--white);color:var(--gray-text);transition:all .15s;}
.compat-tag:hover{border-color:var(--orange);color:var(--orange);}
.compat-tag.on{background:var(--orange);color:#fff;border-color:var(--orange);}
.rating-stars{display:flex;gap:4px;cursor:pointer;font-size:20px;}
.rating-stars span{color:#E2E8F0;transition:color .1s;}
.rating-stars span.on{color:var(--orange);}
.rating-stars span:hover{color:var(--orange);}

.no-res{padding:60px 20px;text-align:center;color:var(--gray-text);font-size:14px;display:none;}
.no-res .big{font-size:36px;margin-bottom:8px;}

/* Toast */
.toast{position:fixed;bottom:24px;right:24px;background:var(--dark);color:#fff;padding:12px 20px;border-radius:10px;font-size:12.5px;font-weight:600;z-index:300;animation:toastIn .3s ease;box-shadow:0 8px 24px rgba(0,0,0,.15);}
.toast.success{border-left:4px solid var(--green);}
.toast.error{border-left:4px solid var(--red);}
@keyframes toastIn{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:translateY(0);}}

@media(max-width:768px){
  .header,.toolbar,.table-wrap{padding-left:16px;padding-right:16px;}
  .search-box{min-width:200px;}
  .form-grid{grid-template-columns:1fr;}
}