:root{--tuto-color-primary: #007aff;--tuto-color-primary-hover: #0060d0;--tuto-color-bg: #f9f9f9;--tuto-color-border: rgba(0,0,0,.06);--tuto-color-text: #333;--tuto-color-text-alt: #555;--tuto-shadow-light: 0 2px 6px rgba(0,0,0,.04);--tuto-shadow-medium: 0 4px 12px rgba(0,0,0,.05);--tuto-shadow-hover: 0 8px 16px rgba(0,0,0,.08);--tuto-transition-fast: .3s ease;--tuto-transition-medium: .3s ease;--tuto-radius-s: 8px;--tuto-radius-m: 12px;--tuto-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif}#tutoriel-module-container{width:100%;box-sizing:border-box;padding:1rem;background:var(--tuto-color-bg);border:1px solid var(--tuto-color-border);border-radius:var(--tuto-radius-m);font-family:var(--tuto-font-family);color:var(--tuto-color-text);box-shadow:var(--tuto-shadow-light);transition:box-shadow var(--tuto-transition-fast),transform var(--tuto-transition-fast)}#tutoriel-module-container:hover{transform:translateY(-1px);box-shadow:var(--tuto-shadow-medium)}.tutoriel-search-bar{display:flex;align-items:center;margin-bottom:1rem;gap:.5rem}.tutoriel-search-bar input[type=text]{flex:1;padding:.6rem .8rem;border:1px solid rgba(0,0,0,.15);border-radius:var(--tuto-radius-s);font-size:1rem;background:#fff;transition:border-color var(--tuto-transition-fast)}.tutoriel-search-bar input[type=text]:focus{border-color:var(--tuto-color-primary);outline:none}.tutoriel-search-bar button{padding:.6rem 1.2rem;background:var(--tuto-color-primary);color:#fff;border:none;border-radius:var(--tuto-radius-s);font-size:1rem;cursor:pointer;transition:background var(--tuto-transition-fast),transform .2s}.tutoriel-search-bar button:hover{background:var(--tuto-color-primary-hover)}.tutoriel-search-bar button:active{transform:scale(.97)}.tutoriel-cards-container{display:grid;grid-template-columns:1fr;gap:1rem}@media (min-width: 768px){.tutoriel-cards-container{grid-template-columns:1fr 1fr}}.tutoriel-card{background:#fff;border:1px solid var(--tuto-color-border);border-radius:var(--tuto-radius-s);padding:1rem;box-shadow:var(--tuto-shadow-light);display:flex;flex-direction:column;transition:transform var(--tuto-transition-fast),box-shadow var(--tuto-transition-fast)}.tutoriel-card:hover{transform:translateY(-2px);box-shadow:var(--tuto-shadow-hover)}.tutoriel-card-thumbnail{width:100%;margin-bottom:.5rem;border-radius:var(--tuto-radius-s);overflow:hidden}.tutoriel-card-thumbnail img{display:block;width:100%;height:auto}.tutoriel-card-title{font-size:1.1rem;margin:.2rem 0;font-weight:600;color:var(--tuto-color-text)}.tutoriel-card-desc{flex:1;font-size:.95rem;color:var(--tuto-color-text-alt);margin-top:.3rem;margin-bottom:.6rem}.tutoriel-card-more{align-self:flex-start;background:var(--tuto-color-primary);color:#fff;border:none;padding:.5rem 1rem;border-radius:var(--tuto-radius-s);font-size:.9rem;cursor:pointer;transition:background var(--tuto-transition-fast),transform .2s}.tutoriel-card-more:hover{background:var(--tuto-color-primary-hover)}.tutoriel-card-more:active{transform:scale(.97)}#tutoriel-detail-container{display:none;background:#fff;border:1px solid var(--tuto-color-border);border-radius:var(--tuto-radius-s);margin-top:1rem;padding:1rem;box-shadow:var(--tuto-shadow-light)}#tutoriel-detail-container.active{display:block;animation:slideDown .3s ease-out}@keyframes slideDown{0%{transform:translateY(-10px);opacity:0}to{transform:translateY(0);opacity:1}}.tutoriel-detail-player iframe{width:100%;max-width:100%;height:315px;border-radius:var(--tuto-radius-s)}.tutoriel-detail-desc{margin-top:1rem;font-size:.95rem;color:var(--tuto-color-text-alt)}.tutoriel-reactions{margin-top:1rem}.tutoriel-reactions button{margin-right:.5rem;background:#eee;border:1px solid rgba(0,0,0,.15);cursor:pointer;padding:.4rem .8rem;border-radius:var(--tuto-radius-s);font-size:.9rem;transition:background var(--tuto-transition-fast),transform .2s}.tutoriel-reactions button:hover{background:#ddd}.tutoriel-reactions button:active{transform:scale(.96)}