/*
  TSUBOMI Simple Flow v1
  Couche publique d'ergonomie et de navigation.
  Objectifs : une action = un résultat, aucune fuite horizontale, menu fiable au tactile,
  transitions discrètes et vocabulaire simple. Toutes les fonctions existantes restent intactes.
*/
:root{
  --tsb-simple-edge:clamp(10px,3vw,18px);
  --tsb-simple-header-gap:8px;
}

html{
  width:100%;
  max-width:100%;
  overflow-x:hidden;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  scroll-behavior:smooth;
  overscroll-behavior-x:none;
}
body{
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:hidden!important;
  overscroll-behavior-x:none;
}
body>main,[data-site-header],[data-site-footer],.container,.section,.panel,.card,.hero,.hero-copy,.hero-showcase{
  min-width:0;
  max-width:100%;
}
img,video,canvas,svg,iframe{max-width:100%}
button,.btn,.icon-btn,.main-nav a,a[href]{-webkit-tap-highlight-color:transparent}
button,.btn,.icon-btn,.main-nav a{touch-action:manipulation}
[hidden]{display:none!important}

/* Navigation : pas de calque fantôme quand le menu est fermé. */
@media(max-width:860px){
  .site-header{width:100%;max-width:100%}
  .header-inner{
    width:calc(100% - 20px)!important;
    max-width:none!important;
    margin-inline:auto!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto minmax(0,auto)!important;
    align-items:center!important;
    gap:var(--tsb-simple-header-gap)!important;
    min-height:64px!important;
    height:auto!important;
    padding-block:8px!important;
  }
  .brand{grid-column:1;min-width:0!important;max-width:100%!important;font-size:clamp(.98rem,4.5vw,1.25rem)!important;gap:6px!important}
  .brand-logo{width:clamp(24px,8vw,32px)!important;height:clamp(24px,8vw,32px)!important}
  .mobile-toggle{grid-column:2!important;margin:0!important;min-width:0!important;padding:10px 14px!important;white-space:nowrap!important}
  .header-actions{grid-column:3!important;margin:0!important;display:flex!important;justify-content:flex-end!important;min-width:0!important}
  .header-actions .desktop-only{display:none!important}
  .cortex-search-button{display:inline-flex!important;min-width:0!important;max-width:42vw!important;padding:10px 14px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
  .cortex-search-button .kbd{display:none!important}
  .main-nav{
    position:fixed!important;
    z-index:9990!important;
    left:max(var(--tsb-simple-edge),env(safe-area-inset-left))!important;
    right:max(var(--tsb-simple-edge),env(safe-area-inset-right))!important;
    top:var(--tsb-simple-nav-top,74px)!important;
    width:auto!important;
    max-width:none!important;
    max-height:calc(var(--visual-vh,100vh) - var(--tsb-simple-nav-top,74px) - max(var(--tsb-simple-edge),env(safe-area-inset-bottom)))!important;
    padding:10px!important;
    margin:0!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:6px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch;
    background:#101017!important;
    border:1px solid rgba(255,255,255,.12)!important;
    border-radius:18px!important;
    box-shadow:0 20px 70px rgba(0,0,0,.55)!important;
    transform:none!important;
    -webkit-transform:none!important;
    contain:layout paint!important;
  }
  .main-nav[hidden],.main-nav:not(.open){display:none!important;visibility:hidden!important;pointer-events:none!important}
  .main-nav.open{display:flex!important;visibility:visible!important;pointer-events:auto!important}
  .main-nav a{
    display:flex!important;
    align-items:center!important;
    width:100%!important;
    min-height:48px!important;
    padding:12px 14px!important;
    border-radius:13px!important;
    font-size:1rem!important;
    line-height:1.2!important;
  }
  body.tsb-menu-open{overflow-x:hidden!important}
}

@media(max-width:420px){
  .header-inner{width:calc(100% - 14px)!important;gap:6px!important}
  .mobile-toggle{padding-inline:12px!important}
  .cortex-search-button{padding-inline:12px!important;max-width:40vw!important}
  .brand span{display:none}
  .hero-copy h1{font-size:clamp(2.45rem,14.6vw,3.85rem)!important;line-height:.94!important;letter-spacing:-.045em!important}
}
@media(max-width:350px){
  .brand-logo{display:none!important}
  .brand{font-size:.98rem!important}
  .mobile-toggle,.cortex-search-button{padding-inline:9px!important;font-size:.9rem!important}
}

/* Empêche la page entière de partir latéralement tout en gardant les carrousels voulus. */
.rail,.tabs,.release-stream,.smart-shelf-list,.nexus-timeline,.reader-footer{
  max-width:100%;
}
.rail,.tabs,.release-window[data-release-axis="x"] .release-stream,.smart-shelf-list{
  overscroll-behavior-inline:contain;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-x pan-y;
}
.hero,.page-hero,.detail-hero,.release-window,.future-grid,.nexus-page,.profile-grid,.library-layout{
  overflow-wrap:break-word;
}

/* Boutons et contenus plus lisibles pour enfants, adultes et tactile. */
@media(hover:none),(pointer:coarse){
  button,.btn,.icon-btn,.main-nav a,.tab{min-height:46px}
}
@media(max-width:520px){
  .toolbar,.modal-actions,.nexus-inline-actions,.actions{gap:8px!important}
  .toolbar>.btn,.toolbar>a.btn,.modal-actions>.btn,.nexus-inline-actions>.btn{min-height:46px}
  .section-head{align-items:flex-start!important}
}

/* Les options avancées restent disponibles sans encombrer l'expérience principale. */
.simple-advanced{
  margin-top:18px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  background:rgba(255,255,255,.025);
  overflow:hidden;
}
.simple-advanced>summary{
  cursor:pointer;
  list-style:none;
  padding:14px 16px;
  font-weight:800;
  color:#ddd;
  touch-action:manipulation;
}
.simple-advanced>summary::-webkit-details-marker{display:none}
.simple-advanced>summary:after{content:'+';float:right;color:var(--accent);font-size:1.2em}
.simple-advanced[open]>summary:after{content:'−'}
.simple-advanced-content{padding:0 16px 16px}

/* Transition légère : on ne masque jamais le contenu longtemps. */
html.tsb-navigating body>main{opacity:.92}
html.tsb-navigating .site-header{opacity:.96}
body>main,.site-header{-webkit-transition:opacity .08s linear;transition:opacity .08s linear}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}body>main,.site-header{transition:none!important}}

