:root{
    --ink:#141414;--paper:#ffffff;--muted:#a3a3a3;--line:#141414;--hair:1px;
    --gutter:42px;--mono:'JetBrains Mono',monospace;--sans:'Hanken Grotesk',sans-serif;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
  body{background:var(--paper);color:var(--ink);font-family:var(--sans);
    padding:26px var(--gutter) 120px;max-width:1560px;margin:0 auto}

  .mono{font-family:var(--mono);font-size:10px;letter-spacing:.09em;text-transform:uppercase;font-weight:500}
  .rule{height:var(--hair);background:var(--line);width:100%}
  .rule--dot{position:relative}
  .rule--dot::after{content:"";position:absolute;right:-2px;top:50%;width:5px;height:5px;
    border-radius:50%;background:var(--ink);transform:translateY(-50%)}
  .field{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:10px;
    font-weight:500;letter-spacing:.09em;text-transform:uppercase;white-space:nowrap}
  .field::after{content:"";flex:1;height:var(--hair);background:var(--line)}

  .topbar{display:flex;justify-content:space-between;align-items:baseline;padding-bottom:14px}

  .searchbar{display:flex;align-items:center;margin-top:26px;border:1px solid var(--ink);border-radius:8px;
    overflow:hidden;max-width:560px;transition:border-color .15s}
  .searchbar:focus-within{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink) inset}
  .search__icon{display:flex;align-items:center;padding:0 6px 0 14px;color:#7a7a7a}
  .search__input{flex:1;border:none;outline:none;background:none;color:var(--ink);
    font-family:var(--mono);font-size:12px;letter-spacing:.03em;padding:13px 8px}
  .search__input::placeholder{color:#9a9a9a;text-transform:uppercase;letter-spacing:.08em;font-size:10px}
  .search__clear{border:none;background:none;cursor:pointer;padding:0 16px;color:var(--ink);
    font-family:var(--mono);font-size:12px;line-height:1}
  .search__clear:hover{color:#7a7a7a}
  .search__clear[hidden]{display:none}

  .hero{display:flex;justify-content:space-between;align-items:flex-end;margin-top:34px}
  .hero__title{font-weight:800;font-size:clamp(56px,8.6vw,128px);line-height:.9;letter-spacing:-.02em}
  .hero__stats{display:flex;gap:96px;align-self:flex-end;padding-bottom:6px}
  .stat{min-width:62px}
  .stat__top{height:var(--hair);background:var(--line);margin-bottom:6px}
  .stat .mono{display:block;margin-bottom:8px}
  .stat__value{font-weight:800;font-size:26px;letter-spacing:-.01em}

  .vista{display:flex;align-items:center;gap:26px;margin-top:22px;padding-bottom:14px}
  .vista__label{font-family:var(--mono);font-size:10px;letter-spacing:.12em}
  .tabs{display:flex;gap:6px}
  .tab{font-family:var(--mono);font-size:10px;font-weight:500;letter-spacing:.09em;
    text-transform:uppercase;border:var(--hair) solid var(--ink);background:transparent;
    color:var(--ink);padding:7px 14px;cursor:pointer;transition:.15s}
  .tab:hover{background:#f1f1f1}
  .tab.is-active{background:var(--ink);color:var(--paper)}
  .range{display:flex;align-items:center;gap:12px;margin-left:auto;width:330px;user-select:none}
  .range__chip{font-family:var(--mono);font-size:10px;letter-spacing:.08em;
    border:var(--hair) solid var(--ink);padding:5px 8px;min-width:42px;text-align:center}
  .range__bar{position:relative;flex:1;height:16px;cursor:pointer}
  .range__bar::before{content:"";position:absolute;left:0;right:0;top:50%;height:var(--hair);
    background:var(--ink);transform:translateY(-50%)}
  .range__fill{position:absolute;top:50%;height:3px;background:var(--ink);transform:translateY(-50%)}
  .range__knob{position:absolute;top:50%;width:12px;height:12px;border-radius:50%;
    background:var(--paper);border:1.4px solid var(--ink);transform:translate(-50%,-50%);
    cursor:grab;z-index:2;touch-action:none}
  .range__knob:active{cursor:grabbing}
  .range__knob.b{background:var(--ink)}
  .tune{background:none;border:1px solid transparent;cursor:pointer;color:var(--ink);display:flex;align-items:center;padding:6px 8px;border-radius:6px;transition:.15s}
  .tune:hover{background:#f1f1f1}
  .tune.is-active{background:var(--ink);color:var(--paper)}

  .filterpanel{margin-top:18px;border:1px solid var(--ink);border-radius:8px;padding:20px 22px;display:flex;flex-direction:column;gap:16px}
  .filterpanel[hidden]{display:none}
  .fgroup{display:grid;grid-template-columns:120px 1fr;gap:18px;align-items:start}
  .fgroup__label{color:#6b6b6b;padding-top:8px}
  .fchips{display:flex;flex-wrap:wrap;gap:8px}
  .fchip{font-family:var(--mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;
    border:1px solid var(--ink);border-radius:6px;background:none;color:var(--ink);cursor:pointer;padding:7px 12px;transition:.15s}
  .fchip:hover{background:#f1f1f1}
  .fchip.is-on{background:var(--ink);color:var(--paper)}
  .fmore{font-family:var(--mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;
    border:none;background:none;cursor:pointer;color:#6b6b6b;padding:7px 6px;text-decoration:underline;text-underline-offset:2px}
  .fmore:hover{color:var(--ink)}
  .fbar{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #e6e6e6;padding-top:14px}
  .fbar .mono{color:#6b6b6b}

  .simplebar{display:flex;justify-content:flex-end;align-items:center;gap:14px;margin-top:20px}
  .simplebar .mono{color:var(--ink)}
  .switch{width:52px;height:26px;border-radius:999px;border:1px solid var(--ink);
    background:#e9e9e9;position:relative;cursor:pointer;padding:0;transition:.2s;flex:none}
  .switch__dot{position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:#9a9a9a;transition:.2s}
  .switch.is-on{background:var(--ink)}
  .switch.is-on .switch__dot{left:30px;background:#fff}

  .themebar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:20px}
  .themebar .mono{color:var(--ink)}
  .themechips{display:flex;flex-wrap:wrap;gap:8px}
  .themechip{display:inline-flex;align-items:center;gap:12px;border:1px solid var(--ink);border-radius:7px;
    padding:8px 8px 8px 14px;font-family:var(--mono);font-size:11px;letter-spacing:.06em;
    text-transform:uppercase;background:var(--ink);color:var(--paper)}
  .themechip__x{border:none;background:var(--paper);color:var(--ink);cursor:pointer;width:20px;height:20px;
    border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;line-height:1;font-family:var(--mono)}
  .themechip__x:hover{background:#d9d9d9}
  .morebtn{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;
    border:1px solid var(--ink);border-radius:7px;background:none;cursor:pointer;padding:9px 13px;transition:.15s}
  .morebtn:hover{background:#f1f1f1}
  .morepanel{flex-basis:100%;display:flex;flex-wrap:wrap;gap:8px;margin-top:2px}
  .segmented{display:inline-flex;border:1px solid var(--ink);border-radius:7px;overflow:hidden}
  .seg{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;
    background:none;border:none;cursor:pointer;padding:9px 13px;color:var(--ink);transition:.15s}
  .seg:hover{background:#f1f1f1}
  .seg.is-on{background:var(--ink);color:var(--paper)}
  .seg.is-on:hover{background:var(--ink)}
  .seg + .seg{border-left:1px solid var(--ink)}
  .empty{margin-top:26px;color:#6b6b6b;font-family:var(--mono);font-size:11px;letter-spacing:.06em}

  .year{margin-top:46px}
  .year__head{display:flex;justify-content:space-between;align-items:flex-start}
  .year__num{font-weight:800;font-size:clamp(64px,9vw,118px);line-height:.86;letter-spacing:-.03em}
  .year__meta{text-align:right;color:var(--muted);font-family:var(--mono);font-size:10px;
    line-height:1.9;letter-spacing:.08em;padding-top:8px}
  .year__nav{display:flex;justify-content:space-between;margin:18px 0 34px}
  .year__nav.is-single{justify-content:flex-start}
  .i-down{width:13px;height:46px;color:var(--ink)}

  .card{margin-bottom:64px}
  .card__meta{display:flex;align-items:center;gap:64px;padding:13px 0}
  .card__meta .status{margin-left:auto}
  .card__body{display:grid;grid-template-columns:44% 1fr;column-gap:42px;align-items:start}
  .media{display:flex;flex-direction:column;gap:14px}
  .media__frame{position:relative;width:100%;aspect-ratio:4/3;overflow:hidden;background:#ededed}
  .media__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
  .media__nav{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:50%;
    background:rgba(255,255,255,.92);border:none;cursor:pointer;color:var(--ink);display:flex;align-items:center;
    justify-content:center;box-shadow:0 1px 6px rgba(0,0,0,.18);transition:.18s}
  .media__nav:hover{background:#fff;transform:translateY(-50%) scale(1.08)}
  .media__nav.prev{left:10px}.media__nav.next{right:10px}
  .i-arrow{width:20px;height:12px}
  .media figcaption{font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase}
  .info{display:flex;flex-direction:column;gap:20px;min-height:100%}
  .info__title{font-weight:800;font-size:34px;letter-spacing:-.015em;line-height:1}
  .info__desc{display:flex;flex-direction:column;gap:11px}
  .info__desc p{font-size:12.5px;line-height:1.55;font-weight:500;max-width:46ch;
    display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
  .info__people{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:auto}
  .people{display:flex;flex-direction:column;gap:9px}
  .people p{font-size:12px;font-weight:600;line-height:1.5}
  .palette{display:grid;grid-template-columns:96px 1fr;column-gap:40px;align-items:start;margin-top:14px}
  .palette__label{font-family:var(--mono);font-size:10px;letter-spacing:.08em;line-height:1.7;text-transform:uppercase}
  .swatches{display:grid;grid-template-columns:repeat(5,1fr);column-gap:30px}
  .swatch{display:flex;flex-direction:column;gap:9px}
  .swatch__chip{height:36px;max-width:118px;width:100%;border:1px solid rgba(0,0,0,.1)}
  .swatch__meta{font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;line-height:1.6}
  .swatch__meta b{display:block;font-weight:700}

  .card--simple{margin-bottom:0}
  .card--simple .card__meta{padding:11px 0}
  .scard{display:grid;grid-template-columns:96px minmax(0,1fr) 152px 152px;column-gap:34px;align-items:start;padding-bottom:18px}
  .scard__thumb{width:96px;height:96px;overflow:hidden;background:#ededed}
  .scard__thumb img{width:100%;height:100%;object-fit:cover;display:block}
  .scard__title{font-weight:800;font-size:19px;letter-spacing:-.01em;line-height:1}
  .scard__desc{font-size:12px;line-height:1.5;font-weight:500;margin-top:8px;max-width:56ch;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .scard__palette{display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:start;margin-top:12px}
  .scard__plabel{font-family:var(--mono);font-size:9px;letter-spacing:.08em;line-height:1.7;text-transform:uppercase}
  .sswatches{display:grid;grid-template-columns:repeat(5,minmax(0,84px));gap:14px;justify-content:start}
  .sswatch{display:flex;flex-direction:column;gap:5px}
  .sswatch__chip{height:15px;width:100%;border:1px solid rgba(0,0,0,.1)}
  .sswatch__hex{font-family:var(--mono);font-size:8.5px;letter-spacing:.03em}
  .scard__people{display:flex;flex-direction:column;gap:8px}
  .scard__people p{font-size:11px;font-weight:700;line-height:1.5}

  .pstack{display:flex;flex-direction:column;gap:0}
  .pband{display:grid;width:100%;height:56px}
  .pseg{position:relative;min-width:0}
  .pseg__hex{position:absolute;top:6px;left:6px;background:#fff;color:#333;font-family:var(--mono);
    font-size:9px;letter-spacing:.03em;padding:3px 6px}

  .plist{border-top:var(--hair) solid var(--line);margin-top:6px}
  .prow{border-bottom:var(--hair) solid var(--line)}
  .prow__head{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:22px 4px;
    cursor:pointer;transition:padding-left .2s;background:none;border:none;width:100%;text-align:left}
  .prow__head:hover{padding-left:14px}
  .prow__name{font-weight:800;font-size:clamp(22px,2.4vw,30px);letter-spacing:-.015em;line-height:1}
  .prow__contrib{color:#6b6b6b;display:flex;align-items:center;gap:12px;white-space:nowrap}
  .prow__chev{width:11px;height:7px;transition:transform .25s;color:#6b6b6b}
  .prow.is-open .prow__chev{transform:rotate(180deg)}
  .prow__panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .32s ease}
  .prow.is-open .prow__panel{grid-template-rows:1fr}
  .prow__panelin{overflow:hidden}
  .pitems{padding:2px 0 26px}
  .pitem{display:grid;grid-template-columns:180px 1fr;gap:28px;align-items:start;padding:16px 0;border-top:var(--hair) solid #e6e6e6}
  .pitem:first-child{border-top:none}
  .pitem__thumb{width:180px;aspect-ratio:4/3;overflow:hidden;background:#ededed}
  .pitem__thumb img{width:100%;height:100%;object-fit:cover;display:block}
  .pitem__title{font-weight:800;font-size:20px;letter-spacing:-.01em;line-height:1;margin-bottom:10px}
  .pitem__desc{font-size:12.5px;line-height:1.55;font-weight:500;max-width:62ch;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

  .tcloud{display:flex;flex-wrap:wrap;gap:8px}
  .tpill{display:inline-flex;align-items:center;gap:22px;border:1px solid var(--ink);border-radius:7px;
    background:none;cursor:pointer;padding:9px 14px;transition:.15s;font-family:var(--mono);font-size:11px;
    letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}
  .tpill:hover{background:var(--ink);color:var(--paper)}
  .tpill__count{color:#8a8a8a}
  .tpill:hover .tpill__count{color:#cfcfcf}
  .tpill--sm{padding:8px 12px;font-size:10px;gap:14px}

  [data-project]{cursor:pointer}
  .metatag,.metalink{font:inherit;letter-spacing:inherit;text-transform:inherit;color:inherit;
    background:none;border:none;padding:0;margin:0;cursor:pointer;text-align:left}
  .metatag:hover,.metalink:hover{text-decoration:underline;text-underline-offset:2px}
  .swatch__chip,.sswatch__chip{cursor:pointer;transition:outline-color .12s}
  .swatch__chip:hover,.sswatch__chip:hover{outline:2px solid var(--ink);outline-offset:2px}
  .colordot{display:inline-block;width:11px;height:11px;border:1px solid rgba(255,255,255,.45);vertical-align:middle;margin-right:2px}
  .chiprole{font-size:8px;letter-spacing:.1em;opacity:.55;margin-right:2px}
  .card[data-project]:hover .info__title,
  .card--simple[data-project]:hover .scard__title{text-decoration:underline;text-underline-offset:3px}
  .pband[data-project]{transition:filter .15s}
  .pband[data-project]:hover{filter:brightness(.94)}
  .pitem[data-project]:hover .pitem__title{text-decoration:underline;text-underline-offset:3px}

  /* ---- DETAIL page ---- */
  .detail{position:fixed;inset:0;z-index:60;background:var(--paper);overflow:auto;padding:26px var(--gutter) 100px}
  .detail[hidden]{display:none}
  .detail__inner{max-width:1560px;margin:0 auto}
  .detail__top{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding-bottom:16px}
  .detail__back{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:10px;
    letter-spacing:.08em;text-transform:uppercase;background:none;border:none;cursor:pointer;color:var(--ink)}
  .detail__back:hover{opacity:.6}
  .detail__title{font-weight:800;font-size:clamp(40px,6.4vw,88px);line-height:.92;letter-spacing:-.025em;margin:32px 0 4px}
  .detail__subtitle{font-weight:600;font-size:clamp(16px,2vw,22px);color:#666;margin-bottom:14px}
  .detail__tags{display:flex;flex-wrap:wrap;gap:16px;font-family:var(--mono);font-size:11px;color:#8a8a8a;letter-spacing:.04em;margin-bottom:34px}
  .detail__media{display:grid;grid-template-columns:1fr 200px;gap:18px;align-items:start}
  .detail__frame{aspect-ratio:16/9}
  .detail__thumbs{display:flex;flex-direction:column;gap:12px}
  .dthumb{border:none;background:#ededed;padding:0;cursor:pointer;aspect-ratio:4/3;overflow:hidden}
  .dthumb img{width:100%;height:100%;object-fit:cover;display:block;transition:.2s}
  .dthumb:hover img{transform:scale(1.05)}
  .detail__desc{max-width:72ch;margin:30px 0 8px}
  .detail__desc p{font-size:14px;line-height:1.6;font-weight:500;margin-bottom:12px}
  .spec{border-top:1px solid var(--line);margin-top:20px}
  .spec__row{display:grid;grid-template-columns:230px 1fr;gap:30px;padding:16px 2px;border-bottom:1px solid #e6e6e6;align-items:start}
  .spec__label{font-family:var(--mono);font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:#8a8a8a;padding-top:4px}
  .spec__value{font-size:14px;font-weight:600;line-height:1.55}
  .spec__value a{color:var(--ink)}
  .spec__pal{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;max-width:560px;padding-bottom:18px}
  .spec__chip{position:relative;height:42px;border:1px solid rgba(0,0,0,.1)}
  .spec__chip span{position:absolute;left:0;bottom:-15px;font-family:var(--mono);font-size:8.5px;color:#333}
  .conn-title{font-weight:800;font-size:30px;letter-spacing:-.02em;margin-bottom:22px}
  .conn-select{display:flex;flex-wrap:wrap;gap:10px;border-bottom:1px solid var(--line);padding-bottom:18px;margin-bottom:26px}
  .connbtn{font-family:var(--sans);font-weight:700;font-size:15px;letter-spacing:-.01em;
    border:1px solid var(--ink);background:none;color:var(--ink);cursor:pointer;padding:9px 16px;transition:.15s}
  .connbtn:hover{background:#f1f1f1}
  .connbtn.is-on{background:var(--ink);color:var(--paper)}
  .conn-view{min-height:120px}
  .conn__bar{display:flex;align-items:baseline;flex-wrap:wrap;gap:16px;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:20px}
  .conn__name{font-weight:800;font-size:21px;letter-spacing:-.01em}
  .conn__role{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#8a8a8a}
  .conn__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
  .mini{text-align:left;background:none;border:none;cursor:pointer;padding:0;display:flex;flex-direction:column;gap:10px}
  .mini__thumb{width:100%;aspect-ratio:4/3;overflow:hidden;background:#ededed}
  .mini__thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:.2s}
  .mini:hover .mini__thumb img{transform:scale(1.05)}
  .mini:hover .mini__title{text-decoration:underline;text-underline-offset:3px}
  .mini__meta{display:flex;flex-direction:column;gap:3px}
  .mini__title{font-weight:800;font-size:14px;letter-spacing:-.01em}
  .mini .mono{color:#8a8a8a}
  .conn__empty{font-family:var(--mono);font-size:11px;color:#8a8a8a;letter-spacing:.04em}

  /* =========================================================
     TABLET (721–980px): adattamenti leggeri
     ========================================================= */
  @media(max-width:980px) and (min-width:721px){
    body{padding:22px 28px 90px}
    .hero__stats{gap:56px}
    .card__body{grid-template-columns:1fr;row-gap:24px}
    .swatches{grid-template-columns:repeat(3,1fr);gap:18px}
    .conn__grid{grid-template-columns:repeat(3,1fr)}
  }

  /* =========================================================
     MOBILE (≤720px): versione dedicata
     ========================================================= */
  @media(max-width:720px){
    :root{--gutter:18px}
    body{padding:16px var(--gutter) 90px}

    /* top bar: solo il brand, data su riga sotto */
    .topbar{flex-direction:column;align-items:flex-start;gap:4px;padding-bottom:10px}
    .topbar .mono{font-size:9px}

    /* hero compatto, stats in riga sotto il titolo */
    .hero{flex-direction:column;align-items:flex-start;gap:22px;margin-top:22px}
    .hero__title{font-size:clamp(40px,12.5vw,64px)}
    .hero__stats{gap:0;width:100%;display:grid;grid-template-columns:repeat(3,1fr);align-self:auto;padding-bottom:0}
    .stat{min-width:0}
    .stat__value{font-size:20px}

    /* ricerca sticky, compatta, col tasto filtri accanto */
    .searchbar{position:sticky;top:0;z-index:30;background:var(--paper);margin-top:16px;padding:7px 10px;gap:8px}
    .searchbar .search__icon svg{width:13px;height:13px}
    .search__input{font-size:16px;padding:2px 0} /* 16px evita lo zoom di iOS */
    .searchbar .tune{flex:none;padding:5px 6px;margin-left:2px;border-left:1px solid #e0e0e0;border-radius:0}
    .searchbar .tune svg{width:22px;height:17px}

    /* vista: tab scorrevoli; slider e tune sono spostati altrove dal JS */
    .vista{flex-wrap:wrap;gap:14px;margin-top:14px}
    .vista__label{display:none}
    .tabs{order:1;flex:1 1 100%;display:flex;gap:6px;overflow-x:auto;-webkit-overflow-scrolling:touch;
      scrollbar-width:none;padding-bottom:2px}
    .tabs::-webkit-scrollbar{display:none}
    .tab{flex:none;padding:9px 14px}

    /* slider dentro il pannello filtri */
    .frange{border-bottom:1px solid #e6e6e6;padding-bottom:14px}
    .frange .range{width:100%;margin-left:0}
    .range__knob{width:18px;height:18px} /* touch target */

    .simplebar{justify-content:space-between;margin-top:16px}
    .themebar{gap:8px}
    .filterpanel{padding:16px}
    .fgroup{grid-template-columns:1fr;gap:8px}
    .fgroup__label{padding-top:0}
    .fbar{flex-direction:column;align-items:flex-start;gap:10px}

    /* anni */
    .year{margin-top:34px}
    .year__num{font-size:clamp(52px,17vw,84px)}
    .year__meta{font-size:9px;line-height:1.8}
    .year__nav{margin:12px 0 22px}
    .i-down{height:34px}

    /* scheda completa: impilata */
    .card{margin-bottom:44px}
    .card__meta{gap:14px;flex-wrap:wrap;padding:11px 0}
    .card__meta .status{margin-left:0;flex-basis:100%}
    .card__body{grid-template-columns:1fr;row-gap:18px}
    .info__title{font-size:26px}
    .info__desc p{max-width:none}
    .info__people{grid-template-columns:1fr 1fr;gap:18px}
    .palette{grid-template-columns:1fr;gap:12px;margin-top:12px}
    .swatches{grid-template-columns:repeat(5,1fr);gap:10px}
    .swatch__chip{height:26px}
    .swatch__meta{font-size:8px}

    /* scheda semplificata: cover piena + contenuto sotto (layout mobile) */
    .scard{grid-template-columns:1fr;row-gap:14px;padding-bottom:16px}
    .scard__thumb{width:100%;height:auto;aspect-ratio:16/9}
    .scard__title{font-size:22px}
    .scard__desc{max-width:none}
    .sswatches{grid-template-columns:repeat(5,1fr)}
    .scard__people{flex-direction:row;justify-content:space-between;gap:14px}
    .scard__people + .scard__people{margin-top:-6px}

    /* palette view: bande più basse, hex più piccoli */
    .pband{height:44px}
    .pseg__hex{font-size:8px;padding:2px 4px;top:4px;left:4px}

    /* studenti / docenti */
    .prow__head{padding:16px 2px}
    .prow__name{font-size:20px}
    .prow__contrib{font-size:9px;gap:8px}
    .pitem{grid-template-columns:1fr;gap:10px;padding:14px 0}
    .pitem__thumb{width:100%;aspect-ratio:16/9}

    /* nuvole temi/discipline */
    .tpill{padding:10px 13px;gap:14px}

    /* dettaglio: impilato, thumbs orizzontali scorrevoli */
    .detail{padding:14px var(--gutter) 80px}
    .detail__top{flex-direction:column;align-items:flex-start;gap:8px}
    .detail__title{font-size:clamp(34px,10.5vw,56px);margin-top:22px}
    .detail__tags{gap:10px;margin-bottom:22px}
    .detail__media{grid-template-columns:1fr;gap:12px}
    .detail__frame{aspect-ratio:4/3}
    .detail__thumbs{flex-direction:row;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
    .detail__thumbs::-webkit-scrollbar{display:none}
    .dthumb{flex:0 0 104px}
    .detail__desc p{font-size:13.5px}
    .spec__row{grid-template-columns:1fr;gap:5px;padding:13px 2px}
    .spec__pal{grid-template-columns:repeat(5,1fr);gap:8px;max-width:none}
    .spec__chip{height:32px}
    .spec__chip span{font-size:7.5px}
    .conn-title{font-size:24px}
    .conn-select{gap:8px}
    .connbtn{font-size:13px;padding:8px 12px}
    .conn__grid{grid-template-columns:repeat(2,1fr);gap:14px}
    .mini__title{font-size:13px}

    /* touch: niente hover-scale sulle frecce, target più grandi */
    .media__nav{width:34px;height:34px}
    .media__nav:hover{transform:translateY(-50%)}
  }