body:has(#showcaseView.active) { background:#f5f8f5; }
body:not(.customer-session) .farm-bottom-nav > [data-go="showcaseView"] { grid-column:5;grid-row:1; }
body.customer-session #appMain > .farm-bottom-nav { display:grid;grid-template-columns:1fr 1fr; }
body.customer-session #appMain > .farm-bottom-nav > [data-go="showcaseView"] { display:flex!important;grid-column:2;grid-row:1; }
body.customer-session #appMain > .farm-bottom-nav > #globalBackButton { grid-column:1;grid-row:1; }
body:has(#showcaseView.active) #appMain { width:100%;margin:0;padding:0; }
#showcaseView { max-width:760px;margin:auto;padding:26px 20px calc(110px + env(safe-area-inset-bottom));color:#173e2d;background:#f5f8f5;min-height:100svh; }
#showcaseView *, #showcaseDialog * { box-sizing:border-box; }
.showcase-top { display:flex;align-items:center;gap:12px;margin-bottom:24px; }
.showcase-top>div { flex:1; }
.showcase-top small { color:#61766a;font-size:12px;letter-spacing:1px; }
.showcase-top h1 { margin:4px 0 0;font-size:28px;line-height:1.25; }
#showcaseView button,#showcaseDialog button,.showcase-archive-option button { min-height:44px;border:1px solid #d8e4da;border-radius:14px;background:#fff;color:#173e2d;padding:8px 12px;font:inherit;cursor:pointer; }
#showcaseView button:active,#showcaseDialog button:active { opacity:.75; }
#showcaseView button:focus-visible,#showcaseDialog :is(button,input,textarea,select):focus-visible { outline:3px solid #438360;outline-offset:2px; }
#showcaseView [hidden],#showcaseDialog [hidden] { display:none!important; }
#showcaseBack,#showcaseClose { width:44px;flex-shrink:0; }
#showcaseManage { font-size:13px!important; }
.showcase-list { display:grid;gap:16px; }
#showcaseView .showcase-company { display:flex;align-items:center;gap:12px;padding:16px 14px;text-align:left;border-radius:16px; }
.showcase-company-mark { display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#e4efe6;flex-shrink:0; }
.showcase-company-mark svg { width:24px;height:24px; }
.showcase-company-copy { min-width:0;display:grid;gap:8px;flex:1; }
.showcase-company-copy strong { font-size:16px;line-height:1.5;overflow-wrap:anywhere; }
.showcase-company-copy b { display:flex;justify-content:space-between;flex-wrap:wrap;gap:4px 8px;font-size:12px;font-weight:500;color:#617468; }
.showcase-badge { display:inline-block;justify-self:start;color:#266d47;background:#e5f0e7;border-radius:20px;padding:5px 9px;font-size:12px;line-height:1.4; }
.showcase-note { display:flex;gap:12px;align-items:center;margin:28px 8px;color:#63756a;font-size:13px;line-height:1.8; }
.showcase-note svg { flex-shrink:0;width:22px; }
.showcase-company-header { padding:20px;border-radius:20px;background:#e8f1e9; }
.showcase-company-header h2 { font-size:23px;margin:12px 0;line-height:1.4; }
.showcase-company-header p,.showcase-footnote { color:#63756a;font-size:13px;line-height:1.7; }
.showcase-company-header strong { font-size:13px; }
.showcase-filters { display:flex;gap:12px;margin:20px 0; }
.showcase-filters label { flex:1;display:grid;gap:6px;font-size:12px;color:#63756a; }
.showcase-filters select { width:100%;min-height:44px;padding:8px;border:1px solid #d8e4da;border-radius:12px;background:#fff;color:#173e2d;font:inherit;font-size:14px; }
.showcase-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px; }
#showcaseView .showcase-turtle { padding:0;overflow:hidden;text-align:left;border-radius:20px;border-color:#e0e8e1;box-shadow:0 4px 14px #173e2d06; }
.showcase-turtle>img,.showcase-turtle>.showcase-no-photo { display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:#edf1ec; }
.showcase-turtle .showcase-turtle-copy { display:grid;gap:8px;padding:10px;min-width:0; }
.showcase-code-row { display:flex;align-items:baseline;gap:6px;min-width:0; }
.showcase-turtle .showcase-code-label { color:#617468;font-size:12px;line-height:1.4;font-weight:500;white-space:nowrap; }
.showcase-turtle strong { min-width:0;color:#173e2d;font-size:18px;line-height:1.3;font-weight:750;overflow-wrap:anywhere; }
.showcase-turtle-meta { display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:4px;color:#52685a;font-size:12px;line-height:1.5; }
.showcase-turtle-meta>span { min-width:0;overflow-wrap:anywhere; }
.showcase-size { text-align:center; }
.showcase-age { padding:2px 3px;border-radius:6px;background:#eaf2e9;color:#365f42;font-size:12px;white-space:nowrap;font-variant-numeric:tabular-nums; }
.showcase-empty { grid-column:1/-1;text-align:center;padding:54px 16px;color:#63756a; }
.showcase-empty svg { width:46px;height:46px;color:#4c8461; }
.showcase-empty h2 { font-size:18px;color:#173e2d;margin:16px 0 10px; }
.showcase-empty p { font-size:14px;line-height:1.7; }
.showcase-no-photo { display:grid!important;place-content:center;justify-items:center;gap:8px;background:#e8efe7;color:#66796b;font-size:13px;min-height:150px; }
.showcase-gallery { display:flex;overflow:auto;scroll-snap-type:x mandatory;border-radius:22px;background:#e8efe7; }
.showcase-gallery figure { position:relative;flex:0 0 100%;margin:0;scroll-snap-align:start; }
.showcase-gallery img { display:block;width:100%;aspect-ratio:1.1;object-fit:cover; }
.showcase-gallery figcaption { position:absolute;right:14px;bottom:14px;padding:5px 10px;color:#fff;background:#173e2dce;border-radius:14px;font-size:12px; }
.showcase-gallery>.showcase-no-photo { width:100%; }
.showcase-detail-intro { margin-top:24px; }
.showcase-detail-intro h2 { font-size:28px;margin:12px 0 8px;overflow-wrap:anywhere; }
.showcase-detail-intro p { color:#63756a;line-height:1.7; }
.showcase-detail-intro dl { display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:18px 0;border-block:1px solid #dbe5dc; }
.showcase-detail-intro dt { font-size:12px;color:#63756a; }
.showcase-detail-intro dd { margin:6px 0 0;font-size:14px;overflow-wrap:anywhere; }
.showcase-stat-grid { display:flex;gap:8px;margin:22px 0; }
.showcase-stat-grid>div { flex:1;background:#e8f1e9;border-radius:14px;padding:16px 6px;text-align:center; }
.showcase-stat-grid strong { display:block;font-size:25px; }
.showcase-stat-grid span { display:block;margin-top:6px;font-size:11px; }
.showcase-record-tabs { display:flex;gap:4px;padding:3px;background:#e8f0e8;border-radius:16px; }
#showcaseView .showcase-record-tabs button { flex:1;border:0;background:none;font-size:13px;padding:8px 4px; }
#showcaseView .showcase-record-tabs button[aria-selected=true] { color:#fff;background:#173e2d; }
.showcase-record { padding:18px 2px;border-bottom:1px solid #dbe5dc; }
.showcase-record time { font-size:12px;color:#63756a; }
.showcase-record>div { display:flex;justify-content:space-between;gap:12px;margin-top:8px;font-size:14px; }
#showcaseView:has(.showcase-detail-intro) { padding-top:16px; }
#showcaseView:has(.showcase-detail-intro) .showcase-top { gap:10px;margin-bottom:14px; }
#showcaseView:has(.showcase-detail-intro) .showcase-top h1 { font-size:22px;margin-top:2px; }
#showcaseView:has(.showcase-detail-intro) .showcase-gallery { border-radius:16px; }
#showcaseView:has(.showcase-detail-intro) .showcase-gallery img { height:clamp(180px,28svh,260px);max-height:260px;aspect-ratio:auto;object-fit:contain; }
#showcaseView:has(.showcase-detail-intro) .showcase-gallery figcaption { right:10px;bottom:10px;padding:3px 8px; }
.showcase-detail-intro { margin-top:12px; }
.showcase-detail-intro .showcase-badge { padding:3px 8px; }
.showcase-detail-intro h2 { margin:8px 0 4px;font-size:23px;line-height:1.3; }
.showcase-detail-intro p { margin:6px 0;font-size:13px;line-height:1.5;overflow-wrap:anywhere; }
.showcase-detail-intro dl { margin:10px 0;padding:10px 0;gap:10px 12px; }
.showcase-detail-intro dd { margin-top:3px;font-size:13px; }
#showcaseView:has(.showcase-detail-intro) .showcase-stat-grid { gap:8px;margin:12px 0; }
#showcaseView:has(.showcase-detail-intro) .showcase-stat-grid>div { padding:10px 4px;border-radius:12px; }
#showcaseView:has(.showcase-detail-intro) .showcase-stat-grid strong { font-size:22px; }
#showcaseView:has(.showcase-detail-intro) .showcase-stat-grid span { margin-top:3px; }
#showcaseView:has(.showcase-detail-intro) .showcase-record { padding:12px 2px; }
#showcaseDialog { width:min(520px,calc(100% - 24px));max-height:85svh;overflow:auto;border:1px solid #d8e4da;border-radius:22px;padding:20px;background:#f8fbf8;color:#173e2d; }
#showcaseDialog::backdrop { background:#102d2466; }
#showcaseDialog>header { display:flex;justify-content:space-between;align-items:center;gap:12px; }
#showcaseDialog h2 { font-size:21px; }
#showcaseDialog p { font-size:13px;line-height:1.7;color:#617468; }
#showcaseDialog form,#showcaseDialog form>label { display:grid;gap:10px; }
#showcaseDialog form { gap:18px; }
#showcaseDialog input:not([type=checkbox]),#showcaseDialog textarea { width:100%;min-height:44px;border:1px solid #cbdacf;border-radius:12px;padding:12px;background:#fff;font:inherit; }
#showcaseDialog textarea { min-height:88px; }
#showcaseDialog .showcase-check { display:flex;align-items:center;gap:10px;min-height:44px;font-size:14px; }
.showcase-check input { width:20px;height:20px;accent-color:#246846;flex-shrink:0; }
#showcaseDialog fieldset { border:1px solid #d8e4da;border-radius:14px;padding:12px; }
#showcaseDialog .showcase-primary { background:#173e2d;color:#fff;width:100%; }
#showcaseDialog:has(#showcasePublish) { padding:16px; }
#showcaseDialog:has(#showcasePublish)>header { margin-bottom:12px; }
#showcaseDialog:has(#showcasePublish) h2 { margin:0;font-size:20px; }
#showcaseDialog #showcasePublish { gap:12px; }
#showcaseDialog #showcasePublish p { margin:0;font-size:12px;line-height:1.6; }
#showcaseDialog #showcasePublish>label:not(.showcase-check) { gap:6px;font-size:13px;color:#173e2d; }
#showcaseDialog #showcasePublish .showcase-check { display:flex;flex-direction:row;justify-content:flex-start;align-items:center;text-align:left;gap:8px;margin:0;padding:4px 0;min-height:44px;font-size:13px;color:#173e2d; }
#showcaseDialog #showcasePublish .showcase-check input { margin:0;width:18px;height:18px;flex:0 0 18px; }
#showcaseDialog #showcasePublish>label.showcase-check:first-child { padding:8px 12px;border-radius:12px;background:#e8f1e9;font-weight:650; }
#showcaseDialog #showcasePublish fieldset { display:flex;flex-wrap:wrap;gap:0 12px;margin:0;min-width:0;padding:4px 10px 8px;background:#fff; }
#showcaseDialog #showcasePublish legend { padding:0 4px;font-size:13px;font-weight:600; }
#showcaseDialog #showcasePublish textarea { min-height:64px;height:64px;padding:10px;font-size:13px;line-height:1.5;resize:vertical; }
#showcaseDialog #showcasePublish .showcase-privacy { padding:10px;border-radius:10px;background:#edf3ed; }
.showcase-status { padding:16px;background:#e9f2e9;border-radius:16px;margin:16px 0; }
.showcase-manage-row { display:flex;gap:12px;justify-content:space-between;align-items:center;padding:14px 0;border-bottom:1px solid #d8e4da; }
.showcase-manage-row small,.showcase-admin-row small { display:block;color:#617468;font-size:12px;margin-top:6px; }
.showcase-admin-row { padding:18px 0;border-bottom:1px solid #d8e4da;overflow-wrap:anywhere; }
.showcase-admin-row>div { display:flex;flex-wrap:wrap;gap:6px;margin-top:12px; }
.showcase-archive-option { display:flex;gap:12px;align-items:center;justify-content:space-between;padding:18px!important; }
.showcase-archive-option small { display:block;margin-top:5px;color:#647468;font-size:12px;line-height:1.6; }
.showcase-archive-option button { flex-shrink:0; }
#showcaseError,#showcaseDialogError { padding:12px;background:#fff0ec;border-radius:12px;color:#9b3423;font-size:14px; }
@media(min-width:640px){.showcase-grid{grid-template-columns:repeat(3,minmax(0,1fr));}.showcase-gallery img{max-height:480px;}}