@supports (view-transition-name: none){
  @view-transition{navigation:auto}
  ::view-transition-old(root){animation:tsb-flow-out .08s ease both}
  ::view-transition-new(root){animation:tsb-flow-in .12s ease both}
  @keyframes tsb-flow-out{to{opacity:.92}}
  @keyframes tsb-flow-in{from{opacity:.92}to{opacity:1}}
}

/* Les messages d'erreur restent humains : le numéro HTTP ne sert pas au lecteur. */
.error-code{display:none!important}

/* Les contrôles flottants restent dans l'écran. */
.tsubomi-assistant-launcher,.tsubomi-assistant-greeting,.cortex-orb,.cortex-dock,.rgpd{
  max-width:calc(100vw - var(--tsb-simple-edge) - var(--tsb-simple-edge))!important;
}
\n\n/* V16 : garde-fous supplémentaires pour le défilement mobile et le menu à un seul appui. */\nhtml,body{position:relative;inline-size:100%;max-inline-size:100%;}\nbody{overflow-x:hidden!important;}\n.site-header,.site-footer,body>main{inline-size:100%;max-inline-size:100%;}\n.main-nav a,.mobile-toggle,.cortex-search-button{user-select:none;-webkit-user-select:none;}\n@media(max-width:860px){\n  .main-nav a{touch-action:manipulation!important;}\n  .main-nav.open{will-change:auto!important;}\n  body.tsb-menu-open{position:relative!important;width:100%!important;}\n}\n@supports(overflow:clip){html,body{overflow-x:clip!important;}}\n