/* Tsubomi V19 — Expérience simple, mobile-first et progressive. */
:root{
  --tsb-ease-dock-h:64px;
  --tsb-ease-target:48px;
}
@supports(view-transition-name:root){
  @view-transition{navigation:auto}
  ::view-transition-old(root),::view-transition-new(root){animation-duration:.16s;animation-timing-function:ease-out}
}

/* Menu compact : panneau fiable + fond cliquable. */
.tsb-menu-backdrop{display:none}
@media(max-width:1239px){
  body.tsb-menu-open{overflow:hidden!important;overscroll-behavior:none!important}
  .tsb-menu-backdrop{display:block;position:fixed;inset:0;z-index:1390;background:rgba(0,0,0,.52);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px)}
  .main-nav{overscroll-behavior:contain!important;scrollbar-gutter:stable both-edges}
  .main-nav a{min-height:52px!important;font-size:1rem!important;padding:13px 15px!important}
}
@media(max-width:480px){
  .main-nav{left:max(8px,env(safe-area-inset-left))!important;right:max(8px,env(safe-area-inset-right))!important}
}

/* Accès rapide mobile : réduit le besoin d'ouvrir le menu. */
.tsb-easy-dock{display:none}
@media(max-width:900px){
  body:not([data-page="lecteur"]) .tsb-easy-dock{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));position:fixed;left:max(8px,env(safe-area-inset-left));right:max(8px,env(safe-area-inset-right));bottom:max(8px,env(safe-area-inset-bottom));z-index:1280;min-height:var(--tsb-ease-dock-h);padding:6px;border:1px solid var(--line);border-radius:20px;background:rgba(12,12,18,.96);box-shadow:0 14px 42px rgba(0,0,0,.38);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
  .tsb-easy-dock a{display:flex;align-items:center;justify-content:center;min-width:0;min-height:50px;padding:8px 6px;border-radius:14px;color:var(--muted);text-align:center;font-size:.78rem;font-weight:800;line-height:1.1;text-decoration:none;touch-action:manipulation}
  .tsb-easy-dock a[aria-current="page"]{background:rgba(242,11,136,.16);color:#fff;box-shadow:inset 0 0 0 1px rgba(242,11,136,.34)}
  body:not([data-page="lecteur"]){padding-bottom:calc(var(--tsb-ease-dock-h) + 22px + env(safe-area-inset-bottom))}
  html.tsb-rgpd-active .tsb-easy-dock,html.tsb-assistant-open .tsb-easy-dock,body.tsb-menu-open .tsb-easy-dock{display:none!important}
}
@media(max-width:360px){
  .tsb-easy-dock a{font-size:.72rem;padding-inline:3px}
}

/* Boussole : une action claire en un toucher. */
.tsb-compass{margin-top:18px;margin-bottom:0}
.tsb-compass-card{border:1px solid var(--line);border-radius:24px;background:linear-gradient(180deg,rgba(242,11,136,.08),rgba(255,255,255,.015));padding:18px}
.tsb-compass-head{display:flex;align-items:end;justify-content:space-between;gap:14px;margin-bottom:14px}
.tsb-compass-head h2{margin:0;font-size:clamp(1.35rem,3vw,2rem)}
.tsb-compass-head p{margin:4px 0 0;color:var(--muted)}
.tsb-compass-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.tsb-compass-action{display:flex;min-height:78px;align-items:flex-start;justify-content:center;flex-direction:column;gap:5px;padding:14px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.025);color:#fff;text-decoration:none;touch-action:manipulation}
.tsb-compass-action:hover,.tsb-compass-action:focus-visible{border-color:rgba(242,11,136,.7);background:rgba(242,11,136,.08)}
.tsb-compass-action strong{font-size:1rem}.tsb-compass-action span{font-size:.82rem;color:var(--muted)}
.tsb-compass-action.primary{background:linear-gradient(135deg,rgba(242,11,136,.23),rgba(242,11,136,.08));border-color:rgba(242,11,136,.5)}
@media(max-width:760px){.tsb-compass-grid{grid-template-columns:1fr 1fr}.tsb-compass-head{display:block}}
@media(max-width:430px){.tsb-compass-card{padding:14px;border-radius:20px}.tsb-compass-grid{grid-template-columns:1fr}.tsb-compass-action{min-height:64px}}

/* Mode simple : lisible pour petits écrans et utilisateurs qui veulent moins d'options à la fois. */
html.tsb-ease-mode{--tsb-ease-target:54px}
html.tsb-ease-mode .btn,html.tsb-ease-mode button,html.tsb-ease-mode .icon-btn,html.tsb-ease-mode .tab,html.tsb-touch-comfort .btn,html.tsb-touch-comfort button,html.tsb-touch-comfort .icon-btn{min-height:var(--tsb-ease-target)}
html.tsb-ease-mode .muted{line-height:1.55}
html.tsb-ease-mode .feature-strip{grid-template-columns:1fr!important}
html.tsb-ease-mode .toolbar,html.tsb-ease-mode .detail-actions{gap:10px}
html.tsb-ease-mode .toolbar>.btn,html.tsb-ease-mode .detail-actions>.btn{flex:1 1 180px}
.tsb-ease-setting{margin:18px 0 0;padding:16px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.02)}
.tsb-ease-setting-row{display:flex;align-items:center;justify-content:space-between;gap:18px}
.tsb-ease-setting-row strong{display:block}.tsb-ease-setting-row span{display:block;color:var(--muted);margin-top:4px;font-size:.9rem}
.tsb-ease-switch{width:54px;height:32px;accent-color:var(--accent);flex:0 0 auto}

/* Texte et écrans techniques : gardés en arrière-plan, interface publique simple. */
.tsb-public-advanced{display:none!important}
html.tsb-ease-mode details:not([open])>*:not(summary){display:none}

/* Petits écrans : aucun élément ne doit élargir la page. */
@media(max-width:520px){
  .container,.app-center,.app-card,.panel,.card,.volume,.event-card,.tsb-compass-card{max-width:100%!important;min-width:0!important}
  button,.btn,input,select,textarea{max-width:100%}
}
