/* Jamyvo 2.4: Marketplace, Events & meetups, Our promise, and the ways in from Explore, search and profiles. */
/* Shared: photo picker and forms */
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.field-row>.field.narrow{min-width:0}
@media(max-width:380px){.field-row{grid-template-columns:1fr}}
@media(max-width:560px){.field-row.dates{grid-template-columns:1fr}}
.l-photos{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;padding:2px 0 14px;overscroll-behavior-x:contain}
.l-thumb{position:relative;flex:none;width:96px;height:96px;border-radius:14px;overflow:hidden;background:#151515;border:1px solid var(--line)}
.l-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.l-thumb .icon-btn{position:absolute;top:4px;right:4px;width:30px;height:30px;background:#000a;border:1px solid #ffffff30}
.l-thumb b{position:absolute;left:6px;bottom:6px;font-size:11px;background:#000b;padding:2px 7px;border-radius:999px}
.l-add{flex:none;width:96px;height:96px;display:grid;place-content:center;justify-items:center;gap:2px;border-radius:14px;border:1.5px dashed #ffffff40;color:#ddd;font-size:13px;font-weight:650;background:#0d0d0d}
.l-add small{color:var(--muted);font-weight:500}
.l-thumb.wide,.l-add.wide{width:100%;height:auto;aspect-ratio:2/1;max-height:220px}
.spinner.sm{width:22px;height:22px;margin:0}

/* Marketplace browse */
.market .m-top{display:flex;gap:10px;align-items:center;margin-bottom:10px}
.market .m-top .search{flex:1;min-width:0}
.market .m-top .btn{flex:none;min-height:46px}
.market #m-cats{margin-bottom:8px}
.m-filters{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:4px 0 6px}
.m-filters .chip svg.i{width:16px;height:16px}
.m-filters .link-btn{margin-left:auto}
.m-note{margin:4px 0 12px}
.m-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 12px;margin-bottom:16px}
@media(min-width:620px){.m-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1100px){.m-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.m-grid>.empty,.m-grid>.spinner{grid-column:1/-1}
.m-card{display:grid;gap:3px;min-width:0;color:#fff}
.m-photo{position:relative;display:block;aspect-ratio:1;border-radius:14px;overflow:hidden;background:#141414;border:1px solid #ffffff14;margin-bottom:5px}
.m-photo img{width:100%;height:100%;object-fit:cover;display:block}
.m-noimg{display:grid;place-items:center;width:100%;height:100%;color:#ffffff55}
.m-noimg svg.i{width:38px;height:38px}
.m-noimg.big{aspect-ratio:4/3;border-radius:16px;background:#141414}
.m-badge{position:absolute;left:8px;top:8px;background:#000c;border:1px solid #ffffff40;font-size:12px;padding:3px 9px;border-radius:999px}
.m-badge.inline{position:static;display:inline-block;vertical-align:middle;margin-left:6px}
.m-card.sold .m-photo img{opacity:.55}
.m-price{font-size:16px}
.m-title{font-size:14px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.m-where{color:var(--muted);font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* One listing */
.l-gallery{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;border-radius:16px;overscroll-behavior-x:contain}
.l-gallery img{flex:none;width:100%;aspect-ratio:1;max-height:min(70vh,560px);object-fit:cover;border-radius:16px;scroll-snap-align:center;background:#111}
.l-gallery.many img{width:88%}
.l-count{margin:6px 0 0}
.l-main{padding:4px 0 8px}
.l-price{font-size:24px;font-weight:800;margin:12px 0 2px}
.l-title{font-size:19px;line-height:1.3;margin:0 0 6px}
.l-actions,.e-rsvp{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.l-actions .btn,.e-rsvp .btn{gap:7px}
.l-body{white-space:normal;line-height:1.5;margin:12px 0;color:#e8e8e8}
.l-link{display:grid;grid-template-columns:auto 1fr;column-gap:10px;align-items:center;padding:12px 14px;border-radius:12px;background:#111;border:1px solid var(--line);margin:12px 0;color:#fff}
.l-link svg.i{grid-row:span 2}
.l-link small{color:var(--muted)}
.l-seller{display:flex;align-items:center;gap:12px;padding:12px;border-radius:14px;background:#0c0c0c;border:1px solid var(--line);margin:12px 0;color:#fff}
.l-seller>span:not(.avatar){display:grid;flex:1;min-width:0}
.l-seller small{color:var(--muted)}

/* Events */
.events .e-tabs{display:flex;width:100%;margin:2px 0 10px}
.events .e-tabs>a{flex:1;min-width:0;text-align:center;white-space:nowrap;padding-inline:4px;font-size:14px}
.e-filters{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.e-filters .chips{flex:1;min-width:0;margin:0}
.e-filters>.chip{flex:none}
.e-filters .chip svg.i{width:16px;height:16px}
.e-create{margin:2px 0 6px}
.e-day{font-size:14px;font-weight:700;color:#bbb;margin:18px 0 8px;text-transform:none}
.e-card{display:flex;gap:12px;align-items:center;padding:12px;border-radius:14px;background:#0b0b0b;border:1px solid #ffffff14;margin-bottom:8px;color:#fff}
.e-date{flex:none;display:grid;place-items:center;width:52px;height:56px;border-radius:12px;background:#151515;border:1px solid #ffffff1c;line-height:1}
.e-date small{font-size:11px;text-transform:uppercase;color:#42e681;font-weight:700}
.e-date strong{font-size:21px}
.e-info{display:grid;gap:2px;flex:1;min-width:0}
.e-info strong{font-size:15.5px;line-height:1.3;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.e-info small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.e-when{color:#42e681;font-weight:650}
.e-when.big{font-size:15px;margin:14px 0 2px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.e-going{display:flex;align-items:center;gap:6px;color:var(--muted)}
.e-going b{color:#fff;font-weight:650}
.e-faces{display:inline-flex}
.e-faces .avatar{margin-right:-6px;box-shadow:0 0 0 2px #0b0b0b}
.e-faces .avatar:last-child{margin-right:0}
.e-thumb{flex:none;width:64px;height:64px;border-radius:10px;object-fit:cover;background:#151515}
.e-badge{display:inline-block;font-size:11.5px;font-weight:700;padding:2px 8px;border-radius:999px;background:#ffffff18;color:#ddd;margin-left:4px}
.e-badge.live{background:#42e68126;color:#42e681}
.e-badge.cancelled{background:#ff5a7a22;color:#ff8aa0}
.e-cover{width:100%;aspect-ratio:2/1;max-height:340px;object-fit:cover;border-radius:16px;background:#111;margin-top:4px}
.e-title{font-size:22px;line-height:1.25;margin:2px 0 8px}
.e-where{display:flex;gap:8px;align-items:flex-start;color:#ddd;margin:6px 0}
.e-where svg.i{width:20px;height:20px;flex:none;margin-top:1px}
.e-join{margin:6px 0 10px;gap:8px}
.e-people{display:flex;align-items:center;gap:12px;width:100%;padding:12px;border-radius:14px;background:#0c0c0c;border:1px solid var(--line);color:#fff;text-align:left;margin:4px 0 10px}
.e-people>span:nth-child(2){flex:1;min-width:0}
.e-people .e-faces .avatar{box-shadow:0 0 0 2px #0c0c0c}
.e-person{padding:8px 0}
.e-talk{margin-top:8px;padding-bottom:12px}
.e-comment{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-bottom:1px solid #ffffff10}
.e-comment>div{flex:1;min-width:0}
.e-comment p{margin:0}
.e-comment-text{margin-top:3px!important;line-height:1.45;overflow-wrap:anywhere}
.e-comment-form{position:sticky;bottom:calc(var(--tabbar-h,48px) + var(--tab-lift,var(--safe-b,0px)));margin:10px -16px 0;border-radius:0;background:#000;border-top:1px solid var(--line);z-index:4}
@media(min-width:768px){.e-comment-form{bottom:0;margin-inline:0;border-radius:14px}}
.e-comment-form textarea{flex:1;min-width:0;resize:none;background:var(--surface-3);border:0;border-radius:22px;padding:11px 16px;color:#fff;font:inherit;font-size:16px;line-height:1.35;max-height:120px}
.e-mode{display:flex;gap:10px;border:0;padding:0}
.e-mode legend{font-size:13px;font-weight:600;color:var(--text-2);margin-bottom:6px}
.e-mode .radio{flex:1}
.e-cover-pick{margin-bottom:14px}

/* Our promise */
.promise-hero{text-align:center;padding:12px 6px 4px}
.promise-hero img{border-radius:14px;display:block;margin:0 auto}
.promise-hero h2{font-size:22px;margin:12px 0 6px}
.promise-hero p{color:#ccc;line-height:1.5;margin:0 auto;max-width:34em}
.promise-list{list-style:none;padding:0;margin:18px 0;display:grid;gap:10px}
.promise-list li{display:flex;gap:14px;padding:14px;border-radius:14px;background:#0b0b0b;border:1px solid #ffffff14}
.promise-icon{flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#42e6811c;color:#42e681}
.promise-list h3{font-size:16px;margin:0 0 4px}
.promise-list p{margin:0;color:#cfcfcf;line-height:1.5}
.promise-links{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:8px 0 18px}

/* Ways in: Explore row, search results, profile links */
.explore-more{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:2px 0 12px}
.explore-more a{display:flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:0 8px;border-radius:12px;background:#0d0d0d;border:1px solid #ffffff1c;color:#fff;font-weight:650;font-size:14px;white-space:nowrap;overflow:hidden}
.explore-more svg.i{width:19px;height:19px;flex:none;color:#42e681}
@media(max-width:520px){.explore-more{gap:6px;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) minmax(0,1fr) minmax(0,1fr)}.explore-more a{flex-direction:column;gap:3px;min-height:56px;padding:0 4px;font-size:12.5px}}
/* 2.4.1: four places in the row; the second (Marketplace) is the longest word, so it gets the wider column on phones. */
@media(max-width:340px){.explore-more a{padding:0 2px;font-size:11.5px}}
/* iPads and computers list Events, Marketplace, Groups and Music studio in the menu on the left, so the row would only repeat it. */
@media(min-width:768px){.explore-more{display:none}}
/* Likewise Explore's ? help button, wherever the left menu shows Help · Tunza (it moves out of the menu on very short screens). */
@media(min-width:768px) and (min-height:761px){#tunza-btn{display:none}}
.e-mode .radio span{white-space:nowrap}
.search-more-list{display:grid;gap:6px;margin-bottom:6px}
.search-more-row{display:flex;align-items:center;gap:12px;padding:8px;border-radius:12px;background:#0b0b0b;border:1px solid #ffffff12;color:#fff}
.search-more-row img,.search-more-icon{flex:none;width:48px;height:48px;border-radius:10px;object-fit:cover;background:#151515}
.search-more-icon{display:grid;place-items:center;color:#42e681}
.search-more-row>span:last-child{display:grid;min-width:0}
.search-more-row strong,.search-more-row small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.search-more-row small{color:var(--muted)}
.p-extras{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:2px 0 10px}
.p-extras .chip{gap:6px}
.p-extras svg.i{width:16px;height:16px}

/* 2.4: with Events and Marketplace the left menu has two more rows; on screens up to 980 px tall the rows are a
   little shorter so the whole menu (down to your account) still fits on a typical computer screen. */
@media(min-width:768px) and (max-height:980px){.rail-nav nav a{height:41px}.rail-nav .brand{padding-bottom:10px}.rail-nav .create-btn{margin:6px 0}}
@media(min-width:768px) and (max-height:800px){.rail-nav nav a{height:35px;font-size:15px}.rail-nav .brand{padding-bottom:6px}.rail-nav .rail-legal{display:none}}
/* Very short computer screens: Help · Tunza stays in Settings › Help & feedback and on Explore. */
@media(min-width:768px) and (max-height:760px){.rail-nav .rail-help{display:none}}
