/* ASR Tutorials · Premium Readable Library v20
   Final visual authority: larger typography, visibly differentiated premium colours,
   3-column desktop tutorials, stronger cards, no oversized empty dashboard chrome. */

body[data-tutorial-final][data-tutorial-premium-library-v19][data-tutorial-premium-readable-v20]{
  --t20-bg:#030405;
  --t20-surface:#080a0d;
  --t20-surface-2:#0d1014;
  --t20-line:#2a3038;
  --t20-text:#f7f8fa;
  --t20-muted:#a8afb7;
  background:var(--t20-bg)!important;
}

/* Readability first */
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tutorials-section-head{
  gap:42px!important;
  margin-bottom:24px!important;
  padding-bottom:22px!important;
  border-bottom-color:#2a3038!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tutorials-section-head .eyebrow{
  color:#b8a7ff!important;
  font-size:12px!important;
  letter-spacing:.15em!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tutorials-section-head h2{
  font-size:clamp(46px,4.6vw,62px)!important;
  line-height:1!important;
  letter-spacing:-.052em!important;
  font-weight:630!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tutorials-section-head>p{
  color:#bcc2c9!important;
  font-size:15px!important;
  line-height:1.6!important;
}

/* Member utility is compact, but no tiny copy. */
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-library-main>.tp-rail-access .tp-member-card{
  min-height:68px!important;
  padding:11px 12px 11px 14px!important;
  border-color:#35304a!important;
  background:
    radial-gradient(circle at 0 50%,rgba(126,102,214,.16),transparent 34%),
    linear-gradient(180deg,#0d0c14,#090a0d)!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-library-main>.tp-rail-access .tp-member-card:before{
  width:42px!important;
  height:42px!important;
  border-color:#66549a!important;
  background:#161123!important;
  color:#ddd4ff!important;
  font-size:10.5px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-library-main>.tp-rail-access .tp-member-card>strong{
  font-size:15.5px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-library-main>.tp-rail-access .tp-member-card>small{
  color:#aaa6b4!important;
  font-size:12px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-library-main>.tp-rail-access .tp-member-card>button{
  min-width:112px!important;
  min-height:39px!important;
  border-color:#715db0!important;
  background:#171120!important;
  color:#f2edff!important;
  font-size:12px!important;
}

/* Sections — more visible, still restrained. */
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-category-bar{
  gap:6px!important;
  padding:6px!important;
  border-color:#30343c!important;
  background:#090b0e!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-category-chip{
  min-height:42px!important;
  padding:0 15px!important;
  color:#b2b8bf!important;
  font-size:13px!important;
  font-weight:720!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-category-chip svg{
  width:15px!important;
  height:15px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-category-chip:hover{
  border-color:#4d4b62!important;
  background:#111019!important;
  color:#fff!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-category-chip.active{
  border-color:#8f78e6!important;
  background:linear-gradient(180deg,#251d3a,#191525)!important;
  color:#fff!important;
  box-shadow:inset 0 0 0 1px rgba(190,172,255,.08)!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-category-chip.active svg{
  color:#cabbff!important;
}

/* Search / counts */
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-library-tools{
  gap:14px!important;
  padding:8px!important;
  border-color:#30343c!important;
  background:#090b0e!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-search-wrap input{
  height:46px!important;
  padding:0 14px!important;
  border-color:#363c44!important;
  background:#0d1014!important;
  color:#fff!important;
  font-size:14px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-search-wrap input::placeholder{
  color:#8f969e!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-count{
  color:#afb6bd!important;
  font-size:11.5px!important;
  letter-spacing:.07em!important;
}

/* Breadcrumb + collection header */
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-breadcrumb{
  min-height:38px!important;
  font-size:12px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-breadcrumb button{
  font-size:12px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-collection-head{
  padding:22px 24px!important;
  border-color:#343944!important;
  background:
    radial-gradient(circle at 88% 0%,rgba(145,122,225,.14),transparent 34%),
    linear-gradient(135deg,#101019,#0b0d11 62%)!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-collection-head>span{
  color:#baa9ff!important;
  font-size:11px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-collection-head h2{
  font-size:clamp(30px,2.6vw,38px)!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-collection-head p{
  color:#b2b8c0!important;
  font-size:14px!important;
  line-height:1.6!important;
}

/* Group headings: readable, not microscopic. */
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-grid-group{
  margin-top:22px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-grid-label{
  min-height:38px!important;
  margin-bottom:11px!important;
  padding-bottom:10px!important;
  border-bottom-color:#282e35!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-grid-label span{
  color:#c3c8ce!important;
  font-size:11.5px!important;
  letter-spacing:.12em!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-grid-label b{
  min-width:30px!important;
  height:27px!important;
  border-color:#3a4149!important;
  background:#0d1014!important;
  color:#d6dbe0!important;
  font-size:11px!important;
}

/* COLLECTIONS: strong, visible colour families. */
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-grid{
  gap:14px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-card{
  min-height:222px!important;
  padding:22px!important;
  border-width:1px!important;
  border-radius:14px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-card:nth-child(1){
  --tile-accent:#69b9ee!important;
  --tile-bg:#0a1a27!important;
  --tile-border:#285979!important;
  background:
    radial-gradient(circle at 0 0,rgba(71,159,216,.22),transparent 42%),
    linear-gradient(145deg,#0c1d2b,#09131c)!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-card:nth-child(2){
  --tile-accent:#66d19b!important;
  --tile-bg:#0a1d14!important;
  --tile-border:#2b6546!important;
  background:
    radial-gradient(circle at 0 0,rgba(60,169,112,.20),transparent 42%),
    linear-gradient(145deg,#0b2017,#09140f)!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-card:nth-child(3){
  --tile-accent:#e6b45f!important;
  --tile-bg:#22180a!important;
  --tile-border:#73501f!important;
  background:
    radial-gradient(circle at 0 0,rgba(207,151,52,.21),transparent 42%),
    linear-gradient(145deg,#21170a,#151006)!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-card:nth-child(4n+4){
  --tile-accent:#e08d9c!important;
  --tile-bg:#211016!important;
  --tile-border:#713244!important;
  background:
    radial-gradient(circle at 0 0,rgba(190,75,100,.20),transparent 42%),
    linear-gradient(145deg,#211016,#150b0f)!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-card:nth-child(4n+5){
  --tile-accent:#a69cff!important;
  --tile-bg:#14152a!important;
  --tile-border:#4e4a88!important;
  background:
    radial-gradient(circle at 0 0,rgba(117,105,225,.22),transparent 42%),
    linear-gradient(145deg,#15162c,#0e101c)!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-card:nth-child(4n+6){
  --tile-accent:#c0c7ce!important;
  --tile-bg:#15181b!important;
  --tile-border:#4b535a!important;
  background:
    radial-gradient(circle at 0 0,rgba(153,164,174,.14),transparent 42%),
    linear-gradient(145deg,#15191d,#0e1114)!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-card:before{
  height:4px!important;
  background:linear-gradient(90deg,var(--tile-accent),color-mix(in srgb,var(--tile-accent) 38%,transparent),transparent 84%)!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-card:after{
  top:19px!important;
  right:20px!important;
  color:var(--tile-accent)!important;
  opacity:.72!important;
  font-size:11px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-icon{
  width:46px!important;
  height:46px!important;
  border-color:color-mix(in srgb,var(--tile-accent) 58%,#303840)!important;
  border-radius:11px!important;
  background:color-mix(in srgb,var(--tile-accent) 14%,#0a0d10)!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-icon svg{
  width:23px!important;
  height:23px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-copy>span{
  color:var(--tile-accent)!important;
  font-size:11px!important;
  letter-spacing:.1em!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-copy h3{
  margin:11px 0 8px!important;
  color:#fff!important;
  font-size:22px!important;
  line-height:1.18!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-card:nth-child(1) .tp-folder-copy h3{
  font-size:26px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-copy p{
  color:#b2bac2!important;
  font-size:13.5px!important;
  line-height:1.55!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-stats{
  gap:7px!important;
  padding-top:16px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-stats em{
  min-height:27px!important;
  padding:0 9px!important;
  border-color:color-mix(in srgb,var(--tile-accent) 34%,#343d45)!important;
  background:rgba(0,0,0,.16)!important;
  color:#c1c8cf!important;
  font-size:10.5px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-card>b{
  margin-top:16px!important;
  color:#f1f4f6!important;
  font-size:12.5px!important;
}

/* TUTORIALS: 3-column desktop maximum for real readability. */
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-results{
  gap:14px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-row-card{
  grid-column:span 4!important;
  min-height:292px!important;
  padding:20px!important;
  grid-template-columns:44px minmax(0,1fr)!important;
  column-gap:14px!important;
  border-radius:14px!important;
  border-width:1px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-row-card[data-semantic-resource-type="video"]{
  --tile-accent:#6bb6ef!important;--tile-border:#285476!important;
  background:radial-gradient(circle at 100% 0%,rgba(78,154,215,.19),transparent 42%),linear-gradient(145deg,#0b1925,#09121a)!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-row-card[data-semantic-resource-type="slides"]{
  --tile-accent:#e29b61!important;--tile-border:#70411f!important;
  background:radial-gradient(circle at 100% 0%,rgba(207,125,61,.18),transparent 42%),linear-gradient(145deg,#20140c,#140d08)!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-row-card[data-semantic-resource-type="code"]{
  --tile-accent:#66c8d9!important;--tile-border:#28606a!important;
  background:radial-gradient(circle at 100% 0%,rgba(62,169,188,.18),transparent 42%),linear-gradient(145deg,#0a1a1f,#081216)!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-row-card[data-semantic-resource-type="notebook"]{
  --tile-accent:#e0b15d!important;--tile-border:#70521f!important;
  background:radial-gradient(circle at 100% 0%,rgba(205,157,52,.18),transparent 42%),linear-gradient(145deg,#211809,#151006)!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-row-card[data-semantic-resource-type="spreadsheet"]{
  --tile-accent:#66ca8e!important;--tile-border:#2b6241!important;
  background:radial-gradient(circle at 100% 0%,rgba(61,170,104,.18),transparent 42%),linear-gradient(145deg,#0b1b13,#08120d)!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-row-card[data-semantic-resource-type="guide"]{
  --tile-accent:#a9b2ba!important;--tile-border:#485159!important;
  background:radial-gradient(circle at 100% 0%,rgba(152,164,174,.13),transparent 42%),linear-gradient(145deg,#14181b,#0d1013)!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-card-accent{
  height:4px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-row-card>.tp-resource-type-icon{
  width:42px!important;
  height:42px!important;
  border-color:color-mix(in srgb,var(--tile-accent) 58%,#313941)!important;
  border-radius:10px!important;
  background:color-mix(in srgb,var(--tile-accent) 13%,#0b0e11)!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-row-card>.tp-resource-type-icon svg{
  width:23px!important;
  height:23px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-row-kicker{
  margin-bottom:9px!important;
  color:var(--tile-accent)!important;
  font-size:11px!important;
  letter-spacing:.09em!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-row-card h3{
  margin-bottom:9px!important;
  color:#fff!important;
  font-size:21px!important;
  line-height:1.2!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-row-card p{
  color:#b2bac2!important;
  font-size:13.5px!important;
  line-height:1.58!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-row-meta{
  gap:6px!important;
  padding-top:15px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-row-meta>span:not(.tp-pill),
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-pill{
  min-height:27px!important;
  padding:0 8px!important;
  border-radius:7px!important;
  color:#c2c9cf!important;
  font-size:10.5px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-row-resources{
  gap:6px!important;
  margin-top:11px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-resource-chip{
  min-height:27px!important;
  padding:0 8px!important;
  border-radius:7px!important;
  font-size:10.5px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-row-open{
  min-height:42px!important;
  margin-top:16px!important;
  padding:0 12px!important;
  border-radius:9px!important;
  border-color:color-mix(in srgb,var(--tile-accent) 34%,#414850)!important;
  background:rgba(0,0,0,.18)!important;
  color:#f2f4f6!important;
  font-size:12.5px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-row-open:hover{
  border-color:var(--tile-accent)!important;
  background:var(--tile-accent)!important;
  color:#050607!important;
}

/* Viewer/resource copy is also readable. */
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-dialog-head p{
  font-size:11px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-dialog-head h2{
  font-size:24px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-resource b{
  font-size:14px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-resource small,
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-resource span{
  font-size:12px!important;
}
body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-notes{
  font-size:15px!important;
  line-height:1.72!important;
}

/* Responsive: 3 → 2 → 1, never 4 tiny cards. */
@media(max-width:1180px){
  body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-row-card{
    grid-column:span 6!important;
  }
  body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-card,
  body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-card:nth-child(1),
  body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-card:nth-child(2),
  body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-card:nth-child(3){
    grid-column:span 6!important;
  }
}
@media(max-width:760px){
  body[data-tutorial-final][data-tutorial-premium-readable-v20] .tutorials-section-head h2{
    font-size:clamp(40px,12vw,50px)!important;
  }
  body[data-tutorial-final][data-tutorial-premium-readable-v20] .tutorials-section-head>p{
    font-size:14px!important;
  }
  body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-category-chip{
    min-height:40px!important;
    padding:0 12px!important;
    font-size:12px!important;
  }
  body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-library-main>.tp-rail-access .tp-member-card{
    grid-template-columns:42px minmax(0,1fr) auto!important;
    grid-template-areas:"mark title action" "mark role action"!important;
  }
  body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-card,
  body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-card:nth-child(1),
  body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-card:nth-child(2),
  body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-card:nth-child(3),
  body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-row-card{
    grid-column:span 12!important;
  }
  body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-card{
    min-height:190px!important;
  }
  body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-folder-card:nth-child(1) .tp-folder-copy h3{
    font-size:22px!important;
  }
  body[data-tutorial-final][data-tutorial-premium-readable-v20] .tp-row-card{
    min-height:260px!important;
  }
}
