:root{--pink:#E91E63;--pink-soft:#FF6B9D;--ink:#14253a;--blue:#16477d;--line:#e4d4df}*{box-sizing:border-box}body{margin:0;color:#f8fbff;font-family:'DM Sans',sans-serif;overflow:hidden;background:#1c3567}.desktop{height:calc(100vh - 64px);position:relative;overflow:hidden;background:linear-gradient(140deg,#4b8bc5,#16477d 50%,#0e2750)}.mountains{position:absolute;inset:0;background:linear-gradient(145deg,transparent 52%,#102e56 52.2%,#102e56 57%,transparent 57.2%),linear-gradient(35deg,transparent 42%,#1d4b7d 42.2%,#1d4b7d 58%,transparent 58.2%),linear-gradient(150deg,transparent 34%,#3777aa 34.2%,#3777aa 47%,transparent 47.2%);opacity:.9}.mountains:after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 70% 25%,#fff5 0 2px,transparent 3px),linear-gradient(#98d2edaa,#518fc400 38%)}.desktop-label{position:absolute;right:7%;top:9%;z-index:1;font:11px 'IBM Plex Mono';letter-spacing:.14em;color:#d6e9ff}.desktop-label b{display:block;color:#9ec8ea;font-weight:400;margin-top:8px}.window{position:absolute;left:10%;top:5%;width:min(1060px,calc(100vw - 100px));max-height:calc(100vh - 92px);background:#f8fbff;color:var(--ink);border:1px solid #ffffffaa;border-radius:14px;box-shadow:0 30px 80px #05204477;overflow:hidden;z-index:5;animation:pop .28s ease}.window-head{height:46px;background:#edf5fd;color:#1a3150;display:flex;align-items:center;justify-content:space-between;padding:0 13px 0 18px;cursor:grab}.window-head strong{display:flex;align-items:center;gap:9px}.title-dot{color:var(--pink);font-size:18px}.controls button{border:0;background:#dceafb;color:#193755;border-radius:5px;margin-left:5px;width:28px;height:25px;cursor:pointer;font-size:16px}.controls button:hover{background:#f9c4d7;color:#a30e45}.window-body{overflow:auto;max-height:calc(100vh - 138px)}.app-toolbar{height:66px;padding:14px 28px;display:flex;align-items:center;gap:12px;border-bottom:1px solid #e6edf4;background:#fff}.app-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:#fde3ed;color:var(--pink);font-size:21px}.app-toolbar b,.app-toolbar small{display:block}.app-toolbar small{font:11px 'IBM Plex Mono';color:#72839a;margin-top:3px}.toolbar-status{margin-left:auto;font:11px 'IBM Plex Mono';color:#70859a}.toolbar-status i,.skills-footer i{display:inline-block;width:7px;height:7px;border-radius:50%;background:#39ad78;margin-right:5px}.skills-intro{display:flex;justify-content:space-between;align-items:center;padding:28px 32px 22px;background:linear-gradient(105deg,#fff 60%,#fff5f8)}.eyebrow{margin:0;color:var(--pink);font:600 11px 'IBM Plex Mono';letter-spacing:.14em}.skills-intro h1{font-size:clamp(2rem,4vw,3.6rem);line-height:.92;letter-spacing:-.07em;margin:13px 0}.skills-intro h1 em{font-style:normal;color:var(--pink)}.intro-copy{max-width:510px;color:#63758a;line-height:1.65;margin:0}.intro-badge{width:100px;height:100px;border-radius:50%;display:grid;place-items:center;align-content:center;background:#fff;border:1px solid #f5c1d3;box-shadow:0 9px 24px #e91e631c;color:var(--pink);transform:rotate(7deg)}.intro-badge span{font-size:15px}.intro-badge b{font-size:25px;line-height:1}.intro-badge small{text-align:center;font:9px 'IBM Plex Mono';color:#768397}.category-tabs{display:flex;gap:5px;padding:0 28px 20px;background:#fff;overflow:auto}.category-tabs button{white-space:nowrap;border:1px solid #d9e5ef;background:#f6faff;color:#4d657d;border-radius:7px;padding:9px 12px;cursor:pointer;font:500 12px 'DM Sans';transition:.18s}.category-tabs button span{font:10px 'IBM Plex Mono';margin-left:5px;color:#8da0b2}.category-tabs button:hover,.category-tabs button.is-active{background:var(--pink);border-color:var(--pink);color:#fff;transform:translateY(-2px)}.category-tabs button:hover span,.category-tabs button.is-active span{color:#ffe1eb}.skills-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:0 28px 22px;background:#f7fbff}.skill-card{opacity:0;transform:translateY(10px);background:#fff;border:1px solid #e0eaf3;border-top:3px solid var(--accent);border-radius:10px;padding:15px;box-shadow:0 8px 20px #285b8420;transition:transform .2s,box-shadow .2s,opacity .2s}.skill-card.is-visible{opacity:1;transform:none}.skill-card.is-hidden{display:none}.skill-card:hover{transform:translateY(-5px);box-shadow:0 15px 28px #e91e6326}.skill-top{display:flex;align-items:center;gap:10px}.skill-icon{display:grid;place-items:center;width:38px;height:38px;border-radius:9px;background:#fff0f5;color:var(--accent);font:600 12px 'IBM Plex Mono'}.skill-top p{margin:0 0 3px;color:#8090a1;font:10px 'IBM Plex Mono';text-transform:uppercase;letter-spacing:.08em}.skill-top h2{margin:0;font-size:15px}.level-value{margin-left:auto;color:var(--accent);font:600 12px 'IBM Plex Mono'}.skill-note{min-height:31px;color:#6e7f91;font-size:11px;line-height:1.4;margin:12px 0}.progress{height:5px;border-radius:9px;background:#edf2f7;overflow:hidden}.progress span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--accent),#ff9fba);transition:width 1s cubic-bezier(.2,.8,.2,1)}.is-visible .progress span{width:var(--level)}.skills-footer{display:flex;justify-content:space-between;padding:13px 28px;background:#edf5fd;color:#73869a;font:10px 'IBM Plex Mono'}.taskbar{height:64px;position:fixed;bottom:0;left:0;right:0;z-index:40;display:flex;align-items:center;justify-content:center;gap:10px;background:#e9f2fce8;color:#12233a;box-shadow:0 -8px 30px #07162e33;backdrop-filter:blur(18px)}.taskbar button,.taskbar a{border:0;background:#ffffff66;color:#1b3351;border-radius:8px;height:42px;cursor:pointer;text-decoration:none;display:grid;place-items:center}.start{font-size:27px;width:48px}.search{width:185px;text-align:left!important;padding:0 14px!important;display:block!important;line-height:42px}.pinned{display:flex;gap:5px}.pinned span{width:42px;height:42px;display:grid;place-items:center;border-radius:8px;font-size:21px}.pinned .active{color:var(--pink);background:#fff}.taskbar a{padding:0 13px;margin-left:18px;font-size:12px}.status{position:absolute;right:16px;display:grid;grid-template-columns:auto auto;gap:0 10px;align-items:center;font-size:13px}.status small{grid-column:2;color:#526882}@keyframes pop{from{opacity:0;transform:scale(.97) translateY(8px)}to{opacity:1;transform:none}}@media(max-width:780px){body{overflow:auto}.desktop{height:calc(100vh - 58px);min-height:760px}.window{left:70px;top:2%;width:calc(100vw - 82px);max-height:calc(100vh - 75px)}.skills-grid{grid-template-columns:1fr}.skills-intro{padding:23px 20px 18px}.category-tabs{padding-left:20px;padding-right:20px}.skills-grid{padding-left:20px;padding-right:20px}.app-toolbar{padding-left:20px;padding-right:20px}.skills-footer{display:block;padding:12px 20px}.skills-footer span{display:block;margin:4px 0}.taskbar{height:58px}.search{width:105px}.pinned,.taskbar a{display:none}.status{right:7px;font-size:10px}.intro-badge{width:75px;height:75px;flex:none}.intro-badge b{font-size:20px}}


/* Correctifs de mise en page — cohérents avec skills.css */
.window {
  left: clamp(16px, 10%, 120px);
  width: min(1060px, calc(100vw - 32px));
}
.window-body {
  min-height: 0;
  scrollbar-gutter: stable;
}
.window.min {
  width: min(360px, calc(100vw - 32px));
  max-height: 46px;
}
.window.min .window-body { display: none; }
.window.min .window-head { border-radius: 13px; }
.category-tabs {
  scrollbar-width: thin;
  overscroll-behavior-inline: contain;
}
.skill-top > div { min-width: 0; }
.skill-top h2 { overflow-wrap: anywhere; }
@media (max-width: 1100px) and (min-width: 781px) {
  .window { left: 16px; width: calc(100vw - 32px); }
  .skills-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 780px) {
  body { overflow-x: hidden; }
  .desktop { min-height: calc(100vh - 58px); height: auto; overflow: visible; padding: 10px 0 76px; }
  .window { position: relative; left: 10px; top: 0; width: calc(100vw - 20px); max-height: none; margin: 0; }
  .window-body { max-height: none; overflow: visible; }
  .skills-intro { gap: 16px; align-items: flex-start; }
  .skills-intro > div:first-child { min-width: 0; }
  .skills-intro h1 { font-size: clamp(1.9rem, 9vw, 2.7rem); }
  .intro-copy { font-size: 13px; }
  .intro-badge { margin-top: 4px; }
  .skill-top { align-items: flex-start; }
  .level-value { white-space: nowrap; font-size: 10px; }
  .taskbar { position: fixed; }
}
@media (max-width: 380px) {
  .app-toolbar { padding-left: 14px; padding-right: 14px; }
  .app-toolbar small { font-size: 9px; }
  .toolbar-status { display: none; }
  .skills-intro { padding-left: 14px; padding-right: 14px; }
  .category-tabs { padding-left: 14px; padding-right: 14px; }
  .skills-grid { padding-left: 14px; padding-right: 14px; }
  .skills-footer { padding-left: 14px; padding-right: 14px; }
  .intro-badge { width: 64px; height: 64px; }
}
