/* MAXS-LOOK-1 (Steve 2026-11-09 00:32Z): the picture on top of every tool card, Home tile and Everything row. A real picture of the CURRENT franchise, else an illustrated empty state. */
.tl-fig{position:relative;margin:0;border-radius:12px;overflow:hidden;aspect-ratio:16/9;background:var(--bg);border:1px solid var(--line);isolation:isolate}
.tl-fig img{display:block;width:100%;height:100%;object-fit:cover}
.tl-fig figcaption{position:absolute;left:0;right:0;bottom:0;padding:18px 12px 7px;font-size:.74rem;color:#fff;background:linear-gradient(to top,rgba(10,12,18,.72),rgba(10,12,18,0));pointer-events:none}
.tl-fig-contain{background:linear-gradient(135deg,#1c2433,#2b3650)}
.tl-fig-contain img{object-fit:contain;padding:10px;image-rendering:auto}
.tl-fig-empty{display:flex;align-items:center;justify-content:center;border:0;color:#fff}
.tl-fig-empty .tl-art-ic{width:52px;height:52px;color:#fff;opacity:.92;filter:drop-shadow(0 3px 8px rgba(0,0,0,.25))}
.tl-fig-empty::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 80% 15%,rgba(255,255,255,.28),rgba(255,255,255,0) 45%),radial-gradient(circle at 12% 95%,rgba(0,0,0,.28),rgba(0,0,0,0) 55%)}
.tl-fig-empty::after{content:"";position:absolute;inset:0;z-index:-1;background-image:repeating-linear-gradient(115deg,rgba(255,255,255,.07) 0 2px,transparent 2px 22px)}
.tl-art-note{position:absolute;left:12px;bottom:8px;font-size:.74rem;opacity:.88}
.tl-art-a{background:linear-gradient(135deg,#b4531f,#e0953a)}
.tl-art-b{background:linear-gradient(135deg,#1f5f7a,#3aa0a8)}
.tl-art-c{background:linear-gradient(135deg,#4a3f8f,#8b6fcf)}
.tl-art-d{background:linear-gradient(135deg,#2f3b4a,#5b6b80)}
.tl-art-e{background:linear-gradient(135deg,#3f6b3a,#86b05a)}
.tl-more{margin-top:2px}.tl-more>summary{cursor:pointer;color:var(--muted);font-size:.86rem;min-height:34px;display:flex;align-items:center}
.tl-more[open]>summary{margin-bottom:6px}
/* Home tiles: picture on top, words under it */
.tl-tile{flex-direction:column;align-items:stretch;padding:0;overflow:hidden;gap:0}
.tl-tile .tl-fig-tile{border-radius:0;border:0;border-bottom:1px solid var(--line)}
.tl-tile .tl-tile-t{padding:10px 14px 12px}
.tl-tile .tl-x{position:absolute;top:10px;right:10px;color:#fff;background:rgba(10,12,18,.45);border-radius:6px;padding:2px}
.tl-tile{position:relative}
/* Everything rows: a small picture at the left */
.tl-erow{align-items:center}
.tl-fig-row{width:96px;flex:none;border-radius:8px;margin-right:12px}
.tl-fig-row figcaption,.tl-fig-row .tl-art-note{display:none}
.tl-fig-row.tl-fig-empty .tl-art-ic{width:26px;height:26px}
/* Start something / Make tiles on Studio Home */
.ss-tile.ss-has-fig{flex-direction:column;align-items:stretch;padding:0;overflow:hidden;gap:0}
.ss-tile.ss-has-fig .tl-fig{border-radius:0;border:0;border-bottom:1px solid var(--line)}
.ss-tile.ss-has-fig .ss-ic{display:none}
.ss-tile.ss-has-fig .ss-tile-t{padding:12px 14px 14px}
@media(min-width:900px){.ss-tiles-4{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:699px){.tl-fig-tile,.ss-tile.ss-has-fig .tl-fig{aspect-ratio:16/8}.tl-fig-row{width:72px}}


/* MAXS-LOOK-1: example franchises on the franchise picker */
.fr-examples{margin-top:26px}
.fr-ex-grid{display:grid;gap:14px;grid-template-columns:minmax(0,1fr)}
@media(min-width:700px){.fr-ex-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1100px){.fr-ex-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.fr-ex{display:flex;flex-direction:column;gap:6px;text-decoration:none;color:var(--ink);padding:0;overflow:hidden}
.fr-ex .tl-fig{border-radius:0;border:0}.fr-ex h3,.fr-ex p{margin:0 14px}.fr-ex h3{margin-top:10px}.fr-ex p:last-child{margin-bottom:14px}
.fr-ex:hover{border-color:var(--accent)}
.fr-ex-mono{font-family:Georgia,serif;font-size:2.4rem;letter-spacing:.06em;color:#fff;text-shadow:0 3px 10px rgba(0,0,0,.3)}

