/* Rabbit OS 3 — reset, base tipografica e utilità */

@layer reset{
  *,*::before,*::after{box-sizing:border-box}
  html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scrollbar-gutter:stable;background:var(--bg)}
  html,body{margin:0;min-height:100%}
  h1,h2,h3,h4,p,figure,blockquote,dl,dd{margin:0}
  ul[role="list"],ol[role="list"]{list-style:none;margin:0;padding:0}
  button,input,select,textarea{font:inherit;color:inherit;letter-spacing:inherit}
  button{cursor:pointer}
  img,svg,video{display:block;max-width:100%}
  table{border-collapse:collapse}
  [hidden]{display:none !important}
}

@layer base{
  body{
    font-family:var(--font);font-size:var(--fs-md);line-height:var(--lh);
    color:var(--text);background:var(--bg);
    font-feature-settings:"kern","liga","calt";font-optical-sizing:auto;
    -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
    accent-color:var(--accent);
    text-rendering:optimizeLegibility;
  }
  h1{font-size:var(--fs-2xl);font-weight:600;letter-spacing:-.014em;line-height:1.18;text-wrap:balance}
  h2{font-size:var(--fs-lg);font-weight:600;letter-spacing:-.006em;line-height:1.3;text-wrap:balance}
  h3{font-size:var(--fs-md);font-weight:600;line-height:1.35}
  p{text-wrap:pretty}
  a{color:var(--accent);text-decoration:none;text-underline-offset:.18em;text-decoration-thickness:from-font}
  a:hover{text-decoration:underline}
  strong,b{font-weight:600}
  svg.i{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
  svg.i.sm{width:15px;height:15px}
  svg.i.lg{width:22px;height:22px}

  /* Anello di focus doppio: uno stacco del colore della superficie + l'anello */
  :focus-visible{
    outline:2px solid var(--focus);outline-offset:2px;border-radius:5px;
  }
  ::selection{background:var(--accent-tint);color:var(--text)}

  ::-webkit-scrollbar{width:11px;height:11px}
  ::-webkit-scrollbar-thumb{background:color-mix(in oklch,var(--muted) 32%,transparent);border-radius:11px;border:3px solid transparent;background-clip:padding-box}
  ::-webkit-scrollbar-thumb:hover{background-color:color-mix(in oklch,var(--muted) 55%,transparent)}
  ::-webkit-scrollbar-track{background:transparent}
  *{scrollbar-color:color-mix(in oklch,var(--muted) 35%,transparent) transparent}
}

@layer utilities{
  .num,.tnum{font-variant-numeric:tabular-nums}
  .cond{font-stretch:var(--condensed)}
  .muted{color:var(--muted)}
  .faint{color:var(--faint)}
  .danger-text{color:var(--danger)}
  .ok-text{color:var(--ok)}
  .warn-text{color:var(--warn)}
  .ellipsis{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
  .clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
  .row{display:flex;align-items:center;gap:var(--s2)}
  .row.wrap{flex-wrap:wrap}
  .row.gap3{gap:var(--s3)}
  .row.gap4{gap:var(--s4)}
  .col{display:flex;flex-direction:column;gap:var(--s2)}
  .spacer{flex:1}
  .grow{flex:1;min-width:0}
}

/* Movimento ridotto: le transizioni restano istantanee ma lo stato finale è identico */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none !important}
}

/* Colori forzati (Windows ad alto contrasto): i bordi restano visibili */
@media (forced-colors:active){
  .btn,.input,.select,.textarea,.panel,.stamp,.tag,.seg button[aria-pressed="true"]{border:1px solid CanvasText}
  .item.sel,.mail-row.sel{outline:2px solid Highlight}
}