:root{--bg:#f1f7fc;--bg2:#e4f0fa;--accent:#2f86c9;--accent2:#5bb0e0;--ink:#17384c;--muted:#5d7c90;--card:#fff;--border:#d7e6f2;--soft:#eef6fc;--soft2:#e3f0f9;--red:#c0563f;--shadow:#1e50781f}.school-guitare{--bg:#faf5ec;--bg2:#f3ead9;--accent:#c0862a;--accent2:#4f8375;--ink:#3b3025;--muted:#8a7c68;--card:#fff;--border:#e7dcc8;--soft:#fbf5e9;--soft2:#f4ead6;--shadow:#5a3c191f}.school-piano{--bg:#f6f4fc;--bg2:#eee9fb;--accent:#6d5bd0;--accent2:#a97fca;--ink:#2b2540;--muted:#79728f;--card:#fff;--border:#e2ddf2;--soft:#f2eefc;--soft2:#e9e3f8;--shadow:#3c32781f}.school-connaissance{--bg:#eff8f4;--bg2:#e2f2ea;--accent:#2e9e8f;--accent2:#6bbf8a;--ink:#1f3d36;--muted:#5f8579;--card:#fff;--border:#d5ece4;--soft:#edf7f3;--soft2:#dff1e9;--shadow:#1e5a4b1f}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{color:var(--ink);background:linear-gradient(180deg, var(--bg2), var(--bg));font-family:Segoe UI,Helvetica Neue,Arial,sans-serif;line-height:1.6}a{color:inherit}.theme-shell{background:linear-gradient(180deg, var(--bg2), var(--bg));min-height:100vh}.site-header{text-align:center;padding:2.4rem 1rem 1.2rem}.site-header h1{color:var(--accent);letter-spacing:.5px;font-size:clamp(1.7rem,5vw,2.9rem)}.site-header p{color:var(--muted);margin-top:.5rem}.nav{flex-wrap:wrap;justify-content:center;gap:.6rem;padding:.4rem 1rem 1rem;display:flex}.nav a{color:var(--ink);border:1px solid var(--border);background:var(--card);border-radius:999px;padding:.45rem 1rem;font-size:.93rem;text-decoration:none;transition:all .2s}.nav a:hover,.nav a.active{background:var(--accent);color:#fff;border-color:var(--accent)}.brandbar{text-align:center;color:var(--muted);padding:.6rem 1rem 0;font-size:.9rem}.brandbar .uni{color:var(--accent);font-weight:600}.brandbar .sep{opacity:.6;margin:0 .4rem}.brandbar .school{color:var(--ink);font-weight:600;text-decoration:none}.brandbar .school:hover{color:var(--accent)}.container{max-width:1040px;margin:0 auto;padding:1rem 1.2rem 4rem}.center{text-align:center}.grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.4rem;margin-top:1.6rem;display:grid}.card{background:var(--card);border:1px solid var(--border);box-shadow:0 6px 20px var(--shadow);color:var(--ink);border-radius:16px;flex-direction:column;gap:.55rem;padding:1.5rem;text-decoration:none;transition:transform .2s,box-shadow .2s,border-color .2s;display:flex}a.card:hover{box-shadow:0 12px 28px var(--shadow);border-color:var(--accent);transform:translateY(-5px)}.card .num{color:var(--accent);font-size:2.2rem;font-weight:700;line-height:1}.card h3{font-size:1.2rem}.card p{color:var(--muted);font-size:.93rem}.card .dot{border-radius:50%;width:34px;height:34px}.badge{text-transform:uppercase;letter-spacing:.5px;background:var(--soft2);color:var(--muted);border-radius:999px;align-self:flex-start;padding:.2rem .6rem;font-size:.68rem}.badge.ready{background:var(--accent);color:#fff}.badge.soon{background:var(--soft2);color:var(--muted)}.btn{cursor:pointer;border:1px solid var(--border);background:var(--card);color:var(--ink);border-radius:999px;padding:.5rem 1.1rem;font-size:.9rem;text-decoration:none;transition:all .2s;display:inline-block}.btn:hover{border-color:var(--accent)}.btn.primary{background:var(--accent);color:#fff;border-color:var(--accent)}.cta{background:var(--accent);color:#fff;box-shadow:0 4px 12px var(--shadow);border-radius:999px;margin:0 .3rem .6rem;padding:.55rem 1.3rem;font-weight:700;text-decoration:none;display:inline-block}.cta.alt{background:var(--accent2)}.row{flex-wrap:wrap;justify-content:center;align-items:center;gap:.6rem;display:flex}.panel{background:var(--card);border:1px solid var(--border);box-shadow:0 6px 20px var(--shadow);border-radius:18px;padding:1.4rem}.hint{text-align:center;color:var(--muted);margin-top:1rem;font-size:.9rem}.feedback{text-align:center;min-height:1.3rem;margin-top:.5rem;font-weight:600}.feedback.ok{color:var(--accent2)}.feedback.no{color:var(--red)}.chord-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1.1rem;margin-top:1.4rem;display:grid}.chord-card{background:var(--soft);border:1px solid var(--border);text-align:center;cursor:pointer;border-radius:14px;padding:1rem;transition:transform .2s,border-color .2s}.chord-card:hover{border-color:var(--accent);transform:translateY(-4px)}.chord-card h3{color:var(--accent)}.chord-card .sub{color:var(--muted);font-size:.82rem}.chord-card svg,.chord-diagram svg{width:120px;height:auto}.strings-svg{width:100%;height:auto}.timeline{background:var(--soft);border:1px solid var(--border);border-radius:14px;height:92px;margin:1.2rem 0;position:relative;overflow:hidden}.timeline:before{content:"";background:var(--accent);z-index:3;width:3px;position:absolute;top:0;bottom:0;left:90px}.timeline:after{content:"▶";color:var(--accent);z-index:3;font-size:12px;position:absolute;top:-2px;left:82px}.tl-chord{background:var(--card);border:1px solid var(--border);border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:2px;width:138px;height:64px;display:flex;position:absolute;top:14px;overflow:hidden}.tl-chord .tl-name{color:var(--ink);font-size:1.35rem;font-weight:700;line-height:1}.tl-chord .tl-ly{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;max-width:132px;font-size:.78rem;overflow:hidden}.tl-chord.now{background:var(--accent);border-color:var(--accent)}.tl-chord.now .tl-name,.tl-chord.now .tl-ly{color:#fff}.pa-current{flex-direction:column;align-items:center;gap:.3rem;margin-top:.6rem;display:flex}.pa-current .lyric-now{color:var(--ink);text-align:center;min-height:1.4rem;font-size:1.15rem;font-weight:600}.pa-current .lbl{color:var(--accent2);font-weight:700}.song-part{margin-top:1rem}.song-part h3{color:var(--accent2)}.chord-line{flex-wrap:wrap;gap:.5rem;margin:.4rem 0;display:flex}.chord-badge{background:var(--soft);border:1px solid var(--border);color:var(--ink);cursor:pointer;border-radius:8px;padding:.35rem .8rem;font-weight:700}.chord-badge:hover{background:var(--accent);color:#fff;border-color:var(--accent)}.admin-layout{grid-template-columns:260px 1fr;align-items:start;gap:1.3rem;display:grid}@media (max-width:820px){.admin-layout{grid-template-columns:1fr}}.field{margin-bottom:.7rem}.field label{color:var(--muted);margin-bottom:.2rem;font-size:.85rem;display:block}.field input[type=text],.field input[type=number]{border:1px solid var(--border);background:var(--card);width:100%;color:var(--ink);border-radius:8px;padding:.5rem .6rem;font-size:1rem}.sec{border:1px solid var(--border);background:var(--soft);border-radius:12px;margin-bottom:.8rem;padding:.8rem}.sec-head{align-items:center;gap:.5rem;margin-bottom:.5rem;display:flex}.sec-head input{border:1px solid var(--border);background:var(--card);color:var(--ink);border-radius:8px;flex:1;padding:.4rem .5rem;font-weight:600}.bar-row{align-items:center;gap:.4rem;margin-bottom:.35rem;display:flex}.bar-row .bnum{text-align:center;width:24px;color:var(--muted);font-size:.8rem}.bar-row select{border:1px solid var(--border);background:var(--card);width:110px;color:var(--ink);border-radius:8px;padding:.35rem}.bar-row input{border:1px solid var(--border);background:var(--card);color:var(--ink);border-radius:8px;flex:1;padding:.35rem .5rem}.icon-btn{border:1px solid var(--border);background:var(--card);color:var(--red);cursor:pointer;border-radius:8px;width:30px;height:30px}.actions{flex-wrap:wrap;gap:.5rem;margin-top:1rem;display:flex}.song-item{border:1px solid var(--border);background:var(--card);cursor:pointer;border-radius:10px;justify-content:space-between;align-items:center;gap:.4rem;padding:.55rem .7rem;display:flex}.song-item:hover{border-color:var(--accent)}.song-item.on{box-shadow:inset 0 0 0 2px var(--accent)}.song-item small{color:var(--muted)}.tag{text-transform:uppercase;background:var(--soft2);color:var(--accent2);border-radius:999px;padding:.1rem .4rem;font-size:.62rem}.tempo{color:var(--muted);flex-wrap:wrap;justify-content:center;align-items:center;gap:1rem;margin-top:1rem;display:flex}.tempo input[type=range]{width:200px;accent-color:var(--accent)}.beats{flex-wrap:wrap;justify-content:center;gap:.5rem;margin:1.2rem 0;display:flex}.beat{border:1px solid var(--border);background:var(--soft);width:52px;height:66px;color:var(--ink);border-radius:12px;flex-direction:column;justify-content:center;align-items:center;font-size:1.6rem;transition:all .1s;display:flex}.beat.up{color:var(--accent2)}.beat.down{color:var(--accent)}.beat .lbl{color:var(--muted);margin-top:2px;font-size:.6rem}.beat.on{background:var(--accent);color:#fff;transform:translateY(-4px)}.beat.mute{opacity:.4}.legend{color:var(--muted);flex-wrap:wrap;justify-content:center;gap:1.2rem;margin-top:1rem;font-size:.88rem;display:flex}.legend span{align-items:center;gap:.4rem;display:inline-flex}.dot-key{border-radius:50%;width:16px;height:16px;display:inline-block}.fretboard-wrap{overflow-x:auto}.capo-fret{flex-wrap:wrap;justify-content:center;gap:.4rem;margin:1rem 0;display:flex}.capo-fret .btn{width:44px}.result-chord{color:var(--accent);text-align:center;font-size:1.6rem;font-weight:700}.metro-row{justify-content:center;gap:.6rem;margin:1.2rem 0;display:flex}.metro-dot{background:var(--border);border-radius:50%;width:28px;height:28px;transition:transform 50ms,background 50ms}.metro-dot.on{background:var(--accent);transform:scale(1.3)}.metro-dot.accent.on{background:var(--accent2)}.opts{gap:.6rem;margin-top:1rem;display:grid}.opt{border:1px solid var(--border);background:var(--soft);color:var(--ink);cursor:pointer;text-align:left;border-radius:12px;padding:.7rem 1rem;font-size:1rem}.opt:hover:not(:disabled){border-color:var(--accent)}.opt:disabled{cursor:default}.opt.correct{background:var(--soft2);border-color:var(--accent2);color:var(--accent2)}.opt.wrong{border-color:var(--red);color:var(--red);background:#f6e2dc}.big{color:var(--accent);text-align:center;font-size:1.6rem;font-weight:700}.deg-table{border-collapse:collapse;width:100%;margin-top:1rem}.deg-table th,.deg-table td{border:1px solid var(--border);text-align:center;padding:.5rem}.deg-table th{color:var(--muted);font-weight:600}.deg-table .play{cursor:pointer;color:var(--accent);font-weight:700}.theme-shell.school-guitare{--school-bg:linear-gradient(#faf6ee8c, #faf6eea8), url(/ecole-guitare.png), url(/ecole-guitare.svg);background-color:#efe6d6;background-image:var(--school-bg);background-position:50%;background-repeat:no-repeat;background-size:cover;background-attachment:fixed}.gt-topbar{z-index:50;background-color:#e9d8b8;background-image:var(--school-bg);background-position:50%;background-repeat:no-repeat;background-size:cover;background-attachment:fixed;position:fixed;top:0;left:0;right:0;box-shadow:0 8px 18px -12px #3c280f59}.gt-inner{grid-template-columns:1fr auto 1fr;align-items:center;gap:.6rem;width:100%;padding:.6rem 1.4rem;display:grid}.gt-left{justify-self:start}.gt-right{flex-wrap:wrap;justify-self:end;gap:.45rem;display:flex}.gt-brand{color:var(--accent);letter-spacing:.3px;text-shadow:0 1px 10px #ffffffb3;justify-self:center;font-size:1.2rem;font-weight:800;text-decoration:none}.gt-brand:hover{color:var(--wood)}.gt-btn{color:var(--ink);white-space:nowrap;background:#fff9;border:1px solid #785a2840;border-radius:999px;padding:.42rem .95rem;font-size:.86rem;text-decoration:none;transition:all .15s}.gt-btn:hover,.gt-btn.active{background:var(--accent);color:#fff;border-color:var(--accent)}.gt-content{z-index:1;padding-top:62px;position:relative}.gn-wrap{pointer-events:none;z-index:3;position:fixed;inset:0;overflow:hidden}.gn{color:var(--accent);opacity:0;will-change:transform, opacity;-webkit-user-select:none;user-select:none;text-shadow:0 1px 8px #fff9;line-height:1;position:absolute}.gn.sage{color:var(--accent2)}@media (max-width:640px){.gt-inner{grid-template-columns:auto 1fr;row-gap:.3rem}.gt-brand{order:-1;grid-column:1/-1;justify-self:center}.gt-left{justify-self:start}.gt-right{justify-self:end}.gt-content{padding-top:104px}}.lesson-nav{grid-template-columns:1fr auto 1fr;align-items:stretch;gap:.8rem;margin-top:1.6rem;display:grid}@media (max-width:640px){.lesson-nav{grid-template-columns:1fr}}.lesson-nav a{border:1px solid var(--border);background:var(--card);color:var(--ink);box-shadow:0 4px 14px var(--shadow);border-radius:12px;padding:.7rem .9rem;text-decoration:none;transition:border-color .15s,transform .15s}.lesson-nav a:hover{border-color:var(--accent);transform:translateY(-2px)}.lesson-nav .ln-prev{text-align:left}.lesson-nav .ln-next{text-align:right}.lesson-nav .ln-mid{color:var(--accent);justify-content:center;align-items:center;font-weight:700;display:flex}.lesson-nav small{color:var(--muted);font-size:.72rem;display:block}footer.site-footer{z-index:1;text-align:center;color:var(--muted);border-top:1px solid var(--border);padding:2rem 1rem;font-size:.85rem;position:relative}