/* assets/fishunter_ui.css */
/* Fishunter Ocean UI — design layer loaded after every other stylesheet.
   Social feed (Facebook), live & inbox (TikTok), shop (Shopee),
   weather (Windy) and tides (Fishing Points), unified by one ocean identity.
   Remove the <link> to this file to fall back to the previous look. */

:root{
  --fx-ink:#0f2530;--fx-ink-2:#34505c;--fx-muted:#667c87;--fx-line:#e2eaee;--fx-line-2:#eef3f5;
  --fx-bg:#f2f5f7;--fx-surface:#fff;--fx-soft:#f6f9fa;
  --fx-deep:#062a39;--fx-deep-2:#0b3a4c;--fx-teal:#0b8f8a;--fx-teal-2:#12b3a6;--fx-teal-soft:#e2f5f2;
  --fx-coral:#ff6a3d;--fx-sun:#ffb020;--fx-live:#fe2c55;--fx-shop:#ee4d2d;--fx-shop-soft:#fff1ec;
  --fx-danger:#d93636;--fx-warn:#d98a00;--fx-ok:#0f9d6e;
  --fx-grad:linear-gradient(135deg,#0b8f8a 0%,#12b3a6 55%,#3cc7b0 100%);
  --fx-grad-deep:linear-gradient(150deg,#062a39 0%,#0b3a4c 55%,#0d5a63 100%);
  --fx-r-sm:10px;--fx-r:14px;--fx-r-lg:20px;--fx-r-xl:26px;
  --fx-shadow-1:0 1px 2px rgba(15,37,48,.06),0 1px 1px rgba(15,37,48,.04);
  --fx-shadow-2:0 6px 20px -8px rgba(15,37,48,.18),0 2px 6px rgba(15,37,48,.05);
  --fx-shadow-3:0 22px 50px -18px rgba(6,42,57,.35);
  --fx-focus:0 0 0 3px rgba(18,179,166,.28);
  --fx-dock-h:68px;
}

/* ---------- Base ---------- */
body.unified-app{background:var(--fx-bg);color:var(--fx-ink);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body.unified-app main{padding-bottom:calc(var(--fx-dock-h) + 36px + env(safe-area-inset-bottom))}
body.unified-app :is(h1,h2,h3){color:var(--fx-ink);letter-spacing:-.02em}
body.unified-app h1{font-weight:700;line-height:1.15}
body.unified-app .section>h1,body.unified-app .form-page>h1,body.unified-app .section-head h1{font-size:clamp(1.6rem,4.8vw,2.3rem)}
body.unified-app h2{font-weight:700}
body.unified-app a{text-underline-offset:3px}
body.unified-app :is(a,button,input,select,textarea,summary):focus-visible{outline:none;box-shadow:var(--fx-focus);border-radius:var(--fx-r-sm)}
body.unified-app .muted{color:var(--fx-muted)}
body.unified-app .fineprint{color:var(--fx-muted);font-size:.78rem;line-height:1.55}
body.unified-app .eyebrow,body.unified-app .eyebrow.dark,body.unified-app .feed-eyebrow{color:var(--fx-teal);font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
body.unified-app ::selection{background:#bfeee7}
@media (prefers-reduced-motion:reduce){body.unified-app *{transition:none!important;animation:none!important}}

/* ---------- Header: light frosted bar like Facebook / Instagram ---------- */
body.unified-app .app-navigation{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.86);backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid rgba(15,37,48,.07);box-shadow:none}
body.unified-app .app-navigation .lite-header{background:transparent;box-shadow:none;border:0}
body.unified-app .lite-headrow{min-height:62px}
body.unified-app .lite-wordmark,body.unified-app .lite-wordmark .mancing-brand-type{color:var(--fx-deep)!important}
body.unified-app .lite-wordmark .mancing-brand-type small{color:var(--fx-muted)!important;opacity:1}
body.unified-app .lite-wordmark .mancing-brand-mark{background:var(--fx-teal-soft);box-shadow:inset 0 0 0 1px rgba(11,143,138,.12)}
body.unified-app .lite-round{background:var(--fx-line-2)!important;color:var(--fx-ink)!important;border:0!important;border-radius:999px!important;width:40px;height:40px;transition:background .15s,transform .15s}
body.unified-app .lite-round:hover{background:var(--fx-teal-soft)!important;color:var(--fx-teal)!important}
body.unified-app .lite-round:active{transform:scale(.94)}
body.unified-app .notification-badge{background:var(--fx-live)!important;color:#fff!important;border:2px solid #fff;font-weight:700;min-width:18px;height:18px;line-height:14px;border-radius:999px;font-size:.62rem}
body.unified-app .notification-badge:is(:empty,[data-count="0"]){display:none}
@media(max-width:600px){body.unified-app .lite-round{width:36px;height:36px}}

/* ---------- Bottom navigation: floating dock ---------- */
body.unified-app .app-bottom-navigation{position:fixed;left:50%;right:auto;bottom:calc(10px + env(safe-area-inset-bottom));transform:translateX(-50%);width:min(560px,calc(100% - 20px));z-index:50;background:rgba(255,255,255,.9);backdrop-filter:saturate(1.6) blur(16px);-webkit-backdrop-filter:saturate(1.6) blur(16px);border:1px solid rgba(15,37,48,.08);border-radius:22px;box-shadow:0 18px 40px -16px rgba(6,42,57,.38),0 2px 8px rgba(6,42,57,.06);padding:6px}
body.unified-app .app-bottom-navigation .lite-primary-tabs{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;background:transparent;border:0;box-shadow:none;padding:0;margin:0;max-width:none;position:static}
body.unified-app .app-bottom-navigation .lite-primary-tabs a{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-height:52px;border-radius:16px;color:var(--fx-muted);font-size:.66rem;font-weight:700;background:transparent;transition:color .15s,background .15s}
body.unified-app .app-bottom-navigation .lite-primary-tabs a .lite-icon{width:22px;height:22px;transition:transform .2s}
body.unified-app .app-bottom-navigation .lite-primary-tabs a:hover{color:var(--fx-ink)}
body.unified-app .app-bottom-navigation .lite-primary-tabs a.active{color:var(--fx-teal);background:var(--fx-teal-soft)}
body.unified-app .app-bottom-navigation .lite-primary-tabs a.active .lite-icon{transform:translateY(-1px) scale(1.06)}
body.unified-app .app-bottom-navigation .notification-badge{position:absolute;top:5px;left:calc(50% + 6px)}
body.unified-app .footer{margin-bottom:calc(var(--fx-dock-h) + 20px)}

/* ---------- Surfaces ---------- */
body.unified-app :is(.panel,.lite-panel,.list-card,.weather-card,.auth-card,.product-detail>.panel){background:var(--fx-surface);border:1px solid var(--fx-line);border-radius:var(--fx-r-lg);box-shadow:var(--fx-shadow-1)}
body.unified-app .panel{padding:clamp(18px,3.4vw,26px)}
body.unified-app .panel>h2:first-child,body.unified-app .panel>h2:first-of-type{font-size:1.12rem;margin-top:0}
body.unified-app .list-grid{display:grid;gap:12px}
body.unified-app .list-card{transition:border-color .15s,box-shadow .15s}
body.unified-app .list-card:hover{box-shadow:var(--fx-shadow-2)}
body.unified-app .back{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:999px;background:var(--fx-surface);border:1px solid var(--fx-line);color:var(--fx-ink-2);font-weight:700;font-size:.8rem;text-decoration:none;box-shadow:var(--fx-shadow-1);margin-bottom:14px}
body.unified-app .back:hover{color:var(--fx-teal);border-color:#bfe3de}
body.unified-app .empty{background:var(--fx-surface);border:1px dashed #cfdde2;border-radius:var(--fx-r-lg);padding:40px 22px;color:var(--fx-muted);text-align:center}
body.unified-app .empty h2,body.unified-app .empty h3{color:var(--fx-ink);font-size:1.05rem;margin:6px 0}
body.unified-app .empty::before{content:"";display:block;width:56px;height:56px;margin:0 auto 14px;border-radius:18px;background:var(--fx-teal-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b8f8a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3-6 10-6 10 6 10 6-3 6-10 6S2 12 2 12z'/%3E%3Cpath d='M22 12l-3-2v4z'/%3E%3Ccircle cx='8' cy='11' r='.6' fill='%230b8f8a'/%3E%3C/svg%3E") center/28px no-repeat}
body.unified-app .empty:has(>span:first-child)::before,body.unified-app .empty:has(>.lite-icon:first-child)::before{display:none}

/* ---------- Buttons ---------- */
body.unified-app .button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 20px;border-radius:999px;border:0;background:var(--fx-grad);color:#fff;font-weight:700;font-size:.9rem;letter-spacing:.005em;box-shadow:0 8px 18px -10px rgba(11,143,138,.9);transition:transform .12s,box-shadow .15s,filter .15s;text-decoration:none;cursor:pointer}
body.unified-app .button:hover{filter:brightness(1.05);box-shadow:0 12px 22px -10px rgba(11,143,138,.95)}
body.unified-app .button:active{transform:translateY(1px) scale(.99)}
body.unified-app .button.ghost,body.unified-app .button.secondary{background:var(--fx-surface);color:var(--fx-ink);border:1px solid var(--fx-line);box-shadow:var(--fx-shadow-1)}
body.unified-app .button.ghost:hover,body.unified-app .button.secondary:hover{border-color:#b9ddd8;color:var(--fx-teal);filter:none}
body.unified-app .button.danger,body.unified-app .button.red{background:var(--fx-danger);box-shadow:0 8px 18px -10px rgba(217,54,54,.8)}
body.unified-app .button:disabled,body.unified-app .button[aria-disabled=true]{opacity:.5;cursor:not-allowed;transform:none}
body.unified-app .button.full{width:100%}
body.unified-app .card-actions{display:flex;flex-wrap:wrap;gap:8px}

/* ---------- Forms ---------- */
body.unified-app :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=hidden]),select,textarea){background:var(--fx-soft);border:1.5px solid var(--fx-line);border-radius:var(--fx-r);color:var(--fx-ink);font:inherit;font-size:.95rem;transition:border-color .15s,box-shadow .15s,background .15s}
body.unified-app :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=hidden]),select,textarea):hover{border-color:#cddbe0}
body.unified-app :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=hidden]),select,textarea):focus{background:#fff;border-color:var(--fx-teal-2);box-shadow:var(--fx-focus);outline:0}
body.unified-app :is(input,select,textarea):disabled{opacity:.6;cursor:not-allowed;background:var(--fx-line-2)}
body.unified-app ::placeholder{color:#94a7af;opacity:1}
body.unified-app .stack-form label:not(.check){color:var(--fx-ink-2);font-size:.8rem;font-weight:700;letter-spacing:.01em}
body.unified-app input[type=checkbox],body.unified-app input[type=radio]{accent-color:var(--fx-teal)}
body.unified-app .field-hint{display:block;font-weight:400;font-size:.76rem;color:var(--fx-muted);letter-spacing:0;margin-top:2px}
body.unified-app .field-optional{font-weight:400;font-size:.72rem;color:var(--fx-muted);background:var(--fx-line-2);border-radius:999px;padding:1px 8px;margin-left:4px}
body.unified-app fieldset{border:1px solid var(--fx-line);border-radius:var(--fx-r);padding:12px 14px 14px;margin:0;background:var(--fx-soft)}
body.unified-app legend{padding:0 6px;font-weight:700;font-size:.8rem;color:var(--fx-ink-2)}

/* ---------- Pills, flash, tabs ---------- */
body.unified-app .pill{display:inline-flex;align-items:center;gap:4px;border-radius:999px;font-weight:700;font-size:.68rem;padding:4px 10px;background:var(--fx-line-2);color:var(--fx-ink-2);vertical-align:middle}
body.unified-app .pill:is(.active,.approved,.verified,.confirmed,.completed,.paid){background:#dcf5ea;color:#0a7a52}
body.unified-app .pill:is(.pending,.draft,.waiting){background:#fff1d6;color:#8a5a00}
body.unified-app .pill:is(.rejected,.suspended,.cancelled,.failed){background:#fde4e4;color:#a42424}
body.unified-app .flash{border-radius:var(--fx-r);border:0;box-shadow:var(--fx-shadow-2);font-weight:600;padding:13px 16px;margin-top:12px}
body.unified-app .flash.success{background:#e3f7ef;color:#0a6b4a}
body.unified-app .flash.error,body.unified-app .flash.danger{background:#fde8e8;color:#8f1f1f}
body.unified-app .flash.warning{background:#fff4dc;color:#7a5000}
body.unified-app .flash.info{background:#e6f1fb;color:#1d4f7a}
/* Segmented tabs, shared by weather, tides, inbox, shop and the feed filter */
body.unified-app :is(.service-tabs,.marine-page-tabs,.shop-tabs,.message-tabs,.feed-tabs,.lite-feed-filter){display:flex;gap:4px;padding:4px;margin:14px 0 18px;background:#e7eef1;border-radius:999px;border:0;overflow-x:auto;scrollbar-width:none;max-width:100%;width:max-content;box-shadow:none}
body.unified-app :is(.service-tabs,.marine-page-tabs,.shop-tabs,.message-tabs,.feed-tabs,.lite-feed-filter)::-webkit-scrollbar{display:none}
body.unified-app :is(.service-tabs,.marine-page-tabs,.shop-tabs,.message-tabs,.feed-tabs,.lite-feed-filter)>a{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:38px;padding:8px 16px;border-radius:999px;color:var(--fx-ink-2);font-weight:700;font-size:.82rem;text-decoration:none;white-space:nowrap;background:transparent;border:0;box-shadow:none;transition:background .15s,color .15s}
body.unified-app :is(.service-tabs,.marine-page-tabs,.shop-tabs,.message-tabs,.feed-tabs,.lite-feed-filter)>a:hover{color:var(--fx-ink)}
body.unified-app :is(.service-tabs,.marine-page-tabs,.shop-tabs,.message-tabs,.feed-tabs,.lite-feed-filter)>a:is(.active,[aria-current]){background:#fff;color:var(--fx-teal);box-shadow:0 2px 8px -2px rgba(15,37,48,.18)}
body.unified-app .lite-feed-filter{width:100%}
body.unified-app .lite-feed-filter>a{flex:1}
body.unified-app .message-tabs>a span{background:var(--fx-line-2);color:var(--fx-ink-2);border-radius:999px;padding:1px 7px;font-size:.68rem}
body.unified-app .message-tabs>a.active span{background:var(--fx-teal);color:#fff}

/* ---------- Section heads ---------- */
body.unified-app .section-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:14px 20px;margin-bottom:18px}
body.unified-app .section-head>div:first-child{flex:1 1 300px;min-width:0}
body.unified-app .section-head p.muted{max-width:60ch}
body.unified-app .count-badge{background:var(--fx-teal-soft);color:var(--fx-teal);border-radius:999px;padding:6px 12px;font-weight:700;font-size:.78rem}

/* =================================================================
   COMMUNITY FEED — Facebook-style cards
   ================================================================= */











/* Shortcut chips at the top of the feed */
body.unified-app .ocean-shortcuts{gap:10px}
body.unified-app .ocean-shortcuts>a{background:var(--fx-surface);border:1px solid var(--fx-line);border-radius:var(--fx-r-lg);box-shadow:var(--fx-shadow-1);transition:transform .15s,box-shadow .15s}
body.unified-app .ocean-shortcuts>a:hover{transform:translateY(-2px);box-shadow:var(--fx-shadow-2)}
body.unified-app .ocean-shortcuts>a>span:first-child{border-radius:14px}

/* Composer */
body.unified-app .lite-composer{border-radius:var(--fx-r-lg)!important;border:1px solid var(--fx-line)!important;box-shadow:var(--fx-shadow-1)!important}
body.unified-app .lite-composer textarea{border-radius:var(--fx-r)!important;background:var(--fx-soft)!important;min-height:64px}
body.unified-app .composer-submit{background:var(--fx-grad)!important;color:#fff!important;border-radius:999px!important;font-weight:700;border:0!important;box-shadow:0 8px 18px -10px rgba(11,143,138,.9)!important}
body.unified-app .composer-tools :is(label,button){border-radius:12px!important}

/* Section heading + post cards */
body.unified-app .feed-section-heading{margin:22px 2px 6px}
body.unified-app .feed-section-heading a{color:var(--fx-teal);font-weight:700;font-size:.8rem;text-decoration:none}
body.unified-app .lite-post{background:var(--fx-surface)!important;border:1px solid var(--fx-line)!important;border-radius:var(--fx-r-lg)!important;box-shadow:var(--fx-shadow-1)!important;overflow:hidden;margin-bottom:14px;padding:0!important}
body.unified-app .lite-post>*:not(.post-gallery):not(.feed-video-shell){margin-left:16px;margin-right:16px}
body.unified-app .lite-post-head{padding-top:14px;gap:10px;align-items:flex-start}
body.unified-app .lite-post-head .avatar{width:44px!important;height:44px!important;border-radius:50%!important;box-shadow:0 0 0 2px #fff,0 0 0 3.5px var(--fx-teal-soft)}
body.unified-app .lite-author{color:var(--fx-ink)!important;font-weight:700!important;font-size:.95rem}
body.unified-app .lite-post-by small{color:var(--fx-muted)!important;font-size:.74rem}
body.unified-app .user-presence{font-size:.68rem!important;color:var(--fx-muted)!important;background:transparent!important;padding:0!important}
body.unified-app .user-presence[data-online=true]{color:var(--fx-ok)!important}
body.unified-app .feed-follow button{background:transparent!important;color:var(--fx-teal)!important;border:0!important;padding:0 4px!important;font-weight:700!important;font-size:.82rem!important;box-shadow:none!important}
body.unified-app .post-region{color:var(--fx-muted)!important;font-size:.72rem!important}
body.unified-app .post-admin-coordinates{display:inline-flex!important;align-items:center;gap:4px;margin-top:4px;padding:2px 8px!important;border-radius:999px!important;background:var(--fx-line-2)!important;color:var(--fx-ink-2)!important;border:0!important;font-size:.66rem!important;font-weight:600!important;text-decoration:none!important;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.unified-app .lite-post-menu summary{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:transparent;transition:background .15s}
body.unified-app .lite-post-menu summary:hover{background:var(--fx-line-2)}
body.unified-app .lite-menu-popup{border-radius:var(--fx-r)!important;border:1px solid var(--fx-line)!important;box-shadow:var(--fx-shadow-3)!important;padding:6px!important}
body.unified-app .lite-menu-popup :is(button,a){border-radius:10px!important}
body.unified-app .lite-post-body{font-size:.98rem;line-height:1.55;color:var(--fx-ink);margin-top:10px;margin-bottom:12px}
body.unified-app .lite-post .post-gallery{border-radius:0;margin:0}
body.unified-app .lite-post .feed-video-shell{border-radius:0;margin:0;background:#07161d}
body.unified-app .lite-post-stats{padding:10px 0 8px;font-size:.78rem;color:var(--fx-muted);border-bottom:1px solid var(--fx-line-2)}
body.unified-app .lite-post-stats a{color:var(--fx-muted);text-decoration:none}
body.unified-app .lite-like-badge{background:linear-gradient(135deg,#1bb3a5,#0b8f8a)!important;box-shadow:0 0 0 2px #fff}
body.unified-app .lite-post-actions{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:2px;padding:4px 0 6px!important;border:0!important}
body.unified-app .lite-post-actions>*{min-width:0}
body.unified-app .lite-post-actions :is(button,a){width:100%;display:flex!important;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:6px 4px!important;border-radius:10px!important;background:transparent!important;border:0!important;box-shadow:none!important;color:var(--fx-ink-2)!important;font-weight:700!important;font-size:.8rem!important;text-decoration:none;transition:background .15s,color .15s}
body.unified-app .lite-post-actions :is(button,a):hover{background:var(--fx-line-2)!important}
body.unified-app .lite-post-actions :is(button,a) span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .lite-post-actions button.is-liked,body.unified-app .lite-post-actions button[aria-pressed=true]{color:var(--fx-teal)!important}
body.unified-app .lite-post-actions button.is-liked .lite-icon{fill:currentColor}
@media(max-width:380px){body.unified-app .lite-post-actions :is(button,a) span{font-size:.72rem}}
body.unified-app .lite-aside .lite-panel{border-radius:var(--fx-r-lg)!important;background:linear-gradient(170deg,#ffffff 0%,#f0faf8 100%)!important}
body.unified-app .lite-aside .lite-panel strong{font-size:1.35rem;letter-spacing:-.02em;color:var(--fx-deep)}
body.unified-app .lite-aside .lite-panel a{color:var(--fx-teal);font-weight:700;text-decoration:none}

/* Comments */
body.unified-app .comments-list :is(.comment,article){background:var(--fx-soft);border-radius:16px;border:0}



article,figure){border-radius:16px;overflow:hidden;aspect-ratio:9/16;background:var(--fx-deep);box-shadow:var(--fx-shadow-2)}

/* =================================================================
   LIVE — TikTok-like dark stage
   ================================================================= */

/* =================================================================
   INBOX — TikTok-like message list
   ================================================================= */
body.unified-app .inbox-page>form:not(.inbox-search){display:inline-block;margin:0 0 10px}
body.unified-app .inbox-search{display:flex;gap:8px;align-items:center;margin:0 0 6px}
body.unified-app .inbox-search input{flex:1;border-radius:999px!important;padding-left:42px!important;min-height:44px;background:var(--fx-surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23667c87' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") 15px center/18px no-repeat!important}
body.unified-app .inbox-search .button{min-height:44px}
body.unified-app .message-section{font-size:1rem;margin:20px 2px 10px}
body.unified-app .inbox-page .list-grid{gap:0;background:var(--fx-surface);border:1px solid var(--fx-line);border-radius:var(--fx-r-lg);overflow:hidden}
body.unified-app .inbox-page .list-grid:empty{display:none}
body.unified-app .inbox-page .list-grid>*{border:0!important;border-radius:0!important;box-shadow:none!important;border-bottom:1px solid var(--fx-line-2)!important}
body.unified-app .inbox-page .list-grid>*:last-child{border-bottom:0!important}
body.unified-app .notification-list{padding:6px!important}
body.unified-app .notification-list>p:only-child{padding:22px 16px;text-align:center;color:var(--fx-muted);margin:0}
body.unified-app .notification-list>:is(a,div,article){border-radius:14px;padding:12px;transition:background .15s}
body.unified-app .notification-list>:is(a,div,article):hover{background:var(--fx-soft)}

/* =================================================================
   SHOP — Shopee-like marketplace
   ================================================================= */
body.unified-app:is([data-page=shop],[data-page=product],[data-page=sell],[data-page=shop_orders],[data-page=shop_order]){--fx-accent:var(--fx-shop)}
body.unified-app:is([data-page=shop],[data-page=product],[data-page=sell],[data-page=shop_orders],[data-page=shop_order]) .button:not(.ghost){background:linear-gradient(135deg,#ff7337,var(--fx-shop));box-shadow:0 8px 18px -10px rgba(238,77,45,.85)}
body.unified-app:is([data-page=shop],[data-page=product]) .eyebrow.dark{color:var(--fx-shop)}
body.unified-app[data-page=shop] .shop-search{display:grid;grid-template-columns:1fr auto auto;gap:8px;padding:10px!important;border-radius:999px!important;align-items:center}
body.unified-app[data-page=shop] .shop-search input{border-radius:999px!important;padding-left:44px!important;background:var(--fx-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ee4d2d' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") 16px center/18px no-repeat!important;min-width:0}
body.unified-app[data-page=shop] .shop-search select{border-radius:999px!important;min-width:0;max-width:170px}
body.unified-app[data-page=shop] .shop-search .button{min-height:44px;padding:10px 22px}
@media(max-width:600px){body.unified-app[data-page=shop] .shop-search{grid-template-columns:1fr auto;border-radius:var(--fx-r-lg)!important}body.unified-app[data-page=shop] .shop-search input{grid-column:1/-1}body.unified-app[data-page=shop] .shop-search select{max-width:none}}
body.unified-app[data-page=shop] .shop-tabs>a:is(.active,[aria-current]){color:var(--fx-shop)}
body.unified-app .product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:12px}
@media(max-width:600px){body.unified-app .product-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}}
body.unified-app .product-card{display:flex;flex-direction:column;background:var(--fx-surface);border:1px solid var(--fx-line);border-radius:var(--fx-r);overflow:hidden;text-decoration:none;color:var(--fx-ink);box-shadow:var(--fx-shadow-1);transition:transform .15s,box-shadow .15s,border-color .15s}
body.unified-app .product-card:hover{transform:translateY(-3px);box-shadow:var(--fx-shadow-2);border-color:#ffc9b8}
body.unified-app .product-card .product-photo{aspect-ratio:1/1;background:#f1f4f6;overflow:hidden;margin:0;border-radius:0}
body.unified-app .product-card .product-photo img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
body.unified-app .product-card:hover .product-photo img{transform:scale(1.04)}
body.unified-app .product-card .product-info{display:flex;flex-direction:column;gap:4px;padding:10px 12px 12px}
body.unified-app .product-card .product-info .eyebrow{font-size:.6rem;letter-spacing:.08em;color:var(--fx-muted)}
body.unified-app .product-card h3{font-size:.86rem;font-weight:600;line-height:1.35;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.7em}
body.unified-app .product-card strong{color:var(--fx-shop);font-size:1.02rem;font-weight:700}
body.unified-app .product-card small{color:var(--fx-muted);font-size:.7rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .product-detail{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:18px;align-items:start}
@media(max-width:820px){body.unified-app .product-detail{grid-template-columns:1fr}body.unified-app .product-detail>aside{order:-1}}
body.unified-app .product-detail .product-main-photo{width:100%;border-radius:var(--fx-r);aspect-ratio:4/3;object-fit:cover;background:#f1f4f6}
body.unified-app .product-detail>aside{position:sticky;top:84px}
body.unified-app .product-price{display:block;color:var(--fx-shop)!important;font-size:clamp(1.6rem,6vw,2.1rem);font-weight:700;background:var(--fx-shop-soft);border-radius:var(--fx-r);padding:10px 14px;margin:10px 0}

/* =================================================================
   BOATS / TRIPS
   ================================================================= */
body.unified-app .fishing-hero{background:var(--fx-grad-deep)!important;border-radius:0 0 var(--fx-r-xl) var(--fx-r-xl);overflow:hidden}
body.unified-app .fishing-hero :is(h1,p){color:#fff}
body.unified-app .fishing-hero .eyebrow{color:#7fe3d6}
body.unified-app .hero-proof span{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14);border-radius:999px;color:#e5f6f3}
body.unified-app .search-panel{border-radius:var(--fx-r-xl)!important;box-shadow:var(--fx-shadow-3)!important;border:1px solid var(--fx-line)!important}
body.unified-app .boat-grid{gap:16px}
body.unified-app .boat-card{background:var(--fx-surface);border:1px solid var(--fx-line)!important;border-radius:var(--fx-r-lg)!important;overflow:hidden;box-shadow:var(--fx-shadow-1)!important;transition:transform .15s,box-shadow .15s}
body.unified-app .boat-card:hover{transform:translateY(-3px);box-shadow:var(--fx-shadow-2)!important}
body.unified-app .boat-photo img{aspect-ratio:16/10;object-fit:cover}
body.unified-app .photo-tag{background:rgba(255,255,255,.92)!important;color:var(--fx-teal)!important;border-radius:999px!important;font-weight:700;backdrop-filter:blur(6px)}
body.unified-app .open-promo{background:linear-gradient(120deg,#fff7ec,#fff);border:1px solid #ffe3c2;border-radius:var(--fx-r-xl)}
body.unified-app .steps>div{background:var(--fx-surface);border:1px solid var(--fx-line);border-radius:var(--fx-r-lg)}
body.unified-app .steps b{color:var(--fx-teal)}
body.unified-app .package-card{border-radius:var(--fx-r)!important;border:1px solid var(--fx-line)!important;background:var(--fx-soft)!important}
body.unified-app .instant-tag{background:#fff1d6!important;color:#8a5a00!important;border-radius:999px!important}

/* =================================================================
   PROFILE WALL
   ================================================================= */
body.unified-app .profile-cover{border-radius:var(--fx-r-xl) var(--fx-r-xl) 0 0;min-height:150px;background:radial-gradient(80% 120% at 85% 10%,rgba(255,176,32,.55),transparent 55%),var(--fx-grad-deep)!important}
body.unified-app .user-intro{border-radius:0 0 var(--fx-r-xl) var(--fx-r-xl)!important;margin-top:0!important}
body.unified-app .wall-avatar{box-shadow:0 0 0 4px #fff,0 10px 24px -8px rgba(6,42,57,.4)!important}
body.unified-app .profile-connections a{color:var(--fx-ink);font-weight:700;text-decoration:none}

/* =================================================================
   DASHBOARD / ADMIN
   ================================================================= */
body.unified-app .dashboard>h2{font-size:1.1rem;margin-top:28px}
body.unified-app .facts>div{border-color:var(--fx-line-2)!important}
body.unified-app .stack-form h2~h2{border-top:1px solid var(--fx-line-2)}

/* Admin accounts */
body.unified-app .admin-card-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
body.unified-app .admin-card-head h2{margin:0;font-size:1.05rem}
body.unified-app .admin-card-head p{margin:2px 0 0}
body.unified-app .admin-initial{flex:none;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--fx-grad);color:#fff;font-weight:700;font-size:1.05rem}
body.unified-app .admin-card-head .admin-count{margin-left:auto;font-size:.74rem;color:var(--fx-muted);font-weight:700}
body.unified-app .perm-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px;border:0;background:transparent;padding:0}
body.unified-app .perm-grid legend{padding:0 0 8px}
body.unified-app .perm-option{display:flex!important;flex-direction:row!important;gap:10px!important;align-items:flex-start;padding:12px 14px;border:1.5px solid var(--fx-line);border-radius:var(--fx-r);background:#fff;cursor:pointer;font-weight:400!important;transition:border-color .15s,background .15s}
body.unified-app .perm-option:hover{border-color:#bfe3de}
body.unified-app .perm-option:has(input:checked){border-color:var(--fx-teal-2);background:#f0fbf9}
body.unified-app .perm-option input{margin-top:3px;width:18px!important;height:18px;flex:none}
body.unified-app .perm-option span{display:flex;flex-direction:column;gap:2px}
body.unified-app .perm-option strong{font-size:.86rem;color:var(--fx-ink)}
body.unified-app .perm-option small{font-size:.74rem;color:var(--fx-muted);line-height:1.4}
body.unified-app .admin-footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}
body.unified-app .admin-danger summary{cursor:pointer;color:var(--fx-danger);font-weight:700;font-size:.82rem;list-style:none}
body.unified-app .admin-danger summary::-webkit-details-marker{display:none}
body.unified-app .admin-danger[open]{flex-basis:100%;background:#fff6f6;border:1px solid #f6d0d0;border-radius:var(--fx-r);padding:12px 14px}
body.unified-app .admin-danger label{margin-top:10px}
body.unified-app .owner-list{display:grid;gap:8px}
body.unified-app .owner-row{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--fx-line-2)}
body.unified-app .owner-row:first-of-type{border-top:0}
body.unified-app .owner-row p{margin:0}

/* Audit log timeline */
body.unified-app .audit-day{margin:22px 2px 8px;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--fx-muted);font-weight:700}
body.unified-app .audit-list{background:var(--fx-surface);border:1px solid var(--fx-line);border-radius:var(--fx-r-lg);overflow:hidden}
body.unified-app .audit-row{display:grid;grid-template-columns:auto 1fr auto;gap:4px 14px;align-items:start;padding:14px 16px;border-top:1px solid var(--fx-line-2)}
body.unified-app .audit-row:first-child{border-top:0}
body.unified-app .audit-row .admin-initial{width:36px;height:36px;font-size:.85rem;grid-row:span 2}
body.unified-app .audit-row h3{margin:0;font-size:.92rem}
body.unified-app .audit-row time{color:var(--fx-muted);font-size:.74rem;white-space:nowrap}
body.unified-app .audit-change{grid-column:2/-1;display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0;font-size:.84rem}
body.unified-app .audit-change del{text-decoration:line-through;color:#a42424;background:#fdecec;border-radius:6px;padding:1px 6px;overflow-wrap:anywhere}
body.unified-app .audit-change ins{text-decoration:none;color:#0a6b4a;background:#e3f7ef;border-radius:6px;padding:1px 6px;font-weight:700;overflow-wrap:anywhere}
body.unified-app .audit-by{grid-column:2/-1;color:var(--fx-muted);font-size:.76rem;margin:0}
body.unified-app .audit-filter .form-row{gap:10px}

/* =================================================================
   CAPTAIN PROFILE
   ================================================================= */
body.unified-app .captain-status[data-status=verified]{background:linear-gradient(160deg,#fff,#effaf5)}
body.unified-app .captain-status[data-status=rejected]{background:linear-gradient(160deg,#fff,#fff4f4);border-color:#f3d2d2}
body.unified-app .captain-steps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:0;margin:16px 0 0;counter-reset:none}
body.unified-app .captain-steps li{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;font-size:.74rem;font-weight:700;color:var(--fx-muted)}
body.unified-app .captain-steps li span{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--fx-line-2);color:var(--fx-muted);font-weight:700;position:relative;z-index:1;box-shadow:0 0 0 4px #fff}
body.unified-app .captain-steps li:not(:first-child)::before{content:"";position:absolute;top:16px;right:50%;width:100%;height:2px;background:var(--fx-line)}
body.unified-app .captain-steps li.is-done{color:var(--fx-ok)}
body.unified-app .captain-steps li.is-done span{background:var(--fx-ok);color:#fff}
body.unified-app .captain-steps li.is-done+li::before,body.unified-app .captain-steps li.is-done::before{background:var(--fx-ok)}
body.unified-app .captain-steps li.is-current{color:var(--fx-teal)}
body.unified-app .captain-steps li.is-current span{background:var(--fx-teal);color:#fff;box-shadow:0 0 0 4px #fff,0 0 0 7px rgba(18,179,166,.25)}
body.unified-app .captain-steps li.is-error{color:var(--fx-danger)}
body.unified-app .captain-steps li.is-error span{background:var(--fx-danger);color:#fff}
body.unified-app .captain-note{background:#fff6f6;border:1px solid #f3d2d2;border-radius:var(--fx-r);padding:12px 14px;margin:14px 0 0}
body.unified-app .captain-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:start;margin-top:16px}
@media(max-width:860px){body.unified-app .captain-layout{grid-template-columns:1fr}}
body.unified-app .captain-tips{position:sticky;top:84px;background:linear-gradient(170deg,#fff,#f0faf8)}
body.unified-app .captain-tips h2{font-size:1rem}
body.unified-app .captain-tips ul{margin:0;padding:0;list-style:none;display:grid;gap:10px}
body.unified-app .captain-tips li{position:relative;padding-left:26px;font-size:.84rem;color:var(--fx-ink-2);line-height:1.45}
body.unified-app .captain-tips li::before{content:"✓";position:absolute;left:0;top:0;width:18px;height:18px;border-radius:50%;background:var(--fx-teal-soft);color:var(--fx-teal);font-size:.7rem;font-weight:700;display:grid;place-items:center}
body.unified-app .captain-recheck{background:#fff4dc;color:#7a5000;border-radius:var(--fx-r);padding:10px 14px;font-size:.84rem;margin:0}

/* =================================================================
   WEATHER — Windy-like
   ================================================================= */
body.unified-app .marine-weather .weather-location{display:grid;gap:10px}
body.unified-app .marine-weather .weather-picker{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) auto;gap:10px;align-items:end}
@media(max-width:700px){body.unified-app .marine-weather .weather-picker{grid-template-columns:1fr}}
body.unified-app .marine-weather [data-weather-locate]{justify-self:start}
body.unified-app .marine-weather [data-weather-location-status]:empty{display:none}
body.unified-app .marine-alert{display:grid;gap:4px;border:0;border-radius:var(--fx-r-lg);padding:16px 18px 16px 58px;position:relative;box-shadow:var(--fx-shadow-1)}
body.unified-app .marine-alert::before{position:absolute;left:16px;top:16px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-weight:700;color:#fff;font-size:.95rem}
body.unified-app .marine-alert-danger{background:linear-gradient(135deg,#fff0f0,#ffe3e3);color:#7f1d1d}
body.unified-app .marine-alert-danger::before{content:"!";background:var(--fx-danger)}
body.unified-app .marine-alert-warning{background:linear-gradient(135deg,#fff8e8,#fff0cf);color:#6b4200}
body.unified-app .marine-alert-warning::before{content:"!";background:var(--fx-warn)}
body.unified-app .marine-alert-safe{background:linear-gradient(135deg,#ecfaf4,#dcf5ea);color:#0b4d40}
body.unified-app .marine-alert-safe::before{content:"✓";background:var(--fx-ok)}
body.unified-app .marine-alert strong{font-size:1rem;margin:0}
body.unified-app .marine-alert p{margin:0;line-height:1.5;font-size:.9rem}
body.unified-app .marine-advice{font-weight:700}
body.unified-app .marine-level{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:4px 10px;font-size:.7rem;font-weight:700;white-space:nowrap}
body.unified-app .marine-level-danger{background:#fde4e4;color:#a42424}
body.unified-app .marine-level-warning{background:#fff1d6;color:#8a5a00}
body.unified-app .marine-level-safe{background:#dcf5ea;color:#0a7a52}
/* "Now" card: deep Windy-style panel with big readable figures */
body.unified-app .weather-page>.weather-now{margin:14px 0 22px;padding:20px;border:0;border-radius:var(--fx-r-xl);background:radial-gradient(120% 120% at 100% 0%,rgba(18,179,166,.35),transparent 55%),var(--fx-grad-deep);color:#e6f3f5;box-shadow:var(--fx-shadow-3)}
body.unified-app .weather-now-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
body.unified-app .weather-now-head strong{display:block;color:#fff;font-size:1.15rem;letter-spacing:-.01em}
body.unified-app .weather-page>.weather-now .weather-now-head p{color:#9ed6d0!important;font-weight:700;margin:4px 0 0}
body.unified-app .weather-page>.weather-now .marine-level{box-shadow:0 0 0 1px rgba(255,255,255,.2)}
body.unified-app .weather-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0 14px!important}
body.unified-app .weather-page>.weather-now .weather-stats>div{flex-direction:column!important;align-items:flex-start!important;justify-content:flex-start;gap:6px;padding:14px!important;border:1px solid rgba(255,255,255,.1)!important;border-radius:var(--fx-r);background:rgba(255,255,255,.07)}
body.unified-app .weather-page>.weather-now .weather-stats dt{color:#9fb8bf;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;font-weight:700}
body.unified-app .weather-page>.weather-now .weather-stats dd{color:#fff;font-size:.98rem;text-align:left!important;line-height:1.4}
@media(max-width:420px){body.unified-app .weather-stats{grid-template-columns:1fr}}
body.unified-app .weather-more{display:inline-flex;align-items:center;gap:6px;color:#7fe3d6;font-weight:700;text-decoration:none}
body.unified-app .marine-widget .weather-more{color:var(--fx-teal)}
/* Day and hour cards */
body.unified-app .weather-page.marine-weather .weather-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;overflow:visible;padding:0}
body.unified-app .weather-page.marine-weather .weather-grid.weather-hours{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
@media(max-width:700px){body.unified-app .weather-page.marine-weather .weather-grid.weather-days{grid-template-columns:1fr}body.unified-app .weather-page.marine-weather .weather-grid.weather-hours{grid-template-columns:1fr 1fr}}
@media(max-width:430px){body.unified-app .weather-page.marine-weather .weather-grid.weather-hours{grid-template-columns:1fr}}
body.unified-app .weather-grid>.weather-card{flex:initial;display:flex;flex-direction:column;gap:8px;padding:14px 16px;border-radius:var(--fx-r-lg);text-decoration:none;color:var(--fx-ink);transition:transform .15s,box-shadow .15s,border-color .15s;position:relative}
body.unified-app a.weather-card:hover{transform:translateY(-2px);box-shadow:var(--fx-shadow-2)}
body.unified-app .weather-grid>.weather-card>strong{color:var(--fx-ink)!important;font-size:.92rem!important}
body.unified-app .weather-grid>.weather-card>p{margin:0;color:var(--fx-teal)!important;font-weight:700}
body.unified-app .weather-grid>.weather-card .marine-level{align-self:flex-start}
body.unified-app .weather-grid>.weather-card[data-level=danger]{border-top:4px solid var(--fx-danger)}
body.unified-app .weather-grid>.weather-card[data-level=warning]{border-top:4px solid var(--fx-warn)}
body.unified-app .weather-grid>.weather-card[data-level=safe]{border-top:4px solid var(--fx-ok)}
body.unified-app .weather-grid>.weather-card[aria-current]{border-color:var(--fx-teal-2);box-shadow:0 0 0 2px rgba(18,179,166,.25),var(--fx-shadow-2)}
body.unified-app .weather-grid>.weather-card dl{margin:0}
body.unified-app .weather-grid>.weather-card dl div{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-top:1px solid var(--fx-line-2);font-size:.82rem}
body.unified-app .weather-grid>.weather-card dd{text-align:right;font-weight:700;margin:0}
body.unified-app .marine-detail>.weather-card{display:flex;flex-direction:column;gap:6px;margin:14px 0 20px;padding:18px 20px;border:0;border-radius:var(--fx-r-xl);background:radial-gradient(90% 140% at 100% 0%,rgba(255,176,32,.28),transparent 60%),var(--fx-grad-deep);color:#e6f3f5}
body.unified-app .marine-detail>.weather-card strong{color:#fff!important;font-size:1.05rem}
body.unified-app .marine-detail>.weather-card p{color:#cfe6e9!important;font-weight:400;margin:0}
body.unified-app .marine-detail>.weather-card a{color:#ffd27a;font-weight:700;text-decoration:none}
body.unified-app .windy-panel iframe{display:block;width:100%;height:clamp(300px,55vh,480px);border:0;border-radius:var(--fx-r);background:linear-gradient(135deg,#0b3a4c,#0d5a63)}
body.unified-app .windy-layers{margin-top:10px}
body.unified-app .windy-layers .button{min-height:38px;padding:8px 16px}
body.unified-app .marine-widget h2{font-size:1.05rem}

/* =================================================================
   TIDES — Fishing Points-like
   ================================================================= */
body.unified-app .tide-date-strip{gap:8px}
body.unified-app .tide-date-strip a{border-radius:var(--fx-r)!important;border:1px solid var(--fx-line)!important;background:#fff!important;transition:transform .15s}
body.unified-app .tide-date-strip a.active{background:var(--fx-grad)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 8px 18px -10px rgba(11,143,138,.9)}
body.unified-app .tide-date-strip a.active :is(small,strong){color:#fff!important}
body.unified-app .tide-summary>div{border-radius:var(--fx-r-lg)!important;border:0!important}
body.unified-app .tide-summary>div:first-child{background:linear-gradient(150deg,#e6f6ff,#d4ecfb)!important}
body.unified-app .tide-summary>div:first-child strong{color:#135e9c!important}
body.unified-app .tide-summary>div:last-child{background:linear-gradient(150deg,#fff5e6,#ffe9c9)!important}
body.unified-app .tide-summary>div:last-child strong{color:#9a5a00!important}
body.unified-app .tide-chart-shell{border-radius:var(--fx-r-lg)!important;border:1px solid var(--fx-line)!important;background:linear-gradient(180deg,#f7fbff,#fff)!important}
body.unified-app .tide-turns>div{border-radius:var(--fx-r)!important;border:1px solid var(--fx-line)!important}
body.unified-app .tide-turns .high{color:#135e9c!important}
body.unified-app .tide-turns .low{color:#9a5a00!important}
body.unified-app .tide-hourly summary{color:var(--fx-teal);font-weight:700;cursor:pointer}
body.unified-app .location-panel{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}

/* =================================================================
   AUTH
   ================================================================= */
body.unified-app .auth-card{border-radius:var(--fx-r-xl)!important;box-shadow:var(--fx-shadow-3)!important;border:0!important;overflow:hidden;position:relative}
body.unified-app .auth-card::before{content:"";position:absolute;inset:0 0 auto;height:5px;background:var(--fx-grad)}

/* ---------- Desktop rhythm ---------- */
@media(min-width:1024px){
  body.unified-app .shell{max-width:1120px}
  body.unified-app .form-page{max-width:880px}
  body.unified-app .captain-page,body.unified-app .marine-weather{max-width:1040px}
}

/* ---------- Refinements after visual review ---------- */
/* Section heads stack on phones without a tall empty flex-basis gap */
@media(max-width:700px){body.unified-app .section-head{flex-direction:column;align-items:stretch}body.unified-app .section-head>div:first-child{flex:none}}
/* Feed: author row wraps instead of truncating; actions become icon-over-label on phones */
body.unified-app .feed-author-row{flex-wrap:wrap;row-gap:0;min-width:0}
body.unified-app .lite-author{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;max-width:none!important}
body.unified-app .lite-post-by{min-width:0;flex:1}
@media(max-width:520px){
  body.unified-app .lite-post-actions :is(button,a){flex-direction:column;gap:3px;min-height:52px;font-size:.7rem!important}
  body.unified-app .lite-post-actions :is(button,a) span{font-size:.7rem}
  body.unified-app .lite-post-actions .lite-icon{width:20px;height:20px}
  body.unified-app .lite-feed-filter>a{padding:8px 10px;font-size:.78rem}
}
body.unified-app .feed-section-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}
body.unified-app .feed-section-heading .feed-eyebrow{white-space:nowrap}


/* Weather banner: the title already carries its ✓/⚠ mark (also used by the APK) */
body.unified-app .marine-alert{padding:16px 18px}
body.unified-app .marine-alert::before{content:none!important}
body.unified-app .windy-panel{padding:clamp(18px,3.4vw,26px)!important}
/* Captain form: optional chip hugs its text */
body.unified-app .field-optional{align-self:flex-start;margin:-2px 0 0}
/* Inbox: "mark read" is a quiet text action */
body.unified-app .inbox-page>form:not(.inbox-search) .button{min-height:34px;padding:6px 12px;background:transparent;border:0;box-shadow:none;color:var(--fx-teal);font-size:.8rem}
/* Product on phones: photo, then price card, then description (Shopee order) */
@media(max-width:820px){
  body.unified-app .product-detail>aside{order:0}
  body.unified-app .product-detail>.panel:first-child{display:contents}
  body.unified-app .product-detail .product-main-photo{order:-2;border-radius:var(--fx-r-lg);box-shadow:var(--fx-shadow-2)}
  body.unified-app .product-detail>aside{order:-1;position:static}
  body.unified-app .product-detail>.panel:first-child>:not(img){padding:0 6px;margin:0}
  body.unified-app .product-detail>.panel:first-child>h2{margin-top:6px;font-size:1rem}
}
body.unified-app .composer-heading span.avatar{display:grid!important;place-items:center;font-size:1rem!important;font-weight:700;color:var(--fx-teal);background:var(--fx-teal-soft);margin:0!important;border-radius:50%;overflow:hidden}
body.unified-app .composer-heading span.avatar img{width:100%;height:100%;object-fit:cover}
/* Profile wall: avatar overlaps the cover, stats on one line */
body.unified-app .user-intro{position:relative}
body.unified-app .profile-connections{display:flex!important;flex-wrap:wrap;align-items:center;gap:4px 8px}
body.unified-app .profile-connections a{display:inline!important}
@media(max-width:700px){
  body.unified-app .user-intro{display:flex!important;flex-direction:column;align-items:flex-start;gap:10px;padding-top:0!important}
  body.unified-app .user-intro .profile-photo-link{margin-top:-52px}
  body.unified-app .user-intro .wall-avatar{width:104px!important;height:104px!important}
  body.unified-app .user-intro h1{margin:0;font-size:1.6rem}
  body.unified-app .user-intro p{margin:2px 0}
  body.unified-app .user-intro .card-actions{width:100%}
  body.unified-app .user-intro .card-actions :is(form,.button){flex:1}
  body.unified-app .user-intro .card-actions form .button{width:100%}
}
body.unified-app .section-head .count-badge{align-self:flex-start}

/* =================================================================
   Phase 2 — inbox threads, chat room, live lobby, dashboard
   ================================================================= */
/* Thread list: avatar · name/preview · time/unread, like TikTok inbox */
body.unified-app .inbox-page:has(.thread-row) .notification-list:has(>p:only-child){display:none}
body.unified-app .thread-row{display:grid!important;grid-template-columns:52px minmax(0,1fr) auto;align-items:center;gap:12px!important;padding:12px 14px!important;text-decoration:none;color:var(--fx-ink)}
body.unified-app .thread-row:hover{background:var(--fx-soft)!important}
body.unified-app .thread-row>.avatar{width:52px!important;height:52px!important;border-radius:50%!important;overflow:hidden;display:grid;place-items:center;background:var(--fx-teal-soft);color:var(--fx-teal);font-weight:700;font-size:1.1rem}
body.unified-app .thread-row>.avatar img{width:100%;height:100%;object-fit:cover}
body.unified-app .thread-row h3{margin:0;font-size:.95rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .thread-row .user-presence{display:none!important}
body.unified-app .thread-row p{margin:2px 0 0;font-size:.84rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .thread-row.is-unread h3{font-weight:700}
body.unified-app .thread-row.is-unread p{color:var(--fx-ink)!important;font-weight:600}
body.unified-app .thread-meta{display:flex;flex-direction:column;align-items:flex-end;gap:6px;align-self:stretch;justify-content:center}
body.unified-app .thread-meta time{font-size:.72rem;color:var(--fx-muted)}
body.unified-app .thread-row.is-unread .thread-meta time{color:var(--fx-live);font-weight:700}
body.unified-app .thread-unread{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--fx-live);color:#fff;font-size:.68rem;font-weight:700}

/* Chat room: bubbles, compact sticky composer */
body.unified-app .chat-page{display:flex;flex-direction:column}
body.unified-app .chat-heading{position:sticky;top:62px;z-index:5;background:rgba(242,245,247,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:10px 0;margin:0 0 4px}
body.unified-app .chat-heading h1{font-size:1.15rem!important;margin:0 0 2px!important}
body.unified-app .chat-heading .avatar{width:44px!important;height:44px!important;border-radius:50%!important}
body.unified-app [data-chat-actions]{gap:6px;margin-bottom:10px}
body.unified-app [data-chat-actions] .button{min-height:32px;padding:5px 12px;font-size:.74rem}
body.unified-app .message-list{gap:6px!important;padding:6px 0 12px}
body.unified-app .message-list>.message{position:relative;max-width:min(78%,520px);padding:9px 14px 7px!important;border-radius:20px 20px 20px 6px!important;background:var(--fx-surface)!important;border:1px solid var(--fx-line)!important;box-shadow:var(--fx-shadow-1);display:flex;flex-wrap:wrap;align-items:baseline;column-gap:8px}
body.unified-app .message-list>.message.mine{border-radius:20px 20px 6px 20px!important;background:var(--fx-grad)!important;border:0!important;color:#fff}
body.unified-app .message-list>.message>strong{display:none}
body.unified-app .message-list>.message>p{order:1;flex-basis:100%;margin:0;font-size:.95rem;line-height:1.45;overflow-wrap:anywhere}
body.unified-app .message-list>.message>small{order:2;font-size:.66rem;color:var(--fx-muted);margin-top:3px}
body.unified-app .message-list>.message.mine>small{color:rgba(255,255,255,.8)}
body.unified-app .message-list>.message.mine .chat-receipt{margin-left:auto}
body.unified-app .message-list>.message>details{order:3;position:absolute;top:4px;right:6px}
body.unified-app .message-list>.message>details>summary{list-style:none;cursor:pointer;font-size:.7rem;opacity:0;padding:0 6px;border-radius:8px;transition:opacity .15s;color:inherit}
body.unified-app .message-list>.message>details>summary::-webkit-details-marker{display:none}
body.unified-app .message-list>.message:is(:hover,:focus-within)>details>summary,body.unified-app .message-list>.message>details[open]>summary{opacity:.8}
@media(hover:none){body.unified-app .message-list>.message>details>summary{opacity:.45}}
body.unified-app .message-list>.message>details[open]{position:static;flex-basis:100%;order:4;margin-top:6px}
body.unified-app .message-list>.message .message-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
body.unified-app .message-list>.message .message-actions :is(button,a){font-size:.72rem;padding:4px 10px;border-radius:999px;border:1px solid var(--fx-line);background:#fff;color:var(--fx-ink-2)}
body.unified-app [data-chat-latest],body.unified-app [data-chat-older]{align-self:center;min-height:30px!important;padding:4px 14px!important;font-size:.74rem!important}
body.unified-app [data-chat-status]:empty{display:none}
body.unified-app .chat-compose{position:sticky!important;bottom:calc(var(--fx-dock-h) + 20px + env(safe-area-inset-bottom))!important;z-index:6;display:grid!important;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:8px!important;padding:8px!important;border-radius:26px!important;background:rgba(255,255,255,.96)!important;border:1px solid var(--fx-line);box-shadow:var(--fx-shadow-2)}
body.unified-app .chat-compose>label{display:block!important;font-size:0!important;margin:0}
body.unified-app .chat-compose textarea{min-height:44px!important;max-height:140px;padding:11px 16px!important;border-radius:22px!important;font-size:.95rem!important;resize:none;background:var(--fx-soft)!important}
body.unified-app .chat-compose .button{min-height:44px;width:44px;padding:0;border-radius:50%;font-size:0;background-color:var(--fx-teal);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 2 11 13'/%3E%3Cpath d='M22 2 15 22l-4-9-9-4z'/%3E%3C/svg%3E"),var(--fx-grad);background-position:center,center;background-size:20px,cover;background-repeat:no-repeat}
body.unified-app[data-page=chat] main{padding-bottom:calc(var(--fx-dock-h) + 24px)}

/* Live lobby: what's on air comes first; TikTok-style cards */

/* Dashboard quick actions: tidy chip grid */
body.unified-app .dashboard>.section-head .card-actions{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;width:100%}
body.unified-app .dashboard>.section-head .card-actions .button{width:100%;justify-content:flex-start;padding:10px 14px;border-radius:var(--fx-r)}
body.unified-app .dashboard>.card-actions .button{border-radius:var(--fx-r)}

/* Notifications: unread rows get a clear dot and tint */
body.unified-app .notification-list{display:grid;gap:2px}
body.unified-app .notification-list .avatar{border-radius:50%!important}

/* Comments (post detail) */
body.unified-app :is(.lite-comments,.comments-list) .avatar{border-radius:50%!important}
body.unified-app :is(.lite-comment-body,.comment-bubble){border-radius:18px!important}
body.unified-app .message-list>.message:has(>details){padding-right:30px!important}
body.unified-app .chat-page>.back{align-self:flex-start}

/* =================================================================
   COMPACT DENSITY — tighter rhythm on every page.
   Scale: 4 / 8 / 12 / 16px spacing, 40px primary controls, 36px chips.
   ================================================================= */
:root{--fx-dock-h:56px;--fx-r:12px;--fx-r-lg:16px;--fx-r-xl:20px}
html{font-size:15px}
body.unified-app{line-height:1.45}
body.unified-app main{padding-bottom:calc(var(--fx-dock-h) + 26px + env(safe-area-inset-bottom))}
body.unified-app .shell{padding-left:12px;padding-right:12px}
@media(min-width:700px){body.unified-app .shell{padding-left:20px;padding-right:20px}}
body.unified-app .section,body.unified-app section.section{padding:12px 0 18px!important}
body.unified-app .section-head{margin-bottom:10px!important;gap:8px 14px!important}
body.unified-app .section>h1,body.unified-app .form-page>h1,body.unified-app .section-head h1,body.unified-app main h1{font-size:clamp(1.3rem,4.4vw,1.75rem)!important;margin:2px 0 4px!important;line-height:1.2!important}
body.unified-app main h2{font-size:1rem!important;margin:14px 0 8px}
body.unified-app main h3{font-size:.92rem}
body.unified-app main p{margin:0 0 8px}
body.unified-app .section>p.muted,body.unified-app .form-page>p.muted,body.unified-app .section-head p.muted{font-size:.86rem;margin:0 0 10px}
body.unified-app .eyebrow,body.unified-app .eyebrow.dark,body.unified-app .feed-eyebrow{font-size:.64rem;margin-bottom:2px}
body.unified-app .back{padding:5px 11px;font-size:.76rem;margin-bottom:8px}
body.unified-app .fineprint{font-size:.74rem;margin:6px 0 0}

/* Header 52px, dock 56px */
body.unified-app .lite-headrow{min-height:52px!important;padding-top:0!important;padding-bottom:0!important}
body.unified-app .lite-wordmark{font-size:1.2rem!important;gap:8px!important}
body.unified-app .lite-wordmark .mancing-brand-mark{width:34px!important;height:34px!important;border-radius:11px!important}
body.unified-app .mancing-brand-type small{font-size:.36rem!important;margin-top:4px!important}
body.unified-app .lite-round{width:34px!important;height:34px!important}
body.unified-app .lite-round .lite-icon{width:18px;height:18px}
body.unified-app .app-bottom-navigation{padding:4px;border-radius:18px;bottom:calc(8px + env(safe-area-inset-bottom))}
body.unified-app .app-bottom-navigation .lite-primary-tabs a{min-height:46px;border-radius:14px;gap:2px;font-size:.62rem}
body.unified-app .app-bottom-navigation .lite-primary-tabs a .lite-icon{width:20px;height:20px}
body.unified-app .footer{padding:14px 0!important;margin-bottom:calc(var(--fx-dock-h) + 16px)!important}
body.unified-app .footer-inner{gap:8px 14px!important;font-size:.78rem}
body.unified-app .flash{padding:9px 12px;margin-top:8px;font-size:.86rem}

/* Surfaces and controls */
body.unified-app .panel{padding:14px!important;margin-bottom:10px}
@media(min-width:700px){body.unified-app .panel{padding:18px!important}}
body.unified-app .panel>h2:first-child,body.unified-app .panel>h2:first-of-type{margin:0 0 8px!important}
body.unified-app .list-grid{gap:8px!important}
body.unified-app .list-card{padding:12px!important;gap:10px!important}
body.unified-app .empty{padding:22px 16px!important}
body.unified-app .empty::before{width:44px;height:44px;margin-bottom:8px;border-radius:14px;background-size:22px}
body.unified-app .empty>span{width:44px!important;height:44px!important;font-size:1.2rem!important;margin-bottom:8px!important}
body.unified-app .button{min-height:40px;padding:8px 16px;font-size:.86rem;gap:6px}
body.unified-app .button.ghost,body.unified-app .card-actions .button{min-height:36px;padding:6px 14px;font-size:.8rem}
body.unified-app .card-actions{gap:6px}
body.unified-app .stack-form{gap:10px!important}
body.unified-app .stack-form label:not(.check){gap:4px!important;font-size:.76rem}
body.unified-app :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=hidden]):not([name=q]),select){min-height:40px!important;padding:8px 12px!important;font-size:.9rem!important;border-radius:11px!important}
body.unified-app textarea{padding:8px 12px!important;font-size:.9rem!important;border-radius:11px!important}
body.unified-app .form-row{gap:10px!important}
body.unified-app .stack-form h2~h2{padding-top:12px!important;margin-top:4px!important}
body.unified-app .check{font-size:.82rem!important}
body.unified-app fieldset{padding:8px 10px 10px}
body.unified-app .field-hint{font-size:.72rem;margin-top:0}
body.unified-app :is(.service-tabs,.marine-page-tabs,.shop-tabs,.message-tabs,.feed-tabs,.lite-feed-filter){margin:8px 0 10px;padding:3px}
body.unified-app :is(.service-tabs,.marine-page-tabs,.shop-tabs,.message-tabs,.feed-tabs,.lite-feed-filter)>a{min-height:32px;padding:5px 12px;font-size:.78rem}
body.unified-app .facts>div{padding:8px 0!important;font-size:.82rem!important}
body.unified-app .pill{padding:3px 8px;font-size:.64rem}

/* Feed */
body.unified-app .lite-frame{padding:0 10px!important}
body.unified-app .community-lite{padding-top:8px!important}
body.unified-app .lite-main{gap:14px!important}





/* shortcut cards become a single row of compact chips */
body.unified-app .ocean-shortcuts{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px!important;margin:0 0 8px!important}
body.unified-app .ocean-shortcuts>a{min-height:0!important;display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;gap:8px!important;padding:8px 10px!important;border-radius:14px!important;text-align:left!important}
body.unified-app .ocean-shortcuts>a>span:first-child{width:30px!important;height:30px!important;border-radius:10px!important;flex:none;display:grid!important;place-items:center;margin:0!important}
body.unified-app .ocean-shortcuts>a>span:first-child .lite-icon{width:17px!important;height:17px!important}
body.unified-app .ocean-shortcuts>a>div{min-width:0}
body.unified-app .ocean-shortcuts strong{display:block!important;font-size:.76rem!important;line-height:1.15!important;min-height:0!important;justify-content:flex-start!important;text-align:left!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .ocean-shortcuts small{display:none!important}
body.unified-app .ocean-shortcuts>a>svg.lite-icon:last-child{display:none!important}
/* composer */
body.unified-app .lite-composer{padding:10px 12px!important;margin-bottom:8px!important}
body.unified-app .composer-heading{margin-bottom:8px!important;gap:10px!important}
body.unified-app .composer-heading span.avatar{width:34px!important;height:34px!important}
body.unified-app .composer-heading strong{font-size:.84rem!important}
body.unified-app .composer-heading span:not(.composer-spark):not(.avatar){font-size:.66rem!important}
body.unified-app .lite-composer textarea{min-height:42px!important;height:42px}
body.unified-app .lite-composer textarea:focus{height:90px}
body.unified-app .composer-footer{margin-top:8px!important}
body.unified-app .composer-tools :is(label,button){width:36px!important;height:36px!important}
body.unified-app .composer-submit{min-height:36px!important;padding:6px 16px!important;font-size:.82rem!important}
body.unified-app .composer-hint{font-size:.7rem!important;margin:6px 0 0!important}
body.unified-app .feed-section-heading{margin:12px 2px 2px!important}
body.unified-app .lite-feed-filter{margin:4px 0 8px!important}
/* posts */
body.unified-app .lite-post{margin-bottom:10px!important}
body.unified-app .lite-post>*:not(.post-gallery):not(.feed-video-shell){margin-left:12px!important;margin-right:12px!important}
body.unified-app .lite-post-head{padding-top:10px!important;gap:8px!important}
body.unified-app .lite-post-head .avatar{width:38px!important;height:38px!important}
body.unified-app .lite-author{font-size:.88rem!important}
body.unified-app .lite-post-by small{font-size:.68rem!important}
body.unified-app .post-region{font-size:.66rem!important}
body.unified-app .lite-post-body{font-size:.92rem!important;margin-top:6px!important;margin-bottom:8px!important}
body.unified-app .lite-post-stats{padding:6px 0!important;font-size:.72rem!important}
body.unified-app .lite-post-actions{padding:2px 0 4px!important}
body.unified-app .lite-post-actions :is(button,a){flex-direction:row!important;min-height:36px!important;gap:5px!important;padding:4px 2px!important;font-size:.74rem!important}
body.unified-app .lite-post-actions :is(button,a) span{font-size:.74rem!important}
body.unified-app .lite-post-actions .lite-icon{width:17px!important;height:17px!important}
@media(max-width:360px){body.unified-app .lite-post-actions :is(button,a) span{font-size:.66rem!important}}
body.unified-app .feed-video-shell{max-height:70vh}
body.unified-app .lite-aside .lite-panel{padding:16px!important}

/* Inbox / chat / notifications */
body.unified-app .thread-row{padding:9px 12px!important;grid-template-columns:44px minmax(0,1fr) auto;gap:10px!important}
body.unified-app .thread-row>.avatar{width:44px!important;height:44px!important}
body.unified-app .inbox-search{margin:0 0 4px}
body.unified-app .inbox-search input{min-height:38px!important}
body.unified-app .inbox-search .button{min-height:38px}
body.unified-app .message-section{margin:12px 2px 6px!important}
body.unified-app .notification-list>:is(a,div,article){padding:8px 10px!important}
body.unified-app .notification-list .avatar{width:40px!important;height:40px!important}
body.unified-app .chat-heading{padding:6px 0!important;top:52px}
body.unified-app .chat-heading .avatar{width:38px!important;height:38px!important}
body.unified-app .message-list>.message{padding:7px 12px 5px!important}
body.unified-app .message-list>.message>p{font-size:.9rem}
body.unified-app .chat-compose{padding:6px!important;bottom:calc(var(--fx-dock-h) + 16px + env(safe-area-inset-bottom))!important}
body.unified-app .chat-compose textarea{min-height:40px!important;padding:9px 14px!important}
body.unified-app .chat-compose .button{min-height:40px;width:40px}

/* Shop */
body.unified-app[data-page=shop] .shop-search{padding:6px!important;gap:6px}
body.unified-app .product-grid{gap:8px!important}
body.unified-app .product-card .product-info{padding:8px 10px 10px;gap:2px}
body.unified-app .product-card h3{font-size:.8rem;min-height:2.6em}
body.unified-app .product-card strong{font-size:.95rem}
body.unified-app .product-price{font-size:clamp(1.35rem,5vw,1.7rem)!important;padding:6px 12px!important;margin:6px 0!important}

/* Boats / trips */
body.unified-app .fishing-hero{padding:18px 0 46px!important;min-height:0!important}
body.unified-app .fishing-hero .hero-inner{min-height:0!important;gap:10px!important}
body.unified-app .fishing-hero h1{font-size:clamp(1.4rem,5vw,2rem)!important;margin:4px 0 6px!important;color:#fff}
body.unified-app .fishing-hero p{font-size:.88rem;margin-bottom:8px}
body.unified-app .hero-proof{gap:6px!important}
body.unified-app .hero-proof span{padding:3px 9px!important;font-size:.7rem!important}
body.unified-app .search-wrap{margin-top:-34px!important}
body.unified-app .search-panel{padding:12px!important;gap:8px!important}
body.unified-app .search-extras{gap:8px!important;margin-top:4px!important}
body.unified-app .discover-section{padding-top:14px!important}
body.unified-app .boat-grid{gap:10px!important}
body.unified-app .boat-info{padding:10px 12px 12px!important;gap:4px!important}
body.unified-app .boat-info p{margin:0!important}
body.unified-app .boat-bottom{padding-top:8px!important;margin-top:6px!important}
body.unified-app .open-promo{padding:14px!important;margin:10px auto!important}
body.unified-app .how{padding:14px 0 18px!important}
body.unified-app .steps{gap:8px!important;display:grid!important;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
body.unified-app .steps>div{padding:12px!important}
body.unified-app .steps>div h3{margin:4px 0!important}
body.unified-app .steps>div p{font-size:.8rem;margin:0}
body.unified-app .feature-grid{gap:8px!important}
body.unified-app .package-card{padding:10px 12px!important}

/* Weather / tides */
body.unified-app .weather-page>.weather-now{padding:14px!important;margin:10px 0 14px!important}
body.unified-app .weather-stats{margin:10px 0 8px!important;gap:8px}
body.unified-app .weather-page>.weather-now .weather-stats>div{padding:10px!important;gap:3px!important}
body.unified-app .weather-page>.weather-now .weather-stats dd{font-size:.9rem}
body.unified-app .marine-alert{padding:10px 14px!important;margin-bottom:10px!important;gap:2px}
body.unified-app .marine-alert strong{font-size:.9rem}
body.unified-app .marine-alert p{font-size:.82rem}
body.unified-app .weather-grid>.weather-card{padding:10px 12px!important;gap:4px!important}
body.unified-app .weather-grid>.weather-card dl div{padding:4px 0!important;font-size:.76rem!important}
@media(max-width:700px){body.unified-app .weather-page.marine-weather .weather-grid.weather-days{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important}
  body.unified-app .weather-grid.weather-days>.weather-card{padding:8px!important}
  body.unified-app .weather-grid.weather-days>.weather-card>strong{font-size:.72rem!important}
  body.unified-app .weather-grid.weather-days>.weather-card>p{font-size:.72rem}
  body.unified-app .weather-grid.weather-days>.weather-card .marine-level{font-size:.6rem;padding:2px 6px}
  body.unified-app .weather-grid.weather-days>.weather-card dl div{flex-direction:column;gap:0;font-size:.68rem!important}
  body.unified-app .weather-grid.weather-days>.weather-card dd{text-align:left}}
body.unified-app .marine-detail>.weather-card{padding:12px 14px!important;margin:8px 0 12px!important}
body.unified-app .windy-panel iframe{height:clamp(260px,46vh,420px)}
body.unified-app .windy-panel{padding:12px!important}
body.unified-app .marine-weather .weather-location{gap:6px}
body.unified-app .tide-date-strip a{padding:6px 4px!important}
body.unified-app .tide-summary{gap:8px!important}
body.unified-app .tide-summary>div{padding:10px 12px!important}
body.unified-app .tide-turns{gap:6px!important}
body.unified-app .tide-turns>div{padding:8px 10px!important}
body.unified-app .location-panel{padding:10px 14px!important}

/* Profile, captain, admin */
body.unified-app .profile-cover{min-height:110px!important}
body.unified-app .captain-steps{margin-top:10px}
body.unified-app .captain-steps li span{width:28px;height:28px}
body.unified-app .captain-steps li:not(:first-child)::before{top:14px}
body.unified-app .captain-layout{gap:10px;margin-top:10px}
body.unified-app .captain-tips li{font-size:.8rem}
body.unified-app .perm-grid{gap:6px}
body.unified-app .perm-option{padding:8px 10px;gap:8px!important}
body.unified-app .perm-option small{font-size:.7rem}
body.unified-app .admin-initial{width:38px;height:38px;font-size:.92rem}
body.unified-app .audit-row{padding:10px 12px;gap:2px 10px}
body.unified-app .audit-row .admin-initial{width:32px;height:32px}
body.unified-app .audit-day{margin:12px 2px 6px}
body.unified-app .dashboard>h2{margin-top:16px!important}

/* Help / FAQ style blocks */
body.unified-app details:not(.lite-post-menu):not(.admin-danger):not(.tide-hourly)>summary{padding:6px 0}
/* compact refinements */
body.unified-app .ocean-shortcuts>a{overflow:hidden;min-width:0}
body.unified-app .ocean-shortcuts>a>div{flex:1 1 auto;overflow:hidden}
body.unified-app .ocean-shortcuts strong{font-size:.72rem!important}
@media(max-width:520px){
  body.unified-app .lite-post-actions :is(button,a){flex-direction:column!important;min-height:42px!important;gap:2px!important;padding:3px 0!important}
  body.unified-app .lite-post-actions :is(button,a) span{font-size:.66rem!important}
}
body.unified-app .weather-stats{grid-template-columns:1fr 1fr!important}
body.unified-app .search-extras{display:grid!important;grid-template-columns:auto 1fr 1fr;align-items:end}
body.unified-app .search-extras>label:not(.check){flex-direction:column!important;align-items:stretch!important;gap:3px!important;font-size:.72rem}
@media(max-width:520px){body.unified-app .search-extras{grid-template-columns:1fr 1fr}body.unified-app .search-extras>label.check{grid-column:1/-1}}
body.unified-app section.open-promo{padding:14px 16px!important;width:calc(100% - 24px);max-width:1080px}
body.unified-app .how .shell>h2{margin-top:2px!important}
body.unified-app .ocean-shortcuts>a{padding:7px 8px!important;gap:6px!important}
body.unified-app .ocean-shortcuts>a>div{display:block!important;text-align:left!important}
body.unified-app .ocean-shortcuts>a>span:first-child{width:26px!important;height:26px!important;border-radius:9px!important}
body.unified-app .ocean-shortcuts strong{white-space:normal!important;overflow:hidden;text-overflow:clip!important;display:-webkit-box!important;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.2!important}
body.unified-app .ocean-shortcuts strong{font-size:.68rem!important}
body.unified-app .inbox-search input,body.unified-app[data-page=shop] .shop-search input{padding-top:8px!important;padding-bottom:8px!important;padding-right:12px!important;font-size:.9rem!important}
body.unified-app .product-detail{gap:10px!important}
body.unified-app .help-tabs{flex-wrap:nowrap!important}
body.unified-app .help-page .panel details{border-bottom:1px solid var(--fx-line-2)}
body.unified-app .help-page .panel details:last-child{border-bottom:0}
body.unified-app .help-page .panel details>summary{padding:9px 0!important;margin:0!important;font-size:.86rem;cursor:pointer;border:0!important}
body.unified-app .help-page .panel details>p{margin:0 0 10px!important;font-size:.84rem;color:var(--fx-ink-2)}
body.unified-app .help-page details{padding:0!important;border-top:0!important}
body.unified-app .help-page summary{min-height:0!important}
body.unified-app[data-page=shop] .shop-search select{grid-column:1}
body.unified-app[data-page=shop] .shop-search button{grid-column:auto!important;min-height:40px!important;padding:8px 18px!important}
@media(min-width:601px){body.unified-app[data-page=shop] .shop-search{grid-template-columns:1fr auto auto}}

/* Feed video: the box follows the video's own shape (server-provided bucket), video fills it edge to edge */
body.unified-app :is(.lite-post,.lite-shared)>.feed-video-shell{margin:0!important;border-radius:0!important;min-height:0!important;aspect-ratio:1/1;max-height:min(82vh,720px);width:100%;background:#0b1c22!important}
body.unified-app .lite-shared>.feed-video-shell{border-radius:12px!important}
body.unified-app .feed-video-shell[data-ar=portrait]{aspect-ratio:4/5}
body.unified-app .feed-video-shell[data-ar=square]{aspect-ratio:1/1}
body.unified-app .feed-video-shell[data-ar=classic]{aspect-ratio:4/3}
body.unified-app .feed-video-shell[data-ar=wide]{aspect-ratio:16/9}
body.unified-app :is(.lite-post,.lite-shared)>.feed-video-shell>video{width:100%!important;height:100%!important;max-height:none!important;object-fit:cover!important;background:transparent!important;border-radius:0!important}
body.unified-app .feed-video-shell:fullscreen>video{object-fit:contain!important}
body.unified-app .feed-video-shell .feed-video-controls{left:10px;right:10px;bottom:22px!important}
body.unified-app .feed-video-shell .feed-video-controls button{min-height:30px;padding:4px 11px;border-radius:999px;background:rgba(6,20,26,.55);color:#fff;border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);font-size:.72rem;font-weight:700}
body.unified-app .feed-video-shell .feed-video-seek{position:absolute;left:10px;right:10px;bottom:8px;width:calc(100% - 20px);z-index:3;accent-color:var(--fx-teal-2);height:4px}
body.unified-app .feed-video-shell .feed-video-status{position:absolute;inset:auto 0 50% 0;text-align:center;color:#fff;font-size:.78rem;z-index:2;text-shadow:0 1px 4px rgba(0,0,0,.6)}
/* Loading state: nothing is drawn over the poster; the status text stays available to screen readers */
body.unified-app .feed-video-shell .feed-video-status.is-loading{position:absolute!important;inset:auto!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
/* Chat: delete conversation (two-step confirm) */
body.unified-app .chat-delete{display:inline-block}
body.unified-app .chat-delete>summary{list-style:none;cursor:pointer;color:var(--fx-danger)}
body.unified-app .chat-delete>summary::-webkit-details-marker{display:none}
body.unified-app .chat-delete[open]{display:block;flex-basis:100%}
body.unified-app .chat-delete>.panel{margin-top:6px;padding:10px 12px}
body.unified-app .chat-delete>.panel p{margin:0 0 8px;font-size:.85rem}
/* Feed video, Facebook Lite style: tap the video to pause/resume, speaker icon bottom right */
body.unified-app .feed-video-shell.is-tap-toggle{cursor:pointer;-webkit-tap-highlight-color:transparent}
body.unified-app .feed-video-shell.is-tap-toggle:focus-visible{outline:2px solid var(--fx-teal-2);outline-offset:-2px}
body.unified-app .feed-video-shell .feed-video-controls{position:absolute!important;inset:auto 10px 16px auto!important;display:block!important;pointer-events:none}
body.unified-app .feed-video-shell .feed-video-controls button{pointer-events:auto}
body.unified-app .feed-video-shell .feed-video-controls [data-feed-sound]{display:grid;place-items:center;width:32px;height:32px;min-width:0;min-height:0;padding:0;border-radius:50%;border:0;background:rgba(0,0,0,.55);color:#fff;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
body.unified-app .feed-video-shell .feed-video-controls [data-feed-sound] svg{width:18px;height:18px}
body.unified-app .feed-video-shell .feed-video-controls [data-feed-sound]::after{content:"";position:absolute;inset:-8px;border-radius:50%}
body.unified-app .feed-video-shell .feed-video-controls [data-feed-expand]{position:absolute;right:0;bottom:calc(100% + 8px);width:32px;height:32px;min-width:0;min-height:0;padding:0;margin:0;border-radius:50%;border:0;background:rgba(0,0,0,.4);color:#fff;font-size:.85rem;line-height:1;box-shadow:none}
body.unified-app .feed-video-shell .feed-video-seek{left:0!important;right:0!important;bottom:0!important;width:100%!important;height:4px!important;margin:0;opacity:.85}
body.unified-app .feed-video-shell.is-user-paused::after{content:"";position:absolute;z-index:2;left:50%;top:50%;width:56px;height:56px;margin:-28px 0 0 -28px;border-radius:50%;pointer-events:none;background:rgba(0,0,0,.5) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5v14l11-7z' fill='white'/%3E%3C/svg%3E") 55% 50%/26px no-repeat}
body.unified-app .feed-video-shell .feed-video-controls [data-feed-expand]{display:grid;place-items:center}
body.unified-app .feed-video-shell .feed-video-controls [data-feed-expand] svg{width:16px;height:16px}
body.unified-app .feed-video-shell .feed-video-seek::-webkit-slider-thumb{width:10px;height:10px}
/* Post header: time · location on one line, no globe; owner-only Maps link on the region name */
body.unified-app .lite-post-by>small.post-meta-line{display:block;line-height:1.4;overflow-wrap:anywhere}
body.unified-app .post-meta-line .post-region{display:inline!important;margin:0!important;color:inherit!important;font-size:inherit!important}
body.unified-app .post-meta-line a.post-region.is-owner-link{color:var(--fx-teal)!important;text-decoration:none;font-weight:600}
body.unified-app .post-meta-line a.post-region.is-owner-link:hover{text-decoration:underline}
body.unified-app .lite-menu-popup button[aria-pressed=true] .lite-icon{fill:currentColor}
/* Last seen, right after "Offline" */
body.unified-app .user-presence .presence-last-seen{color:var(--fx-muted);font-weight:400}
/* Follow sits right after the author's name */
body.unified-app .feed-author-row .feed-follow button{white-space:nowrap}
/* Comments, Facebook Lite style: bubble (name + text), then "1 jam  Balas" with the like at the far right */
body.unified-app .lite-comment{display:flex;gap:8px;margin:10px 0;align-items:flex-start}
body.unified-app .lite-comment>a{flex:none}
body.unified-app .lite-comment>.lite-comment-main{flex:1;min-width:0;background:transparent!important;padding:0!important;border-radius:0!important}
body.unified-app .lite-comment-bubble{display:inline-block;max-width:100%;background:#f0f2f5;border-radius:18px;padding:7px 12px}
body.unified-app .lite-comment-bubble a{color:inherit;text-decoration:none}
body.unified-app .lite-comment-bubble strong{display:block;font-size:.8rem;line-height:1.3}
body.unified-app .lite-comment-bubble p{margin:2px 0 0!important;font-size:.84rem;line-height:1.35;overflow-wrap:anywhere}
body.unified-app .lite-comment-meta{display:flex;align-items:center;gap:14px;padding:3px 12px 0;font-size:.72rem;color:var(--fx-muted)}
body.unified-app .lite-comment-meta>button{background:none!important;border:0!important;padding:0!important;min-height:0!important;font:inherit;font-weight:700!important;color:var(--fx-muted)!important;cursor:pointer;box-shadow:none!important}
body.unified-app .lite-comment-like{margin-left:auto;display:flex;align-items:center}
body.unified-app .lite-comment-like button,body.unified-app span.lite-comment-like{display:flex;align-items:center;gap:4px;background:none!important;border:0!important;padding:2px 0!important;min-height:0!important;color:var(--fx-muted)!important;font:inherit;font-weight:600;box-shadow:none!important;cursor:pointer}
body.unified-app .lite-comment-like .lite-icon{width:16px;height:16px}
body.unified-app .lite-comment-like button[aria-pressed=true]{color:var(--fx-teal)!important}
body.unified-app .lite-comment-like button[aria-pressed=true] .lite-icon{fill:currentColor}
/* Bottom sheet */
body.comment-sheet-open{overflow:hidden}
.comment-sheet{position:fixed;inset:0;width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:0;border:0;background:transparent;overflow:hidden}
.comment-sheet::backdrop{background:rgba(0,0,0,0);transition:background .22s}
.comment-sheet.is-open::backdrop{background:rgba(0,0,0,.45)}
.comment-sheet-panel{position:absolute;left:0;right:0;bottom:0;margin:0 auto;max-width:680px;height:88vh;height:88dvh;display:flex;flex-direction:column;background:#fff;border-radius:16px 16px 0 0;box-shadow:0 -6px 30px rgba(0,0,0,.2);transform:translateY(100%);transition:transform .22s ease-out}
.comment-sheet.is-open .comment-sheet-panel{transform:translateY(0)}
.comment-sheet-head{position:relative;display:flex;align-items:center;justify-content:center;padding:14px 48px 10px;border-bottom:1px solid #e4e6ea;touch-action:none}
.comment-sheet-grip{position:absolute;top:6px;left:50%;width:40px;height:4px;margin-left:-20px;border-radius:4px;background:#ccd0d5}
.comment-sheet-head strong{font-size:.95rem}
.comment-sheet-close{position:absolute;right:8px;top:50%;transform:translateY(-40%);width:36px;height:36px;border:0;border-radius:50%;background:transparent;font-size:1rem;color:#65676b;cursor:pointer}
.comment-sheet-body{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:0 12px;-webkit-overflow-scrolling:touch}
.comment-sheet-body .lite-comments{border:0!important;padding:4px 0 0!important;min-height:100%;display:flex;flex-direction:column}
.comment-sheet-body .lite-comment-form{position:sticky;bottom:0;margin-top:auto;background:#fff;padding:10px 0 calc(10px + env(safe-area-inset-bottom));border-top:1px solid #e4e6ea}
.comment-sheet-body .lite-comments>p{margin-top:auto;padding:10px 0 calc(10px + env(safe-area-inset-bottom))}
.comment-sheet-body .lite-comments>p.lite-comments-empty{margin:auto 0;text-align:center;color:#65676b}
.comment-sheet-loading{padding:24px 0;text-align:center;color:#65676b;font-size:.85rem}
@media(prefers-reduced-motion:reduce){.comment-sheet-panel,.comment-sheet::backdrop{transition:none}}
/* Sheet geometry is set from JS (fixed top, bottom follows the keyboard) */
.comment-sheet-panel{bottom:auto;top:12vh;height:88vh;transition:transform .22s ease-out}
/* Comment bar, Facebook Lite style */
body.unified-app .fb-composer{display:block!important;gap:0!important}
.fb-composer .fbc-row{display:flex;align-items:flex-end;gap:6px}
.fb-composer .fbc-field{flex:1;min-width:0;display:flex;align-items:flex-end;background:#f0f2f5;border-radius:20px;padding:0 4px 0 14px}
.fb-composer textarea[data-fbc-text]{flex:1;min-width:0;border:0!important;outline:0;background:transparent!important;box-shadow:none!important;resize:none;padding:9px 0!important;margin:0;font:inherit;font-size:.9rem;line-height:1.35;min-height:38px;max-height:120px;color:inherit}
.fb-composer .fbc-tools{display:flex;align-items:center;flex:none}
.fb-composer .fbc-tools button,.fb-composer .fbc-send{display:grid;place-items:center;width:36px;height:38px;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;color:#65676b!important;cursor:pointer;min-height:0!important;border-radius:50%!important}
.fb-composer .fbc-tools svg,.fb-composer .fbc-send svg{width:22px;height:22px}
.fb-composer .fbc-icon-keyboard{display:none}
.fb-composer.is-panel-open .fbc-icon-emoji{display:none}
.fb-composer.is-panel-open .fbc-icon-keyboard{display:block}
.fb-composer.is-panel-open [data-fbc-toggle]{color:var(--fx-teal,#0a7f82)!important}
.fb-composer .fbc-send{width:40px;color:var(--fx-teal,#0a7f82)!important}
.fb-composer .fbc-send:disabled{color:#bcc0c4!important;cursor:default}
.fb-composer .fbc-preview{position:relative;display:inline-block;margin:0 0 8px 0}
.fb-composer .fbc-preview[hidden]{display:none}
.fb-composer .fbc-preview img{display:block;max-height:110px;max-width:160px;border-radius:12px;object-fit:cover}
.fb-composer .fbc-preview button{position:absolute;top:4px;right:4px;width:24px;height:24px;border-radius:50%;border:0;background:rgba(0,0,0,.6);color:#fff;font-size:.7rem;line-height:1;cursor:pointer;padding:0}
.fb-composer .fbc-panel{margin-top:8px;border-top:1px solid #e4e6ea}
.fb-composer .fbc-panel[hidden]{display:none}
.fb-composer .fbc-tabs{display:flex;gap:4px;padding:6px 0}
.fb-composer .fbc-tabs button{border:0;background:transparent;padding:6px 14px;border-radius:999px;font-weight:700;font-size:.8rem;color:#65676b;cursor:pointer}
.fb-composer .fbc-tabs button[aria-selected=true]{background:#e7f3f2;color:var(--fx-teal,#0a7f82)}
.fb-composer .fbc-grid{display:grid;height:220px;overflow-y:auto;overscroll-behavior:contain;align-content:start}
.fb-composer .fbc-grid[hidden]{display:none}
.fb-composer .fbc-emoji{grid-template-columns:repeat(8,1fr)}
.fb-composer .fbc-emoji button{border:0;background:transparent;font-size:1.5rem;line-height:1;padding:7px 0;cursor:pointer;border-radius:8px}
.fb-composer .fbc-stickers{grid-template-columns:repeat(4,1fr);gap:6px}
.fb-composer .fbc-stickers button{border:0;background:transparent;font-size:2.8rem;line-height:1;padding:8px 0;cursor:pointer;border-radius:12px}
.fb-composer :is(.fbc-emoji,.fbc-stickers) button:active{background:#f0f2f5;transform:scale(.92)}
/* Photo and sticker inside a comment */
body.unified-app .lite-comment-name{display:block;padding:0 12px 2px;color:inherit;text-decoration:none;font-size:.8rem}
body.unified-app .lite-comment-image{display:block;margin-top:4px;max-width:220px}
body.unified-app .lite-comment-image img{display:block;width:100%;max-height:260px;object-fit:cover;border-radius:14px}
body.unified-app .lite-comment-sticker{display:block;font-size:4.2rem;line-height:1.1;padding:0 6px}
body.unified-app .fb-composer :is(.fbc-tabs,.fbc-grid) button{background:transparent!important;box-shadow:none!important;border:0!important;color:#65676b!important;min-height:0!important;width:auto!important;margin:0!important;text-transform:none!important;letter-spacing:0!important}
body.unified-app .fb-composer :is(.fbc-tabs,.fbc-grid,.fbc-tools,.fbc-row) button::before,body.unified-app .fb-composer :is(.fbc-tabs,.fbc-grid,.fbc-tools,.fbc-row) button::after{content:none!important;display:none!important}
body.unified-app .fb-composer .fbc-tabs button{padding:6px 14px!important;border-radius:999px!important;font-size:.8rem!important}
body.unified-app .fb-composer .fbc-tabs button[aria-selected=true]{background:#e7f3f2!important;color:var(--fx-teal,#0a7f82)!important}
body.unified-app .fb-composer .fbc-emoji button{padding:7px 0!important;font-size:1.5rem!important;border-radius:8px!important;color:inherit!important}
body.unified-app .fb-composer .fbc-stickers button{padding:8px 0!important;font-size:2.8rem!important;border-radius:12px!important;color:inherit!important}
body.unified-app .fb-composer :is(.fbc-emoji,.fbc-stickers) button:active{background:#f0f2f5!important}
/* Composer: tag friends */
body.unified-app .composer-tools{display:flex;align-items:center;gap:4px}
body.unified-app .composer-tag-toggle.is-active{color:var(--fx-teal)!important;background:#e7f3f2!important}
body.unified-app .composer-tags{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:6px 0 2px;font-size:.78rem;color:var(--fx-muted)}
body.unified-app .composer-tags[hidden]{display:none}
body.unified-app .composer-tags button{display:inline-flex;align-items:center;gap:4px;padding:3px 10px!important;min-height:0!important;border-radius:999px!important;border:0!important;background:#e7f3f2!important;color:var(--fx-teal)!important;font-size:.76rem!important;font-weight:700!important;box-shadow:none!important;cursor:pointer}
body.unified-app .composer-tag-panel{margin:8px 0;border:1px solid var(--fx-line);border-radius:14px;background:#fff;overflow:hidden}
body.unified-app .composer-tag-panel[hidden]{display:none}
body.unified-app .composer-tag-head{display:flex;align-items:center;justify-content:space-between;padding:8px 12px;border-bottom:1px solid var(--fx-line);font-size:.85rem}
body.unified-app .composer-tag-head button{border:0!important;background:none!important;box-shadow:none!important;padding:4px 6px!important;min-height:0!important;color:var(--fx-muted)!important;cursor:pointer}
body.unified-app .composer-tag-search{display:block;width:calc(100% - 20px);margin:8px 10px;padding:8px 12px!important;border:0!important;border-radius:999px!important;background:#f0f2f5!important;resize:none;font:inherit;font-size:.85rem;min-height:0!important;height:36px;line-height:20px;overflow:hidden;box-shadow:none!important}
body.unified-app .composer-tag-list{max-height:240px;overflow-y:auto;overscroll-behavior:contain;padding:0 4px 6px}
body.unified-app .composer-tag-list button{display:flex;align-items:center;gap:10px;width:100%;padding:7px 8px!important;min-height:0!important;border:0!important;border-radius:10px!important;background:transparent!important;box-shadow:none!important;color:inherit!important;font-size:.86rem!important;font-weight:600!important;text-align:left;cursor:pointer}
body.unified-app .composer-tag-list button[hidden]{display:none}
body.unified-app .composer-tag-list button:hover{background:#f0f2f5!important}
body.unified-app .composer-tag-list .avatar{width:34px!important;height:34px!important;flex:none;border-radius:50%!important}
body.unified-app .composer-tag-list button span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.unified-app .composer-tag-list button i{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;border:2px solid #ccd0d5;color:transparent;font-style:normal;font-size:.75rem;flex:none}
body.unified-app .composer-tag-list button[aria-selected=true] i{background:var(--fx-teal);border-color:var(--fx-teal);color:#fff}
body.unified-app .composer-tag-empty{padding:12px;margin:0;font-size:.82rem;color:var(--fx-muted)}
/* Post header: "bersama ..." */
body.unified-app .post-tagged{font-size:.74rem;color:var(--fx-muted);line-height:1.35}
body.unified-app .post-tagged a{color:var(--fx-ink-2,#1c1e21);font-weight:700;text-decoration:none}
/* Composer: "+" tile after the media previews */
body.unified-app .composer-previews .composer-add-more{position:static!important;display:grid;place-items:center;width:auto!important;height:auto!important;min-height:0!important;aspect-ratio:1;margin:0;padding:0!important;border:2px dashed #b8c4c7!important;border-radius:12px!important;background:#f5f8f8!important;color:var(--fx-teal,#0a7f82)!important;box-shadow:none!important;cursor:pointer}
body.unified-app .composer-previews .composer-add-more span{font-size:2rem;font-weight:300;line-height:1}
body.unified-app .composer-previews .composer-add-more:hover{background:#e7f3f2!important}
body.unified-app .composer-previews .composer-add-more:disabled{opacity:.5;cursor:default}
/* Composer: compact media thumbnails (64px) so previews don't take over the form */
body.unified-app .composer-previews{display:flex!important;flex-wrap:wrap;gap:6px!important;margin-top:8px!important;grid-template-columns:none!important}
body.unified-app .composer-previews[hidden]{display:none!important}
body.unified-app .composer-previews>figure,body.unified-app .composer-previews>.composer-add-more{flex:0 0 64px;width:64px!important;height:64px!important;aspect-ratio:auto!important;border-radius:10px!important}
body.unified-app .composer-previews figure button{top:3px!important;right:3px!important;width:20px!important;height:20px!important;min-height:0!important;padding:0!important;font-size:.8rem!important;line-height:1!important;border-width:0!important;background:rgba(0,0,0,.6)!important}
body.unified-app .composer-previews figure .composer-replace{top:auto!important;bottom:3px!important;right:3px!important;width:auto!important;height:18px!important;padding:0 5px!important;border-radius:6px!important;font-size:.55rem!important}
body.unified-app .composer-previews figcaption{padding:2px 4px!important;font-size:.5rem!important}
body.unified-app .composer-previews .composer-add-more span{font-size:1.5rem!important}
/* Inbox, compact: search on top, then category tabs, then one row with sub-tabs + "Tandai dibaca" */
body.unified-app .inbox-compact{padding-top:10px!important}
body.unified-app .inbox-compact .inbox-search{position:relative;margin:0 0 8px!important}
body.unified-app .inbox-compact .inbox-search input{min-height:40px!important;padding:8px 14px 8px 40px!important;border-radius:999px!important;background:var(--fx-line-2)!important;border:0!important;box-shadow:none!important;font-size:.9rem}
body.unified-app .inbox-compact .inbox-search-icon{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--fx-muted);display:flex;pointer-events:none}
body.unified-app .inbox-compact .inbox-search-icon .lite-icon{width:18px;height:18px}
body.unified-app .inbox-compact .message-tabs{margin:0 0 6px!important;width:100%}
body.unified-app .inbox-compact .message-tabs>a{flex:1 1 0;justify-content:center}
body.unified-app .inbox-compact .inbox-subbar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 8px}
body.unified-app .inbox-compact .inbox-subbar .feed-tabs{margin:0!important;padding:2px!important;min-width:0}
body.unified-app .inbox-compact .inbox-subbar .feed-tabs>a{min-height:28px!important;padding:3px 10px!important;font-size:.76rem!important}
body.unified-app .inbox-compact .inbox-read-all-form{display:block!important;margin:0!important;flex:none}
body.unified-app .inbox-compact .inbox-read-all{border:0!important;background:none!important;box-shadow:none!important;padding:4px 2px!important;min-height:0!important;color:var(--fx-teal)!important;font-size:.76rem!important;font-weight:700!important;cursor:pointer;white-space:nowrap}
body.unified-app .inbox-compact .inbox-hint{margin:0;font-size:.78rem;color:var(--fx-muted)}
body.unified-app .inbox-compact .notification-list{margin:0 0 8px!important;padding:0!important}
body.unified-app .inbox-compact .notification-item button{padding:8px 10px!important;gap:10px!important;min-height:0!important}
body.unified-app .inbox-compact .notification-item .avatar{width:36px!important;height:36px!important}
body.unified-app .inbox-compact .notification-item span{font-size:.82rem!important;line-height:1.3}
body.unified-app .inbox-compact .empty{padding:18px 14px!important}
body.unified-app .thread-row{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
/* Press-and-hold menu on a conversation */
.thread-menu{position:fixed;inset:0;z-index:6000;display:flex;align-items:flex-end;justify-content:center;background:rgba(0,0,0,0);transition:background .18s}
.thread-menu.is-open{background:rgba(0,0,0,.45)}
.thread-menu-box{width:100%;max-width:520px;background:#fff;border-radius:16px 16px 0 0;padding:14px 12px calc(12px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:4px;transform:translateY(100%);transition:transform .18s ease-out}
.thread-menu.is-open .thread-menu-box{transform:none}
.thread-menu-box strong{display:block;text-align:center;font-size:.92rem;padding:2px 0 8px;color:#10343e}
.thread-menu-text{margin:0 4px 8px;font-size:.88rem;color:#34505c;text-align:center;line-height:1.4}
.thread-menu-box button{width:100%;min-height:46px;border:0;border-radius:12px;background:#f0f2f5;color:#10343e;font:inherit;font-size:.92rem;font-weight:600;cursor:pointer}
.thread-menu-box button.thread-menu-danger{color:#d93636}
.thread-menu-box button:disabled{opacity:.6}
@media(prefers-reduced-motion:reduce){.thread-menu,.thread-menu-box{transition:none}}
/* Android app: no link drag / callout / text selection when holding buttons and links */
body.in-app :is(a,button,summary,label,img,video,[role=button],nav){-webkit-user-drag:none;user-drag:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
body.in-app{-webkit-tap-highlight-color:transparent}
body.in-app :is(input,textarea,select,[contenteditable]){-webkit-user-select:text;user-select:text;-webkit-touch-callout:default}
/* Inbox "Transaksi" tab: compact group headings and empty lines */
body.unified-app .inbox-compact .inbox-group{margin:12px 2px 6px!important;font-size:.8rem!important;font-weight:800;letter-spacing:.02em;text-transform:uppercase;color:var(--fx-muted)}
body.unified-app .inbox-compact .inbox-none{margin:0;padding:12px 14px;font-size:.84rem;color:var(--fx-muted)}
body.unified-app .inbox-compact .list-grid:has(>.inbox-none:only-child){display:block}
body.unified-app .inbox-compact a.inbox-read-all{text-decoration:none}
body.unified-app .inbox-compact .notification-list>p:only-child{margin:0;padding:12px 14px!important;font-size:.84rem;text-align:left;color:var(--fx-muted)}
/* ===== Chat screen (2026-09-29): header with ⋯, receipts, composer like feed comments ===== */
body.unified-app .chat-heading{display:flex!important;align-items:center;gap:10px;padding:8px 4px!important;margin:0 0 6px!important}
body.unified-app .chat-heading>a{flex:none;display:flex}
body.unified-app .chat-heading-name{flex:1;min-width:0}
body.unified-app .chat-heading-name h1{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .chat-menu-button{flex:none;display:grid;place-items:center;width:40px;height:40px;min-height:0!important;padding:0!important;border:0!important;border-radius:50%!important;background:transparent!important;box-shadow:none!important;color:var(--fx-ink-2)!important;cursor:pointer}
body.unified-app .chat-menu-button:active{background:var(--fx-line-2)!important}
body.unified-app .chat-menu-button .lite-icon{width:22px;height:22px;stroke-width:3}
/* message bubbles: press and hold for options, no inline menu */
body.unified-app .message-list>.message{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;cursor:default}
body.unified-app .message-list>.message:focus-visible{outline:2px solid var(--fx-teal-2);outline-offset:2px}
body.unified-app .message-list>.message.is-deleted>p{font-style:italic;opacity:.75}
body.unified-app .message-list>.message>small{display:flex;align-items:center;gap:4px;justify-content:flex-end;margin-left:auto}
body.unified-app .message-list>.message .chat-receipt{display:inline-flex;margin:0!important;color:rgba(255,255,255,.72)}
body.unified-app .message-list>.message .chat-receipt svg{width:16px;height:11px}
body.unified-app .message-list>.message .chat-receipt.is-read{color:#7fe3ff}
body.unified-app .message-list>.message .message-image{display:block;order:0;flex-basis:100%;margin:-3px -9px 6px;border-radius:14px;overflow:hidden;max-width:240px}
body.unified-app .message-list>.message .message-image img{display:block;width:100%;max-height:300px;object-fit:cover}
body.unified-app .message-list>.message .message-sticker{display:block;order:0;font-size:3.8rem;line-height:1.1}
body.unified-app .message-list>.message.is-sticker{background:transparent!important;border:0!important;box-shadow:none!important;padding:0 4px!important}
body.unified-app .message-list>.message.mine.is-sticker>small,body.unified-app .message-list>.message.mine.is-sticker .chat-receipt{color:var(--fx-muted)}
body.unified-app .message-list>.message.mine.is-sticker .chat-receipt.is-read{color:var(--fx-teal)}
/* composer: the shared fb-composer bar, pinned above the bottom menu */
body.unified-app .chat-compose.fb-composer{display:block!important;background:var(--fx-bg,#f2f5f7);padding:8px 0 6px!important;margin:0!important;border-top:1px solid var(--fx-line)}
body.unified-app .chat-compose.fb-composer .fbc-field{background:var(--fx-surface,#fff)!important;border:1px solid var(--fx-line)}
body.unified-app .chat-compose.fb-composer textarea{min-height:38px!important;max-height:120px;padding:9px 0!important;border-radius:0!important;box-shadow:none!important}
/* Typing on a phone: the bottom menu steps aside so it never covers the field */
body.is-typing.chat-screen .app-bottom-navigation{display:none!important}
body.is-typing .chat-compose{bottom:0!important}
body.is-typing .lite-composer{scroll-margin-bottom:16px}
body.chat-screen .chat-page{min-height:calc(100dvh - 72px - var(--fx-dock-h) - 30px)}
body.chat-screen.is-typing .chat-page{min-height:calc(100dvh - 72px)}
body.unified-app.chat-screen .chat-page>.chat-compose.fb-composer{margin-top:auto!important}
body.unified-app .chat-compose.fb-composer textarea{background:transparent!important;border:0!important;outline:0}
/* Inbox list: unread = bold name + bold last message + count bubble (no separate notice cards) */
body.unified-app .thread-row.is-unread h3{font-weight:800!important;color:var(--fx-ink)!important}
body.unified-app .thread-row.is-unread p{font-weight:700!important;color:var(--fx-ink)!important}
body.unified-app .thread-row:not(.is-unread) p{font-weight:400!important;color:var(--fx-muted)!important}
body.unified-app .thread-unread{min-width:22px;height:22px;font-size:.72rem!important;font-weight:800!important}
/* Chat header: name + online status on one line, "Sedang mengetik…" small underneath */
body.unified-app .chat-title-row{display:flex;align-items:baseline;gap:8px;min-width:0}
body.unified-app .chat-title-row h1{flex:0 1 auto;min-width:0;margin:0!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .chat-title-row .user-presence{flex:0 1 auto;min-width:0;display:inline-flex!important;align-items:center;gap:4px;margin:0!important;font-size:.7rem!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .chat-typing{display:block;margin-top:1px;font-size:.7rem;line-height:1.2;color:var(--fx-teal);font-style:italic}
body.unified-app .chat-typing[hidden]{display:none}
/* ===== Chat bubbles, WhatsApp style ===== */
body.unified-app.chat-screen{--wa-bg:#efeae2;--wa-out:#d9fdd3;--wa-in:#ffffff;--wa-ink:#111b21;--wa-meta:#667781;--wa-tick:#8696a0;--wa-read:#53bdeb;background:var(--wa-bg)!important}
body.unified-app.chat-screen .chat-page{background:var(--wa-bg)}
body.unified-app.chat-screen .chat-heading{background:rgba(240,242,245,.96)!important}
body.unified-app.chat-screen .message-list{display:flex!important;flex-direction:column;gap:2px!important;padding:8px 2px 12px!important}
body.unified-app.chat-screen .message-list>.message{display:block!important;position:relative;align-self:flex-start;max-width:min(80%,520px);min-width:0;padding:6px 7px 8px 9px!important;margin:0!important;border:0!important;border-radius:7.5px!important;background:var(--wa-in)!important;color:var(--wa-ink)!important;box-shadow:0 1px .5px rgba(11,20,26,.13)!important}
body.unified-app.chat-screen .message-list>.message.mine{align-self:flex-end;background:var(--wa-out)!important}
/* a new run of messages (other sender) gets more space and the little tail */
body.unified-app.chat-screen .message-list>.message:first-child,
body.unified-app.chat-screen .message-list>.message.mine+.message:not(.mine),
body.unified-app.chat-screen .message-list>.message:not(.mine)+.message.mine{margin-top:10px!important}
body.unified-app.chat-screen .message-list>.message:not(.mine):first-child,
body.unified-app.chat-screen .message-list>.message.mine+.message:not(.mine){border-top-left-radius:0!important}
body.unified-app.chat-screen .message-list>.message.mine:first-child,
body.unified-app.chat-screen .message-list>.message:not(.mine)+.message.mine{border-top-right-radius:0!important}
body.unified-app.chat-screen .message-list>.message:not(.mine):first-child::before,
body.unified-app.chat-screen .message-list>.message.mine+.message:not(.mine)::before{content:"";position:absolute;top:0;left:-8px;width:8px;height:13px;background:var(--wa-in);clip-path:polygon(0 0,100% 0,100% 100%);filter:drop-shadow(0 1px .5px rgba(11,20,26,.13))}
body.unified-app.chat-screen .message-list>.message.mine:first-child::before,
body.unified-app.chat-screen .message-list>.message:not(.mine)+.message.mine::before{content:"";position:absolute;top:0;right:-8px;width:8px;height:13px;background:var(--wa-out);clip-path:polygon(0 0,100% 0,0 100%)}
body.unified-app.chat-screen .message-list>.message>p{display:inline;margin:0!important;font-size:.9rem!important;line-height:1.35!important;color:var(--wa-ink)!important;white-space:pre-wrap;overflow-wrap:anywhere}
/* room at the end of the last line for the time + ticks, which sit bottom-right inside the bubble */
body.unified-app.chat-screen .message-list>.message>p::after{content:"";display:inline-block;width:52px;height:1px}
body.unified-app.chat-screen .message-list>.message.mine>p::after{width:72px}
body.unified-app.chat-screen .message-list>.message>small{position:absolute;right:7px;bottom:4px;display:inline-flex!important;align-items:center;gap:3px;margin:0!important;font-size:.66rem!important;line-height:1;color:var(--wa-meta)!important}
body.unified-app.chat-screen .message-list>.message .chat-receipt{color:var(--wa-tick)!important}
body.unified-app.chat-screen .message-list>.message .chat-receipt.is-read{color:var(--wa-read)!important}
body.unified-app.chat-screen .message-list>.message .chat-receipt svg{width:17px;height:11px}
body.unified-app.chat-screen .message-list>.message.is-deleted>p{font-style:italic;color:var(--wa-meta)!important;opacity:1}
body.unified-app.chat-screen .message-list>.message.is-deleted>p::before{content:"⊘ ";font-style:normal}
/* photo bubble: thin frame, time over the picture */
body.unified-app.chat-screen .message-list>.message:has(.message-image){padding:3px!important}
body.unified-app.chat-screen .message-list>.message .message-image{display:block;margin:0 0 4px!important;border-radius:6px!important;overflow:hidden;max-width:260px}
body.unified-app.chat-screen .message-list>.message:has(.message-image)>p{display:block;padding:0 6px 4px}
body.unified-app.chat-screen .message-list>.message:has(.message-image):not(:has(p))>small{color:#fff!important;text-shadow:0 1px 2px rgba(0,0,0,.6)}
/* sticker: no bubble, no tail */
body.unified-app.chat-screen .message-list>.message.is-sticker{background:transparent!important;box-shadow:none!important;padding:0 0 16px!important}
body.unified-app.chat-screen .message-list>.message.is-sticker::before{display:none}
body.unified-app.chat-screen .message-list>.message.is-sticker>small{background:rgba(255,255,255,.85);padding:2px 5px;border-radius:8px;bottom:0}
/* Chat wallpaper: sunlit sea (assets/chat-ocean.svg), fixed behind the conversation */
body.unified-app.chat-screen{background:#1f9cc0!important}
body.unified-app.chat-screen::before{content:"";position:fixed;inset:0;z-index:-1;background:#1f9cc0 url("/assets/chat-ocean.svg?v=1") center top/cover no-repeat;pointer-events:none}
body.unified-app.chat-screen .chat-page{background:transparent!important}
body.unified-app.chat-screen .chat-heading{background:rgba(255,255,255,.82)!important;backdrop-filter:blur(12px) saturate(1.2);-webkit-backdrop-filter:blur(12px) saturate(1.2);border-radius:14px;box-shadow:0 2px 10px rgba(6,42,57,.12)}
body.unified-app.chat-screen .message-list>.message{box-shadow:0 1px 2px rgba(6,42,57,.25)!important}
body.unified-app.chat-screen [data-chat-status]:not(:empty){display:inline-block;align-self:center;background:rgba(255,255,255,.85);border-radius:8px;padding:3px 10px;font-size:.75rem}
body.unified-app.chat-screen [data-chat-latest],body.unified-app.chat-screen [data-chat-older]{box-shadow:0 2px 8px rgba(6,42,57,.2)}
/* Chat header blends into the sea: no white card, readable text with a soft light halo */
body.unified-app.chat-screen .chat-heading{background:linear-gradient(to bottom,rgba(155,231,236,.92) 0%,rgba(155,231,236,.55) 70%,rgba(155,231,236,0) 100%)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;box-shadow:none!important;border:0!important;border-radius:0!important;padding:8px 4px 14px!important}
body.unified-app.chat-screen .chat-heading h1{color:#062a39!important;text-shadow:0 1px 0 rgba(255,255,255,.65),0 0 12px rgba(255,255,255,.55)}
body.unified-app.chat-screen .chat-title-row .user-presence{color:#0b3a4c!important;font-weight:600!important;text-shadow:0 0 8px rgba(255,255,255,.7)}
body.unified-app.chat-screen .chat-title-row .user-presence[data-online="1"]{color:#05603a!important}
body.unified-app.chat-screen .chat-typing{color:#064e5c;font-weight:600;text-shadow:0 0 8px rgba(255,255,255,.7)}
body.unified-app.chat-screen .chat-menu-button{color:#062a39!important;background:rgba(255,255,255,.35)!important}
body.unified-app.chat-screen .chat-heading .avatar{box-shadow:0 0 0 2px rgba(255,255,255,.85),0 2px 6px rgba(6,42,57,.25)!important}
/* silhouette shown instead of the photo while blocked */
body.unified-app .avatar.avatar-blocked{display:grid!important;place-items:end center;overflow:hidden;background:#c9d3d8!important;color:#fff!important}
body.unified-app .avatar.avatar-blocked svg{width:78%;height:78%}
body.unified-app.chat-screen .chat-heading{position:relative!important;top:auto!important;background:transparent!important;padding:6px 2px 8px!important}
/* Blocked conversation: a short notice instead of the message box */
body.unified-app .chat-blocked{position:sticky;bottom:calc(var(--fx-dock-h) + 20px + env(safe-area-inset-bottom));margin-top:auto;display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 16px;border-radius:14px;background:rgba(255,255,255,.9);box-shadow:0 2px 10px rgba(6,42,57,.18);text-align:center}
body.unified-app .chat-blocked p{margin:0;font-size:.86rem;color:#34505c}
body.unified-app .chat-blocked .chat-unblock{border:0!important;background:none!important;box-shadow:none!important;min-height:0!important;padding:4px 10px!important;color:var(--fx-teal)!important;font-weight:800!important;font-size:.88rem!important;cursor:pointer}
/* ===== Chat as an app screen: fixed panel sized by inbox.js, only the messages scroll ===== */
html:has(body.chat-screen),body.unified-app.chat-screen{overflow:hidden!important;overscroll-behavior:none;height:100%}
body.unified-app.chat-screen .chat-page{position:fixed!important;left:0;right:0;top:72px;height:calc(100dvh - 72px);z-index:5;max-width:760px;margin:0 auto!important;padding:0 12px!important;display:flex!important;flex-direction:column;min-height:0!important;box-sizing:border-box}
body.unified-app.chat-screen .chat-heading{flex:none}
body.unified-app.chat-screen .chat-body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column;padding-bottom:4px;scrollbar-width:none}
body.unified-app.chat-screen .chat-body::-webkit-scrollbar{display:none}
body.unified-app.chat-screen .chat-body>.message-list{flex:none}
body.unified-app.chat-screen .chat-body>[data-chat-older],body.unified-app.chat-screen .chat-body>[data-chat-latest]{align-self:center;flex:none;margin:6px 0}
body.unified-app.chat-screen .chat-body>[data-chat-status]{align-self:center;margin:4px 0}
body.unified-app.chat-screen .chat-body>[data-chat-status]:empty{display:none}
body.unified-app.chat-screen .chat-page>.chat-compose.fb-composer,body.unified-app.chat-screen .chat-page>.chat-blocked{position:static!important;flex:none;margin:6px 0 4px!important;bottom:auto!important}
/* while typing, the site's top bar steps aside too so the chat keeps as much room as possible */
body.unified-app.chat-screen.is-typing .app-navigation{display:none!important}
/* Top bar (app name, notifications, search, side menu) only on the community pages. It stays in the
   markup because presence and notification scripts read the account data on the bell. */
/* outside the community only the brand row hides; the tab bar stays at the top */
body.unified-app.no-topbar .app-navigation .lite-header{display:none!important}
body.unified-app.no-topbar>main,body.unified-app.no-topbar .page-main{padding-top:env(safe-area-inset-top)}
body.unified-app.no-topbar.chat-screen .chat-page{top:0;height:calc(100dvh - var(--fx-dock-h) - 30px)}
/* Community and inbox backdrop (body.scenic-bg) */
body.unified-app.scenic-bg{background:#0b3a4c!important}
/* Community and inbox: no picture, just Fishunter's sea colours (deep sea navy -> brand teal) */
body.unified-app.scenic-bg::before{content:"";position:fixed;inset:0;z-index:-1;background:radial-gradient(120% 60% at 85% 0%,rgba(60,199,176,.28) 0%,rgba(60,199,176,0) 60%),linear-gradient(180deg,#062a39 0%,#0b3a4c 22%,#0d5a63 48%,#0b8f8a 78%,#12b3a6 100%);pointer-events:none}
body.unified-app.scenic-bg :is(.community-lite,.lite-frame,.lite-main,.lite-feed-col,.inbox-page,main){background:transparent!important}
/* labels that sit directly on the sunset wallpaper: white with a soft dark shadow */
body.unified-app.scenic-bg :is(.feed-section-heading,.feed-section-heading *,.feed-eyebrow,.lite-section-title,.lite-section-title *,.inbox-subbar .inbox-hint,.inbox-subbar .inbox-read-all,.inbox-compact .inbox-group,.inbox-compact .inbox-none:not(.list-grid *)){color:#fff!important;text-shadow:0 1px 3px rgba(20,12,40,.55)!important}
body.unified-app.scenic-bg .feed-section-heading svg{stroke:#fff}
/* the NOAA scan is soft and JPEG-blocky when enlarged on phones: a light blur hides the blocks */
/* "↑ N postingan baru" pill when new posts arrive while reading further down */
.feed-new-pill{position:fixed;top:calc(env(safe-area-inset-top) + 78px);left:50%;transform:translateX(-50%);z-index:45;border:0;border-radius:999px;padding:8px 16px;background:var(--fx-teal,#0b8f8a);color:#fff;font:inherit;font-size:.82rem;font-weight:800;box-shadow:0 6px 18px rgba(6,42,57,.3);cursor:pointer}
.feed-new-pill[hidden]{display:none}
/* ===== Community feed edge to edge, like Facebook Lite: no side margins, square cards, thin gaps ===== */
body.unified-app.community-screen section.community-lite{padding-left:0!important;padding-right:0!important}
body.unified-app.community-screen .lite-frame{padding-left:0!important;padding-right:0!important}
body.unified-app.community-screen :is(.lite-post,.lite-composer,.lite-login-note,.lite-verify,.lite-panel,.lite-comments){border-radius:0!important;border-left:0!important;border-right:0!important;margin-left:0!important;margin-right:0!important;box-shadow:none!important}
body.unified-app.community-screen .lite-post{margin-bottom:8px!important}
body.unified-app.community-screen .lite-post .feed-video-shell,body.unified-app.community-screen .lite-post .post-gallery{border-radius:0!important;margin-left:0!important;margin-right:0!important}
body.unified-app.community-screen :is(.lite-feed-filter,.feed-tabs,.ocean-shortcuts){margin-left:0!important;margin-right:0!important;border-radius:0!important}
body.unified-app.community-screen .ocean-shortcuts{padding-left:8px!important;padding-right:8px!important}
body.unified-app.community-screen :is(.feed-section-heading,.lite-section-title){padding-left:12px!important;padding-right:12px!important}

/* ===== Main tabs at the top, under the app name (Facebook Lite style) ===== */
:root{--fx-dock-h:0px}
body.unified-app .app-navigation{position:sticky!important;top:0;z-index:40}
body.unified-app .app-navigation>.app-bottom-navigation{position:static!important;inset:auto!important;left:auto!important;right:auto!important;bottom:auto!important;transform:none!important;width:100%!important;max-width:none!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:transparent!important}
body.unified-app .app-navigation>.app-bottom-navigation .lite-primary-tabs{display:grid!important;grid-template-columns:repeat(5,1fr);gap:0!important;max-width:680px;height:46px!important;margin:0 auto!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important}
body.unified-app .app-navigation>.app-bottom-navigation .lite-primary-tabs a{position:relative;display:flex!important;flex-direction:row!important;align-items:center;justify-content:center;min-height:46px!important;height:46px;padding:0!important;margin:0!important;border-radius:0!important;background:transparent!important;font-size:0!important;gap:0!important}
body.unified-app .app-navigation>.app-bottom-navigation .lite-primary-tabs a .lite-icon{width:24px!important;height:24px!important;transform:none!important}
body.unified-app .app-navigation>.app-bottom-navigation .lite-primary-tabs a.active::after{content:"";position:absolute;left:10%;right:10%;bottom:0;height:3px;border-radius:3px 3px 0 0;background:var(--fx-teal)}
body.unified-app .app-navigation>.app-bottom-navigation .notification-badge{top:6px!important;left:calc(50% + 6px)!important}
body.unified-app main{padding-bottom:16px}
.feed-new-pill{top:calc(env(safe-area-inset-top) + var(--app-head-h,120px) + 8px)!important}
body.unified-app .app-navigation>.app-bottom-navigation .notification-badge{font-size:10px!important;line-height:14px}
/* ===== Post "⋯" menu as a bottom sheet (Facebook Lite): always fully on screen, scrollable, big targets ===== */
body.unified-app .lite-post-menu[open]>summary::before{content:"";position:fixed;inset:0;z-index:80;background:rgba(0,0,0,.55);cursor:default}
body.unified-app .lite-post-menu[open]>.lite-menu-popup{position:fixed!important;left:0!important;right:0!important;bottom:0!important;top:auto!important;width:auto!important;max-width:680px;margin:0 auto!important;max-height:75vh;overflow-y:auto;overscroll-behavior:contain;z-index:81!important;border-radius:16px 16px 0 0!important;padding:10px 8px calc(14px + env(safe-area-inset-bottom))!important;box-shadow:0 -8px 30px rgba(0,0,0,.45)!important;animation:post-sheet-up .18s ease-out}
body.unified-app .lite-post-menu[open]>.lite-menu-popup::before{content:"";display:block;width:40px;height:4px;margin:0 auto 10px;border-radius:4px;background:#5a5c5f}
body.unified-app .lite-post-menu[open]>.lite-menu-popup :is(button,a,summary){min-height:48px!important;padding:12px 14px!important;font-size:.95rem!important;gap:14px!important}
body.unified-app .lite-post-menu[open]>.lite-menu-popup .lite-icon{width:22px!important;height:22px!important}
body.unified-app .lite-post-menu[open]>.lite-menu-popup form{margin:0}
body.unified-app .lite-post-menu[open]>.lite-menu-popup form:has(input[value=post_delete]) button{color:#ff6b6b!important}
body.unified-app .lite-post-menu[open]>.lite-menu-popup details form{padding:6px 10px 10px!important;display:grid;gap:8px}
body.unified-app .lite-post-menu[open]>.lite-menu-popup details input{min-height:42px}
@keyframes post-sheet-up{from{transform:translateY(100%)}to{transform:none}}
@media(prefers-reduced-motion:reduce){body.unified-app .lite-post-menu[open]>.lite-menu-popup{animation:none}}
/* Temukan teman: online status + estimated distance under each name */
body.unified-app .lite-person-status{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin-top:3px}
body.unified-app .lite-person-status .user-presence{font-size:.72rem!important}
body.unified-app .lite-person-status .user-presence[data-online="1"]{color:#31d07c!important;font-weight:700}
body.unified-app .lite-person-status .user-presence[data-online="1"]::before{content:"";display:inline-block;width:7px;height:7px;margin-right:5px;border-radius:50%;background:#31d07c;vertical-align:1px}
body.unified-app .lite-person-distance{font-size:.72rem;color:var(--fx-teal)!important;font-weight:700}
body.unified-app .lite-person-distance.is-unknown{color:var(--fx-muted)!important;font-weight:400}
body.unified-app .lite-people-locate{display:grid;gap:6px;margin:0 0 10px;padding:10px 12px;border-radius:12px;background:rgba(45,212,191,.08)}
body.unified-app .lite-people-locate[hidden]{display:none}
body.unified-app .lite-people-locate button{justify-self:start;display:inline-flex;align-items:center;gap:6px;border:0;border-radius:999px;padding:8px 14px;background:var(--fx-teal-2,#14b8a6);color:#04201c;font-weight:800;cursor:pointer}
body.unified-app .lite-people-locate small{font-size:.72rem;color:var(--fx-muted)}
/* Location required (Android app): full-screen gate until permission is granted / GPS is on */
html.location-gated,html.location-gated body{overflow:hidden!important}
.location-gate{position:fixed;inset:0;z-index:9000;display:grid;place-items:center;padding:24px;background:#0b141a}
.location-gate-box{display:grid;justify-items:center;gap:16px;text-align:center;max-width:320px}
.location-gate-icon{font-size:3rem;line-height:1}
.location-gate strong{font-size:1.15rem;color:#e9edef}
.location-gate button{min-width:220px;min-height:48px;border:0;border-radius:999px;background:#14b8a6;color:#04201c;font:inherit;font-weight:800;font-size:1rem;cursor:pointer}
.location-gate a{color:#2dd4bf;font-weight:700;text-decoration:none}
.location-gate a[hidden]{display:none}
.location-gate-text{margin:0;font-size:.9rem;line-height:1.5;color:#8696a0}
.feed-tab-loading{padding:24px 12px;text-align:center;color:var(--fx-muted)}
body.unified-app .composer-avatar-link{display:block;flex:none;border-radius:50%;line-height:0;-webkit-tap-highlight-color:transparent}
body.unified-app .composer-avatar-link:active{opacity:.7}
body.unified-app .composer-avatar-link:focus-visible{outline:2px solid #2d88ff;outline-offset:2px}
body.unified-app .verified-star{display:inline-block;width:.9em;height:.9em;margin-left:.28em;vertical-align:-.08em;line-height:0}
body.unified-app .verified-star svg{width:100%;height:100%;display:block}
body.unified-app .feed-author-row>.verified-star{width:15px;height:15px;margin-left:-2px;align-self:center;flex:none}
/* Compact feed: thin FB Lite style separator between posts */
body.unified-app.community-screen .lite-post{margin-bottom:4px!important}
body.unified-app .lite-post-head{padding-top:8px!important}
body.unified-app .lite-post-actions{padding:0 0 2px!important}
body.unified-app .angler-pick{display:flex;flex-direction:column;max-height:320px;overflow-y:auto;border:1px solid var(--dk-line,#202c33);border-radius:10px}
body.unified-app .angler-option{display:flex!important;align-items:center;gap:10px;padding:8px 10px;margin:0!important;cursor:pointer;border-bottom:1px solid var(--dk-line,#202c33)}
body.unified-app .angler-option[hidden]{display:none!important}
body.unified-app .angler-option:last-of-type{border-bottom:0}
body.unified-app .angler-option input{flex:none;width:18px;height:18px;margin:0;accent-color:#2d88ff}
body.unified-app .angler-option .avatar{width:36px;height:36px;flex:none;font-size:.9rem}
body.unified-app .angler-option span:not(.avatar):not(.verified-star){display:flex;flex-direction:column;min-width:0}
body.unified-app .angler-option strong{font-size:.9rem}
body.unified-app .angler-option small{font-size:.75rem;opacity:.7;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.unified-app .angler-option:has(input:checked){background:rgba(45,136,255,.14)}
body.unified-app .angler-pick>p{margin:10px}
/* Post text lines up with the author's name (right of the avatar) */
body.unified-app .lite-post>.lite-post-body.lite-post-body:not(.post-gallery):not(.feed-video-shell){margin-left:60px!important;margin-right:12px!important}
/* Action bar like FB Lite: icon, label and the count on one line (no separate stats row) */
body.unified-app .lite-post-actions :is(button,a){flex-direction:row!important;align-items:center!important;justify-content:center!important;gap:5px!important;min-height:40px!important;padding:4px 0!important;white-space:nowrap}
body.unified-app .lite-post-actions :is(button,a) span{font-size:.8rem!important}
body.unified-app .lite-post-actions .action-count{font-weight:700;font-variant-numeric:tabular-nums}
body.unified-app .lite-post-actions .action-count:empty{display:none}
body.unified-app .lite-post-actions{border-top:1px solid var(--fx-line)!important;margin-top:4px}
@media(max-width:360px){body.unified-app .lite-post-actions :is(button,a) span{font-size:.72rem!important}body.unified-app .lite-post-actions :is(button,a){gap:3px!important}}

/* Post header: 40px avatar flush with the card edge, vertically centred on name + meta, thin ring */
body.unified-app .lite-post>.lite-post-head.lite-post-head:not(.post-gallery):not(.feed-video-shell){padding:10px 0 0!important;gap:8px!important;align-items:center!important}
body.unified-app .lite-post-head .avatar{width:40px!important;height:40px!important;min-width:40px;border:0!important;box-shadow:0 0 0 1px var(--fx-line)!important;margin:0!important}
/* Circles crop around the upper middle, where faces usually are in portrait photos */
body.unified-app .avatar img,.call-avatar img{object-position:50% 30%}
/* New round badge logo: show it whole (no tile, zoom or crop) */
body.unified-app .lite-wordmark .mancing-brand-mark{width:38px!important;height:38px!important;border-radius:50%!important;background:transparent!important;border:0!important;box-shadow:none!important;overflow:visible!important;padding:0!important}
body.unified-app .mancing-brand-mark img{width:100%!important;height:100%!important;object-fit:contain!important;transform:none!important;border-radius:0!important;margin:0!important;max-width:none!important}
/* Rendering speed: posts (and long list rows) off screen are skipped for style, layout and paint until they
   come near the viewport; "auto" remembers each post's real height so scrolling stays steady. */
body.unified-app .lite-post{content-visibility:auto;contain-intrinsic-size:auto 560px}
body.unified-app :is(.thread-list>*,.lite-people-list>.lite-person,.notification-list>*){content-visibility:auto;contain-intrinsic-size:auto 76px}
/* A post whose "⋯" sheet (position:fixed) is open must not be a containment box, or the sheet would be clipped inside it */
body.unified-app .lite-post.menu-open{content-visibility:visible!important;contain:none!important}

/* Tamu mencoba alat cek laut (public/landing_pages.php guestTryBar) */
.guest-try{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:60;display:flex;align-items:center;gap:12px;justify-content:space-between;padding:12px 14px;border-radius:18px;background:#062a39;color:#fff;box-shadow:0 12px 30px rgba(0,0,0,.35);max-width:620px;margin:0 auto}
.guest-try div{display:grid;gap:2px;min-width:0}.guest-try strong{font-size:.95rem}.guest-try span{font-size:.8rem;color:#bfe3e6}
.guest-try .button{flex:0 0 auto;white-space:nowrap;background:#12b3a6;color:#fff}
body:has(.guest-try) main{padding-bottom:110px}
.auth-captain{border:1px dashed rgba(127,160,170,.6);border-radius:14px;padding:10px 14px}
.auth-captain summary{cursor:pointer;font-weight:700;color:#0b8f8a}.auth-captain[open] summary{margin-bottom:10px}

/* Prediksi terkunci untuk tamu (landing_pages.php guestLockCard/guestDateLocked, 2026-10-10) */
.guest-lock-ico{width:1em;height:1em;display:inline-block;vertical-align:-.12em}
.guest-lock{display:grid;justify-items:center;gap:8px;margin:16px 0;padding:22px 18px;border-radius:20px;text-align:center;background:linear-gradient(160deg,rgba(45,212,191,.14),rgba(6,42,57,.55));border:1px solid rgba(45,212,191,.35);color:#e9edef}
.guest-lock-q{position:relative;display:grid;place-items:center;width:112px;height:112px;border-radius:50%;font-size:3.2rem;font-weight:700;color:#e9edef;background:radial-gradient(circle,rgba(45,212,191,.2) 0,rgba(45,212,191,0) 70%);border:2px dashed rgba(45,212,191,.55)}
.guest-lock-q .guest-lock-ico{position:absolute;right:6px;bottom:6px;width:30px;height:30px;padding:6px;border-radius:50%;background:#12b3a6;color:#fff}
.guest-lock b{font-size:1.1rem;line-height:1.3}
.guest-lock p{margin:0;max-width:30rem;font-size:.9rem;color:#bfe3e6}
.guest-lock .button{margin-top:4px;background:#12b3a6;color:#fff}
.guest-lock small{font-size:.75rem;color:#9fc5c9}
body.unified-app .fa-days a.is-locked,body.unified-app .td-days a.is-locked{opacity:.75}
body.unified-app .fa-days a.is-locked small,body.unified-app .td-days a.is-locked small{color:#f5c451!important;font-size:.8rem}
body.unified-app .fa-cal-grid a.is-locked{opacity:.8}
body.unified-app .fa-cal-grid a.is-locked i{color:#f5c451;font-size:.62rem}
.guest-lock-note{display:flex;align-items:center;justify-content:center;gap:6px;margin:10px 0 0;font-size:.8rem;color:#bfe3e6}
.guest-lock-note .guest-lock-ico{color:#f5c451}
.guest-lock-note a{color:#2dd4bf;font-weight:700}

/* assets/dark.css */
/* =====================================================================
   Fishunter dark theme (same palette as the chat screen, WhatsApp-style dark), loaded after every other stylesheet.
   bg #0b141a · card #111b21 · raised #202c33 · line #222d34 · text #e9edef · muted #8696a0
   Brand accent stays teal.
   ===================================================================== */
:root{
  color-scheme:dark;
  --dk-bg:#0b141a;--dk-card:#111b21;--dk-raised:#202c33;--dk-hover:#2a3942;--dk-line:#222d34;
  --dk-text:#e9edef;--dk-muted:#8696a0;--dk-accent:#2dd4bf;--dk-accent-2:#14b8a6;
  --fx-ink:#e9edef;--fx-ink-2:#d1d7db;--fx-muted:#8696a0;--fx-line:#222d34;--fx-line-2:#1b262d;
  --fx-bg:#0b141a;--fx-surface:#111b21;--fx-soft:#182229;--fx-teal-soft:#16332f;--fx-shop-soft:#3a2620;
  --fx-teal:#2dd4bf;--fx-teal-2:#14b8a6;
  --fx-shadow-1:0 1px 2px rgba(0,0,0,.4);--fx-shadow-2:0 6px 18px -8px rgba(0,0,0,.6);--fx-shadow-3:0 20px 44px -16px rgba(0,0,0,.7);
  --lite-blue:#2dd4bf;
  --dk-card-rgb:17,27,33;--dk-bg-rgb:11,20,26;
}
/* Light theme (switch next to the name in the side menu; cookie fh_theme=light, set on <html data-theme>): the same
   layout, only the palette changes. Teal is a shade darker so text stays readable on white. */
html[data-theme="light"]{
  color-scheme:light;
  --dk-bg:#eef2f5;--dk-card:#ffffff;--dk-raised:#f0f3f6;--dk-hover:#e4eaee;--dk-line:#dde4e9;
  --dk-text:#111b21;--dk-muted:#5e6e78;--dk-accent:#0f9688;--dk-accent-2:#0d7f74;
  --fx-ink:#111b21;--fx-ink-2:#2f3b43;--fx-muted:#5e6e78;--fx-line:#dde4e9;--fx-line-2:#e8edf1;
  --fx-bg:#eef2f5;--fx-surface:#ffffff;--fx-soft:#f3f6f8;--fx-teal-soft:#dcf3ef;--fx-shop-soft:#fdeee6;
  --fx-teal:#0f9688;--fx-teal-2:#0d7f74;
  --fx-shadow-1:0 1px 2px rgba(17,27,33,.08);--fx-shadow-2:0 6px 18px -8px rgba(17,27,33,.18);--fx-shadow-3:0 20px 44px -16px rgba(17,27,33,.25);
  --lite-blue:#0f9688;
  --dk-card-rgb:255,255,255;--dk-bg-rgb:238,242,245;
}
html,body,body.unified-app{background:var(--dk-bg)!important;color:var(--dk-text)!important}
body.unified-app :is(main,.page-main,section.section,.shell,.community-lite,.lite-frame,.lite-main,.form-page,.social-layout){background-color:transparent}
body.unified-app :is(h1,h2,h3,h4,h5,h6,strong,b,label,legend,dt,th){color:var(--dk-text)}
body.unified-app :is(p,li,dd,td,span,small,figcaption,time){color:inherit}
body.unified-app :is(.muted,.fineprint,.eyebrow,.hint,small,.small,.lite-post-by>small,.post-meta-line){color:var(--dk-muted)!important}
body.unified-app a{color:var(--dk-accent)}
body.unified-app hr{border-color:var(--dk-line)}
::selection{background:#2dd4bf55}

/* backdrops: flat Facebook dark instead of the light/gradient backgrounds */
body.unified-app.scenic-bg{background:var(--dk-bg)!important}
body.unified-app.scenic-bg::before,body.unified-app.scenic-bg::after{background:var(--dk-bg)!important;filter:none!important;-webkit-mask-image:none!important;mask-image:none!important}

/* top bar and bottom menu */
body.unified-app .app-navigation{background:rgba(36,37,38,.96)!important;border-bottom:1px solid var(--dk-line)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
body.unified-app .app-navigation :is(a,button,strong,span,small){color:var(--dk-text)}
body.unified-app .app-navigation :is(a,button)[class*=icon],body.unified-app .app-navigation .notification-bell,body.unified-app .app-navigation :is(button,a):has(svg){background:var(--dk-raised)!important;color:var(--dk-text)!important;border-color:transparent!important}
body.unified-app .app-bottom-navigation{background:rgba(36,37,38,.97)!important;border:1px solid var(--dk-line)!important;box-shadow:0 -2px 16px rgba(0,0,0,.5)!important}
body.unified-app .app-bottom-navigation a{color:var(--dk-muted)!important}
body.unified-app .app-bottom-navigation a:is(.active,[aria-current]){color:var(--dk-accent)!important;background:rgba(45,212,191,.12)!important}

/* cards, panels, lists */
body.unified-app :is(.panel,.lite-panel,.lite-post,.lite-composer,.lite-login-note,.lite-verify,.list-card,.card,.state-card,.empty,.lite-comments,.lite-shared,.notification-list,.inbox-page .list-grid,.thread-row,.product-card,.boat-card,.package-card,.lite-menu-grid,.service-card,.feature-card,.facts>div,.weather-card,.tide-card,.recommendation,.location-panel,.weather-picker,.app-update-banner,.composer-tag-panel,.install-tip){background:var(--dk-card)!important;border-color:var(--dk-line)!important;color:var(--dk-text)!important;box-shadow:none!important}
body.unified-app :is(.list-card,.thread-row,.notification-item button):hover{background:var(--fx-soft)!important}
body.unified-app .inbox-page .list-grid>*{border-bottom-color:var(--dk-line)!important}
body.unified-app .empty{border-style:dashed!important}

/* form controls */
body.unified-app :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),select,textarea){background:var(--dk-raised)!important;color:var(--dk-text)!important;border-color:var(--dk-line)!important;box-shadow:none!important}
body.unified-app :is(input,textarea)::placeholder{color:#8a8d91!important}
body.unified-app :is(input,select,textarea):focus{border-color:var(--dk-accent)!important;box-shadow:0 0 0 2px rgba(45,212,191,.25)!important}
body.unified-app option{background:var(--dk-card);color:var(--dk-text)}

/* buttons */
body.unified-app :is(.button.ghost,.button.secondary,.ghost){background:var(--dk-raised)!important;color:var(--dk-text)!important;border-color:transparent!important;box-shadow:none!important}
body.unified-app :is(.button.ghost,.ghost):hover{background:var(--dk-hover)!important}

/* tabs and pills */
body.unified-app :is(.service-tabs,.marine-page-tabs,.shop-tabs,.message-tabs,.feed-tabs,.lite-feed-filter){background:var(--dk-card)!important;border-color:var(--dk-line)!important}
body.unified-app :is(.service-tabs,.marine-page-tabs,.shop-tabs,.message-tabs,.feed-tabs,.lite-feed-filter)>a{color:var(--dk-muted)!important}
body.unified-app :is(.service-tabs,.marine-page-tabs,.shop-tabs,.message-tabs,.feed-tabs,.lite-feed-filter)>a:is(.active,[aria-current]){background:var(--dk-raised)!important;color:var(--dk-accent)!important;box-shadow:none!important}
body.unified-app .message-tabs>a span{background:var(--dk-hover)!important;color:var(--dk-text)!important}
body.unified-app .pill{background:var(--dk-raised)!important;color:var(--dk-text)!important;border-color:transparent!important}

/* feed posts */
body.unified-app .lite-post :is(.lite-author,.lite-post-body,h3){color:var(--dk-text)!important}
body.unified-app .lite-post-stats{color:var(--dk-muted)!important;border-color:var(--dk-line)!important}
body.unified-app .lite-post-stats a{color:var(--dk-muted)!important}
body.unified-app .lite-post-actions{border-color:var(--dk-line)!important}
body.unified-app .lite-post-actions :is(button,a){color:var(--dk-muted)!important}
body.unified-app .lite-post-actions :is(button,a):hover{background:var(--dk-raised)!important}
body.unified-app .lite-post-actions button:is(.is-liked,[aria-pressed=true]){color:var(--dk-accent)!important}
body.unified-app .post-tagged a,body.unified-app .feed-follow button{color:var(--dk-accent)!important}
body.unified-app .ocean-shortcuts>a{background:var(--dk-card)!important;border-color:var(--dk-line)!important;color:var(--dk-text)!important}
body.unified-app .ocean-shortcuts>a :is(strong,small,div){color:var(--dk-text)!important}

/* dropdown menus, popups, sheets */
body.unified-app .lite-menu-popup,.lite-menu-popup{background:var(--dk-card)!important;border-color:var(--dk-line)!important;box-shadow:0 8px 28px rgba(0,0,0,.6)!important}
body.unified-app .lite-menu-popup :is(button,summary,a){background:transparent!important;color:var(--dk-text)!important}
body.unified-app .lite-menu-popup :is(button,summary,a):hover{background:var(--dk-raised)!important}
.comment-sheet-panel,.thread-menu-box{background:var(--dk-card)!important;color:var(--dk-text)}
.comment-sheet-head{border-color:var(--dk-line)!important}
.comment-sheet-head strong,.thread-menu-box strong{color:var(--dk-text)!important}
.comment-sheet-grip{background:#5a5c5f!important}
.comment-sheet-close{color:var(--dk-muted)!important}
.comment-sheet-body .lite-comment-form{background:var(--dk-card)!important;border-color:var(--dk-line)!important}
.thread-menu-box button{background:var(--dk-raised)!important;color:var(--dk-text)!important}
.thread-menu-box button.thread-menu-danger{color:#ff6b6b!important}
.thread-menu-text{color:var(--dk-muted)!important}
.feed-new-pill{background:var(--dk-accent-2)!important;color:#06201d!important}

/* comments (Facebook dark bubbles) */
body.unified-app .lite-comment-bubble,body.unified-app .lite-comment>div:not(.lite-comment-main){background:var(--dk-raised)!important;color:var(--dk-text)!important}
body.unified-app .lite-comment-bubble :is(strong,p,a){color:var(--dk-text)!important}
body.unified-app .lite-comment-meta,body.unified-app .lite-comment-meta>button,body.unified-app .lite-comment-like :is(button,span){color:var(--dk-muted)!important}
body.unified-app .lite-comment-like button[aria-pressed=true]{color:var(--dk-accent)!important}

/* shared composer bar (comments + chat) */
.fb-composer .fbc-field{background:var(--dk-raised)!important;border-color:transparent!important}
.fb-composer textarea[data-fbc-text]{color:var(--dk-text)!important}
.fb-composer :is(.fbc-tools button,.fbc-send){color:var(--dk-muted)!important}
.fb-composer .fbc-send:not(:disabled),.fb-composer.is-panel-open [data-fbc-toggle]{color:var(--dk-accent)!important}
.fb-composer .fbc-panel{border-color:var(--dk-line)!important}
body.unified-app .fb-composer .fbc-tabs button{color:var(--dk-muted)!important}
body.unified-app .fb-composer .fbc-tabs button[aria-selected=true]{background:var(--fx-teal-soft)!important;color:var(--dk-accent)!important}
body.unified-app .fb-composer :is(.fbc-emoji,.fbc-stickers) button:active{background:var(--dk-raised)!important}

/* post composer */
body.unified-app .lite-composer :is(textarea,.composer-heading strong){color:var(--dk-text)!important}
body.unified-app .composer-heading span{color:var(--dk-muted)!important}
body.unified-app .composer-add{background:var(--dk-raised)!important;color:var(--dk-accent)!important}
body.unified-app .composer-previews .composer-add-more{background:var(--dk-raised)!important;border-color:#5a5c5f!important}
body.unified-app .composer-tags button{background:var(--fx-teal-soft)!important;color:var(--dk-accent)!important}
body.unified-app .composer-tag-panel{background:var(--dk-card)!important}
body.unified-app .composer-tag-head{border-color:var(--dk-line)!important}
body.unified-app .composer-tag-list button:hover{background:var(--dk-raised)!important}

/* inbox + chat */
body.unified-app .inbox-compact .inbox-search input{background:var(--dk-raised)!important}
body.unified-app .thread-row :is(h3){color:var(--dk-text)!important}
body.unified-app .thread-row:not(.is-unread) p{color:var(--dk-muted)!important}
body.unified-app .thread-row.is-unread :is(h3,p){color:#fff!important}
body.unified-app .avatar.avatar-blocked{background:var(--dk-hover)!important}
/* chat: WhatsApp dark */
body.unified-app.chat-screen{--wa-bg:#0b141a;--wa-out:#005c4b;--wa-in:#202c33;--wa-ink:#e9edef;--wa-meta:#8696a0;--wa-tick:#8696a0;--wa-read:#53bdeb;background:var(--dk-bg)!important}
body.unified-app.chat-screen::before{background:var(--dk-bg) url("/assets/chat-ocean.svg?v=1") center top/cover no-repeat!important;opacity:.22}
body.unified-app.chat-screen .chat-heading h1{color:var(--dk-text)!important;text-shadow:none!important}
body.unified-app.chat-screen .chat-title-row .user-presence{color:var(--dk-muted)!important;text-shadow:none!important}
body.unified-app.chat-screen .chat-title-row .user-presence[data-online="1"]{color:#25d366!important}
body.unified-app.chat-screen .chat-typing{color:#25d366!important;text-shadow:none!important}
body.unified-app.chat-screen .chat-menu-button{color:var(--dk-text)!important;background:rgba(255,255,255,.08)!important}
body.unified-app.chat-screen .message-list>.message:not(.mine)::before{background:var(--wa-in)!important}
body.unified-app.chat-screen .message-list>.message.mine::before{background:var(--wa-out)!important}
body.unified-app.chat-screen .chat-compose.fb-composer{background:var(--dk-raised)!important;border-color:transparent!important;box-shadow:none!important}
body.unified-app.chat-screen .chat-compose.fb-composer .fbc-field{background:var(--dk-hover)!important}
body.unified-app .chat-blocked{background:var(--dk-raised)!important}
body.unified-app .chat-blocked p{color:var(--dk-muted)!important}
body.unified-app.chat-screen [data-chat-status]:not(:empty){background:var(--dk-raised)!important;color:var(--dk-muted)!important}

/* toasts, flash messages, tables */
body.unified-app :is(.flash,.notice,.alert){background:var(--dk-card)!important;color:var(--dk-text)!important;border-color:var(--dk-line)!important}
body.unified-app table{color:var(--dk-text)}
body.unified-app :is(th,td){border-color:var(--dk-line)!important}
body.unified-app :is(thead,tr:nth-child(even)){background:transparent!important}

/* ---- pass 2: leftovers found by the page scan ---- */
body.unified-app :is(h1,h2,h3,h4){color:var(--dk-text)!important}
body.unified-app .lite-wordmark,body.unified-app .lite-wordmark *,body.unified-app .mancing-brand-type{color:var(--dk-text)!important}
body.unified-app .avatar:not(:has(img)){background:var(--dk-raised)!important;color:var(--dk-accent)!important}
body.unified-app .auth-switch a{color:var(--dk-accent)!important}
/* boats */
body.unified-app :is(.search-panel,.fishing-search){background:var(--dk-card)!important;border-color:var(--dk-line)!important;box-shadow:none!important}
body.unified-app .photo-tag{background:rgba(0,0,0,.65)!important;color:#fff!important}
body.unified-app input[type=checkbox],body.unified-app input[type=radio]{accent-color:var(--dk-accent-2);background:var(--dk-raised)!important}
body.unified-app .boat-card b,body.unified-app .boat-card div>b{background:var(--dk-raised)!important;color:var(--dk-text)!important}
body.unified-app .boat-photo{background:var(--dk-raised)!important}
/* weather + tides */
body.unified-app .marine-level{border-color:transparent!important}
body.unified-app .marine-level-safe{background:rgba(37,211,102,.16)!important;color:#6ee7a8!important}
body.unified-app .marine-level-caution,body.unified-app .marine-level-warning{background:rgba(245,158,11,.16)!important;color:#fcd34d!important}
body.unified-app .marine-level-danger{background:rgba(239,68,68,.18)!important;color:#fca5a5!important}
body.unified-app .marine-alert{background:rgba(45,212,191,.08)!important;border-color:var(--dk-line)!important}
body.unified-app .marine-alert p{color:var(--dk-text)!important}
body.unified-app .tide-date-strip>a{background:var(--dk-card)!important;border-color:var(--dk-line)!important;color:var(--dk-text)!important}
body.unified-app .tide-date-strip>a:is(.active,[aria-current]){background:var(--fx-teal-soft)!important;color:var(--dk-accent)!important}
body.unified-app .tide-slot{background:var(--dk-card)!important;border-color:var(--dk-line)!important;color:var(--dk-text)!important}
body.unified-app :is(.tide-slot,.panel) :is(.high,strong[class*=high]){color:#7cc4ff!important}
body.unified-app :is(.tide-slot,.panel) :is(.low,strong[class*=low]){color:#fbbf6a!important}
body.unified-app .panel strong[style],body.unified-app .panel span[style]{filter:brightness(1.6)}
body.unified-app .empty>span{background:var(--dk-raised)!important;color:var(--dk-accent)!important}
/* ---- pass 3 ---- */
body.unified-app .avatar{background:var(--dk-raised)!important}
body.unified-app .app-navigation .lite-wordmark :is(span,strong,b,small),body.unified-app .app-navigation .mancing-brand-type{color:var(--dk-text)!important}
body.unified-app .ocean-shortcuts>a>span{background:rgba(45,212,191,.14)!important;color:var(--dk-accent)!important}
body.unified-app .steps b{background:var(--fx-teal-soft)!important;color:var(--dk-accent)!important}
body.unified-app .boat-bottom strong{color:var(--dk-text)!important}
body.unified-app .tide-summary strong:first-child,body.unified-app .tide-summary div:first-child strong{color:#7cc4ff!important}
body.unified-app .tide-summary div:last-child strong{color:#fbbf6a!important}
/* ---- pass 4: signed-in pages ---- */
body.unified-app .lite-section-title{background:var(--dk-card)!important;border-color:var(--dk-line)!important;color:var(--dk-text)!important}
body.unified-app .lite-section-title :is(h1,h2,a){color:var(--dk-text)!important}
body.unified-app .lite-menu-grid :is(a,button){background:var(--dk-card)!important;border-color:var(--dk-line)!important;color:var(--dk-text)!important;box-shadow:none!important}
body.unified-app .lite-menu-grid :is(a,button):hover{background:var(--dk-raised)!important}
body.unified-app .lite-person{background:var(--dk-card)!important;border-color:var(--dk-line)!important}
body.unified-app .lite-person :is(strong,a){color:var(--dk-text)!important}
body.unified-app .lite-person form button{background:var(--dk-raised)!important;color:var(--dk-accent)!important;border-color:transparent!important}
body.unified-app .notification-item button{background:transparent!important;color:var(--dk-text)!important}
body.unified-app .notification-item button span{color:var(--dk-text)!important}
body.unified-app .notification-item button small{color:var(--dk-muted)!important}
body.unified-app .notification-item.is-unread button{background:rgba(45,212,191,.08)!important}
/* ---- pass 5: light gradients ---- */
body.unified-app .tide-summary>div:first-child{background:linear-gradient(150deg,#12304a,#0f2940)!important;border-color:var(--dk-line)!important}
body.unified-app .tide-summary>div:last-child{background:linear-gradient(150deg,#3a2a14,#2f2210)!important;border-color:var(--dk-line)!important}
body.unified-app .tide-summary>div :is(span,small,p){color:var(--dk-muted)!important}
body.unified-app .tide-chart-shell{background:var(--dk-card)!important;border-color:var(--dk-line)!important}
body.unified-app :is(.open-promo,.auth-section){background:var(--dk-bg)!important}
body.unified-app .open-promo :is(h2,h3,p,strong){color:var(--dk-text)!important}
body.unified-app .open-promo>*:not(a):not(.button){background-color:transparent}

/* top tab bar (dark) */
body.unified-app .app-navigation{background:var(--dk-card)!important;border-bottom:1px solid var(--dk-line)!important}
body.unified-app .app-navigation>.app-bottom-navigation{background:transparent!important;border:0!important;box-shadow:none!important}
body.unified-app .app-navigation>.app-bottom-navigation a{color:var(--dk-muted)!important;background:transparent!important}
body.unified-app .app-navigation>.app-bottom-navigation a.active{color:var(--dk-accent)!important;background:transparent!important}
body.unified-app .app-navigation>.app-bottom-navigation a:hover{background:rgba(255,255,255,.05)!important}
body.unified-app.community-screen .app-navigation .lite-header{border-bottom:0!important}
body.unified-app .perm-option{background:var(--dk-card)!important;border-color:var(--dk-line)!important}
body.unified-app .perm-option:has(input:checked){background:rgba(45,212,191,.12)!important;border-color:var(--dk-accent-2)!important}
body.unified-app .perm-option strong{color:var(--dk-text)!important}
body.unified-app .angler-option{flex-direction:row!important;text-align:left!important;justify-content:flex-start!important;align-items:center!important;color:var(--dk-text)!important}
body.unified-app .angler-option>span:not(.avatar){align-items:flex-start!important;text-align:left!important}
body.unified-app .angler-option small{color:var(--dk-muted)!important}
body.unified-app .admin-profile-tools{margin-top:8px}
body.unified-app .admin-profile-tools h2{font-size:1rem;margin:0 0 4px}
body.unified-app .admin-profile-tools .is-active{color:#45bd62!important}
body.unified-app .admin-profile-tools .is-suspended{color:#f3425f!important}
body.unified-app .admin-profile-tools>details,body.unified-app .admin-tools-row{margin-top:10px}
body.unified-app .admin-tools-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
body.unified-app .admin-tools-row>span{flex-basis:100%}
body.unified-app .admin-profile-tools summary{cursor:pointer;font-weight:700;font-size:.85rem}
body.unified-app .admin-danger[open]{background:rgba(243,66,95,.08)!important;border-color:rgba(243,66,95,.35)!important}
body.unified-app .admin-profile-tools .button.danger{background:#e41e3f!important;color:#fff!important;border:0!important}
/* Manajemen admin: compact list */
body.unified-app .admin-access h1{margin:4px 0 2px}
body.unified-app .admin-access>p.muted{margin:0 0 10px}
body.unified-app .admin-access .panel{padding:10px 12px!important;margin-bottom:10px!important}
body.unified-app .admin-add>summary{cursor:pointer;font-weight:700;color:var(--dk-accent)!important;list-style:none}
body.unified-app .admin-add>summary::-webkit-details-marker{display:none}
body.unified-app .admin-add[open]>summary{margin-bottom:10px}
body.unified-app .admin-add .stack-form{gap:10px!important}
body.unified-app .admin-add input[type=search]{width:100%}
body.unified-app .admin-add .angler-pick{max-height:240px}
body.unified-app .admin-list h2{font-size:1rem;margin:0 0 4px}
body.unified-app .admin-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--dk-line);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
body.unified-app .admin-list h2+.admin-row{border-top:0}
body.unified-app .admin-row[data-admin-row]{cursor:pointer}
body.unified-app .admin-row.is-editing{background:rgba(45,212,191,.08);margin:0 -12px;padding:8px 12px}
body.unified-app .admin-row .avatar{width:38px;height:38px;flex:none;font-size:.9rem}
body.unified-app .admin-row-text{flex:1;min-width:0;display:flex;flex-direction:column}
body.unified-app .admin-row-text strong{font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .admin-row-text small{font-size:.75rem;color:var(--dk-muted)!important}
body.unified-app .admin-row-text .is-suspended{color:#f3425f}
body.unified-app .admin-row-more{flex:none;width:34px;height:34px;border-radius:50%;border:0;background:transparent;color:var(--dk-muted);font-size:1.2rem;line-height:1;cursor:pointer}
body.unified-app .admin-row-more:active{background:var(--dk-raised)}
body.unified-app .admin-edit{padding:4px 0 10px}
body.unified-app .perm-chips{border:0;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:6px}
body.unified-app .perm-chips legend{font-size:.78rem;font-weight:700;color:var(--dk-muted)!important;margin-bottom:6px;padding:0}
body.unified-app .perm-chip{display:inline-flex!important;align-items:center;gap:6px;margin:0!important;padding:6px 10px;border-radius:999px;border:1px solid var(--dk-line);background:var(--dk-raised);font-size:.78rem;font-weight:600;cursor:pointer;color:var(--dk-text)!important}
body.unified-app .perm-chip input{width:15px!important;height:15px;margin:0;accent-color:var(--dk-accent-2)}
body.unified-app .perm-chip:has(input:checked){border-color:var(--dk-accent-2);background:rgba(45,212,191,.14)}
body.unified-app .admin-edit-actions{display:flex;gap:8px;margin-top:10px}
body.unified-app .admin-edit-actions .button{flex:1;min-height:36px!important;padding:6px 12px!important}
body.unified-app .angler-pick.is-empty{border:0}
body.unified-app .angler-option .avatar{width:30px!important;height:30px!important}
body.unified-app .angler-option{padding:6px 10px!important}
/* smaller permission chips */
body.unified-app .perm-chips{gap:4px}
body.unified-app .perm-chips legend{font-size:.7rem;margin-bottom:4px}
body.unified-app .perm-chip{padding:3px 8px 3px 6px;gap:4px;font-size:.68rem;font-weight:600}
body.unified-app .perm-chip input{width:12px!important;height:12px!important}
body.unified-app .admin-add .button[type=submit]{min-height:36px!important;padding:6px 12px!important}
body.unified-app .perm-chips{background:transparent!important;border:0!important;padding:0!important;box-shadow:none!important}
body.unified-app .perm-chips .perm-chip{flex-direction:row!important;align-items:center!important;min-height:0!important;height:auto!important;padding:3px 8px 3px 6px!important;gap:4px!important;font-size:.68rem!important;line-height:1.3!important;border-radius:999px!important;width:auto!important}
body.unified-app .perm-chips .perm-chip input{width:12px!important;height:12px!important;min-height:0!important;padding:0!important;margin:0!important;flex:none}
body.unified-app .perm-chips .perm-chip span{display:inline!important}
/* Manajemen kapal / seller */
body.unified-app .admin-manage h1{margin:4px 0 2px}
body.unified-app .admin-manage>p.muted{margin:0 0 8px}
body.unified-app .admin-tabs{display:flex;gap:4px;overflow-x:auto;margin:0 0 8px;scrollbar-width:none}
body.unified-app .admin-tabs a{flex:none;padding:5px 11px;border-radius:999px;background:var(--dk-raised);color:var(--dk-muted)!important;font-size:.76rem;font-weight:700;text-decoration:none}
body.unified-app .admin-tabs a span{opacity:.75;font-weight:600}
body.unified-app .admin-tabs a.active{background:rgba(45,212,191,.16);color:var(--dk-accent)!important}
body.unified-app .admin-search{width:100%;margin:0 0 8px;min-height:38px!important;padding:6px 12px!important;font-size:.85rem!important}
body.unified-app .admin-manage .panel{padding:4px 12px!important}
body.unified-app .admin-rows .admin-row:first-child{border-top:0}
body.unified-app .admin-rows .admin-row{align-items:flex-start}
body.unified-app .admin-rows .admin-row-more{align-self:center}
body.unified-app .admin-rows .admin-row-text small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .admin-rows .admin-row-text small.warn{color:#f5a524!important}
body.unified-app .admin-row[hidden]{display:none!important}
body.unified-app .boat-thumb{border-radius:8px!important;display:grid;place-items:center;overflow:hidden;background:var(--dk-raised)}
body.unified-app .boat-thumb img{width:100%;height:100%;object-fit:cover}
body.unified-app .admin-row-text em.state{font-style:normal;font-size:.62rem;font-weight:700;padding:1px 6px;border-radius:999px;margin-left:4px;vertical-align:1px}
body.unified-app .state-pending{background:rgba(245,165,36,.16);color:#f5a524}
body.unified-app .state-approved,body.unified-app .state-verified{background:rgba(69,189,98,.16);color:#45bd62}
body.unified-app .state-rejected{background:rgba(243,66,95,.16);color:#f3425f}
body.unified-app .admin-empty{padding:10px 0;margin:0}
.thread-menu-box .thread-menu-form{display:contents}
.thread-menu-box button:disabled{opacity:.45}
body.unified-app .admin-tabs a:first-child{display:inline-block!important}
body.unified-app .admin-row-title{display:flex;align-items:center;gap:6px;min-width:0}
body.unified-app .admin-row-title strong{min-width:0}
body.unified-app .admin-row-title em.state{flex:none;margin-left:0}
body.unified-app .admin-manage .admin-search{margin-bottom:8px!important}
body.unified-app .admin-manage .admin-list{margin-top:0!important}
/* Pengaturan aplikasi menu */
body.unified-app .app-settings-menu h1{margin:4px 0 10px}
body.unified-app .settings-menu{padding:0!important;overflow:hidden}
body.unified-app .settings-menu a{display:flex;align-items:center;gap:12px;padding:12px 14px;border-top:1px solid var(--dk-line);color:var(--dk-text)!important;text-decoration:none}
body.unified-app .settings-menu a:first-child{border-top:0;display:flex!important}
body.unified-app .settings-menu a:active{background:var(--dk-raised)}
body.unified-app .settings-menu-icon{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--dk-raised);font-size:1.05rem}
body.unified-app .settings-menu a>span:nth-child(2){flex:1;min-width:0;display:flex;flex-direction:column}
body.unified-app .settings-menu strong{font-size:.92rem}
body.unified-app .settings-menu small{font-size:.74rem;color:var(--dk-muted)!important}
body.unified-app .settings-menu-go{color:var(--dk-muted);font-size:1.4rem;line-height:1}
/* Kelola akun behind ⋯ on a profile */
body.unified-app .profile-admin-more{position:absolute;top:10px;right:10px;z-index:3;width:36px;height:36px;border-radius:50%;border:0;display:grid;place-items:center;background:var(--dk-raised);color:var(--dk-text);cursor:pointer}
body.unified-app .profile-admin-more svg{width:20px;height:20px;fill:currentColor}
body.unified-app .profile-admin-more:active{background:var(--dk-hover)}
.admin-sheet[hidden]{display:none!important}
.admin-sheet .thread-menu-box{max-height:85vh;overflow-y:auto;align-items:stretch;text-align:left;gap:0!important;padding:16px 16px calc(14px + env(safe-area-inset-bottom))!important}
.admin-sheet .admin-profile-tools h2{font-size:1rem;margin:0 0 6px;text-align:center}
.admin-sheet .admin-profile-tools>details{margin-top:10px}
.admin-sheet .admin-profile-tools>details>summary{padding:10px 12px;border-radius:10px;background:var(--dk-raised)}
.admin-sheet .admin-profile-tools>details[open]>summary{margin-bottom:8px}
.admin-sheet .admin-profile-tools>details.admin-danger{background:transparent!important;border:0!important;padding:0!important}
.admin-sheet .admin-profile-tools>details.admin-danger>summary{color:#ff6b6b!important}
.admin-sheet .admin-profile-tools .stack-form{padding:0 2px}
.admin-sheet .admin-sheet-close{margin-top:12px;width:100%}
.admin-sheet .thread-menu-box button.button{width:100%}
.admin-sheet .admin-profile-tools p strong{display:inline!important;font-size:inherit}
.admin-sheet .admin-profile-tools>p.muted{text-align:center;margin:0 0 4px}
.admin-sheet .admin-profile-tools>details.account-restrict>summary{color:#f5a524!important}
.admin-sheet .restrict-on{font-size:.7rem;padding:1px 6px;border-radius:999px;background:rgba(245,165,36,.18);margin-left:4px}
.admin-sheet .restrict-toggle{display:flex!important;flex-direction:row!important;align-items:flex-start;gap:10px;margin:0!important;padding:8px 2px;cursor:pointer}
.admin-sheet .restrict-toggle input{flex:none;width:18px!important;height:18px;margin-top:2px;accent-color:#f5a524}
.admin-sheet .restrict-toggle span{display:flex;flex-direction:column;text-align:left}
.admin-sheet .restrict-toggle strong{display:block!important;font-size:.88rem}
.admin-sheet .restrict-toggle small{color:var(--dk-muted)!important;font-size:.74rem;font-weight:400}
body.unified-app .restricted-note{margin:8px 0;padding:10px 12px;border-radius:10px;background:rgba(245,165,36,.12);color:#f5a524!important;font-size:.82rem}
.admin-sheet .restrict-toggle strong,.admin-sheet .restrict-toggle small{text-align:left!important;align-self:flex-start}
.admin-sheet .restrict-toggle{text-align:left!important}
/* Chat attachments */
.chat-attach-preview{position:relative;display:flex;align-items:center;gap:10px;margin:0 0 6px;padding:8px 10px;border-radius:12px;background:var(--dk-raised);overflow:hidden}
.chat-attach-preview[hidden]{display:none!important}
.chat-attach-icon{flex:none;width:38px;height:38px;border-radius:8px;display:grid;place-items:center;background:#2d88ff;color:#fff;font-size:.68rem;font-weight:800;letter-spacing:.02em}
.chat-attach-text{flex:1;min-width:0;display:flex;flex-direction:column}
.chat-attach-text b{font-size:.84rem;color:var(--dk-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-attach-text small{font-size:.72rem;color:var(--dk-muted)}
.chat-attach-preview>button{flex:none;width:28px;height:28px;border-radius:50%;border:0;background:rgba(255,255,255,.1);color:var(--dk-text);cursor:pointer}
.chat-attach-progress{position:absolute;left:0;bottom:0;height:3px;width:var(--p,0%);background:#2dd4bf;transition:width .2s}
.chat-attach-preview:not(.is-uploading) .chat-attach-progress{display:none}
.chat-attach-preview.is-uploading>button{visibility:hidden}
.message .message-video{display:block;width:min(260px,62vw);max-height:340px;border-radius:12px;background:#000;margin:2px 0 4px}
.message .message-file{display:flex;align-items:center;gap:10px;min-width:200px;max-width:260px;padding:8px 10px;margin:2px 0 4px;border-radius:10px;background:rgba(0,0,0,.18);color:inherit!important;text-decoration:none}
.message .message-file-icon{flex:none;width:36px;height:36px;border-radius:8px;display:grid;place-items:center;background:#2d88ff;color:#fff;font-size:.62rem;font-weight:800}
.message .message-file-text{min-width:0;display:flex;flex-direction:column}
.message .message-file-text b{font-size:.82rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.message .message-file-text small{font-size:.7rem;opacity:.75}
/* Chat header: status under the name, call buttons on the right */
body.unified-app .chat-heading-name{min-width:0;flex:1}
body.unified-app .chat-subline{display:flex;align-items:center;min-width:0;line-height:1.2;margin-top:1px}
body.unified-app .chat-subline .user-presence{display:inline-flex!important;align-items:center;gap:4px;margin:0!important;font-size:.7rem!important;color:var(--dk-muted)!important;text-shadow:none!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .chat-subline .user-presence[data-online="1"]{color:#25d366!important}
body.unified-app .chat-subline .chat-typing{margin:0;font-size:.7rem}
body.unified-app .chat-subline:has(.chat-typing:not([hidden])) .user-presence{display:none!important}
body.unified-app .chat-call-button{flex:none;width:38px;height:38px;border:0;border-radius:50%;background:transparent;color:var(--dk-text);display:grid;place-items:center;cursor:pointer}
body.unified-app .chat-call-button svg{width:22px;height:22px}
body.unified-app .chat-call-button:active{background:var(--dk-raised)}
/* Call screen */
html.call-open,html.call-open body{overflow:hidden}
.call-screen{position:fixed;inset:0;z-index:9000;background:radial-gradient(circle at 50% 30%,#1f3b4d,#0b141a 70%);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:calc(48px + env(safe-area-inset-top)) 20px calc(36px + env(safe-area-inset-bottom))}
.call-screen[hidden]{display:none}
.call-remote{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000;display:none}
.call-local{position:absolute;right:14px;top:calc(14px + env(safe-area-inset-top));width:104px;height:150px;object-fit:cover;border-radius:12px;background:#222;box-shadow:0 4px 16px rgba(0,0,0,.5);z-index:2;display:none}
/* Cermin hanya untuk kamera depan (seperti kaca); kamera belakang tampil apa adanya. */
.call-screen[data-facing="user"] .call-local{transform:scaleX(-1)}
.call-screen[data-kind="video"]:not([data-mode="incoming"]) .call-local{display:block}
.call-screen[data-kind="video"][data-mode="live"] .call-remote{display:block}
.call-screen[data-kind="video"][data-mode="live"] .call-info{position:relative;z-index:2;text-shadow:0 1px 4px rgba(0,0,0,.8)}
.call-screen[data-kind="video"][data-mode="live"] .call-avatar{display:none}
.call-info{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:40px;text-align:center}
.call-avatar{width:112px;height:112px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:var(--dk-hover);font-size:2.6rem;font-weight:700}
.call-avatar img{width:100%;height:100%;object-fit:cover}
.call-name{font-size:1.4rem;font-weight:700}
.call-status{font-size:.9rem;opacity:.85}
.call-actions{position:relative;z-index:2;display:none;gap:22px;justify-content:center}
.call-screen[data-mode="incoming"] .call-incoming,.call-screen:is([data-mode="outgoing"],[data-mode="connecting"],[data-mode="live"]) .call-controls{display:flex}
.call-btn{width:60px;height:60px;border-radius:50%;border:0;display:grid;place-items:center;background:rgba(255,255,255,.16);color:#fff;cursor:pointer}
.call-btn svg{width:28px;height:28px}
.call-btn.is-off{background:#fff;color:#111}
.call-decline{background:#e41e3f!important;color:#fff!important}
.call-decline svg{transform:rotate(0)}
.call-accept{background:#25d366!important;animation:call-pulse 1.2s infinite}
.call-screen[data-kind="audio"] [data-call-cam],.call-screen[data-kind="audio"] [data-call-flip]{display:none}
@keyframes call-pulse{0%,100%{box-shadow:0 0 0 0 rgba(37,211,102,.6)}50%{box-shadow:0 0 0 14px rgba(37,211,102,0)}}
/* Chat composer: one WhatsApp-dark palette (bar #1f2c34, field #2a3942, icons #8696a0, send/mic #00a884) */
body.unified-app.chat-screen .chat-page>.chat-compose.fb-composer{background:var(--dk-raised)!important;border:0!important;border-radius:0!important;box-shadow:none!important;margin:0 -16px!important;padding:6px 8px calc(6px + env(safe-area-inset-bottom))!important}
body.unified-app.chat-screen .chat-compose.fb-composer .fbc-field{background:var(--dk-hover)!important;border:0!important;border-radius:22px!important;padding:0 2px 0 14px!important}
body.unified-app.chat-screen .chat-compose.fb-composer .fbc-field textarea,body.unified-app.chat-screen .chat-compose.fb-composer .fbc-field textarea:focus{background:transparent!important;color:var(--dk-text)!important;border:0!important;box-shadow:none!important;caret-color:#00a884}
body.unified-app.chat-screen .chat-compose.fb-composer textarea::placeholder{color:var(--dk-muted)!important;opacity:1}
body.unified-app.chat-screen .chat-compose.fb-composer .fbc-tools button{color:var(--dk-muted)!important}
body.unified-app.chat-screen .chat-compose.fb-composer.is-panel-open [data-fbc-toggle]{color:#00a884!important}
body.unified-app.chat-screen .chat-compose.fb-composer :is(.fbc-send,.chat-mic){flex:none;width:44px!important;height:44px!important;border-radius:50%!important;background:#00a884!important;color:#fff!important;display:grid;place-items:center;border:0!important}
body.unified-app.chat-screen .chat-compose.fb-composer .fbc-send svg{margin-left:2px}
body.unified-app.chat-screen .chat-compose.fb-composer .chat-mic svg{width:22px;height:22px}
body.unified-app.chat-screen .chat-compose.fb-composer:not(.can-send) .fbc-send{display:none!important}
body.unified-app.chat-screen .chat-compose.fb-composer.can-send .chat-mic{display:none!important}
body.unified-app.chat-screen .chat-compose.fb-composer .fbc-panel{background:var(--dk-raised)!important;border-color:var(--dk-hover)!important}
body.unified-app.chat-screen .chat-compose.fb-composer .chat-attach-preview,body.unified-app.chat-screen .chat-compose.fb-composer .fbc-preview{background:var(--dk-hover)!important}
/* Recording bar replaces the field while recording */
.chat-compose.is-recording .fbc-field,.chat-compose.is-recording .chat-mic,.chat-compose.is-recording .fbc-send{display:none!important}
.voice-recorder{flex:1;display:flex;align-items:center;gap:10px;min-height:44px;padding:0 4px 0 6px;background:var(--dk-hover);border-radius:22px;color:var(--dk-text)}
.voice-recorder[hidden]{display:none!important}
.voice-recorder button{flex:none;width:40px;height:40px;border:0;border-radius:50%;display:grid;place-items:center;background:transparent;color:var(--dk-muted);cursor:pointer}
.voice-recorder button svg{width:22px;height:22px}
.voice-recorder .voice-send{background:#00a884;color:#fff;margin-left:auto}
.voice-dot{width:10px;height:10px;border-radius:50%;background:#f15c6d;animation:voice-blink 1s infinite}
.voice-clock{font-variant-numeric:tabular-nums;font-size:.95rem}
.voice-hint{font-size:.8rem;color:var(--dk-muted)}
@keyframes voice-blink{50%{opacity:.25}}
/* Voice note bubble */
.message .voice-note{display:flex;align-items:center;gap:10px;min-width:210px;max-width:260px;padding:4px 2px 2px}
.message .voice-play{flex:none;width:36px;height:36px;border:0;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.12);color:var(--dk-text);cursor:pointer}
.message .voice-play svg{width:20px;height:20px}
.message .voice-note.is-playing .voice-play svg path{d:path("M7 5h4v14H7zM13 5h4v14h-4z")}
.message .voice-track{position:relative;flex:1;height:4px;border-radius:2px;background:rgba(255,255,255,.25);cursor:pointer}
.message .voice-fill{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:2px;background:#53bdeb}
.message .voice-time{flex:none;font-size:.72rem;opacity:.8;font-variant-numeric:tabular-nums;min-width:30px;text-align:right}
/* Composer blends into the chat: no separate bar, field uses the incoming-bubble colour */
body.unified-app.chat-screen .chat-page>.chat-compose.fb-composer{background:transparent!important;margin:0!important;padding:4px 0 calc(6px + env(safe-area-inset-bottom))!important}
body.unified-app.chat-screen .chat-compose.fb-composer .fbc-field,.chat-compose .voice-recorder,body.unified-app.chat-screen .chat-compose.fb-composer .chat-attach-preview,body.unified-app.chat-screen .chat-compose.fb-composer .fbc-preview{background:var(--dk-raised)!important}
body.unified-app.chat-screen .chat-compose.fb-composer .fbc-panel{background:var(--dk-raised)!important;border-radius:14px}
/* Call: voice -> video request, swap big/small picture, hide buttons on tap */
.call-screen[data-kind="video"] [data-call-upgrade],.call-screen:not([data-mode="live"]) [data-call-upgrade]{display:none}
.call-banner{position:absolute;left:16px;right:16px;top:calc(50% + 40px);z-index:3;display:flex;flex-direction:column;align-items:center;gap:12px;padding:14px 16px;border-radius:16px;background:rgba(var(--dk-card-rgb),.92);color:var(--dk-text);text-align:center;font-size:.92rem}
.call-banner[hidden]{display:none}
.call-banner-actions{display:none;gap:10px}
.call-banner.is-ask .call-banner-actions{display:flex}
.call-banner-actions button{min-width:110px;padding:10px 16px;border-radius:999px;border:0;background:var(--dk-hover);color:var(--dk-text);font-weight:700;cursor:pointer}
.call-banner-actions button.is-primary{background:#00a884;color:#fff}
.call-screen.swapped .call-remote{inset:auto;right:14px;top:calc(14px + env(safe-area-inset-top));width:104px;height:150px;border-radius:12px;z-index:2;box-shadow:0 4px 16px rgba(0,0,0,.5)}
.call-screen.swapped .call-local{right:0;top:0;width:100%;height:100%;border-radius:0;z-index:0;box-shadow:none}
.call-screen[data-kind="video"][data-mode="live"] :is(.call-local,.call-remote){cursor:pointer;transition:all .2s ease}
.call-screen.controls-hidden .call-controls,.call-screen.controls-hidden .call-info{opacity:0;pointer-events:none}
.call-controls,.call-info{transition:opacity .2s}
/* One typeface everywhere (Plus Jakarta Sans via "Fishunter UI"); older stylesheets set Inter/Manrope/Arial/system fonts. */
body.unified-app,body.unified-app :is(h1,h2,h3,h4,h5,h6,p,a,span,small,strong,b,label,li,input,textarea,select,button,.button,summary,legend,th,td),.call-screen,.thread-menu,.chat-compose{font-family:"Fishunter UI",system-ui,-apple-system,Roboto,"Segoe UI",sans-serif!important}
body.unified-app :is(code,pre,kbd,samp){font-family:ui-monospace,SFMono-Regular,Menlo,monospace!important}
body.unified-app{font-optical-sizing:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
/* Plus Jakarta Sans has narrow word spaces and needs no tightening: open words up a little and relax the old
   negative letter-spacing that was tuned for the much wider DejaVu font. Uppercase labels keep their tracking. */
body.unified-app,.call-screen,.thread-menu{word-spacing:.08em}
body.unified-app :is(h1,h2,h3,.lite-author,.composer-heading strong,.feed-section-heading h2,.weather-now-head strong,.lite-aside strong,.footer strong,.gallery-more,.ocean-welcome h1,.fishing-hero h1){letter-spacing:-.01em!important}
body.unified-app .lite-wordmark{letter-spacing:-.02em!important}
/* Thin progress bar shown the moment a link is tapped */
.nav-progress{position:fixed;left:0;top:0;height:2px;width:0;z-index:10000;background:linear-gradient(90deg,#00a884,#2dd4bf);box-shadow:0 0 8px rgba(45,212,191,.6);opacity:0;pointer-events:none}
.nav-progress.is-loading{opacity:1;animation:nav-progress 6s cubic-bezier(.1,.7,.2,1) forwards}
.nav-progress.is-done{opacity:0;width:100%;transition:opacity .2s}
@keyframes nav-progress{0%{width:0}20%{width:45%}60%{width:75%}100%{width:92%}}
body.unified-app .handoff-confirm{max-width:420px;margin:24px auto;text-align:center}
/* Header wordmark styled like the logo: heavy uppercase "FISHUNTER" in brushed silver, tagline in sea blue */
body.unified-app .lite-wordmark .mancing-brand-type{display:flex!important;flex-direction:column;line-height:1!important}
body.unified-app .lite-wordmark .brand-name{font-weight:800;font-size:1.28rem;letter-spacing:.05em;text-transform:uppercase;line-height:1;
  background:linear-gradient(180deg,#ffffff 0%,#f1f5f7 38%,#a9b8c1 52%,#d9e2e7 70%,#ffffff 100%);-webkit-background-clip:text;background-clip:text;
  color:transparent!important;-webkit-text-fill-color:transparent;filter:drop-shadow(0 1.5px 0 #06202c) drop-shadow(0 0 1px rgba(0,0,0,.6))}
body.unified-app .lite-wordmark .mancing-brand-type small{color:#5ec4dc!important;font-size:.62rem!important;font-weight:600;letter-spacing:.03em;text-transform:lowercase;margin-top:3px;opacity:1!important}

/* ---- Cari kapal (page=boats): compact search, horizontal trip cards ---- */
body.unified-app .trip-page{padding-top:12px;padding-bottom:18px;display:flex;flex-direction:column;gap:10px}
body.unified-app .trip-head{display:flex;align-items:flex-end;justify-content:space-between;gap:10px}
body.unified-app .trip-head h1{font-size:1.2rem!important;margin:0!important;line-height:1.2;color:var(--dk-text)}
body.unified-app .trip-head p{margin:2px 0 0;font-size:.74rem;color:var(--dk-muted)}
body.unified-app .trip-head-link{flex:none;font-size:.78rem;font-weight:700;color:var(--dk-accent)!important;text-decoration:none;padding:6px 10px;border:1px solid var(--dk-line);border-radius:999px;background:var(--dk-card)}
body.unified-app .trip-search{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:10px;background:var(--dk-card);border:1px solid var(--dk-line);border-radius:14px}
body.unified-app .trip-field{display:flex;flex-direction:column;gap:3px;min-width:0;margin:0!important;font-size:.68rem!important;font-weight:700;color:var(--dk-muted)!important;text-transform:uppercase;letter-spacing:.04em}
body.unified-app .trip-field-city{grid-column:1/-1}
body.unified-app .trip-search :is(input:not([type=checkbox]),select){width:100%;min-width:0;height:38px;padding:0 10px!important;margin:0!important;border-radius:10px!important;border:1px solid var(--dk-line)!important;background:var(--dk-raised)!important;color:var(--dk-text)!important;font:inherit;font-size:.88rem!important;font-weight:500;text-transform:none;letter-spacing:0;box-shadow:none!important}
body.unified-app .trip-search input:focus,body.unified-app .trip-search select:focus{outline:none;border-color:var(--dk-accent)!important}
body.unified-app .trip-search input[type=date]{color-scheme:dark}
body.unified-app .trip-filters{grid-column:1/2;align-self:stretch}
body.unified-app .trip-filters summary{list-style:none;cursor:pointer;height:38px;display:flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--dk-line);border-radius:10px;background:var(--dk-raised);color:var(--dk-text);font-size:.85rem;font-weight:600}
body.unified-app .trip-filters summary::-webkit-details-marker{display:none}
body.unified-app .trip-filters summary::before{content:"";width:14px;height:10px;background:linear-gradient(currentColor,currentColor) 0 0/100% 2px,linear-gradient(currentColor,currentColor) 50% 50%/70% 2px,linear-gradient(currentColor,currentColor) 50% 100%/40% 2px;background-repeat:no-repeat;opacity:.8}
body.unified-app .trip-filters summary b{min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--dk-accent);color:#062a2a;font-size:.7rem;display:grid;place-items:center}
body.unified-app .trip-filters[open]{grid-column:1/-1;order:5}
body.unified-app .trip-filters[open] summary{display:inline-flex;height:auto;padding:0;border:0;background:none;color:var(--dk-accent);font-size:.8rem}
body.unified-app .trip-filter-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
body.unified-app .trip-check{display:flex;align-items:center;gap:8px;height:38px;padding:0 10px;margin:0!important;border:1px solid var(--dk-line);border-radius:10px;background:var(--dk-raised);color:var(--dk-text);font-size:.82rem;cursor:pointer}
body.unified-app .trip-check input{width:16px;height:16px;margin:0;accent-color:var(--dk-accent)}
body.unified-app .trip-submit{grid-column:2/3;height:38px;min-height:0!important;margin:0!important;padding:0 12px!important;border-radius:10px!important;font-size:.9rem!important;width:100%}
body.unified-app .trip-filters[open]~.trip-submit{grid-column:1/-1;order:6}
body.unified-app .trip-results-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:2px}
body.unified-app .trip-results-head h2{margin:0!important;font-size:.95rem!important;color:var(--dk-text)}
body.unified-app .trip-results-head h2 small{font-weight:500;color:var(--dk-muted);font-size:.78rem;margin-left:4px}
body.unified-app .trip-count{flex:none;font-size:.72rem;font-weight:700;color:var(--dk-accent);background:var(--fx-teal-soft);padding:3px 9px;border-radius:999px}
body.unified-app .trip-list{display:grid;gap:8px}
body.unified-app .trip-card{display:flex;gap:10px;padding:8px;background:var(--dk-card);border:1px solid var(--dk-line);border-radius:14px;min-width:0}
body.unified-app .trip-card-photo{position:relative;flex:none;width:108px;align-self:stretch;min-height:108px;border-radius:10px;overflow:hidden;background:var(--dk-raised);display:grid;place-items:center;font-size:1.6rem;color:var(--dk-muted);text-decoration:none}
body.unified-app .trip-card-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
body.unified-app .trip-card-photos{position:absolute;left:5px;bottom:5px;padding:1px 6px;border-radius:6px;background:rgba(0,0,0,.62);color:#fff;font-size:.66rem;font-weight:700}
body.unified-app .trip-card-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
body.unified-app .trip-card-title{display:flex;align-items:flex-start;justify-content:space-between;gap:6px}
body.unified-app .trip-card-title h3{margin:0!important;font-size:.92rem!important;line-height:1.25;min-width:0;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
body.unified-app .trip-card-title h3 a{color:var(--dk-text)!important;text-decoration:none}
body.unified-app .trip-rating{flex:none;font-size:.7rem;font-weight:700;color:#fbbf24;padding:1px 6px;border-radius:6px;background:#2d2612}
body.unified-app .trip-rating.is-new{color:var(--dk-accent);background:var(--fx-teal-soft)}
body.unified-app .trip-card-place{margin:0!important;font-size:.76rem;color:var(--dk-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .trip-card-meta{margin:0!important;display:flex;flex-wrap:wrap;gap:4px}
body.unified-app .trip-card-meta span{font-size:.68rem;color:var(--dk-text);background:var(--dk-raised);padding:1px 6px;border-radius:6px;white-space:nowrap}
body.unified-app .trip-card-foot{margin-top:auto;padding-top:4px;display:flex;align-items:center;justify-content:space-between;gap:8px}
body.unified-app .trip-price{display:flex;align-items:baseline;gap:2px;min-width:0}
body.unified-app .trip-price strong{font-size:.98rem;color:var(--dk-accent);white-space:nowrap}
body.unified-app .trip-price small{font-size:.68rem;color:var(--dk-muted)}
body.unified-app .trip-card-foot .button{height:30px;min-height:0!important;padding:0 14px!important;font-size:.8rem!important;border-radius:9px!important;margin:0!important}
body.unified-app .trip-empty{display:flex;align-items:center;gap:10px;padding:12px;background:var(--dk-card);border:1px dashed var(--dk-line);border-radius:14px}
body.unified-app .trip-empty>span{font-size:1.5rem}
body.unified-app .trip-empty div{flex:1;min-width:0}
body.unified-app .trip-empty strong{font-size:.86rem;color:var(--dk-text)}
body.unified-app .trip-empty p{margin:2px 0 0;font-size:.75rem;color:var(--dk-muted)}
body.unified-app .trip-empty .button{flex:none;margin:0!important}
body.unified-app .trip-promo{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:14px;background:linear-gradient(120deg,var(--fx-teal-soft),var(--dk-card) 70%);border:1px solid #1d3b37;text-decoration:none;color:var(--dk-text)!important}
body.unified-app .trip-promo.shop-bait{margin:0 0 12px}
body.unified-app .trip-promo-icon{width:34px;height:34px;flex:none;display:grid;place-items:center;border-radius:10px;background:var(--fx-teal-soft);font-size:1rem}
body.unified-app .trip-promo>span:nth-child(2){flex:1;min-width:0;display:flex;flex-direction:column}
body.unified-app .trip-promo strong{font-size:.86rem}
body.unified-app .trip-promo small{font-size:.72rem;color:var(--dk-muted)}
body.unified-app .trip-promo>b{font-size:1.3rem;color:var(--dk-accent);line-height:1}
body.unified-app .trip-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
body.unified-app .trip-steps li{display:flex;align-items:center;gap:6px;padding:7px 8px;border-radius:10px;background:var(--dk-card);border:1px solid var(--dk-line);font-size:.7rem;color:var(--dk-muted);line-height:1.2;min-width:0}
body.unified-app .trip-steps b{flex:none;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;background:var(--fx-teal-soft);color:var(--dk-accent);font-size:.66rem}
@media(min-width:720px){
  body.unified-app .trip-search{grid-template-columns:2fr 1fr .8fr auto auto;align-items:end}
  body.unified-app .trip-field-city{grid-column:auto}
  body.unified-app .trip-filters{grid-column:auto}
  body.unified-app .trip-submit{grid-column:auto;width:auto;padding:0 22px!important}
  body.unified-app .trip-filter-grid{grid-template-columns:repeat(4,1fr)}
  body.unified-app .trip-list{grid-template-columns:1fr 1fr}
  body.unified-app .trip-card-photo{width:128px}
}

/* ---- Boat photos: detail gallery, facility grid, full-screen viewer, form pickers ---- */
body.unified-app .boat-hero-gallery{position:relative;border-radius:14px;overflow:hidden;background:var(--dk-raised);margin-bottom:10px}
body.unified-app .gallery-strip{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;aspect-ratio:16/10}
body.unified-app .gallery-strip::-webkit-scrollbar{display:none}
body.unified-app .gallery-strip .gallery-item{flex:0 0 100%;scroll-snap-align:start}
body.unified-app .gallery-item{padding:0;margin:0;border:0;background:none;cursor:zoom-in;display:block;min-height:0!important;border-radius:0!important;box-shadow:none!important}
body.unified-app .gallery-item img{width:100%;height:100%;object-fit:cover;display:block}
body.unified-app .gallery-counter{position:absolute;right:8px;bottom:8px;padding:2px 8px;border-radius:999px;background:rgba(0,0,0,.6);color:#fff;font-size:.72rem;font-weight:700;pointer-events:none}
body.unified-app .facility-photos h2 small{font-size:.75rem;font-weight:500}
body.unified-app .gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;border-radius:10px;overflow:hidden}
body.unified-app .gallery-grid .gallery-item{aspect-ratio:1}
body.fx-viewer-open{overflow:hidden}
.fx-viewer{position:fixed;inset:0;z-index:2000;background:#000;display:flex;flex-direction:column}
.fx-viewer-bar{display:flex;align-items:center;justify-content:space-between;padding:calc(env(safe-area-inset-top) + 8px) 12px 8px;color:#fff;font-size:.85rem}
.fx-viewer-bar button{width:38px;height:38px;border:0;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;font-size:1.1rem;cursor:pointer;min-height:0}
.fx-viewer-track{flex:1;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.fx-viewer-track::-webkit-scrollbar{display:none}
.fx-viewer-track img{flex:0 0 100%;width:100%;height:100%;object-fit:contain;scroll-snap-align:center}
body.unified-app .boat-photo-fields{display:grid;gap:10px}
body.unified-app .photo-picker{margin:0;padding:10px;border:1px solid var(--dk-line);border-radius:12px;background:var(--dk-card)}
body.unified-app .photo-picker legend{padding:0 4px;font-weight:700;font-size:.85rem;color:var(--dk-text)}
body.unified-app .photo-picker legend small{color:var(--dk-muted);font-weight:600;margin-left:4px}
body.unified-app .photo-picker>p{margin:0 0 8px!important;font-size:.74rem}
body.unified-app .photo-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:8px}
body.unified-app .photo-tile{display:flex;flex-direction:column;border-radius:10px;overflow:hidden;background:var(--dk-raised);border:1px solid var(--dk-line)}
body.unified-app :is(.photo-tile-img,.photo-add){position:relative;display:block;aspect-ratio:1;margin:0!important;overflow:hidden;background:var(--dk-raised);cursor:pointer}
body.unified-app .photo-add{border-radius:10px;align-self:start}
body.unified-app .photo-tile .photo-caption{width:100%;height:auto;min-height:0!important;resize:none;line-height:1.3;margin:0!important;padding:5px 7px!important;border:0!important;border-top:1px solid var(--dk-line)!important;border-radius:0!important;background:var(--dk-card)!important;color:var(--dk-text)!important;font-size:.7rem!important;box-shadow:none!important}
body.unified-app .photo-tile .photo-caption:focus{outline:none;background:#16242b!important}
body.unified-app .photo-tile img{width:100%;height:100%;object-fit:cover;display:block}
body.unified-app .photo-tile.is-cover::after{content:"Sampul";position:absolute;left:4px;bottom:4px;padding:0 5px;border-radius:5px;background:var(--dk-accent);color:#062a2a;font-size:.6rem;font-weight:800}
body.unified-app .photo-remove{position:absolute;top:4px;right:4px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:rgba(0,0,0,.65);color:#fff;font-size:.66rem}
body.unified-app .photo-tile:has(input:checked) img,body.unified-app .photo-tile.is-removed img{opacity:.25}
body.unified-app .photo-tile:has(input:checked) .photo-remove,body.unified-app .photo-tile.is-removed .photo-remove{background:#d93636}
body.unified-app .photo-tile.is-new{border-color:var(--dk-accent)}
body.unified-app .photo-add{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;border:1.5px dashed #34505c;color:var(--dk-accent);font-weight:700}
body.unified-app .photo-add span{font-size:1.3rem;line-height:1}
body.unified-app .photo-add small{font-size:.64rem;color:var(--dk-muted)}
body.unified-app .photo-add.is-full{display:none}
body.unified-app .photo-picker-status{margin:6px 0 0!important;color:#fbbf24;min-height:0}
body.unified-app .photo-picker-status:empty{display:none}
body.unified-app .trip-check{align-self:end;white-space:nowrap}
body.unified-app .trip-empty .button{height:32px;min-height:0!important;padding:0 12px!important;font-size:.78rem!important}

/* Photo captions over the photo */
body.unified-app .gallery-item{position:relative;overflow:hidden}
body.unified-app .gallery-caption{position:absolute;left:0;right:0;bottom:0;padding:22px 10px 8px;background:linear-gradient(transparent,rgba(0,0,0,.78));color:#fff;font-size:.8rem;font-weight:600;line-height:1.3;text-align:left;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;pointer-events:none}
body.unified-app .boat-hero-gallery .gallery-caption{padding-right:52px}
body.unified-app .gallery-grid{grid-template-columns:repeat(2,1fr)}
body.unified-app .gallery-grid .gallery-caption{font-size:.7rem;padding:18px 7px 6px}
.fx-viewer-slide{position:relative;flex:0 0 100%;width:100%;height:100%;margin:0;scroll-snap-align:center;display:flex;align-items:center;justify-content:center}
.fx-viewer-slide img{width:100%;height:100%;object-fit:contain}
.fx-viewer-slide figcaption{position:absolute;left:0;right:0;bottom:0;padding:28px 16px calc(env(safe-area-inset-bottom) + 18px);background:linear-gradient(transparent,rgba(0,0,0,.85));color:#fff;font-size:.9rem;line-height:1.4}
@media(min-width:720px){body.unified-app .gallery-grid{grid-template-columns:repeat(3,1fr)}}body.unified-app .photo-tile{position:relative}
body.unified-app .photo-tile.is-cover::after{bottom:36px}
body.unified-app .photo-tile:has(input:checked) .photo-caption,body.unified-app .photo-tile.is-removed .photo-caption{opacity:.35}

/* Stars (value in halves via .stars-rN; CSP forbids inline widths) */
.stars{--w:0%;position:relative;display:inline-block;width:max-content;justify-self:start;align-self:center;flex:none;font-size:.95rem;line-height:1;letter-spacing:1px;white-space:nowrap;vertical-align:-1px}
.stars::before{content:"★★★★★";color:#3a4a53}
.stars::after{content:"★★★★★";position:absolute;left:0;top:0;width:var(--w);overflow:hidden;color:#fbbf24}
.stars.is-small{font-size:.78rem}
.stars-r0{--w:0%}
.stars-r1{--w:10%}
.stars-r2{--w:20%}
.stars-r3{--w:30%}
.stars-r4{--w:40%}
.stars-r5{--w:50%}
.stars-r6{--w:60%}
.stars-r7{--w:70%}
.stars-r8{--w:80%}
.stars-r9{--w:90%}
.stars-r10{--w:100%}
body.unified-app .trip-card-stars{margin:0!important;display:flex;align-items:center;gap:4px;font-size:.74rem;line-height:1}
body.unified-app .trip-card-stars .stars{font-size:.8rem}
body.unified-app .trip-card-stars b{color:var(--dk-text);font-size:.78rem}
body.unified-app .trip-card-stars small{color:var(--dk-muted);font-size:.7rem}
body.unified-app .trip-badge{flex:none;font-size:.62rem;font-weight:800;letter-spacing:.02em;color:#1a1300;background:linear-gradient(135deg,#fcd34d,#f59e0b);padding:2px 6px;border-radius:6px;text-transform:uppercase}
body.unified-app .trip-card-spot{margin:0!important;font-size:.74rem;color:var(--dk-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .trip-card-spot span{font-size:.62rem;font-weight:800;text-transform:uppercase;color:var(--dk-accent);background:var(--fx-teal-soft);padding:1px 5px;border-radius:5px;margin-right:2px}
body.unified-app .detail-rating{display:inline-flex;align-items:center;flex-wrap:wrap;gap:6px;margin:2px 0 4px;text-decoration:none;color:var(--dk-text)!important;font-size:.85rem}
body.unified-app .detail-rating small{color:var(--dk-muted)}
/* Star picker */
body.unified-app .star-input{border:0;padding:0;margin:0;min-width:0}
body.unified-app .star-input legend{padding:0;margin-bottom:4px;font-size:.8rem;font-weight:700;color:var(--dk-text)}
body.unified-app .star-row{display:inline-flex;flex-direction:row-reverse;justify-content:flex-end;align-items:center;gap:2px}
body.unified-app .star-row label{cursor:pointer;margin:0!important;padding:0 2px;font-size:1.6rem;line-height:1;color:#3a4a53;transition:color .12s,transform .12s}
body.unified-app .star-row label::before{content:"★"}
body.unified-app .star-input.is-large .star-row label{font-size:2.3rem}
body.unified-app .star-row input:checked~label,body.unified-app .star-row label:hover,body.unified-app .star-row label:hover~label{color:#fbbf24}
body.unified-app .star-row input:focus-visible+label{outline:2px solid var(--dk-accent);border-radius:4px}
body.unified-app .star-row label:active{transform:scale(1.2)}
body.unified-app .star-word{margin-left:8px;font-size:.78rem;font-weight:700;color:#fbbf24;min-width:70px}
body.unified-app .star-row:has(input[value="1"]:checked) .star-word::after{content:"Buruk"}
body.unified-app .star-row:has(input[value="2"]:checked) .star-word::after{content:"Kurang"}
body.unified-app .star-row:has(input[value="3"]:checked) .star-word::after{content:"Cukup"}
body.unified-app .star-row:has(input[value="4"]:checked) .star-word::after{content:"Baik"}
body.unified-app .star-row:has(input[value="5"]:checked) .star-word::after{content:"Sangat baik"}
body.unified-app .star-aspects{display:grid;grid-template-columns:1fr;gap:8px;padding:10px;border-radius:12px;background:var(--dk-raised)}
body.unified-app .star-aspects .star-input{display:flex;align-items:center;justify-content:space-between;gap:8px}
body.unified-app .star-aspects legend{float:left;margin:0;font-weight:600;color:var(--dk-muted)}
body.unified-app .star-aspects .star-row label{font-size:1.35rem}
body.unified-app .star-aspects .star-word{display:none}
/* Rating summary + reviews on the boat page */
body.unified-app .rating-summary{display:flex;gap:14px;align-items:center;padding:10px 0 12px;border-bottom:1px solid var(--dk-line)}
body.unified-app .rating-big{flex:none;display:flex;flex-direction:column;align-items:center;gap:4px;min-width:84px}
body.unified-app .rating-big strong{font-size:2.2rem;line-height:1;color:var(--dk-text)}
body.unified-app .rating-big small{font-size:.72rem;color:var(--dk-muted)}
body.unified-app .rating-bars{flex:1;min-width:0;display:grid;gap:3px}
body.unified-app .rating-bars div{display:grid;grid-template-columns:24px 1fr 22px;align-items:center;gap:6px;font-size:.72rem;color:var(--dk-muted)}
body.unified-app .rating-bars small{text-align:right}
body.unified-app .rating-bars progress{appearance:none;-webkit-appearance:none;width:100%;height:7px;border:0;border-radius:4px;background:var(--dk-raised);overflow:hidden}
body.unified-app .rating-bars progress::-webkit-progress-bar{background:var(--dk-raised);border-radius:4px}
body.unified-app .rating-bars progress::-webkit-progress-value{background:#fbbf24;border-radius:4px}
body.unified-app .rating-bars progress::-moz-progress-bar{background:#fbbf24;border-radius:4px}
body.unified-app .rating-aspects{display:grid;gap:4px;padding:10px 0;border-bottom:1px solid var(--dk-line)}
body.unified-app .rating-aspects div{display:grid;grid-template-columns:1fr auto 28px;align-items:center;gap:8px;font-size:.78rem;color:var(--dk-muted)}
body.unified-app .rating-aspects b{color:var(--dk-text);text-align:right}
body.unified-app .review-item{padding:10px 0;border-bottom:1px solid var(--dk-line);display:grid;gap:4px}
body.unified-app .review-item:last-child{border-bottom:0}
body.unified-app .review-head{display:flex;justify-content:space-between;gap:8px;align-items:baseline}
body.unified-app .review-head strong{font-size:.86rem;color:var(--dk-text)}
body.unified-app .review-head small{font-size:.7rem;color:var(--dk-muted)}
body.unified-app .review-item p{margin:2px 0!important;font-size:.85rem;color:var(--dk-text)}
body.unified-app .review-item>small{font-size:.7rem}
/* Spot panel */
body.unified-app .spot-panel .spot-area{margin:0 0 8px!important;font-weight:700;font-size:.95rem;color:var(--dk-text)}
body.unified-app .spot-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:6px;margin-bottom:8px}
body.unified-app .spot-facts div{padding:8px 10px;border-radius:10px;background:var(--dk-raised);display:flex;flex-direction:column;gap:2px;min-width:0}
body.unified-app .spot-facts span,body.unified-app .spot-fish>span{font-size:.64rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--dk-muted)}
body.unified-app .spot-facts b{font-size:.84rem;color:var(--dk-text);overflow-wrap:anywhere}
body.unified-app .spot-fish{margin-bottom:8px}
body.unified-app .spot-fish div{display:flex;flex-wrap:wrap;gap:5px;margin-top:4px}
body.unified-app .spot-fish em{font-style:normal;font-size:.76rem;color:var(--dk-accent);background:var(--fx-teal-soft);padding:3px 9px;border-radius:999px}
body.unified-app .spot-fields{border:1px solid var(--dk-line);border-radius:12px;padding:10px;margin:0;display:grid;gap:8px}
body.unified-app .spot-fields legend{padding:0 4px;font-weight:700;font-size:.85rem;color:var(--dk-text)}
body.unified-app .spot-fields>p{margin:0!important;font-size:.74rem}
body.unified-app .custom-techniques{display:flex;flex-direction:column;gap:4px;width:100%;margin-top:8px!important;font-size:.8rem;font-weight:600;color:var(--dk-text)}
body.unified-app .custom-techniques .field-hint{font-weight:400;font-size:.7rem;color:var(--dk-muted)}

/* Crew & extra costs */
body.unified-app .crew-fields{border:1px solid var(--dk-line);border-radius:12px;padding:10px;margin:0;display:grid;gap:8px}
body.unified-app .crew-fields legend{padding:0 4px;font-weight:700;font-size:.85rem;color:var(--dk-text)}
body.unified-app .crew-fields>p{margin:0!important;font-size:.74rem}
body.unified-app .crew-facts{display:grid;gap:6px}
body.unified-app .crew-facts div{display:flex;flex-direction:column;gap:2px;padding:8px 10px 8px 12px;border-radius:10px;background:var(--dk-raised);border-left:3px solid var(--dk-line)}
body.unified-app .crew-facts span{font-size:.64rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--dk-muted)}
body.unified-app .crew-facts b{font-size:.84rem;color:var(--dk-text);font-weight:600}
body.unified-app .crew-facts .is-yes,body.unified-app .crew-facts .policy-included,body.unified-app .crew-facts .policy-none{border-left-color:var(--dk-accent)}
body.unified-app .crew-facts .policy-voluntary{border-left-color:#fbbf24}
body.unified-app .crew-facts .policy-required{border-left-color:#f97316}
body.unified-app .crew-facts .is-no{border-left-color:#8696a0}
body.unified-app .extra-costs{margin-top:8px;padding:8px 10px;border-radius:10px;background:#2a2113;border:1px solid #4a3718}
body.unified-app .extra-costs small{font-size:.68rem;font-weight:700;color:#fbbf24;text-transform:uppercase;letter-spacing:.03em}
body.unified-app .extra-costs ul{margin:4px 0 0;padding-left:16px;font-size:.78rem;color:var(--dk-text)}

/* Captain name + meeting point / mooring */
body.unified-app .trip-card-captain{margin:0!important;font-size:.74rem;color:var(--dk-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .trip-card-captain a,body.unified-app .detail-captain a{color:var(--dk-text)!important;font-weight:600;text-decoration:none}
body.unified-app .detail-captain{margin:2px 0!important;font-size:.85rem;color:var(--dk-muted)}
body.unified-app .geo-fields{border:1px solid var(--dk-line);border-radius:12px;padding:10px;margin:0;display:grid;gap:10px}
body.unified-app .geo-fields legend{padding:0 4px;font-weight:700;font-size:.85rem;color:var(--dk-text)}
body.unified-app .geo-fields>p{margin:0!important;font-size:.74rem}
body.unified-app .geo-point{display:grid;gap:6px;padding:10px;border-radius:10px;background:var(--dk-raised)}
body.unified-app .geo-point>strong{font-size:.82rem;color:var(--dk-text)}
body.unified-app .geo-point>label{margin:0!important}
body.unified-app .geo-input{display:flex;gap:6px}
body.unified-app .geo-input input{flex:1;min-width:0}
body.unified-app .geo-input .button{flex:none;margin:0!important;padding:0 10px!important;font-size:.76rem!important;min-height:0!important;white-space:nowrap}
body.unified-app .geo-status{margin:0!important;color:#fbbf24;font-size:.72rem}
body.unified-app .geo-status:empty{display:none}
body.unified-app .geo-panel{display:grid;grid-template-columns:minmax(0,1fr);gap:6px}
body.unified-app .geo-panel h2{margin-bottom:2px!important}
body.unified-app .geo-row{min-width:0;display:flex;align-items:center;gap:10px;padding:10px;border-radius:12px;background:var(--dk-raised);text-decoration:none;color:var(--dk-text)!important;border:1px solid transparent}
body.unified-app .geo-row:active{border-color:var(--dk-accent)}
body.unified-app .geo-icon{flex:none;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:var(--fx-teal-soft);color:var(--dk-accent);font-size:1.05rem}
body.unified-app .geo-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
body.unified-app .geo-text small{font-size:.64rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--dk-muted)}
body.unified-app .geo-text b{font-size:.86rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.unified-app .geo-text em{font-style:normal;font-size:.7rem;color:var(--dk-muted);font-variant-numeric:tabular-nums}
body.unified-app .geo-open{flex:none;font-size:.74rem;font-weight:700;color:var(--dk-accent);padding:6px 9px;border-radius:8px;background:var(--fx-teal-soft)}
body.unified-app .maps-link{color:var(--dk-accent)!important;text-decoration:none}

/* ---- Boat detail (page=boat): compact, sectioned ---- */
body.unified-app .boat-detail{padding-top:10px;padding-bottom:84px;display:flex;flex-direction:column;gap:10px}
body.unified-app .bd-hero{position:relative;border-radius:16px;overflow:hidden;background:var(--dk-raised)}
body.unified-app .bd-hero .gallery-strip{aspect-ratio:16/10}
body.unified-app .bd-nophoto{aspect-ratio:16/7;display:grid;place-items:center;font-size:2.4rem;color:var(--dk-muted)}
body.unified-app .bd-back{position:absolute;top:10px;left:10px;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:rgba(0,0,0,.55);color:#fff!important;text-decoration:none;font-size:1.1rem;backdrop-filter:blur(4px)}
body.unified-app .bd-hero .gallery-caption{padding-right:56px}
body.unified-app .bd-head{display:grid;gap:6px}
body.unified-app .bd-head h1{margin:0!important;font-size:1.3rem!important;line-height:1.2;color:var(--dk-text)}
body.unified-app .bd-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
body.unified-app .bd-rating{display:inline-flex;align-items:center;gap:4px;text-decoration:none;color:var(--dk-text)!important;font-size:.8rem}
body.unified-app .bd-rating small{color:var(--dk-muted)}
body.unified-app .bd-verified{font-size:.66rem;font-weight:700;color:#4ade80;background:#12301f;padding:2px 7px;border-radius:6px}
body.unified-app .bd-captain{margin:0!important;font-size:.8rem;color:var(--dk-muted);line-height:1.35}
body.unified-app .bd-captain a{color:var(--dk-text)!important;font-weight:700;text-decoration:none}
body.unified-app .bd-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:2px}
body.unified-app .bd-stats div{display:flex;flex-direction:column;gap:1px;padding:7px 8px;border-radius:10px;background:var(--dk-card);border:1px solid var(--dk-line);min-width:0}
body.unified-app .bd-stats small{font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--dk-muted)}
body.unified-app .bd-stats b{font-size:.78rem;color:var(--dk-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .bd-stats div:last-child b{color:var(--dk-accent)}
body.unified-app .bd-tabs{position:sticky;top:47px;z-index:20;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:8px 16px;background:var(--dk-bg);border-bottom:1px solid var(--dk-line)}
body.unified-app .bd-tabs::-webkit-scrollbar{display:none}
body.unified-app .bd-tabs a{flex:none;padding:5px 12px;border-radius:999px;background:var(--dk-card);border:1px solid var(--dk-line);color:var(--dk-text)!important;font-size:.76rem;font-weight:600;text-decoration:none}
body.unified-app .bd-tabs a.is-active{background:var(--fx-teal-soft);border-color:#1f5a52;color:var(--dk-accent)!important}
body.unified-app .bd-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
body.unified-app .bd-main{display:grid;grid-template-columns:minmax(0,1fr);gap:10px;min-width:0}
body.unified-app .bd-card{scroll-margin-top:100px;padding:12px;border-radius:14px;background:var(--dk-card);border:1px solid var(--dk-line);display:grid;grid-template-columns:minmax(0,1fr);gap:10px;min-width:0;margin:0!important;box-shadow:none!important}
body.unified-app .bd-card>h2{margin:0!important;font-size:.95rem!important;color:var(--dk-text)}
body.unified-app .bd-card>h2 small{font-size:.72rem;font-weight:600;color:var(--dk-muted);margin-left:4px}
body.unified-app .bd-sub{margin:4px 0 0!important;font-size:.8rem!important;color:var(--dk-text)}
body.unified-app .bd-desc{margin:0!important;font-size:.85rem;line-height:1.5;color:var(--dk-text)}
body.unified-app .bd-more summary{list-style:none;cursor:pointer;font-size:.85rem;line-height:1.5;color:var(--dk-text)}
body.unified-app .bd-more summary::-webkit-details-marker{display:none}
body.unified-app .bd-more-link{display:block;margin-top:2px;color:var(--dk-accent);font-weight:600;font-size:.8rem}
body.unified-app .bd-more[open] summary{display:none}
body.unified-app .bd-chips{display:grid;gap:4px}
body.unified-app .bd-chips>small,body.unified-app .bd-spot>small{font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--dk-muted)}
body.unified-app .bd-chips div{display:flex;flex-wrap:wrap;gap:5px}
body.unified-app .bd-chips span{font-size:.74rem;padding:3px 9px;border-radius:999px;background:var(--dk-raised);color:var(--dk-text)}
body.unified-app .bd-chips.is-fish span{background:var(--fx-teal-soft);color:var(--dk-accent)}
body.unified-app .bd-specs,body.unified-app .bd-costs{margin:0;display:grid;border-top:1px solid var(--dk-line)}
body.unified-app .bd-specs div,body.unified-app .bd-costs div{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid var(--dk-line);font-size:.8rem}
body.unified-app .bd-specs div:last-child,body.unified-app .bd-costs div:last-child{border-bottom:0}
body.unified-app .bd-specs dt,body.unified-app .bd-costs dt{color:var(--dk-muted);flex:none}
body.unified-app .bd-specs dd,body.unified-app .bd-costs dd{margin:0;color:var(--dk-text);text-align:right;font-weight:600;min-width:0;overflow-wrap:anywhere}
body.unified-app .bd-costs .policy-required dd{color:#fb923c}
body.unified-app .bd-costs .policy-voluntary dd{color:#fbbf24}
body.unified-app .bd-costs .policy-included dd,body.unified-app .bd-costs .policy-none dd{color:var(--dk-accent)}
body.unified-app .bd-note{margin:0!important;font-size:.78rem;color:var(--dk-muted);line-height:1.45}
body.unified-app .bd-fine{margin:0!important;font-size:.7rem;color:var(--dk-muted);opacity:.85}
body.unified-app .bd-geo{display:grid;gap:6px}
body.unified-app .bd-geo .geo-row{padding:8px}
body.unified-app .bd-geo .geo-icon{width:32px;height:32px}
body.unified-app .bd-spot{display:grid;gap:6px;padding:10px;border-radius:12px;background:var(--dk-raised)}
body.unified-app .bd-spot>b{font-size:.9rem;color:var(--dk-text)}
body.unified-app .bd-spot-facts{margin:0!important;display:flex;flex-wrap:wrap;gap:10px;font-size:.78rem;color:var(--dk-text)}
body.unified-app .bd-spot .bd-chips span{background:var(--fx-teal-soft)}
body.unified-app #lokasi .panel,body.unified-app #lokasi>section,body.unified-app #lokasi>div:not(.bd-geo):not(.bd-spot){margin:0!important;box-shadow:none!important}
body.unified-app .bd-packages{display:grid;gap:6px}
body.unified-app .bd-package{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px;border-radius:12px;background:var(--dk-raised)}
body.unified-app .bd-package>div{display:flex;flex-direction:column;gap:2px;min-width:0}
body.unified-app .bd-package strong{font-size:.86rem;color:var(--dk-text)}
body.unified-app .bd-package small{font-size:.72rem;color:var(--dk-muted)}
body.unified-app .bd-package p{margin:2px 0 0!important;font-size:.74rem;color:var(--dk-muted)}
body.unified-app .bd-package>b{flex:none;font-size:.92rem;color:var(--dk-accent);text-align:right}
body.unified-app .bd-package>b small{display:block;font-weight:500}
body.unified-app .bd-package .instant-tag{font-size:.6rem;padding:1px 6px;border-radius:5px;vertical-align:1px}
body.unified-app .boat-reviews .rating-summary{padding-top:0}
body.unified-app .boat-reviews .review-head{flex-wrap:wrap;justify-content:flex-start;gap:6px}
body.unified-app .boat-reviews .review-head small{margin-left:auto}
body.unified-app .bd-more-reviews summary{cursor:pointer;padding:8px 0 0;font-size:.8rem;font-weight:600;color:var(--dk-accent)}
body.unified-app .booking-panel.bd-card{position:static}
body.unified-app .booking-panel .calendar{margin:0!important}
body.unified-app .bd-book{gap:8px!important}
body.unified-app .bd-book-row{display:grid;grid-template-columns:1.4fr 1fr;gap:8px}
body.unified-app .bd-bookbar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 16px calc(env(safe-area-inset-bottom) + 10px);background:rgba(var(--dk-card-rgb),.96);border-top:1px solid var(--dk-line);backdrop-filter:blur(8px)}
body.unified-app .bd-bookbar span{display:flex;flex-direction:column;line-height:1.2}
body.unified-app .bd-bookbar span>small{font-size:.66rem;color:var(--dk-muted)}
body.unified-app .bd-bookbar b{font-size:1rem;color:var(--dk-accent)}
body.unified-app .bd-bookbar b small{font-size:.7rem;font-weight:500;color:var(--dk-muted);margin-left:2px}
body.unified-app .bd-bookbar .button{margin:0!important;min-height:0!important;height:40px;padding:0 20px!important;border-radius:12px!important}
@media(min-width:900px){
  body.unified-app .boat-detail{padding-bottom:24px}
  body.unified-app .bd-layout{grid-template-columns:minmax(0,1fr) 340px;align-items:start}
  body.unified-app .booking-panel.bd-card{position:sticky;top:110px}
  body.unified-app .bd-bookbar{display:none}
  body.unified-app .bd-tabs{margin:0;padding:8px 0}
}
body.unified-app .bd-tabs a:first-child{display:block!important}
body.unified-app .bd-spot-facts small{font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--dk-muted);margin-right:2px}
body.unified-app .bd-note b{color:var(--dk-text);font-weight:600}
/* marine weather widget inside the Lokasi card */
body.unified-app #lokasi>.panel{padding:10px!important;border-radius:12px!important;background:var(--dk-raised)!important;border:0!important}
body.unified-app #lokasi>.panel h2{font-size:.8rem!important;margin:0 0 4px!important}
body.unified-app #lokasi>.panel p{font-size:.76rem!important;margin:0!important}
body.unified-app #lokasi>.panel a{font-size:.76rem}
/* booking calendar, dark */
body.unified-app .booking-panel .calendar{border:1px solid var(--dk-line)!important;box-shadow:none!important;background:var(--dk-raised)!important;border-radius:12px;padding:10px!important;color:var(--dk-muted);font-size:.78rem}
body.unified-app .calendar-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
body.unified-app .calendar-top strong{color:var(--dk-text);font-size:.85rem}
body.unified-app .calendar-top button{width:32px!important;height:32px!important;min-height:0!important;padding:0!important;border:1px solid var(--dk-line)!important;border-radius:9px!important;background:var(--dk-card)!important;color:var(--dk-text)!important}
body.unified-app .calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;text-align:center}
body.unified-app .calendar-grid span{padding:6px 0;font-size:.74rem;border-radius:8px}
body.unified-app .calendar-grid .weekday{font-size:.62rem;font-weight:700;color:var(--dk-muted);padding:2px 0}
body.unified-app .calendar-grid .available{background:var(--fx-teal-soft)!important;color:var(--dk-accent)!important;font-weight:700;cursor:pointer}
body.unified-app .calendar-grid .unavailable{background:transparent!important;color:#4b5a63!important;text-decoration:line-through}
body.unified-app .calendar-grid .is-picked{background:var(--dk-accent)!important;color:#062a2a!important}
@media(min-width:900px){body.unified-app .bd-hero .gallery-strip{aspect-ratio:auto;height:400px}body.unified-app .boat-detail{max-width:1100px}}
body.unified-app .bd-picked{margin:0!important;padding:8px 10px;border-radius:10px;background:var(--fx-teal-soft);color:var(--dk-accent);font-size:.8rem;font-weight:600}
body.unified-app .bd-picked.is-unavailable{background:#2a2113;color:#fbbf24}
body.unified-app .bd-alert{margin:0!important;padding:8px 10px;border-radius:10px;background:#2a2113;border:1px solid #4a3718;color:#fcd34d;font-size:.76rem;line-height:1.45}
body.unified-app .bd-book button[disabled]{opacity:.55;cursor:not-allowed}
body.unified-app .calendar-grid span{user-select:none;-webkit-tap-highlight-color:transparent}
body.unified-app .bd-book .package-total{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:2px 10px;padding:10px 12px!important;margin:0!important;border-radius:12px!important;background:var(--dk-raised)!important;border:1px solid var(--dk-line)!important;box-shadow:none!important;color:var(--dk-text)!important}
body.unified-app .bd-book .package-total small{font-size:.74rem!important;color:var(--dk-muted)!important}
body.unified-app .bd-book .package-total strong{font-size:.9rem!important;color:var(--dk-text)!important;text-align:right}
body.unified-app .bd-book .package-total strong.package-grand-total{font-size:1.05rem!important;color:var(--dk-accent)!important}
body.unified-app .bd-book .package-total span{grid-column:1/-1;font-size:.7rem!important;color:var(--dk-muted)!important}
/* marine widget inside the boat page, compact 3-day row */
body.unified-app #lokasi .marine-widget{display:grid;gap:8px}
body.unified-app #lokasi .marine-widget h2{font-size:.82rem!important;margin:0!important;line-height:1.3}
body.unified-app .marine-basis{margin:-4px 0 0!important;font-size:.68rem!important;color:var(--dk-muted)!important;line-height:1.4}
body.unified-app #lokasi .weather-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important;margin:0!important}
body.unified-app #lokasi .weather-card{padding:8px!important;border-radius:10px!important;background:var(--dk-card)!important;border:1px solid var(--dk-line)!important;box-shadow:none!important;display:grid;gap:3px;min-width:0}
body.unified-app #lokasi .weather-card strong{font-size:.7rem!important;color:var(--dk-text)!important;line-height:1.2}
body.unified-app #lokasi .weather-card p{font-size:.7rem!important;color:var(--dk-muted)!important;margin:0!important;line-height:1.25}
body.unified-app #lokasi .weather-card dl{margin:0!important;display:grid;gap:1px}
body.unified-app #lokasi .weather-card dl div{display:flex;justify-content:space-between;gap:4px;font-size:.66rem}
body.unified-app #lokasi .weather-card dt{color:var(--dk-muted)}
body.unified-app #lokasi .weather-card dd{margin:0;color:var(--dk-text);font-weight:700;white-space:nowrap}
body.unified-app #lokasi .weather-card[data-level="warning"],body.unified-app #lokasi .weather-card[data-level="danger"]{border-color:#7c2d12!important}
body.unified-app #lokasi .weather-more{font-size:.74rem;font-weight:600;color:var(--dk-accent)!important;text-decoration:none}
body.unified-app #lokasi .weather-card .marine-level{justify-self:start;max-width:100%;padding:1px 6px!important;font-size:.62rem!important;border-radius:6px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app #lokasi .weather-card dl div{display:flex!important;flex-direction:column!important;gap:0!important;padding:2px 0!important;border:0!important;min-width:0}
body.unified-app #lokasi .weather-card dt{font-size:.6rem!important;text-transform:uppercase;letter-spacing:.03em}
body.unified-app #lokasi .weather-card dd{font-size:.74rem!important;overflow:hidden;text-overflow:ellipsis}
body.unified-app #lokasi .weather-card>*{min-width:0}
body.unified-app #lokasi .weather-card dd{text-align:left!important}

/* Boat page: photo card = main photo + strip (captain & ABK faces, then facility thumbnails) */
body.unified-app .bd-hero-card{border-radius:16px;overflow:hidden;background:var(--dk-card);border:1px solid var(--dk-line)}
body.unified-app .bd-hero-card .bd-hero{border-radius:0}
body.unified-app .bd-strip{display:flex;align-items:stretch;gap:10px;padding:8px 10px 10px;overflow-x:auto;scrollbar-width:none;overscroll-behavior-x:contain}
body.unified-app .bd-strip::-webkit-scrollbar{display:none}
body.unified-app .bd-strip-group{flex:none;display:flex;flex-direction:column;gap:4px}
body.unified-app .bd-strip-group>small{font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--dk-muted);white-space:nowrap}
body.unified-app .bd-strip-sep{flex:none;width:1px;background:var(--dk-line);margin:16px 0 4px}
body.unified-app .bd-crew{display:flex;gap:8px}
body.unified-app .bd-face{margin:0;width:56px;display:flex;flex-direction:column;align-items:center;gap:3px;text-align:center}
body.unified-app .bd-face .gallery-item,body.unified-app .bd-face-initial{width:52px;height:52px;border-radius:50%!important;overflow:hidden;border:2px solid var(--dk-line)!important;background:var(--dk-raised);display:grid;place-items:center}
body.unified-app .bd-face .gallery-item img{width:100%;height:100%;object-fit:cover}
body.unified-app .bd-face.is-captain .gallery-item,body.unified-app .bd-face.is-captain .bd-face-initial{border-color:#fbbf24!important}
body.unified-app .bd-face-initial{font-weight:800;font-size:1.05rem;color:var(--dk-text)}
body.unified-app .bd-face.is-more .bd-face-initial{font-size:.85rem;color:var(--dk-muted);border-style:dashed!important}
body.unified-app .bd-face figcaption{display:flex;flex-direction:column;line-height:1.15;min-width:0;max-width:60px}
body.unified-app .bd-face figcaption small{font-size:.56rem;font-weight:700;text-transform:uppercase;color:var(--dk-muted)}
body.unified-app .bd-face.is-captain figcaption small{color:#fbbf24}
body.unified-app .bd-face figcaption a,body.unified-app .bd-face figcaption span{font-size:.66rem;font-weight:600;color:var(--dk-text)!important;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .bd-fac-strip{display:flex;gap:6px}
body.unified-app .bd-fac-strip .gallery-item{width:76px;height:76px;flex:none;border-radius:10px!important;overflow:hidden}
body.unified-app .bd-fac-strip .gallery-item img{width:100%;height:100%;object-fit:cover}
body.unified-app .bd-fac-strip .gallery-caption{padding:12px 4px 3px;font-size:.52rem;font-weight:600;-webkit-line-clamp:2}

/* Verifikasi shortcut (community page, admins) + Pusat verifikasi */
body.unified-app .review-shortcut{display:flex;align-items:center;gap:10px;margin:8px 8px 0;padding:9px 12px;border-radius:14px;background:var(--dk-card);border:1px solid var(--dk-line);color:var(--dk-text)!important;text-decoration:none}
body.unified-app .review-shortcut.has-pending{border-color:#7f1d1d;background:linear-gradient(120deg,#2a1414,var(--dk-card) 70%)}
body.unified-app .review-shortcut-icon{flex:none;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:var(--fx-teal-soft);color:var(--dk-accent)}
body.unified-app .review-shortcut.has-pending .review-shortcut-icon{background:#3b1414;color:#f87171}
body.unified-app .review-shortcut-text{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.2}
body.unified-app .review-shortcut-text strong{font-size:.84rem}
body.unified-app .review-shortcut-text small{font-size:.7rem;color:var(--dk-muted)}
body.unified-app .review-shortcut-badge{flex:none;min-width:24px;height:24px;padding:0 7px;border-radius:12px;display:grid;place-items:center;background:#ef4444;color:#fff;font-size:.75rem;font-weight:800}
body.unified-app .review-shortcut-ok{flex:none;color:var(--dk-accent);font-weight:800}
body.unified-app .review-center{padding-top:12px;padding-bottom:24px;display:grid;gap:12px;max-width:760px}
body.unified-app .rc-head{display:flex;align-items:center;gap:10px}
body.unified-app .rc-head-icon{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--fx-teal-soft);color:var(--dk-accent)}
body.unified-app .rc-head h1{margin:0!important;font-size:1.2rem!important;color:var(--dk-text)}
body.unified-app .rc-head p{margin:2px 0 0!important;font-size:.78rem;color:var(--dk-muted)}
body.unified-app .rc-list{display:grid;gap:6px}
body.unified-app .rc-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:var(--dk-card);border:1px solid var(--dk-line);color:var(--dk-text)!important;text-decoration:none}
body.unified-app .rc-item.has-pending{border-color:#5b1d1d}
body.unified-app .rc-icon{flex:none;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--dk-raised);color:var(--dk-muted)}
body.unified-app .rc-item.has-pending .rc-icon{background:#3b1414;color:#f87171}
body.unified-app .rc-text{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.25}
body.unified-app .rc-text b{font-size:.86rem}
body.unified-app .rc-text small{font-size:.7rem;color:var(--dk-muted)}
body.unified-app .rc-count{flex:none;min-width:26px;height:26px;padding:0 8px;border-radius:13px;display:grid;place-items:center;font-size:.78rem;font-weight:800;background:var(--fx-teal-soft);color:var(--dk-accent)}
body.unified-app .rc-item.has-pending .rc-count{background:#ef4444;color:#fff}
body.unified-app .rc-section{display:grid;gap:8px;scroll-margin-top:60px}
body.unified-app .rc-section h2{margin:4px 0 0!important;font-size:.95rem!important;color:var(--dk-text)}
body.unified-app .rc-section h2 small{font-size:.72rem;color:var(--dk-muted);font-weight:500;margin-left:4px}
body.unified-app .rc-empty{margin:0!important;font-size:.78rem;color:var(--dk-muted)}
body.unified-app .rc-card{display:grid;gap:6px;padding:12px;border-radius:12px;background:var(--dk-card);border:1px solid var(--dk-line)}
body.unified-app .rc-card-head{display:flex;align-items:center;gap:10px}
body.unified-app .rc-card-head>div{display:flex;flex-direction:column;min-width:0}
body.unified-app .rc-card-head b{font-size:.9rem;color:var(--dk-text)}
body.unified-app .rc-card-head small{font-size:.72rem;color:var(--dk-muted)}
body.unified-app .rc-card-head small a{color:var(--dk-text)!important}
body.unified-app .rc-avatar{width:40px!important;height:40px!important;flex:none}
body.unified-app .rc-card p{margin:0!important;font-size:.8rem;color:var(--dk-text);line-height:1.45}
body.unified-app .rc-card .rc-muted{color:var(--dk-muted)}
body.unified-app .rc-actions{display:grid;gap:6px;margin-top:4px}
body.unified-app .rc-actions input{height:36px;padding:0 10px!important;border-radius:10px!important;border:1px solid var(--dk-line)!important;background:var(--dk-raised)!important;color:var(--dk-text)!important;font-size:.8rem!important;margin:0!important}
body.unified-app .rc-actions div{display:flex;justify-content:flex-end;gap:6px}
body.unified-app .rc-actions .button{margin:0!important;min-height:0!important;height:34px;padding:0 16px!important;font-size:.8rem!important}

/* Captain shortcuts (community page) */

/* Captain pages: Atur jadwal / Kapal saya */
body.unified-app .cp-page{padding-top:12px;padding-bottom:24px;display:grid;gap:10px;max-width:760px}
body.unified-app .cp-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
body.unified-app .cp-head h1{margin:0!important;font-size:1.2rem!important;color:var(--dk-text)}
body.unified-app .cp-head-link{font-size:.76rem;font-weight:700;color:var(--dk-accent)!important;text-decoration:none;padding:6px 10px;border:1px solid var(--dk-line);border-radius:999px;background:var(--dk-card)}
body.unified-app .cp-boats{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none}
body.unified-app .cp-boats a:first-child{display:block!important}
body.unified-app .cp-boats a{flex:none;padding:5px 12px;border-radius:999px;background:var(--dk-card);border:1px solid var(--dk-line);color:var(--dk-text)!important;font-size:.76rem;font-weight:600;text-decoration:none}
body.unified-app .cp-boats a.is-active{background:var(--fx-teal-soft);border-color:#1f5a52;color:var(--dk-accent)!important}
body.unified-app .cp-alert{margin:0!important;padding:8px 10px;border-radius:10px;background:#2a2113;border:1px solid #4a3718;color:#fcd34d;font-size:.76rem}
body.unified-app .cp-card{display:grid;gap:8px;padding:12px;border-radius:14px;background:var(--dk-card);border:1px solid var(--dk-line)}
body.unified-app .cp-card>h2{margin:0!important;font-size:.92rem!important;color:var(--dk-text);display:flex;align-items:center;gap:6px}
body.unified-app .cp-badge{min-width:20px;height:20px;padding:0 6px;border-radius:10px;display:inline-grid;place-items:center;background:#ef4444;color:#fff;font-size:.7rem}
body.unified-app .cp-pending{border-color:#5b1d1d}
body.unified-app .cp-booking{display:grid;gap:6px;padding:10px;border-radius:12px;background:var(--dk-raised)}
body.unified-app .cp-booking-main{display:flex;flex-direction:column;gap:2px}
body.unified-app .cp-booking-main b{font-size:.88rem;color:var(--dk-text)}
body.unified-app .cp-booking-main small{font-size:.74rem;color:var(--dk-muted)}
body.unified-app .cp-expire{color:#fbbf24!important}
body.unified-app .cp-booking-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px}
body.unified-app .cp-booking-actions form{margin:0}
body.unified-app .cp-booking-actions .button{width:100%;margin:0!important;min-height:0!important;height:36px;padding:0!important;font-size:.82rem!important}
body.unified-app .cp-link{font-size:.74rem;font-weight:600;color:var(--dk-accent)!important;text-decoration:none}
body.unified-app .cp-month{display:flex;align-items:center;justify-content:space-between}
body.unified-app .cp-month h2{margin:0!important;font-size:.95rem!important;color:var(--dk-text)}
body.unified-app .cp-month a{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:var(--dk-raised);color:var(--dk-text)!important;text-decoration:none;font-size:1.1rem}
body.unified-app .cp-cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
body.unified-app .cp-wd{text-align:center;font-size:.6rem;font-weight:700;color:var(--dk-muted);padding:2px 0}
body.unified-app .cp-day{margin:0;min-width:0}
body.unified-app .cp-day,body.unified-app .cp-day button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;height:46px;border-radius:9px;font:inherit}
body.unified-app .cp-day button{width:100%;padding:0!important;margin:0!important;min-height:0!important;border:0!important;background:none!important;color:inherit;cursor:pointer;box-shadow:none!important}
body.unified-app .cp-day b{font-size:.82rem}
body.unified-app .cp-day small{font-size:.52rem;font-weight:700;text-transform:uppercase;letter-spacing:.02em}
body.unified-app .cp-day.is-open{background:var(--fx-teal-soft);color:var(--dk-accent)}
body.unified-app .cp-day.is-blocked{background:#2a1a1a;color:#f87171;border:1px dashed #7f1d1d}
body.unified-app .cp-day.is-pending{background:#2d2612;color:#fbbf24}
body.unified-app .cp-day.is-booked{background:#1e3a8a;color:#bfdbfe}
body.unified-app .cp-day.is-past{color:#4b5a63}
body.unified-app .cp-day.is-today{outline:2px solid var(--dk-accent);outline-offset:-2px}
body.unified-app .cp-legend{display:flex;flex-wrap:wrap;gap:10px;font-size:.68rem;color:var(--dk-muted)}
body.unified-app .cp-legend span::before{content:"";display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:4px;vertical-align:-1px}
body.unified-app .cp-legend .is-open::before{background:var(--fx-teal-soft);border:1px solid var(--dk-accent)}
body.unified-app .cp-legend .is-blocked::before{background:#2a1a1a;border:1px dashed #f87171}
body.unified-app .cp-legend .is-pending::before{background:#fbbf24}
body.unified-app .cp-legend .is-booked::before{background:#3b82f6}
body.unified-app .cp-hint,body.unified-app .cp-muted{margin:0!important;font-size:.72rem;color:var(--dk-muted)}
body.unified-app .cp-trip{display:flex;align-items:center;gap:10px;padding:8px;border-radius:12px;background:var(--dk-raised);color:var(--dk-text)!important;text-decoration:none}
body.unified-app .cp-trip-date{flex:none;width:42px;height:42px;border-radius:10px;background:#1e3a8a;color:#bfdbfe;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1}
body.unified-app .cp-trip-date b{font-size:1rem}
body.unified-app .cp-trip-date small{font-size:.58rem;text-transform:uppercase}
body.unified-app .cp-trip-text{flex:1;min-width:0;display:flex;flex-direction:column}
body.unified-app .cp-trip-text b{font-size:.84rem}
body.unified-app .cp-trip-text small{font-size:.72rem;color:var(--dk-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .cp-status{flex:none;font-size:.62rem;font-weight:700;padding:2px 7px;border-radius:6px;background:var(--fx-teal-soft);color:var(--dk-accent)}
body.unified-app .cp-status.is-in_progress{background:#2d2612;color:#fbbf24}
body.unified-app .cp-empty{display:grid;gap:6px;justify-items:start;padding:14px;border-radius:14px;background:var(--dk-card);border:1px dashed var(--dk-line)}
body.unified-app .cp-empty b{color:var(--dk-text)}
body.unified-app .cp-empty p{margin:0!important;font-size:.78rem;color:var(--dk-muted)}
body.unified-app .cp-boat{display:grid;gap:10px;padding:12px;border-radius:14px;background:var(--dk-card);border:1px solid var(--dk-line)}
body.unified-app .cp-boat-top{display:flex;gap:10px;align-items:center}
body.unified-app .cp-boat-photo{flex:none;width:72px;height:72px;border-radius:12px;overflow:hidden;background:var(--dk-raised);display:grid;place-items:center;font-size:1.5rem;color:var(--dk-muted);text-decoration:none}
body.unified-app .cp-boat-photo img{width:100%;height:100%;object-fit:cover}
body.unified-app .cp-boat-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
body.unified-app .cp-boat-info>b{font-size:.95rem;color:var(--dk-text)}
body.unified-app .cp-boat-info>small{font-size:.74rem;color:var(--dk-muted)}
body.unified-app .cp-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:2px}
body.unified-app .cp-tags span{font-size:.66rem;font-weight:700;padding:2px 7px;border-radius:6px;background:var(--dk-raised);color:#fbbf24}
body.unified-app .cp-approval.is-approved{background:#12301f!important;color:#4ade80!important}
body.unified-app .cp-approval.is-pending{background:#2d2612!important;color:#fbbf24!important}
body.unified-app .cp-approval.is-rejected{background:#3b1414!important;color:#f87171!important}
body.unified-app .cp-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
body.unified-app .cp-stats a{display:flex;flex-direction:column;align-items:center;padding:7px 4px;border-radius:10px;background:var(--dk-raised);text-decoration:none;color:var(--dk-text)!important}
body.unified-app .cp-stats b{font-size:1rem}
body.unified-app .cp-stats small{font-size:.62rem;color:var(--dk-muted)}
body.unified-app .cp-online{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0;padding:8px 10px;border-radius:10px;background:var(--dk-raised)}
body.unified-app .cp-online>span{display:flex;flex-direction:column;min-width:0}
body.unified-app .cp-online b{font-size:.82rem;color:var(--dk-text)}
body.unified-app .cp-online small{font-size:.68rem;color:var(--dk-muted)}
body.unified-app .cp-switch{flex:none;position:relative;width:46px;height:26px;min-height:0!important;padding:0!important;margin:0!important;border:0!important;border-radius:13px!important;background:#3a4a53!important;cursor:pointer;box-shadow:none!important}
body.unified-app .cp-switch i{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:left .15s}
body.unified-app .cp-switch.is-on{background:var(--dk-accent)!important}
body.unified-app .cp-switch.is-on i{left:23px}
body.unified-app .cp-missing{display:grid;gap:5px}
body.unified-app .cp-missing small{font-size:.66rem;font-weight:700;color:#fbbf24}
body.unified-app .cp-missing div{display:flex;flex-wrap:wrap;gap:5px}
body.unified-app .cp-missing a{font-size:.7rem;padding:3px 8px;border-radius:999px;border:1px dashed #4a3718;color:#fcd34d!important;text-decoration:none}
body.unified-app .cp-complete{margin:0!important;font-size:.76rem;font-weight:700;color:#4ade80}
body.unified-app .cp-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:6px}
body.unified-app .cp-actions a{text-align:center;padding:8px 4px;border-radius:10px;border:1px solid var(--dk-line);font-size:.74rem;font-weight:600;color:var(--dk-text)!important;text-decoration:none;white-space:nowrap}
body.unified-app .cp-footer-actions{display:flex;flex-wrap:wrap;gap:8px}
body.unified-app .cp-footer-actions .button{margin:0!important;min-height:0!important;height:38px;padding:0 14px!important;font-size:.8rem!important}

/* Captain shortcuts: 3 buttons in one row; Riwayat page */
body.unified-app .cp-range{margin:-4px 0 0!important;text-align:center;font-size:.7rem;color:var(--dk-muted)}
body.unified-app .cp-income-main{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px;border-radius:12px;background:linear-gradient(135deg,var(--fx-teal-soft),#16242b)}
body.unified-app .cp-income-main small{font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--dk-muted)}
body.unified-app .cp-income-main strong{font-size:1.6rem;color:var(--dk-accent);line-height:1.2}
body.unified-app .cp-income-main span{font-size:.72rem;color:var(--dk-muted);text-align:center}
body.unified-app .cp-income-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
body.unified-app .cp-income-grid div{display:flex;flex-direction:column;align-items:center;padding:7px 4px;border-radius:10px;background:var(--dk-raised);min-width:0}
body.unified-app .cp-income-grid small{font-size:.58rem;color:var(--dk-muted);text-align:center;line-height:1.2}
body.unified-app .cp-income-grid b{font-size:.8rem;color:var(--dk-text);white-space:nowrap}
body.unified-app .cp-trend{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;align-items:end;height:84px;padding:4px 2px 0}
body.unified-app .cp-trend div{display:flex;flex-direction:column;align-items:center;gap:3px;height:100%;justify-content:flex-end}
body.unified-app .cp-trend progress{-webkit-appearance:none;appearance:none;writing-mode:vertical-lr;direction:rtl;width:18px;height:62px;border:0;border-radius:5px;background:var(--dk-raised);overflow:hidden}
body.unified-app .cp-trend progress::-webkit-progress-bar{background:var(--dk-raised);border-radius:5px}
body.unified-app .cp-trend progress::-webkit-progress-value{background:#1f5a52;border-radius:5px}
body.unified-app .cp-trend progress::-moz-progress-bar{background:#1f5a52}
body.unified-app .cp-trend .is-current progress::-webkit-progress-value{background:var(--dk-accent)}
body.unified-app .cp-trend .is-current progress::-moz-progress-bar{background:var(--dk-accent)}
body.unified-app .cp-trend small{font-size:.6rem;color:var(--dk-muted)}
body.unified-app .cp-trend .is-current small{color:var(--dk-accent);font-weight:700}
body.unified-app .cp-history-end{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:1px}
body.unified-app .cp-history-end b{font-size:.8rem;color:var(--dk-accent)}
body.unified-app .cp-history-end small{font-size:.62rem;color:var(--dk-muted)}
body.unified-app .cp-history.is-completed .cp-trip-date{background:var(--fx-teal-soft);color:var(--dk-accent)}
body.unified-app .cp-history:is(.is-cancelled,.is-weather_cancelled,.is-declined,.is-expired) .cp-trip-date{background:#2a1a1a;color:#f87171}
body.unified-app .cp-history:is(.is-cancelled,.is-weather_cancelled,.is-declined,.is-expired) .cp-history-end small{color:#f87171}
body.unified-app .cp-history:is(.is-confirmed,.is-in_progress) .cp-history-end small{color:#fbbf24}

/* Captain tools row = same look as the shortcuts row above (.ocean-shortcuts); only the pending badge is extra */
body.unified-app .captain-shortcuts>a{position:relative}
body.unified-app .ocean-shortcuts.captain-shortcuts:has(>a:nth-child(4)){grid-template-columns:repeat(2,minmax(0,1fr))}
body.unified-app .captain-badge{position:absolute;top:3px;right:3px;min-width:16px;height:16px;padding:0 4px;border-radius:8px;display:grid;place-items:center;background:#ef4444;color:#fff;font-size:.6rem;font-weight:800;line-height:1}

/* Main tabs at the top (Komunitas, Pesan, Live, Toko, Cuaca): consistent icons, soft pill on the active tab */
body.unified-app .app-navigation>.app-bottom-navigation .lite-primary-tabs{height:50px!important;padding:0 6px!important;border-top:1px solid rgba(255,255,255,.04)!important}
body.unified-app .app-navigation>.app-bottom-navigation .lite-primary-tabs a{height:50px!important;min-height:50px!important;color:var(--dk-muted)!important;-webkit-tap-highlight-color:transparent}
body.unified-app .app-navigation>.app-bottom-navigation .lite-primary-tabs a::before{content:"";position:absolute;left:50%;top:50%;width:54px;height:34px;margin:-17px 0 0 -27px;border-radius:17px;background:transparent;transition:background .18s,transform .18s;transform:scale(.85)}
body.unified-app .app-navigation>.app-bottom-navigation .lite-primary-tabs a:hover::before{background:rgba(255,255,255,.05);transform:scale(1)}
body.unified-app .app-navigation>.app-bottom-navigation .lite-primary-tabs a.active{color:var(--dk-accent)!important}
body.unified-app .app-navigation>.app-bottom-navigation .lite-primary-tabs a.active::before{background:rgba(45,212,191,.15);transform:scale(1)}
body.unified-app .app-navigation>.app-bottom-navigation .lite-primary-tabs a.active::after{display:none!important}
body.unified-app .app-navigation>.app-bottom-navigation .lite-primary-tabs a .lite-icon{position:relative;width:23px!important;height:23px!important;stroke-width:1.8}
body.unified-app .app-navigation>.app-bottom-navigation .lite-primary-tabs a .tab-fill{fill:transparent;transition:fill .18s}
body.unified-app .app-navigation>.app-bottom-navigation .lite-primary-tabs a.active .tab-fill{fill:currentColor;fill-opacity:.22}
body.unified-app .app-navigation>.app-bottom-navigation .lite-primary-tabs a:active::before{transform:scale(.92)}
body.unified-app .app-navigation>.app-bottom-navigation .notification-badge{top:7px!important;left:calc(50% + 5px)!important;min-width:17px!important;height:17px!important;padding:0 4px!important;border:2px solid var(--dk-card)!important;border-radius:9px!important;font-size:9.5px!important;line-height:13px!important;font-weight:800!important;box-shadow:none!important;display:grid;place-items:center}
body.unified-app .app-navigation>.app-bottom-navigation .notification-badge[hidden]{display:none!important}
body.unified-app .app-navigation>.app-bottom-navigation .notification-badge{right:auto!important;width:auto!important}
/* Tabs blend into the header: no separate band (backdrop blur/saturation, inset, top line) and no pill */
body.unified-app .app-navigation>.app-bottom-navigation{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:transparent!important;width:100%!important;left:0!important;margin:0!important}
body.unified-app .app-navigation>.app-bottom-navigation .lite-primary-tabs{border-top:0!important;background:transparent!important}
body.unified-app .app-navigation>.app-bottom-navigation .lite-primary-tabs a::before,body.unified-app .app-navigation>.app-bottom-navigation .lite-primary-tabs a.active::before,body.unified-app .app-navigation>.app-bottom-navigation .lite-primary-tabs a:hover::before{background:transparent!important}
body.unified-app .app-navigation>.app-bottom-navigation .lite-primary-tabs a.active::after{display:block!important;content:""!important;position:absolute;left:50%!important;right:auto!important;top:auto!important;bottom:6px!important;width:5px!important;height:5px!important;margin-left:-2.5px;border-radius:50%!important;background:var(--dk-accent)!important}

/* ---- Cuaca laut & pasang surut: simple, compact, big clear status ---- */
body.unified-app .wx-page{padding-top:12px;padding-bottom:24px;display:grid;gap:10px;max-width:760px}
body.unified-app .wx-ico{width:22px;height:22px;flex:none}
body.unified-app .wx-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
body.unified-app .wx-head h1{margin:0!important;font-size:1.2rem!important;color:var(--dk-text)}
body.unified-app .wx-tabs{display:flex;gap:4px;padding:3px;border-radius:12px;background:var(--dk-card);border:1px solid var(--dk-line)}
body.unified-app .wx-tabs a{display:flex!important;align-items:center;gap:5px;padding:6px 10px;border-radius:9px;color:var(--dk-muted)!important;font-size:.76rem;font-weight:700;text-decoration:none}
body.unified-app .wx-tabs a .wx-ico{width:17px;height:17px}
body.unified-app .wx-tabs a.is-active{background:var(--fx-teal-soft);color:var(--dk-accent)!important}
/* Three tabs (Cuaca, Pasang surut, Aktivitas ikan): a full-width row under the title, equal widths. */
body.unified-app .wx-head{flex-wrap:wrap}
body.unified-app .wx-head .wx-tabs{flex:1 1 100%}
body.unified-app .wx-head .wx-tabs a{flex:1;justify-content:center;padding:7px 6px;white-space:nowrap}
body.unified-app .wx-loc{display:grid;gap:0;border-radius:14px;background:var(--dk-card);border:1px solid var(--dk-line);overflow:hidden}
body.unified-app .wx-loc-row{display:flex;align-items:center;gap:10px;padding:10px 12px}
body.unified-app .wx-loc-icon{flex:none;width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:var(--fx-teal-soft);color:var(--dk-accent)}
body.unified-app .wx-loc-text{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.25}
body.unified-app .wx-loc-text small{font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--dk-muted)}
body.unified-app .wx-loc-text b{font-size:.92rem;color:var(--dk-text)}
body.unified-app .wx-loc-text span{font-size:.7rem;color:var(--dk-muted)}
body.unified-app .wx-gps{flex:none;display:flex;align-items:center;gap:5px;height:34px;min-height:0!important;margin:0!important;padding:0 10px!important;border-radius:10px!important;border:1px solid #1f5a52!important;background:var(--fx-teal-soft)!important;color:var(--dk-accent)!important;font-size:.74rem!important;font-weight:700;box-shadow:none!important;cursor:pointer}
body.unified-app .wx-gps .wx-ico{width:17px;height:17px}
body.unified-app .wx-change{border-top:1px solid var(--dk-line)}
body.unified-app .wx-change summary{cursor:pointer;list-style:none;padding:9px 12px;font-size:.78rem;font-weight:700;color:var(--dk-accent)}
body.unified-app .wx-change summary::-webkit-details-marker{display:none}
body.unified-app .wx-change summary::after{content:" ▾";font-size:.7rem}
body.unified-app .wx-change[open] summary::after{content:" ▴"}
body.unified-app .wx-change form{display:grid;gap:8px;padding:0 12px 12px;margin:0!important;background:none!important;border:0!important;box-shadow:none!important}
body.unified-app .wx-change label{margin:0!important;font-size:.72rem!important;color:var(--dk-muted)!important}
body.unified-app .wx-change select{height:40px;margin-top:4px!important}
body.unified-app .wx-change .button{margin:0!important;min-height:0!important;height:38px}
body.unified-app .wx-change form.is-loading{opacity:.55;pointer-events:none}
body.unified-app .wx-change .recommendations{display:grid;gap:6px;padding:0 12px 10px}
body.unified-app .wx-days-label{font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--dk-muted);margin-bottom:-4px}
body.unified-app .wx-days{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
body.unified-app .wx-day{display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 4px;border-radius:12px;background:var(--dk-card);border:1.5px solid var(--dk-line);color:var(--dk-text)!important;text-decoration:none;text-align:center;min-width:0}
body.unified-app .wx-day small{font-size:.68rem;font-weight:700;color:var(--dk-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
body.unified-app .wx-day b{font-size:.9rem}
body.unified-app .wx-day .wx-ico{width:26px;height:26px;color:#fbbf24}
body.unified-app .wx-day .marine-level{font-size:.6rem!important;padding:1px 6px!important;border-radius:6px!important}
body.unified-app .wx-day[aria-current]{border-color:var(--dk-accent);background:var(--fx-teal-soft)}
body.unified-app .wx-day[aria-current] small{color:var(--dk-accent)}
body.unified-app .wx-day-na{font-size:.7rem;color:var(--dk-muted);padding:10px 0}
body.unified-app .wx-days-compact .wx-day{padding:8px 4px}
body.unified-app .wx-verdict{display:flex!important;align-items:flex-start;gap:12px;padding:14px!important;margin:0!important;border-radius:16px!important;border:0!important}
body.unified-app .wx-verdict-mark{flex:none;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font-size:1.5rem;font-weight:900;color:#fff}
body.unified-app .wx-verdict>div{display:grid;gap:3px;min-width:0}
body.unified-app .wx-verdict small{font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;opacity:.85}
body.unified-app .wx-verdict strong{font-size:1.1rem;line-height:1.25}
body.unified-app .wx-verdict p{margin:0!important;font-size:.76rem;line-height:1.45;opacity:.92}
body.unified-app .wx-verdict .marine-advice{font-weight:700;opacity:1}
body.unified-app .marine-alert-safe.wx-verdict{background:linear-gradient(135deg,#0f3b2e,var(--fx-teal-soft))!important;color:#d1fae5!important}
body.unified-app .marine-alert-safe .wx-verdict-mark{background:#10b981}
body.unified-app .marine-alert-warning.wx-verdict{background:linear-gradient(135deg,#43310d,#2d2612)!important;color:#fef3c7!important}
body.unified-app .marine-alert-warning .wx-verdict-mark{background:#f59e0b}
body.unified-app .marine-alert-danger.wx-verdict{background:linear-gradient(135deg,#4c1414,#2a1414)!important;color:#fee2e2!important}
body.unified-app .marine-alert-danger .wx-verdict-mark{background:#ef4444}
body.unified-app .wx-verdict strong,body.unified-app .wx-verdict p,body.unified-app .wx-verdict small{color:inherit!important}
body.unified-app .wx-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
body.unified-app .wx-tile{display:flex;flex-direction:column;gap:2px;padding:10px;border-radius:12px;background:var(--dk-card);border:1px solid var(--dk-line);min-width:0}
body.unified-app .wx-tile .wx-ico{width:24px;height:24px;color:var(--dk-accent);margin-bottom:2px}
body.unified-app .wx-tile small{font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--dk-muted);line-height:1.2}
body.unified-app .wx-tile b{font-size:.92rem;color:var(--dk-text);line-height:1.2}
body.unified-app .wx-tile span{font-size:.64rem;color:var(--dk-muted);line-height:1.3}
body.unified-app .wx-tile:last-child span{display:none}
body.unified-app .wx-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px}
body.unified-app .wx-action{display:flex;align-items:center;gap:8px;padding:10px;border-radius:12px;background:var(--dk-card);border:1px solid var(--dk-line);color:var(--dk-text)!important;text-decoration:none;font-size:.78rem;font-weight:700}
body.unified-app .wx-action .wx-ico{color:var(--dk-accent)}
body.unified-app .wx-fold{border-radius:14px;background:var(--dk-card);border:1px solid var(--dk-line);overflow:hidden;padding:0!important;margin:0!important;box-shadow:none!important}
body.unified-app .wx-fold summary{display:flex;align-items:center;gap:8px;cursor:pointer;list-style:none;padding:11px 12px;font-size:.82rem;font-weight:700;color:var(--dk-text)}
body.unified-app .wx-fold summary::-webkit-details-marker{display:none}
body.unified-app .wx-fold summary .wx-ico{color:var(--dk-accent);width:20px;height:20px}
body.unified-app .wx-fold summary::after{content:"▾";margin-left:auto;color:var(--dk-muted);font-size:.8rem}
body.unified-app .wx-fold[open] summary::after{content:"▴"}
body.unified-app .wx-fold iframe{display:block;width:100%;height:340px;border:0}
body.unified-app .wx-fold .windy-layers{display:flex;gap:6px;padding:8px 12px 12px;margin:0!important}
body.unified-app .wx-fold .windy-layers .button{margin:0!important;min-height:0!important;height:32px;padding:0 12px!important;font-size:.76rem!important}
body.unified-app .wx-help{margin:0;padding:0 12px 12px 30px;display:grid;gap:5px;font-size:.78rem;color:var(--dk-text);line-height:1.45}
body.unified-app .wx-help b{color:var(--dk-text)}
body.unified-app .wx-help .is-safe{color:#34d399}
body.unified-app .wx-help .is-warning{color:#fbbf24}
body.unified-app .wx-help .is-danger{color:#f87171}
body.unified-app .wx-state{display:grid;gap:6px;justify-items:start;padding:12px;border-radius:14px;background:var(--dk-card);border:1px dashed var(--dk-line)}
body.unified-app .wx-state b{color:var(--dk-text)}
body.unified-app .wx-state p{margin:0!important;font-size:.78rem;color:var(--dk-muted)}
body.unified-app .wx-page>.fineprint{margin:0!important;font-size:.68rem}
/* detail (per jam) */
body.unified-app .wx-detail-head{display:flex;align-items:center;gap:10px}
body.unified-app .wx-back{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--dk-card);border:1px solid var(--dk-line);color:var(--dk-text)!important;text-decoration:none;font-size:1.05rem}
body.unified-app .wx-detail-head h1{margin:0!important;font-size:1.05rem!important;line-height:1.25;color:var(--dk-text)}
body.unified-app .wx-detail-head p{margin:0!important;font-size:.72rem;color:var(--dk-muted)}
body.unified-app .wx-moon{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:var(--dk-card);border:1px solid var(--dk-line)}
body.unified-app .wx-moon-symbol{font-size:1.6rem;line-height:1}
body.unified-app .wx-moon>div{flex:1;min-width:0;display:flex;flex-direction:column}
body.unified-app .wx-moon b{font-size:.82rem;color:var(--dk-text)}
body.unified-app .wx-moon small{font-size:.68rem;color:var(--dk-muted)}
body.unified-app .wx-moon a{flex:none;font-size:.72rem;font-weight:700;color:var(--dk-accent)!important;text-decoration:none}
body.unified-app .wx-hours{display:grid;border-radius:14px;background:var(--dk-card);border:1px solid var(--dk-line);overflow:hidden}
body.unified-app .wx-hours-head,body.unified-app .wx-hour{display:grid;grid-template-columns:44px minmax(0,1.3fr) minmax(0,.8fr) minmax(0,.8fr);align-items:center;gap:6px;padding:8px 10px}
body.unified-app .wx-hours-head{font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--dk-muted);background:var(--dk-raised)}
body.unified-app .wx-hour{border-top:1px solid var(--dk-line);border-left:3px solid transparent}
body.unified-app .wx-hour[data-level=warning]{border-left-color:#f59e0b}
body.unified-app .wx-hour[data-level=danger]{border-left-color:#ef4444}
body.unified-app .wx-hour>strong{font-size:.82rem;color:var(--dk-text)}
body.unified-app .wx-hour-cond{display:flex;align-items:center;gap:5px;min-width:0}
body.unified-app .wx-hour-cond .wx-ico{width:20px;height:20px;color:#fbbf24}
body.unified-app .wx-hour-cond em{font-style:normal;font-size:.72rem;color:var(--dk-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .wx-hour-wind,body.unified-app .wx-hour-wave{display:flex;flex-direction:column;min-width:0;line-height:1.2}
body.unified-app .wx-hour-wind b,body.unified-app .wx-hour-wave b{font-size:.82rem;color:var(--dk-text)}
body.unified-app .wx-hour-wind small{font-size:.62rem;color:var(--dk-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .wx-hour-wave small{font-size:.62rem;color:var(--dk-muted)}
body.unified-app .wx-hour-current{grid-column:2/-1;font-size:.64rem;color:var(--dk-muted);margin-top:-4px}
/* tides page under the same header */
body.unified-app .tides-page .tide-panel{display:grid;gap:10px;padding:12px!important;margin:0!important;border-radius:14px!important}
body.unified-app .wx-change>summary{padding:9px 12px!important;margin:0!important}
body.unified-app .tides-page .tide-panel>*{margin-top:0!important;margin-bottom:0!important}
body.unified-app .tides-page .tide-date-strip{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px!important}
body.unified-app .tides-page .tide-date-strip a{padding:6px 0!important;text-align:center;border-radius:10px!important}
body.unified-app .tides-page .tide-summary{display:grid!important;grid-template-columns:1fr 1fr;gap:6px!important}
body.unified-app .tides-page .tide-turns{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(88px,1fr))!important;gap:6px!important;overflow:visible!important}
body.unified-app .tides-page .tide-turns>div{min-width:0!important;padding:8px 10px!important}
body.unified-app .tides-page .tide-hourly summary{padding:4px 0}

/* Atur jadwal: every date opens a sheet with bookings and the captain's note */
body.unified-app a.cp-day{position:relative;text-decoration:none;cursor:pointer}
body.unified-app .cp-day.is-guest{background:#2e1f4d;color:#d8b4fe}
body.unified-app .cp-day.is-past-day{opacity:.55}
body.unified-app .cp-day.is-past{color:#4b5a63;background:transparent}
body.unified-app .cp-day.is-selected{outline:2px solid #fff;outline-offset:-2px}
body.unified-app .cp-day small{max-width:100%;overflow:hidden;white-space:nowrap;text-transform:none!important;letter-spacing:0!important;font-size:.56rem!important}
body.unified-app .cp-note-dot{position:absolute;top:4px;right:4px;width:6px;height:6px;border-radius:50%;background:#fbbf24}
body.unified-app .cp-legend .is-guest::before{background:#7c3aed}
body.unified-app .cp-legend .is-note::before{width:6px!important;height:6px!important;border-radius:50%!important;background:#fbbf24}
body.unified-app .cp-sheet-backdrop{position:fixed;inset:0;z-index:90;background:rgba(0,0,0,.6);display:flex;align-items:flex-end;justify-content:center}
body.unified-app .cp-sheet-dismiss{position:absolute;inset:0}
body.unified-app .cp-sheet{position:relative;width:100%;max-width:560px;max-height:88vh;overflow-y:auto;overscroll-behavior:contain;display:grid;gap:10px;padding:14px 14px calc(16px + env(safe-area-inset-bottom));border-radius:18px 18px 0 0;background:var(--dk-card);border:1px solid var(--dk-line);box-shadow:0 -10px 30px rgba(0,0,0,.5);animation:cp-sheet-up .18s ease-out}
@keyframes cp-sheet-up{from{transform:translateY(40px);opacity:.6}to{transform:none;opacity:1}}
body.unified-app .cp-sheet header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
body.unified-app .cp-sheet header small{font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--dk-muted)}
body.unified-app .cp-sheet h2{margin:2px 0 0!important;font-size:1.05rem!important;color:var(--dk-text)}
body.unified-app .cp-sheet-x{flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--dk-raised);color:var(--dk-text)!important;text-decoration:none}
body.unified-app .cp-sheet-booking{display:grid;gap:1px;padding:10px 12px;border-radius:12px;background:#1e3a8a;color:#dbeafe!important;text-decoration:none}
body.unified-app .cp-sheet-booking span{font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;opacity:.8}
body.unified-app .cp-sheet-booking b{font-size:1rem}
body.unified-app .cp-sheet-booking small{font-size:.72rem;opacity:.9}
body.unified-app .cp-sheet-booking em{font-style:normal;font-size:.72rem;font-weight:700;margin-top:3px}
body.unified-app .cp-sheet-booking.is-pending{background:#43310d;color:#fef3c7!important}
body.unified-app .cp-sheet-booking.is-completed{background:var(--fx-teal-soft);color:#ccfbf1!important}
body.unified-app .cp-sheet-booking.is-guest{background:#2e1f4d;color:#ede9fe!important}
body.unified-app .cp-sheet-state{margin:0!important;padding:8px 10px;border-radius:10px;background:var(--dk-raised);font-size:.78rem;color:var(--dk-muted)}
body.unified-app .cp-sheet-form{display:grid;gap:8px;margin:0}
body.unified-app .cp-sheet-form label{display:grid;gap:4px;margin:0!important;font-size:.76rem;font-weight:600;color:var(--dk-text)}
body.unified-app .cp-sheet-form input:not([type=checkbox]),body.unified-app .cp-sheet-form textarea{width:100%;margin:0!important;padding:8px 10px!important;border-radius:10px!important;border:1px solid var(--dk-line)!important;background:var(--dk-raised)!important;color:var(--dk-text)!important;font:inherit;font-size:.85rem!important}
body.unified-app .cp-sheet-form .field-optional{font-weight:400;font-size:.66rem;color:var(--dk-muted)}
body.unified-app .cp-sheet-check{display:flex!important;align-items:flex-start;gap:8px;padding:8px 10px;border-radius:10px;background:var(--dk-raised);cursor:pointer}
body.unified-app .cp-sheet-check input{width:18px;height:18px;margin:1px 0 0;accent-color:var(--dk-accent)}
body.unified-app .cp-sheet-check span{display:flex;flex-direction:column;font-size:.78rem}
body.unified-app .cp-sheet-check small{font-size:.66rem;font-weight:400;color:var(--dk-muted)}
body.unified-app .cp-sheet-actions{display:flex;justify-content:flex-end;gap:6px}
body.unified-app .cp-sheet-actions .button{margin:0!important;min-height:0!important;height:38px;padding:0 18px!important}
body.cp-sheet-open{overflow:hidden}
body.unified-app .cp-sheet-form .field-optional{display:block;background:none!important;border:0!important;padding:0!important;margin:0!important}

/* Rekening bersama: buyer transfer panel + owner queues */
body.unified-app .mp-panel{display:grid;gap:10px;margin-top:8px}
body.unified-app .mp-status{margin:0!important;padding:8px 10px;border-radius:10px;background:var(--dk-raised);font-size:.8rem;color:var(--dk-text)}
body.unified-app .mp-status.is-ok{background:var(--fx-teal-soft);color:#a7f3d0}
body.unified-app .mp-status.is-wait{background:#2d2612;color:#fde68a}
body.unified-app .mp-status.is-bad{background:#3b1414;color:#fecaca}
body.unified-app .mp-steps{display:grid;gap:8px}
body.unified-app .mp-step{display:flex;gap:10px;padding:10px;border-radius:12px;background:var(--dk-raised)}
body.unified-app .mp-step>b{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--fx-teal-soft);color:var(--dk-accent);font-size:.75rem}
body.unified-app .mp-step>div{flex:1;min-width:0;display:grid;gap:4px}
body.unified-app .mp-step strong{font-size:.86rem;color:var(--dk-text)}
body.unified-app .mp-step small{font-size:.72rem;color:var(--dk-muted);line-height:1.4}
body.unified-app .mp-amount,body.unified-app .mp-bank{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
body.unified-app .mp-amount span{font-size:1.35rem;font-weight:800;color:var(--dk-accent)}
body.unified-app .mp-bank span{font-size:.9rem;color:var(--dk-text);font-weight:600}
body.unified-app .mp-bank .mp-number{font-size:1.1rem;letter-spacing:.04em;font-variant-numeric:tabular-nums}
body.unified-app .mp-copy{min-height:0!important;height:28px;margin:0!important;padding:0 10px!important;border-radius:8px!important;border:1px solid #1f5a52!important;background:var(--fx-teal-soft)!important;color:var(--dk-accent)!important;font-size:.72rem!important;font-weight:700;box-shadow:none!important;cursor:pointer}
body.unified-app .mp-form{display:grid;gap:8px;margin:4px 0 0!important}
body.unified-app .mp-form label{display:grid;gap:3px;margin:0!important;font-size:.74rem!important;color:var(--dk-muted)!important}
body.unified-app .mp-form input{margin:0!important}
body.unified-app .mp-row{display:grid;grid-template-columns:1fr 1.3fr;gap:8px}
body.unified-app .mp-proof-link{font-size:.76rem;font-weight:700;color:var(--dk-accent)!important;text-decoration:none}
body.unified-app .mp-account{margin:0!important;font-size:.82rem;color:var(--dk-muted)}
body.unified-app .mp-account b{color:var(--dk-text)}
body.unified-app .mp-item{gap:8px}
body.unified-app .mp-item.is-idle{opacity:.7}
body.unified-app .mp-item-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
body.unified-app .mp-item-head>div{display:flex;flex-direction:column;min-width:0}
body.unified-app .mp-item-head small{font-size:.68rem;color:var(--dk-muted)}
body.unified-app .mp-item-head small a{color:var(--dk-accent)!important}
body.unified-app .mp-item-head b{font-size:.9rem;color:var(--dk-text)}
body.unified-app .mp-item-head strong{flex:none;font-size:1.05rem;color:var(--dk-accent)}
body.unified-app .mp-sender{margin:0!important;font-size:.76rem;color:var(--dk-muted)}
body.unified-app .mp-sender b{color:var(--dk-text)}
body.unified-app .mp-proof{display:block;max-height:220px;overflow:hidden;border-radius:10px;border:1px solid var(--dk-line)}
body.unified-app .mp-proof img{width:100%;display:block;object-fit:cover}
body.unified-app .mp-decide{display:grid;gap:6px;margin:0}
body.unified-app .mp-decide input{height:36px;margin:0!important;padding:0 10px!important;border-radius:10px!important;border:1px solid var(--dk-line)!important;background:var(--dk-raised)!important;color:var(--dk-text)!important;font-size:.8rem!important}
body.unified-app .mp-decide div{display:flex;justify-content:flex-end;gap:6px}
body.unified-app .mp-decide .button{margin:0!important;min-height:0!important;height:34px;padding:0 14px!important;font-size:.78rem!important}
body.unified-app .mp-settings .mp-status{margin-bottom:4px!important}
body.unified-app .mp-panel,body.unified-app .mp-steps,body.unified-app .mp-form{grid-template-columns:minmax(0,1fr);min-width:0;max-width:100%}
body.unified-app .mp-step{min-width:0;max-width:100%}
body.unified-app .mp-row{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr)}
body.unified-app .mp-form input:not([type=file]){width:100%;min-width:0;height:38px;padding:0 10px!important;border-radius:10px!important;border:1px solid var(--dk-line)!important;background:var(--dk-card)!important;color:var(--dk-text)!important;font-size:.85rem!important;box-shadow:none!important}
body.unified-app .mp-form input[type=file]{width:100%;min-width:0;max-width:100%;font-size:.76rem;color:var(--dk-muted)}
body.unified-app .mp-form input:focus{outline:none;border-color:var(--dk-accent)!important}
body.unified-app .mp-panel .mp-step form.mp-form input:not([type=file]):not([type=hidden]){background:var(--dk-bg)!important;border:1px solid #34505c!important}

/* Booking paid directly to the captain */
body.unified-app .pay-fields{border:1px solid var(--dk-line);border-radius:12px;padding:10px;margin:0;display:grid;gap:8px}
body.unified-app .pay-fields legend{padding:0 4px;font-weight:700;font-size:.85rem;color:var(--dk-text)}
body.unified-app .pay-fields>p{margin:0!important;font-size:.74rem}
body.unified-app .pay-group{display:grid;gap:6px;padding:10px;border-radius:10px;background:var(--dk-raised)}
body.unified-app .pay-group>strong{font-size:.8rem;color:var(--dk-text)}
body.unified-app .bd-paypick{border:0;padding:0;margin:0;display:grid;gap:6px}
body.unified-app .bd-paypick legend{padding:0;margin-bottom:4px;font-size:.78rem;font-weight:600;color:var(--dk-text)}
body.unified-app .bd-paypick small{font-size:.72rem;color:var(--dk-muted)}
body.unified-app .bd-payopt{display:flex!important;align-items:center;gap:8px;margin:0!important;padding:9px 10px;border-radius:10px;border:1.5px solid var(--dk-line);background:var(--dk-raised);cursor:pointer;font-size:.84rem;color:var(--dk-text)}
body.unified-app .bd-payopt input{width:18px;height:18px;margin:0;accent-color:var(--dk-accent)}
body.unified-app .bd-payopt:has(input:checked){border-color:var(--dk-accent);background:var(--fx-teal-soft)}
body.unified-app .bd-paylist{margin:0!important;display:flex;flex-wrap:wrap;align-items:center;gap:5px}
body.unified-app .bd-paylist span{font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--dk-muted);margin-right:2px}
body.unified-app .bd-paylist em{font-style:normal;font-size:.74rem;padding:3px 9px;border-radius:999px;background:var(--fx-teal-soft);color:var(--dk-accent)}
body.unified-app .dp-panel{display:grid;gap:8px;margin-top:12px;padding:12px;border-radius:14px;background:var(--dk-raised);border:1px solid var(--dk-line)}
body.unified-app .dp-panel h3{margin:0!important;font-size:.92rem!important;color:var(--dk-text)}
body.unified-app .dp-row{display:flex;justify-content:space-between;gap:10px;font-size:.84rem;color:var(--dk-muted)}
body.unified-app .dp-row strong{font-size:1.1rem;color:var(--dk-accent)}
body.unified-app .dp-row b{color:var(--dk-text)}
body.unified-app .dp-account{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px;border-radius:10px;background:var(--dk-card)}
body.unified-app .dp-account>span{font-weight:600;color:var(--dk-text)}
body.unified-app .dp-account .dp-number{font-size:1.1rem;letter-spacing:.04em;font-variant-numeric:tabular-nums}
body.unified-app .dp-account small{flex-basis:100%;font-size:.74rem;color:var(--dk-muted)}
body.unified-app .dp-account small b{color:var(--dk-text)}
body.unified-app .dp-note{margin:0!important;font-size:.78rem;color:var(--dk-muted)}
body.unified-app .dp-note b{color:var(--dk-text)}
body.unified-app .dp-status span{display:block;padding:8px 10px;border-radius:10px;background:var(--dk-card);font-size:.78rem;color:var(--dk-muted)}
body.unified-app .dp-status .is-ok{background:var(--fx-teal-soft);color:#a7f3d0}
body.unified-app .dp-status .is-wait{background:#2d2612;color:#fde68a}
body.unified-app .dp-panel form{margin:0}
body.unified-app .dp-disclaimer{margin:0!important;font-size:.68rem;line-height:1.45;color:var(--dk-muted)}
body.unified-app .bd-book .bd-paypick label.bd-payopt{display:flex!important;flex-direction:row!important;align-items:center!important;gap:10px!important;min-height:0!important;height:auto!important;padding:10px 12px!important;text-align:left!important}
body.unified-app .bd-book .bd-paypick label.bd-payopt input[type=radio]{flex:none!important;width:18px!important;height:18px!important;min-height:0!important;margin:0!important;padding:0!important;box-shadow:none!important}
body.unified-app .bd-book .bd-paypick label.bd-payopt span{flex:1;font-size:.84rem;font-weight:600}
body.unified-app .pay-fields .pay-group :is(input,select){background:var(--dk-bg)!important;border:1px solid #34505c!important}
body.unified-app form.stack-form fieldset.pay-fields div.pay-group :is(input:not([type=checkbox]):not([type=hidden]),select){background:var(--dk-bg)!important;border:1px solid #34505c!important}

/* Boat checkout (?page=boat_checkout) */
body.unified-app .co-page{padding-top:12px;padding-bottom:96px;display:grid;gap:10px;max-width:640px}
body.unified-app .co-head{display:flex;align-items:center;gap:10px}
body.unified-app .co-head h1{margin:0!important;font-size:1.2rem!important;color:var(--dk-text)}
body.unified-app .co-head p{margin:0!important;font-size:.74rem;color:var(--dk-muted)}
body.unified-app .co-boat{display:flex;align-items:center;gap:10px;padding:10px;border-radius:14px;background:var(--dk-card);border:1px solid var(--dk-line);text-decoration:none;color:var(--dk-text)!important}
body.unified-app .co-boat-photo{flex:none;width:56px;height:56px;border-radius:10px;overflow:hidden;background:var(--dk-raised);display:grid;place-items:center}
body.unified-app .co-boat-photo img{width:100%;height:100%;object-fit:cover}
body.unified-app .co-boat-text{display:flex;flex-direction:column;min-width:0;line-height:1.3}
body.unified-app .co-boat-text b{font-size:.92rem}
body.unified-app .co-boat-text small{font-size:.72rem;color:var(--dk-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .co-gate{display:grid;gap:8px;padding:12px;border-radius:14px;background:var(--dk-card);border:1px dashed var(--dk-line)}
body.unified-app .co-gate p{margin:0!important;font-size:.84rem;color:var(--dk-text)}
body.unified-app .co-form{display:grid;gap:10px;margin:0}
body.unified-app .co-step,body.unified-app .co-summary{display:grid;gap:8px;padding:12px;border-radius:14px;background:var(--dk-card);border:1px solid var(--dk-line)}
body.unified-app .co-step h2,body.unified-app .co-summary h2{display:flex;align-items:center;gap:8px;margin:0!important;font-size:.92rem!important;color:var(--dk-text)}
body.unified-app .co-step h2 b{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--fx-teal-soft);color:var(--dk-accent);font-size:.72rem}
body.unified-app .co-step h2 .field-optional{font-weight:400;font-size:.68rem;color:var(--dk-muted);background:none;padding:0}
body.unified-app .co-cal .calendar{margin:0!important}
body.unified-app .co-date{display:flex!important;align-items:center;justify-content:space-between;gap:10px;margin:0!important;font-size:.76rem!important;color:var(--dk-muted)!important}
body.unified-app .co-date input{width:auto!important;max-width:60%;height:36px;margin:0!important}
body.unified-app .co-hint{margin:0!important;font-size:.76rem;color:var(--dk-accent)}
body.unified-app .co-hint.is-bad{color:#fbbf24}
body.unified-app .co-hint b{color:var(--dk-text)}
body.unified-app .co-options{display:grid;gap:6px}
body.unified-app .co-form label.co-option{display:flex!important;flex-direction:row!important;align-items:center!important;gap:10px!important;margin:0!important;padding:10px 12px!important;border-radius:12px;border:1.5px solid var(--dk-line);background:var(--dk-raised);cursor:pointer;color:var(--dk-text)}
body.unified-app .co-form label.co-option input[type=radio]{flex:none!important;width:18px!important;height:18px!important;margin:0!important;padding:0!important;accent-color:var(--dk-accent);box-shadow:none!important}
body.unified-app .co-option-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
body.unified-app .co-option-text b{font-size:.86rem}
body.unified-app .co-option-text small{font-size:.72rem;color:var(--dk-muted)}
body.unified-app .co-option-text .instant-tag{font-style:normal;font-size:.6rem;padding:1px 6px;border-radius:5px;vertical-align:1px}
body.unified-app .co-option>strong{flex:none;font-size:.9rem;color:var(--dk-accent)}
body.unified-app .co-form label.co-option:has(input:checked){border-color:var(--dk-accent);background:var(--fx-teal-soft)}
body.unified-app .co-option .co-full{display:none;color:#f87171!important;font-weight:600}
body.unified-app .co-form label.co-option.is-full{opacity:.5;cursor:not-allowed}
body.unified-app .co-option.is-full .co-full{display:block}
body.unified-app .co-stepper{display:grid;grid-template-columns:44px 72px 44px 1fr;align-items:center;gap:6px}
body.unified-app .co-stepper button{height:40px;min-height:0!important;margin:0!important;padding:0!important;border-radius:10px!important;border:1px solid var(--dk-line)!important;background:var(--dk-raised)!important;color:var(--dk-text)!important;font-size:1.2rem!important;box-shadow:none!important}
body.unified-app .co-stepper input{height:40px;margin:0!important;text-align:center;font-weight:700;font-size:1rem!important;padding:0!important}
body.unified-app .co-stepper small{font-size:.7rem;color:var(--dk-muted);line-height:1.3}
body.unified-app .co-step textarea{margin:0!important}
body.unified-app .co-summary dl{margin:0;display:grid}
body.unified-app .co-summary dl div{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-bottom:1px solid var(--dk-line);font-size:.82rem}
body.unified-app .co-summary dt{color:var(--dk-muted)}
body.unified-app .co-summary dd{margin:0;color:var(--dk-text);font-weight:600;text-align:right}
body.unified-app .co-summary .co-total{border-bottom:0}
body.unified-app .co-summary .co-total dd{font-size:1.1rem;color:var(--dk-accent)}
body.unified-app .co-summary .extra-costs{margin:0!important}
body.unified-app .co-fine{margin:0!important;font-size:.68rem;line-height:1.45;color:var(--dk-muted)}
body.unified-app .co-bar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 16px calc(env(safe-area-inset-bottom) + 10px);background:rgba(var(--dk-card-rgb),.97);border-top:1px solid var(--dk-line);backdrop-filter:blur(8px)}
body.unified-app .co-bar span{display:flex;flex-direction:column;line-height:1.2}
body.unified-app .co-bar small{font-size:.66rem;color:var(--dk-muted)}
body.unified-app .co-bar b{font-size:1.05rem;color:var(--dk-accent)}
body.unified-app .co-bar .button{margin:0!important;min-height:0!important;height:42px;padding:0 22px!important;border-radius:12px!important}
body.unified-app .co-bar .button[disabled]{opacity:.5}
/* boat page: booking call to action */
body.unified-app .bd-cta-price{margin:0!important;display:flex;flex-direction:column;line-height:1.25}
body.unified-app .bd-cta-price small{font-size:.7rem;color:var(--dk-muted)}
body.unified-app .bd-cta-price b{font-size:1.4rem;color:var(--dk-accent)}
body.unified-app .bd-cta-steps{margin:0;padding-left:18px;display:grid;gap:3px;font-size:.78rem;color:var(--dk-text)}
@media(min-width:900px){body.unified-app .bd-cta{position:sticky;top:110px}}

/* Cuaca: 30-day outlook (verified) / locked card */
body.unified-app .wx-month{display:grid;gap:8px;padding:12px;border-radius:14px;background:var(--dk-card);border:1px solid var(--dk-line)}
body.unified-app .wx-month h2{margin:0!important;font-size:.95rem!important;color:var(--dk-text);display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
body.unified-app .wx-month h2 small{font-size:.66rem;font-weight:700;color:#4ade80;background:#12301f;padding:2px 7px;border-radius:6px}
body.unified-app .wx-month h3{margin:6px 0 0!important;font-size:.66rem!important;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--dk-muted)}
body.unified-app .wx-mrows{display:grid;border-radius:10px;overflow:hidden;border:1px solid var(--dk-line)}
body.unified-app .wx-mrow{display:grid;grid-template-columns:44px minmax(0,1fr) 46px 46px 22px;align-items:center;gap:6px;padding:6px 8px;border-top:1px solid var(--dk-line);border-left:3px solid #10b981;background:var(--dk-raised)}
body.unified-app .wx-mrow:first-child{border-top:0}
body.unified-app .wx-mrow[data-level=warning]{border-left-color:#f59e0b}
body.unified-app .wx-mrow[data-level=danger]{border-left-color:#ef4444}
body.unified-app .wx-mdate{display:flex;flex-direction:column;line-height:1.1}
body.unified-app .wx-mdate b{font-size:.92rem;color:var(--dk-text)}
body.unified-app .wx-mdate small{font-size:.58rem;color:var(--dk-muted);white-space:nowrap}
body.unified-app .wx-mcond{display:flex;align-items:center;gap:5px;min-width:0}
body.unified-app .wx-mcond .wx-ico{width:18px;height:18px;color:#fbbf24;flex:none}
body.unified-app .wx-mcond em{font-style:normal;font-size:.72rem;color:var(--dk-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .wx-mval{display:flex;flex-direction:column;align-items:flex-end;line-height:1.1}
body.unified-app .wx-mval b{font-size:.78rem;color:var(--dk-text)}
body.unified-app .wx-mval small{font-size:.55rem;color:var(--dk-muted)}
body.unified-app .wx-mmoon{text-align:center;font-size:.95rem}
body.unified-app .wx-month-note{margin:0!important;font-size:.68rem;line-height:1.45;color:var(--dk-muted)}
body.unified-app .wx-month-note a{color:var(--dk-accent)!important}
body.unified-app .wx-month.is-locked{background:linear-gradient(135deg,var(--fx-teal-soft),var(--dk-card) 70%);border-color:#1f5a52}
body.unified-app .wx-lock{display:flex;gap:10px;align-items:flex-start}
body.unified-app .wx-lock-icon{flex:none;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:var(--fx-teal-soft);font-size:1.1rem}
body.unified-app .wx-lock b{font-size:.9rem;color:var(--dk-text)}
body.unified-app .wx-lock p{margin:2px 0 0!important;font-size:.76rem;color:var(--dk-muted);line-height:1.4}
body.unified-app .wx-month .button{margin:0!important}

/* Captain onboarding deadline card */
body.unified-app .onb-card{display:grid;gap:6px;margin:8px 8px 0;padding:10px 12px;border-radius:14px;background:linear-gradient(135deg,#2d2612,var(--dk-card) 75%);border:1px solid #4a3718}
body.unified-app .cp-page .onb-card{margin:0}
body.unified-app .onb-card.is-urgent{background:linear-gradient(135deg,#3b1414,var(--dk-card) 75%);border-color:#7f1d1d}
body.unified-app .onb-head{display:flex;flex-direction:column;gap:2px}
body.unified-app .onb-head b{font-size:.86rem;color:#fde68a}
body.unified-app .onb-card.is-urgent .onb-head b{color:#fecaca}
body.unified-app .onb-head small{font-size:.7rem;color:var(--dk-muted);line-height:1.4}
body.unified-app .onb-step{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;background:var(--dk-raised);color:var(--dk-text)!important;text-decoration:none;font-size:.8rem;font-weight:600}
body.unified-app .onb-step span{flex:none;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:#43310d;color:#fbbf24;font-size:.7rem}
body.unified-app .onb-step.is-done{color:var(--dk-muted)!important}
body.unified-app .onb-step.is-done span{background:var(--fx-teal-soft);color:var(--dk-accent)}
/* In-app chat buttons (replaced WhatsApp links) */
body.unified-app .chat-open-form{margin:0}
body.unified-app .chat-open-form .button.full{width:100%}

/* Remove cancelled bookings from one's own history */
body.unified-app .bk-item{position:relative;display:grid}
body.unified-app .bk-item>.list-card{padding-bottom:44px!important}
body.unified-app .bk-item>.bk-hide{position:absolute;left:14px;bottom:10px;margin:0}
body.unified-app .bk-hide{margin:0}
body.unified-app .bk-hide-button{min-height:0!important;height:28px;margin:0!important;padding:0 12px!important;border-radius:8px!important;border:1px solid #5b1d1d!important;background:#2a1414!important;color:#fca5a5!important;font-size:.72rem!important;font-weight:700;box-shadow:none!important;cursor:pointer}
body.unified-app .bk-hide-button.is-armed{background:#b91c1c!important;border-color:#b91c1c!important;color:#fff!important}
body.unified-app .bk-hide-button.is-wide{height:32px;margin-top:8px!important}
body.unified-app .bk-hide-all{margin:0 0 8px}
/* Search card review summary (service score, completed trips, newest review) */
body.unified-app .trip-card-review{margin:0!important;display:flex;flex-wrap:wrap;gap:4px;font-size:.68rem;line-height:1.2}
body.unified-app .trip-card-review span{background:var(--fx-teal-soft);color:var(--dk-accent);padding:2px 6px;border-radius:6px;font-weight:700}
body.unified-app .trip-card-review b{color:var(--dk-text)}
body.unified-app .trip-card-quote{margin:0!important;font-size:.72rem;line-height:1.3;color:var(--dk-text);font-style:italic;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
body.unified-app .trip-card-quote .stars{font-size:.62rem;font-style:normal;vertical-align:-1px}
body.unified-app .trip-card-quote small{color:var(--dk-muted);font-style:normal}
/* Community page: finished trips waiting for a review */
body.unified-app .trip-review-card{margin:8px 8px 0;padding:10px;border-radius:14px;background:linear-gradient(135deg,#17312d,#152238);border:1px solid #2a4a44;display:grid;gap:6px}
body.unified-app .trip-review-head b{display:block;font-size:.9rem;color:var(--dk-text)}
body.unified-app .trip-review-head small{display:block;font-size:.72rem;color:var(--dk-muted);line-height:1.3}
body.unified-app .trip-review-row{display:grid;grid-template-columns:40px minmax(0,1fr) auto auto;align-items:center;gap:8px;padding:6px;border-radius:10px;background:rgba(0,0,0,.2);color:var(--dk-text);text-decoration:none}
body.unified-app .trip-review-photo{width:40px;height:40px;border-radius:8px;overflow:hidden;background:#0f1d2c;display:grid;place-items:center}
body.unified-app .trip-review-photo img{width:100%;height:100%;object-fit:cover}
body.unified-app .trip-review-text{min-width:0}
body.unified-app .trip-review-text b{display:block;font-size:.8rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .trip-review-text small{font-size:.68rem;color:var(--dk-muted)}
body.unified-app .trip-review-stars{color:#f5c542;font-size:.8rem;letter-spacing:1px}
body.unified-app .trip-review-row em{font-style:normal;font-size:.72rem;font-weight:800;background:var(--dk-accent);color:#062019;padding:5px 10px;border-radius:999px}

/* Weather: stale-BMKG notice, "Sekarang" card with the real observation, official BMKG line (2026-10-03) */
body.unified-app .wx-stale{padding:9px 11px;border-radius:12px;background:#2a2113;border:1px solid #4a3718;display:grid;gap:3px}
body.unified-app .wx-stale b{font-size:.8rem;color:#fcd34d}
body.unified-app .wx-stale p{margin:0!important;font-size:.72rem;color:#e7d3a3;line-height:1.4}
body.unified-app .wx-now{display:grid;gap:8px;padding:10px 12px;border-radius:14px;background:var(--dk-card);border:1px solid var(--dk-line)}
body.unified-app .wx-now header{display:flex;align-items:baseline;justify-content:space-between}
body.unified-app .wx-now header b{font-size:.86rem}
body.unified-app .wx-now header small{font-size:.7rem}
body.unified-app .wx-now-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
body.unified-app .wx-now-grid span{display:flex;flex-direction:column;align-items:flex-start;gap:1px;padding:7px 8px;border-radius:10px;background:var(--dk-raised);min-width:0}
body.unified-app .wx-now-grid .wx-ico{width:18px;height:18px;color:var(--dk-accent)}
body.unified-app .wx-now-grid b{font-size:.84rem;line-height:1.2}
body.unified-app .wx-now-grid small{font-size:.64rem;line-height:1.25}
body.unified-app .wx-obs{margin:0!important;font-size:.72rem;line-height:1.45;color:var(--dk-text)}
body.unified-app .wx-obs small{display:block;font-size:.64rem;margin-top:2px}
body.unified-app .wx-obs-tag{display:inline-block;padding:1px 7px;border-radius:999px;background:#12301f;color:#4ade80;font-size:.62rem;font-weight:800;letter-spacing:.02em;margin-right:2px}
body.unified-app .wx-official{margin:0!important;padding:7px 10px;border-radius:10px;background:var(--dk-card);border:1px dashed var(--dk-line);font-size:.7rem;color:var(--dk-muted);line-height:1.4}
body.unified-app .wx-official b{color:var(--dk-text)}
body.unified-app .wx-tile>span{font-size:.66rem}
body.unified-app .marine-official{margin:6px 0 0!important;padding:7px 10px;border-radius:10px;background:#2a2113;border:1px solid #4a3718;color:#fcd34d;font-size:.72rem;line-height:1.4}
body.unified-app .marine-official.is-info{background:#0f2433;border-color:#1e3a5f;color:#bfdbfe}
body.unified-app .marine-official.is-info b{color:#e0f2fe}
body.unified-app .wx-spots{display:grid;gap:4px;padding:0 12px 10px}
body.unified-app .wx-spots small{font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--dk-muted)}
body.unified-app .wx-spots div{display:flex;gap:5px;overflow-x:auto;scrollbar-width:none}
body.unified-app .wx-spots a{flex:none;padding:4px 10px;border-radius:999px;border:1px solid var(--dk-line);background:var(--dk-raised);color:var(--dk-text)!important;font-size:.72rem;font-weight:600;text-decoration:none}
body.unified-app .wx-spots a[aria-current]{border-color:var(--dk-accent);color:var(--dk-accent)!important;background:var(--fx-teal-soft)}

/* Profile page: phone + video call icon buttons beside Ikuti / Kirim pesan (call.js, data-call-user). */
body.unified-app .profile-call-buttons{display:inline-flex;gap:8px;flex:none!important}
body.unified-app .profile-call-button{flex:none;width:42px;height:42px;margin:0;padding:0;border-radius:50%;border:1px solid var(--dk-line);background:var(--dk-raised);color:var(--dk-accent);display:grid;place-items:center;cursor:pointer}
body.unified-app .profile-call-button svg{width:21px;height:21px}
body.unified-app .profile-call-button:active{background:var(--dk-hover)}

/* Profile cover photo + own-profile photo menus (profilePhotoMenus in social_pages.php, social.js). */
body.unified-app .profile-cover{position:relative;overflow:hidden}
body.unified-app .profile-cover.has-photo{background:var(--dk-raised)!important}
body.unified-app .profile-cover-link{position:absolute;inset:0;display:block;cursor:zoom-in}
body.unified-app .profile-cover-link>img{width:100%;height:100%;object-fit:cover;display:block}
body.unified-app .profile-cover-edit{z-index:1}
body.unified-app .profile-cover-edit{position:absolute;right:10px;top:10px;margin:0;display:grid;place-items:center;width:34px;height:34px;padding:0;border:0;border-radius:50%;background:rgba(var(--dk-bg-rgb),.72);color:#fff;font-size:.76rem;font-weight:700;cursor:pointer;backdrop-filter:blur(6px)}
body.unified-app .profile-cover-edit svg{width:18px!important;height:18px!important}
body.unified-app .profile-cover-edit svg,body.unified-app .profile-photo-cam svg,body.unified-app .photo-menu-item svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linejoin:round;stroke-linecap:round;flex:none}
body.unified-app .profile-photo-own{position:relative;padding:0;margin:0;border:0;background:none;border-radius:50%;cursor:pointer;display:inline-block;line-height:0}
body.unified-app .profile-photo-cam{position:absolute;right:2px;bottom:4px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--dk-raised);color:var(--dk-text);border:2px solid var(--dk-card)}
@media(max-width:700px){body.unified-app .user-intro .profile-photo-own{margin-top:-52px}}
body.unified-app .photo-menu{position:fixed;inset:0;z-index:2000;display:flex;align-items:flex-end;justify-content:center}
body.unified-app .photo-menu[hidden]{display:none}
body.unified-app .photo-menu-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55)}
body.unified-app .photo-menu-panel{position:relative;width:100%;max-width:480px;background:var(--dk-card);color:var(--dk-text);border-radius:16px 16px 0 0;padding:14px 12px calc(12px + env(safe-area-inset-bottom));display:grid;gap:4px;box-shadow:0 -10px 30px rgba(0,0,0,.4)}
body.unified-app .photo-menu-panel h2{margin:0 4px 6px;font-size:.95rem}
body.unified-app .photo-menu-panel form{margin:0}
body.unified-app .photo-menu-item{width:100%;margin:0!important;display:flex;align-items:center;gap:12px;min-height:46px;padding:0 12px!important;border:0!important;border-radius:12px!important;background:transparent!important;box-shadow:none!important;color:var(--dk-text)!important;font-size:.88rem!important;font-weight:600;text-align:left;cursor:pointer}
body.unified-app .photo-menu-item:active,body.unified-app .photo-menu-item:hover{background:var(--dk-raised)!important}
body.unified-app .photo-menu-item svg{width:20px;height:20px;color:var(--dk-accent)}
body.unified-app .photo-menu-item.is-danger{color:#f87171!important}
body.unified-app .photo-menu-item.is-armed{background:#dc2626!important;color:#fff!important}
body.unified-app .photo-menu-status{margin:0 12px;font-size:.76rem;color:var(--dk-muted)}
body.unified-app .photo-menu-status:empty{display:none}
body.unified-app .photo-menu.is-busy .photo-menu-item{opacity:.5;pointer-events:none}
body.unified-app .photo-menu-cancel{margin:6px 0 0!important;min-height:44px;border:0!important;border-radius:12px!important;background:var(--dk-raised)!important;color:var(--dk-text)!important;font-weight:700;cursor:pointer}
body.photo-menu-open{overflow:hidden}
/* Profile photo: no white ring (social.css border + fishunter_ui.css box-shadow), only a thin ring in the card colour so it
   stands out from the cover and blends into the page below. */
body.unified-app .wall-avatar{border:0!important;box-shadow:0 0 0 2px var(--dk-card)!important}
body.unified-app .profile-photo-cam{border:0;box-shadow:0 2px 8px rgba(0,0,0,.35)}
/* "Bagikan momenmu" composer avatar: no border (community_refresh.css adds a white border + light outline). */
body.unified-app .composer-heading .avatar{border:0!important;box-shadow:none!important}
/* Profile header on phones: Ikuti / Pesan / call / video (and the admin ⋯) sit in one row right of the profile photo;
   name and bio below. The row is a size container: when it is narrow the follow button drops its text, then buttons shrink. */
@media(max-width:700px){
  body.unified-app .user-intro{display:grid!important;grid-template-columns:auto minmax(0,1fr) auto;column-gap:10px;row-gap:8px;align-items:end}
  body.unified-app .user-intro>:is(.profile-photo-link,.profile-photo-own,span.wall-avatar){grid-column:1;grid-row:1}
  body.unified-app .user-intro>span.wall-avatar{margin-top:-44px}
  body.unified-app .user-intro .profile-photo-link,body.unified-app .user-intro .profile-photo-own{margin-top:-44px!important}
  body.unified-app .user-intro .wall-avatar{width:88px!important;height:88px!important}
  body.unified-app .user-intro .profile-photo-cam{width:26px;height:26px;right:0;bottom:2px}
  body.unified-app .user-intro>.card-actions{grid-column:2;grid-row:1;container-type:inline-size;align-self:end;width:auto!important;flex-basis:auto!important;margin:0!important;padding:0 0 2px!important;border:0!important}
  body.unified-app .user-intro>.card-actions>:not(.button){flex:none!important}
  body.unified-app .user-intro>div:not(.card-actions){grid-column:1/-1;grid-row:2}
  body.unified-app .user-intro>.profile-admin-more{position:static;grid-column:3;grid-row:1;align-self:end;margin-bottom:2px;width:34px;height:34px}
  body.unified-app .user-intro>:not(.profile-photo-link):not(.profile-photo-own):not(.wall-avatar):not(.card-actions):not(.profile-admin-more):not(div){grid-column:1/-1}
}
body.unified-app .user-intro .card-actions{display:flex!important;flex-wrap:nowrap;align-items:center;gap:6px}
body.unified-app .user-intro .card-actions form{margin:0;flex:none!important;width:auto!important}
body.unified-app .user-intro .card-actions form .button.profile-follow{width:auto!important;display:inline-flex;align-items:center;gap:5px;min-height:0!important;height:34px;padding:0 12px 0 10px!important;margin:0!important;font-size:.76rem!important;white-space:nowrap}
body.unified-app .profile-follow svg{width:17px;height:17px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
body.unified-app .user-intro .card-actions .button.is-following{background:var(--dk-raised)!important;border:1px solid var(--dk-line)!important;color:var(--dk-text)!important;box-shadow:none!important}
body.unified-app .user-intro .card-actions>.button{min-height:0!important;height:34px;margin:0!important;padding:0 16px!important;font-size:.8rem!important;flex:1 1 auto!important}
body.unified-app .user-intro .profile-call-buttons{gap:6px}
body.unified-app .user-intro .profile-call-button{width:34px;height:34px}
body.unified-app .user-intro .profile-call-button svg{width:18px;height:18px}
/* "Mengikuti" needs ~266 px for the whole row (with the report flag), "Ikuti" ~230 px; below that the follow button is icon-only. */
@container (max-width:266px){
  body.unified-app .user-intro .card-actions form .button.profile-follow.is-following{width:34px!important;padding:0!important;justify-content:center}
  body.unified-app .profile-follow.is-following .profile-action-label{display:none}
}
@container (max-width:232px){
  body.unified-app .user-intro .card-actions form .button.profile-follow{width:34px!important;padding:0!important;justify-content:center}
  body.unified-app .profile-follow .profile-action-label{display:none}
}
@container (max-width:190px){
  body.unified-app .user-intro .card-actions{gap:4px}
  body.unified-app .user-intro .profile-call-buttons{gap:4px}
  body.unified-app .user-intro .card-actions form .button.profile-follow,body.unified-app .user-intro .profile-call-button{width:30px!important;height:30px}
}
@media(max-width:340px){
  body.unified-app .user-intro{column-gap:6px}
  body.unified-app .user-intro .wall-avatar{width:80px!important;height:80px!important}
  body.unified-app .user-intro>.profile-admin-more{width:30px;height:30px}
}
/* Profile name row: name, verified badge, then the role as a pill in the badge's colour. */
body.unified-app .user-intro h1.profile-name{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px;line-height:1.15}
body.unified-app .user-intro h1.profile-name>span:first-child{min-width:0;overflow-wrap:anywhere}
body.unified-app .user-intro h1.profile-name .verified-star{margin:0!important}
body.unified-app .role-pill{--rp:#4c9aff;display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:999px;font-size:.66rem;font-weight:800;letter-spacing:.03em!important;text-transform:uppercase;line-height:1;white-space:nowrap;color:var(--rp);background:color-mix(in srgb,var(--rp) 15%,transparent);border:1px solid color-mix(in srgb,var(--rp) 38%,transparent)}
body.unified-app .role-pill.is-gold{--rp:#f5b800}
body.unified-app .role-pill.is-red{--rp:#ff5470}
body.unified-app .role-pill.is-green{--rp:#34c46a}
body.unified-app .role-pill.is-teal{--rp:#2dd4bf}
body.unified-app .role-pill.is-purple{--rp:#b48cff}
body.unified-app .user-intro .profile-subline{color:var(--dk-muted)!important;font-size:.85rem}
body.unified-app .user-intro .profile-bio{color:var(--dk-text)!important;font-size:.88rem}
/* The "Tentang" side panel was removed (the bio is in the header), so the posts column takes the full width. */
body.unified-app .wall-body.is-single{grid-template-columns:minmax(0,1fr)!important}
body.unified-app .wall-body.is-single>div:first-child{position:static!important}
body.unified-app .user-intro .card-actions{border-top-color:var(--dk-line)!important}
/* Profile page: tight gap between the profile card and the posts below it. */
body.unified-app .user-wall .user-intro{padding-bottom:12px!important;margin-bottom:0!important}
body.unified-app .user-wall .wall-body{margin-top:8px!important;gap:8px!important}
body.unified-app .user-wall .wall-body>div>h2{margin:10px 0 6px!important}
body.unified-app .user-wall .wall-body>div>h2:first-child{margin-top:4px!important}
/* Confirmation popup (FishunterConfirm in app_shell.js): unfollow, profile call / video call. */
.confirm-sheet{position:fixed;inset:0;z-index:3000;display:flex;align-items:flex-end;justify-content:center}
.confirm-sheet[hidden]{display:none}
.confirm-sheet-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.6);animation:confirm-fade .15s ease-out}
.confirm-sheet-panel{position:relative;width:100%;max-width:440px;background:var(--dk-card,#111b21);color:var(--dk-text,#e9edef);border-radius:18px 18px 0 0;padding:20px 16px calc(14px + env(safe-area-inset-bottom));display:grid;justify-items:center;text-align:center;gap:6px;box-shadow:0 -12px 32px rgba(0,0,0,.45);animation:confirm-up .18s ease-out}
.confirm-sheet-img{width:64px;height:64px;border-radius:50%;overflow:hidden;margin-bottom:4px;background:var(--dk-raised,#202c33)}
.confirm-sheet-img[hidden]{display:none}
.confirm-sheet-img img{width:100%;height:100%;object-fit:cover;display:block}
.confirm-sheet-panel h2{margin:0;font-size:1.02rem;line-height:1.3;color:var(--dk-text,#e9edef)!important}
.confirm-sheet-panel p{margin:0 4px;font-size:.8rem;line-height:1.45;color:var(--dk-muted,#8696a0)!important}
.confirm-sheet-panel p[hidden]{display:none}
.confirm-sheet-actions{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.confirm-sheet-actions button{margin:0;min-height:44px;border:0;border-radius:12px;font:inherit;font-size:.86rem;font-weight:700;cursor:pointer}
.confirm-sheet-cancel{background:var(--dk-raised,#202c33);color:var(--dk-text,#e9edef)}
.confirm-sheet-ok{background:var(--dk-accent,#2dd4bf);color:#062a39}
.confirm-sheet-ok.is-danger{background:#dc2626;color:#fff}
.confirm-sheet-actions button:active{filter:brightness(.92)}
body.confirm-sheet-open{overflow:hidden}
@keyframes confirm-up{from{transform:translateY(24px);opacity:.4}to{transform:none;opacity:1}}
@keyframes confirm-fade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.confirm-sheet-panel,.confirm-sheet-backdrop{animation:none}}
/* Name row: name + badge + role pill on the left; follower counts on the right as plain text in the intro's own style:
   bold number + muted label, "·" between, no box. */
body.unified-app .user-intro .profile-name-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0}
body.unified-app .user-intro .profile-name-row h1.profile-name{margin:0!important;min-width:0;flex:1 1 auto}
body.unified-app .user-intro .profile-name-row .profile-connections{flex:none;display:flex!important;align-items:baseline;gap:0;margin:0;padding:0;background:none;border:0;font-size:.78rem;white-space:nowrap}
body.unified-app .user-intro .profile-name-row .profile-connections a{display:inline!important;color:var(--dk-muted)!important;text-decoration:none!important;font-weight:500}
body.unified-app .user-intro .profile-name-row .profile-connections a b{color:var(--dk-text);font-weight:800}
body.unified-app .user-intro .profile-name-row .profile-connections a+a::before{content:"·";margin:0 6px;color:var(--dk-muted);font-weight:700}
body.unified-app .user-intro .profile-name-row .profile-connections a:active{opacity:.6}
@media(hover:hover){body.unified-app .user-intro .profile-name-row .profile-connections a:hover b{color:var(--dk-accent)}}
/* No "Postingan" heading any more: the first card follows the profile card directly. */
body.unified-app .user-wall .wall-body>div>:first-child{margin-top:0!important}
@media(max-width:700px){body.unified-app .user-intro h1.profile-name{font-size:1.25rem!important}}
/* When the role pill wraps under the name, keep the counts level with the name's first line. */
body.unified-app .user-intro .profile-name-row{align-items:flex-start}
body.unified-app .user-intro .profile-name-row .profile-connections{line-height:1;padding-top:.05rem}
@media(min-width:701px){body.unified-app .user-intro .profile-name-row .profile-connections{padding-top:.64rem}}
/* Counts sit right after the role pill in the same flowing row (the h1 box is flattened with display:contents, so
   name, badge, pill and counts wrap together); on narrow screens they continue on the next line. */
body.unified-app .user-intro .profile-name-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:4px 6px}
body.unified-app .user-intro .profile-name-row .profile-connections{margin-left:0!important;padding-left:0!important}
body.unified-app .user-intro .profile-name-row h1.profile-name{display:contents}
body.unified-app .user-intro .profile-name-row h1.profile-name>span:first-child{font-size:inherit;line-height:1.15}
body.unified-app .user-intro .profile-name-row .profile-connections{padding-top:0!important;margin-left:4px;line-height:1.2;align-self:center}
/* Captain tools (Atur jadwal · Kapal saya · Riwayat · Titik spot) in ONE row, styled like the shortcut row above them
   (icon left of a label that may wrap to two lines, same 42px height); only the inner padding is a bit tighter. */
body.unified-app .ocean-shortcuts.captain-shortcuts,body.unified-app .ocean-shortcuts.captain-shortcuts:has(>a:nth-child(4)){display:grid!important;grid-template-columns:repeat(auto-fit,minmax(0,1fr))!important;grid-auto-flow:column;gap:6px!important}
body.unified-app .ocean-shortcuts.captain-shortcuts>a{padding:7px 6px!important;gap:5px!important;min-height:42px!important}
body.unified-app .ocean-shortcuts.captain-shortcuts strong{overflow-wrap:normal;word-break:normal}
body.unified-app .ocean-shortcuts.captain-shortcuts .captain-badge{top:2px;right:2px}
@media(max-width:400px){
  body.unified-app .ocean-shortcuts.captain-shortcuts>a{padding:7px 4px!important;gap:4px!important}
  body.unified-app .ocean-shortcuts.captain-shortcuts strong{letter-spacing:-.01em!important}
}
@media(max-width:340px){
  body.unified-app .ocean-shortcuts.captain-shortcuts strong{font-size:.6rem!important}
  body.unified-app .ocean-shortcuts.captain-shortcuts>a>span:first-child{width:22px!important;height:22px!important}
  body.unified-app .ocean-shortcuts.captain-shortcuts>a>span:first-child .lite-icon{width:14px!important;height:14px!important}
}
/* Captain row labels on ONE line: each tile is a size container and the label's font follows its width
   (as large as fits, 7.5px-10.2px); on phones the icon box shrinks to 22px to leave room for the text. */
body.unified-app .ocean-shortcuts.captain-shortcuts>a{container-type:inline-size}
body.unified-app .ocean-shortcuts.captain-shortcuts>a>div{flex:1 1 auto;min-width:0}
/* "Atur jadwal" (the longest label) is ~5.6em wide; the subtracted px = icon box + gap at each breakpoint. */
body.unified-app .ocean-shortcuts.captain-shortcuts strong{white-space:nowrap!important;overflow:hidden;text-overflow:clip;letter-spacing:-.01em!important;font-size:clamp(7px,calc((100cqw - 32px) / 5.6),10.2px)!important}
@media(max-width:400px){
  body.unified-app .ocean-shortcuts.captain-shortcuts>a>span:first-child{width:22px!important;height:22px!important;border-radius:8px!important}
  body.unified-app .ocean-shortcuts.captain-shortcuts>a>span:first-child .lite-icon{width:14px!important;height:14px!important}
  body.unified-app .ocean-shortcuts.captain-shortcuts strong{font-size:clamp(7px,calc((100cqw - 27px) / 5.6),10.2px)!important}
}
@media(max-width:340px){
  body.unified-app .ocean-shortcuts.captain-shortcuts>a{padding:7px 3px!important;gap:3px!important}
  body.unified-app .ocean-shortcuts.captain-shortcuts>a>span:first-child{width:20px!important;height:20px!important}
  body.unified-app .ocean-shortcuts.captain-shortcuts>a>span:first-child .lite-icon{width:13px!important;height:13px!important}
  body.unified-app .ocean-shortcuts.captain-shortcuts strong{font-size:clamp(7px,calc((100cqw - 24px) / 5.6),10.2px)!important}
}
/* Captain row: bigger one-line labels. Room comes from a 4px tile gap, a smaller icon box and tighter letter-spacing
   ("Atur jadwal" is then ~5.45em wide). */
body.unified-app .ocean-shortcuts.captain-shortcuts,body.unified-app .ocean-shortcuts.captain-shortcuts:has(>a:nth-child(4)){gap:4px!important}
body.unified-app .ocean-shortcuts.captain-shortcuts strong{letter-spacing:-.025em!important;font-size:clamp(8px,calc((100cqw - 32px) / 5.45),10.5px)!important}
@media(max-width:460px){
  body.unified-app .ocean-shortcuts.captain-shortcuts>a{padding:7px 3px!important;gap:3px!important}
  body.unified-app .ocean-shortcuts.captain-shortcuts>a>span:first-child{width:20px!important;height:20px!important;border-radius:7px!important}
  body.unified-app .ocean-shortcuts.captain-shortcuts>a>span:first-child .lite-icon{width:13px!important;height:13px!important}
  body.unified-app .ocean-shortcuts.captain-shortcuts strong{font-size:clamp(8px,calc((100cqw - 23px) / 5.45),10.5px)!important}
}
@media(max-width:340px){
  body.unified-app .ocean-shortcuts.captain-shortcuts>a>span:first-child{width:18px!important;height:18px!important;border-radius:6px!important}
  body.unified-app .ocean-shortcuts.captain-shortcuts>a>span:first-child .lite-icon{width:12px!important;height:12px!important}
  body.unified-app .ocean-shortcuts.captain-shortcuts strong{font-size:clamp(7.5px,calc((100cqw - 21px) / 5.45),10.5px)!important}
}
/* Captain row: icon + label centred as a group in each tile. */
body.unified-app .ocean-shortcuts.captain-shortcuts>a{justify-content:center!important}
body.unified-app .ocean-shortcuts.captain-shortcuts>a>div{flex:0 1 auto!important;width:auto!important}
/* "Masuk" in the header for visitors who are not signed in (left of the search button). */
body.unified-app .lite-login-button{display:inline-flex;align-items:center;justify-content:center;height:36px;padding:0 16px;border-radius:999px;background:var(--dk-accent);color:#062a39!important;font-size:.84rem;font-weight:800;text-decoration:none!important;white-space:nowrap;box-shadow:0 4px 14px -6px rgba(45,212,191,.6)}
body.unified-app .lite-login-button:active{filter:brightness(.92)}
/* Visitors see only Cari kapal + Open Trip (Live komunitas is for members): two equal columns, no empty third. */
body.unified-app .ocean-shortcuts:not(.captain-shortcuts):has(>a:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))!important}
/* Login / register: app logo with the motto underneath, centred above the form. */
body.unified-app .auth-brand{display:flex;flex-direction:column;align-items:center;gap:8px;margin:4px 0 18px;text-align:center}
body.unified-app .auth-brand img{width:96px;height:96px;object-fit:contain;filter:drop-shadow(0 8px 18px rgba(0,0,0,.45))}
body.unified-app .auth-motto{font-size:.82rem;font-weight:700;letter-spacing:.06em!important;color:#5ec4dc}
/* Password fields: eye button inside the field (app_shell.js) to show / hide the password. */
body.unified-app .pw-field{position:relative;display:block}
body.unified-app .pw-field>input{width:100%;padding-right:46px!important}
body.unified-app .pw-toggle{position:absolute;top:50%;right:6px;transform:translateY(-50%);width:36px;height:36px;margin:0!important;padding:0!important;border:0!important;border-radius:50%!important;background:transparent!important;box-shadow:none!important;color:var(--dk-muted)!important;display:grid;place-items:center;cursor:pointer}
body.unified-app .pw-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
body.unified-app .pw-toggle[aria-pressed="true"]{color:var(--dk-accent)!important}
/* Login / registration: message above the button, wrong field outlined in red. */
body.unified-app .auth-error{margin:2px 0 0;padding:10px 12px;border-radius:12px;background:color-mix(in srgb,#ef4444 14%,transparent);border:1px solid color-mix(in srgb,#ef4444 45%,transparent);color:#fca5a5!important;font-size:.84rem;font-weight:600;line-height:1.4}
body.unified-app .auth-error[hidden]{display:none}
body.unified-app :is(input,select).is-invalid{border-color:#ef4444!important;box-shadow:0 0 0 3px color-mix(in srgb,#ef4444 25%,transparent)!important}
/* The form theme fixes input borders with stronger selectors, so the error state uses an outline instead. */
body.unified-app form :is(input,select).is-invalid{outline:2px solid #ef4444!important;outline-offset:0;border-color:#ef4444!important}
/* "Tampilkan kata sandi" checkbox under every password field (app_shell.js). */
body.unified-app .pw-show{display:flex!important;flex-direction:row!important;align-items:center;gap:8px;margin:-4px 0 2px!important;font-size:.82rem!important;font-weight:600!important;color:var(--dk-muted)!important;cursor:pointer;width:max-content}
body.unified-app .pw-show input{width:18px!important;height:18px!important;min-height:0!important;margin:0!important;padding:0!important;accent-color:var(--dk-accent);flex:none}
/* Profile: "Hapus akun" danger panel. */
body.unified-app .account-delete{border:1px solid color-mix(in srgb,#ef4444 35%,transparent)!important}
body.unified-app .account-delete h2{color:#fca5a5!important}
body.unified-app .account-delete-btn{background:#dc2626!important;border-color:#dc2626!important;color:#fff!important;box-shadow:none!important}
/* Lupa kata sandi: choose WhatsApp or email for the reset link. */
body.unified-app .reset-channels{border:0;margin:0;padding:0;display:grid;gap:8px}
body.unified-app .reset-channels legend{font-weight:700;font-size:.86rem;margin-bottom:6px;color:var(--dk-text)}
body.unified-app .reset-channel{display:flex!important;flex-direction:row!important;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;border:1px solid var(--dk-line);background:var(--dk-raised);cursor:pointer}
body.unified-app .reset-channel:has(input:checked){border-color:var(--dk-accent);box-shadow:0 0 0 1px var(--dk-accent)}
body.unified-app .reset-channel input{width:18px!important;height:18px!important;min-height:0!important;margin:0!important;accent-color:var(--dk-accent);flex:none}
body.unified-app .reset-channel span{display:flex;flex-direction:column;gap:1px}
body.unified-app .reset-channel b{font-size:.88rem}
body.unified-app .reset-channel small{font-size:.74rem;color:var(--dk-muted)}
/* Lupa kata sandi: full-screen "Tautan berhasil dikirim" notice (app_shell.js). */
.reset-sent{position:fixed;inset:0;z-index:4000;background:var(--dk-bg,#0b141a);display:flex;align-items:center;justify-content:center;padding:24px 18px calc(24px + env(safe-area-inset-bottom));overflow-y:auto;animation:confirm-fade .18s ease-out}
.reset-sent-inner{width:100%;max-width:420px;display:grid;gap:12px;text-align:center;color:var(--dk-text,#e9edef)}
.reset-sent-icon{justify-self:center;width:84px;height:84px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--dk-accent,#2dd4bf) 16%,transparent);color:var(--dk-accent,#2dd4bf);box-shadow:0 0 0 8px color-mix(in srgb,var(--dk-accent,#2dd4bf) 7%,transparent)}
.reset-sent-icon svg{width:42px;height:42px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.reset-sent h2{margin:6px 0 0;font-size:1.35rem;color:var(--dk-text,#e9edef)!important}
.reset-sent p{margin:0;color:var(--dk-muted,#8696a0)!important;font-size:.92rem;line-height:1.5}
.reset-sent p b{color:var(--dk-text,#e9edef);word-break:break-all}
.reset-sent ol{text-align:left;margin:6px 0 4px;padding:14px 16px 14px 34px;border-radius:14px;background:var(--dk-card,#111b21);border:1px solid var(--dk-line,#222d34);display:grid;gap:8px;font-size:.88rem;line-height:1.45;color:var(--dk-text,#e9edef)}
.reset-sent .button.full{margin-top:4px}
.reset-sent-retry{margin:0;border:0;background:none;color:var(--dk-accent,#2dd4bf);font:inherit;font-size:.86rem;font-weight:700;padding:8px;cursor:pointer}
body.reset-sent-open{overflow:hidden}

/* "Laporkan" sheet (app_shell.js FishunterReport) and report entry points. */
.report-sheet-panel{text-align:left;justify-items:stretch;max-height:92vh;overflow-y:auto}
.report-sheet-panel h2,.report-sheet-panel>p{text-align:center}
.report-options{display:grid;gap:6px;margin-top:8px}
.report-option{display:flex;gap:10px;align-items:flex-start;padding:9px 10px;border-radius:12px;background:var(--dk-raised,#202c33);cursor:pointer}
.report-option input{margin:3px 0 0;accent-color:#ef4444;flex:0 0 auto;width:18px;height:18px}
.report-option span{display:grid;gap:1px;min-width:0}
.report-option b{font-size:.86rem;color:var(--dk-text,#e9edef)}
.report-option small{font-size:.74rem;line-height:1.35;color:var(--dk-muted,#8696a0)}
.report-option:has(input:checked){outline:2px solid #ef4444;outline-offset:-2px}
.report-sheet-panel textarea{width:100%;box-sizing:border-box;margin-top:8px;padding:9px 10px;border-radius:12px;border:1px solid var(--dk-line,#2a3942);background:var(--dk-bg,#0b141a);color:var(--dk-text,#e9edef);font:inherit;font-size:.84rem;resize:vertical}
.report-sheet-panel .report-note{margin:6px 0 0!important;padding:8px 10px;border-radius:10px;background:rgba(239,68,68,.12);color:#fecaca!important;text-align:left!important}
.report-sheet-panel .report-error{margin:6px 0 0!important;color:#f87171!important;text-align:center!important;font-weight:600}
.report-sheet-panel .report-note[hidden],.report-sheet-panel .report-error[hidden]{display:none}
.lite-comment-meta .lite-comment-report{display:inline-grid;place-items:center;width:28px;height:28px;margin:-6px -6px -6px 0;background:none;border:0;padding:0;color:var(--dk-muted,#8696a0);opacity:.7;cursor:pointer}
.lite-comment-meta .lite-comment-report .lite-icon{width:15px;height:15px}
.lite-comment-meta .lite-comment-report:active{opacity:1}
.report-section-title{margin:16px 0 8px;font-size:1rem}
.report-card.is-child{border-left:4px solid #ef4444}
.report-child{display:inline-block;padding:1px 8px;border-radius:999px;background:#dc2626;color:#fff;font-size:.72rem;font-weight:700}
.report-cats{margin:4px 0;font-size:.78rem;color:var(--dk-muted,#8696a0)}
.report-snapshot{margin:6px 0;padding:6px 10px;border-left:3px solid var(--dk-line,#2a3942);background:var(--dk-raised,#202c33);border-radius:6px;font-size:.84rem;white-space:normal}
.report-reason{margin:2px 0;font-size:.8rem;font-style:italic;color:var(--dk-muted,#8696a0)}

/* Notifikasi belum dibaca (2026-10-06): platform.css memberi latar terang #eef8f5 pada wadah sehingga teks putih tak terbaca
   di tema gelap. Wadah transparan + garis gelap; penanda belum dibaca = latar teal tipis + garis kiri + teks tebal. */
body.unified-app .notification-item,body.unified-app .notification-item.is-unread{background:transparent!important;border-bottom:1px solid rgba(255,255,255,.06)!important}
body.unified-app .notification-item.is-unread button{background:rgba(45,212,191,.10)!important;box-shadow:inset 3px 0 0 var(--dk-accent,#2dd4bf)}
body.unified-app .notification-item.is-unread button span{color:#fff!important;font-weight:700}

/* Status server (owner, ?page=server_status, 2026-10-06) */
body.unified-app .server-status-page h1{margin-bottom:12px}
body.unified-app .ss-overall{display:grid;grid-template-columns:1fr auto;gap:2px 12px;padding:14px 16px;border-radius:14px;border:1px solid rgba(255,255,255,.08);background:var(--dk-card);margin-bottom:8px}
body.unified-app .ss-overall strong{font-size:1.05rem;color:#fff}
body.unified-app .ss-overall span{grid-column:1;color:var(--dk-muted,#8696a0);font-size:.86rem}
body.unified-app .ss-overall time{grid-row:1/3;grid-column:2;align-self:center;color:var(--dk-muted,#8696a0);font-size:.8rem}
body.unified-app .ss-overall.ss-ok{box-shadow:inset 4px 0 0 #2dd4bf}
body.unified-app .ss-overall.ss-warn{box-shadow:inset 4px 0 0 #f5b041}
body.unified-app .ss-overall.ss-bad{box-shadow:inset 4px 0 0 #f15c6d}
body.unified-app .ss-heading{font-size:1rem;margin:22px 0 10px;color:var(--dk-text)}
body.unified-app .ss-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
body.unified-app .ss-card{background:var(--dk-card);border:1px solid rgba(255,255,255,.07);border-radius:14px;padding:12px 14px;display:flex;flex-direction:column;gap:4px;min-width:0}
body.unified-app .ss-card .ss-label{color:var(--dk-muted,#8696a0);font-size:.78rem;font-weight:600}
body.unified-app .ss-card strong{font-size:1.45rem;color:#fff;line-height:1.15}
body.unified-app .ss-card small{color:var(--dk-muted,#8696a0);font-size:.74rem;line-height:1.35}
body.unified-app .ss-card.ss-big strong{font-size:2.1rem}
body.unified-app .ss-card.ss-online strong{color:var(--dk-accent)}
body.unified-app .ss-card.ss-warn strong{color:#f5b041}
body.unified-app .ss-card.ss-bad strong{color:#f15c6d}
body.unified-app .ss-card meter{width:100%;height:8px}
body.unified-app .ss-panel{background:var(--dk-card);border:1px solid rgba(255,255,255,.07);border-radius:14px;padding:12px 14px;margin-top:10px}
body.unified-app .ss-panel h3{font-size:.82rem;color:var(--dk-muted,#8696a0);margin:0 0 8px;font-weight:600}
body.unified-app .ss-chart{width:100%;height:auto;display:block}
body.unified-app .ss-chart rect{fill:var(--dk-accent);opacity:.85}
body.unified-app .ss-chart text{fill:var(--dk-muted);font-size:9px}
body.unified-app .ss-chart .ss-grid{stroke:var(--dk-muted,#8696a0);stroke-opacity:.18;stroke-dasharray:2 3}
body.unified-app .ss-chart .ss-base{stroke-opacity:.45;stroke-dasharray:none}
body.unified-app .ss-chart .ss-split{stroke:var(--dk-muted,#8696a0);stroke-opacity:.7;stroke-dasharray:3 3}
body.unified-app .ss-chart rect.ss-old{opacity:.35}
body.unified-app .ss-chart rect.ss-today{opacity:.85}
body.unified-app .ss-chart rect.ss-now{fill:#f5b041;opacity:1}
body.unified-app .ss-chart rect.ss-none{opacity:.15}
body.unified-app .ss-chart text.ss-val{fill:var(--dk-text,#e9edef);font-size:10px;font-weight:700}
body.unified-app .ss-chart text.ss-axis-now{fill:#f5b041;font-weight:700}
body.unified-app .ss-panel .ss-sub{color:var(--dk-muted,#8696a0);font-size:.76rem;line-height:1.4;margin:-4px 0 10px}
body.unified-app .ss-panel .ss-foot{margin:8px 0 0}
body.unified-app .ss-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:12px}
body.unified-app .ss-facts>div{background:rgba(255,255,255,.04);border-radius:10px;padding:8px 10px;display:flex;flex-direction:column;gap:2px;min-width:0}
body.unified-app .ss-facts span{color:var(--dk-muted,#8696a0);font-size:.7rem;font-weight:600}
body.unified-app .ss-facts strong{color:var(--dk-text,#e9edef);font-size:.98rem;line-height:1.2;overflow-wrap:anywhere}
body.unified-app .ss-facts small{color:var(--dk-muted,#8696a0);font-size:.68rem;line-height:1.3}
body.unified-app .ss-facts .ss-up{color:var(--dk-accent)}
body.unified-app .ss-facts .ss-down{color:#f15c6d}
body.unified-app .ss-legend{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:8px;color:var(--dk-muted,#8696a0);font-size:.72rem}
body.unified-app .ss-legend span{display:inline-flex;align-items:center;gap:6px}
body.unified-app .ss-legend i{width:10px;height:10px;border-radius:2px;background:var(--dk-accent)}
body.unified-app .ss-legend i.ss-old{opacity:.35}
body.unified-app .ss-legend i.ss-today{opacity:.85}
body.unified-app .ss-legend i.ss-now{background:#f5b041}
body.unified-app .ss-legend i.ss-line{width:0;height:12px;border-radius:0;background:none;border-left:2px dashed var(--dk-muted,#8696a0)}
body.unified-app .ss-services{display:grid;gap:8px}
body.unified-app .ss-service{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;background:var(--dk-card);border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:10px 14px}
body.unified-app .ss-service strong{color:var(--dk-text);font-size:.9rem;display:block}
body.unified-app .ss-service small{color:var(--dk-muted,#8696a0);font-size:.75rem}
body.unified-app .ss-service em{font-style:normal;font-size:.78rem;font-weight:700;color:var(--dk-accent)}
body.unified-app .ss-dot{width:10px;height:10px;border-radius:50%;background:#2dd4bf;box-shadow:0 0 0 4px rgba(45,212,191,.15)}
body.unified-app .ss-service.ss-bad .ss-dot{background:#f15c6d;box-shadow:0 0 0 4px rgba(241,92,109,.15)}
body.unified-app .ss-service.ss-bad em{color:#f15c6d}
body.unified-app .ss-service.ss-warn .ss-dot{background:#f5b041;box-shadow:0 0 0 4px rgba(245,176,65,.15)}
body.unified-app .ss-service.ss-warn em{color:#f5b041}
body.unified-app .ss-service.ss-off .ss-dot{background:#54656f;box-shadow:none}
body.unified-app .ss-service.ss-off em{color:var(--dk-muted)}
body.unified-app .ss-people{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px}
body.unified-app .ss-people a{display:grid;grid-template-columns:auto 1fr;gap:2px 8px;align-items:center;background:var(--dk-card);border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:8px 10px;color:var(--dk-text);min-width:0}
body.unified-app .ss-people a .avatar{grid-row:1/3;width:34px;height:34px}
body.unified-app .ss-people a span{font-size:.85rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.unified-app .ss-people a small{color:var(--dk-muted,#8696a0);font-size:.72rem}
body.unified-app .ss-people a small.ss-on{color:var(--dk-accent);font-weight:700}
body.unified-app .ss-note{color:var(--dk-muted,#8696a0);font-size:.8rem;margin:8px 0}

/* App menu drawer (header menu button): slides in from the right over the current page (assets/app_drawer.js). */
body.unified-app .app-drawer{position:fixed;inset:0;z-index:1000}
body.unified-app .app-drawer-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55);opacity:0;transition:opacity .25s ease}
body.unified-app .app-drawer-panel{position:absolute;top:0;right:0;bottom:0;display:flex;flex-direction:column;width:min(86vw,340px);padding:calc(12px + env(safe-area-inset-top,0px)) 12px calc(16px + env(safe-area-inset-bottom,0px));background:var(--dk-bg,#0b141a);border-left:1px solid var(--dk-line);box-shadow:-12px 0 32px rgba(0,0,0,.45);transform:translateX(100%);transition:transform .26s cubic-bezier(.2,.8,.2,1);overflow-y:auto;overscroll-behavior:contain;outline:none}
body.unified-app .app-drawer.is-open .app-drawer-backdrop{opacity:1}
body.unified-app .app-drawer.is-open .app-drawer-panel{transform:translateX(0)}
html.app-drawer-lock,html.app-drawer-lock body{overflow:hidden}
body.unified-app .app-drawer-head{display:flex;align-items:center;gap:8px;padding:4px 2px 12px;margin-bottom:8px;border-bottom:1px solid var(--dk-line)}
body.unified-app .app-drawer-me{flex:1;min-width:0;display:flex;align-items:center;gap:10px;color:var(--dk-text);text-decoration:none}
body.unified-app .app-drawer-avatar{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;overflow:hidden;background:var(--dk-raised);color:var(--dk-text);font-weight:700}
body.unified-app .app-drawer-avatar img{width:100%;height:100%;object-fit:cover}
body.unified-app .app-drawer-me>span:last-child{display:grid;min-width:0}
body.unified-app .app-drawer-me b{font-size:.95rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .app-drawer-me small{font-size:.75rem;color:var(--dk-accent)}
body.unified-app .app-drawer-x{flex:none;width:38px;height:38px;min-height:0;padding:0;border:0;border-radius:50%;background:var(--dk-raised);color:var(--dk-text);font-size:1rem;cursor:pointer}
/* !important: the general card rule (line 38) paints every .lite-menu-grid opaque, which showed as a second box inside the glass drawer. */
body.unified-app .app-drawer-list.lite-menu-grid{display:grid;grid-template-columns:1fr;gap:4px;padding:0;background:transparent!important;border:0!important;box-shadow:none!important}
body.unified-app .app-drawer-list.lite-menu-grid :is(a,button){display:flex;align-items:center;gap:12px;width:100%;padding:12px 10px;border:0!important;border-radius:10px;background:transparent!important;font-size:.9rem;font-weight:600;text-align:left}
body.unified-app .app-drawer-list.lite-menu-grid :is(a,button):active,body.unified-app .app-drawer-list.lite-menu-grid :is(a,button):hover{background:var(--dk-hover)!important}
body.unified-app .app-drawer-list .lite-icon{width:20px;height:20px;color:var(--dk-accent)}
@media (prefers-reduced-motion:reduce){body.unified-app .app-drawer-panel,body.unified-app .app-drawer-backdrop{transition:none}}
/* the drawer starts under the header row (top set by app_drawer.js); the menu button stays above it as the toggle */
body.unified-app .app-drawer-panel{padding-top:12px}
body.unified-app .lite-round[data-drawer-toggle][aria-expanded="true"]{background:var(--dk-accent)!important;color:#06221d!important}
/* Search field (Pengguna list, community search) on the dark theme: no white box. */
body.unified-app .lite-search-form{background:var(--dk-card)!important;border:1px solid var(--dk-line)!important;border-radius:14px;padding:8px;margin:8px 0;box-shadow:none!important}
body.unified-app .lite-search-form input{background:var(--dk-raised)!important;color:var(--dk-text)!important;border:0!important;border-radius:22px}
body.unified-app .lite-search-form button{flex:none;width:44px;height:44px;border-radius:50%;background:var(--dk-accent)!important;color:#06221d!important}
/* A post without text: keep the photo/video a little below the name, time and place instead of touching them. */
body.unified-app .lite-post>.lite-post-head+:is(.post-gallery,.feed-video-shell),body.unified-app .lite-shared>.lite-post-head+:is(.post-gallery,.feed-video-shell){margin-top:12px!important}
/* Drawer, compact (2026-10-06): no ✕ (the menu button toggles), only as tall as its items, narrower, and the feed
   behind stays visible (the transparent backdrop only catches a tap outside to close). */
body.unified-app .app-drawer{bottom:auto;height:100%;pointer-events:none}
body.unified-app .app-drawer.is-open{pointer-events:auto}
body.unified-app .app-drawer-backdrop{background:transparent}
body.unified-app .app-drawer-panel{bottom:auto;width:min(78vw,280px);max-height:calc(100% - 16px);padding:8px 8px 10px;border:1px solid var(--dk-line);border-top:0;border-radius:0 0 0 16px;background:var(--dk-card,#111b21);box-shadow:-6px 10px 28px rgba(0,0,0,.5)}
body.unified-app .app-drawer-head{padding:4px 4px 8px;margin-bottom:4px}
body.unified-app .app-drawer-avatar{width:36px;height:36px}
body.unified-app .app-drawer-me b{font-size:.9rem}
body.unified-app .app-drawer-me small{font-size:.72rem}
body.unified-app .app-drawer-list.lite-menu-grid{gap:0}
body.unified-app .app-drawer-list.lite-menu-grid :is(a,button){gap:10px;padding:9px 8px;font-size:.86rem;border-radius:8px}
body.unified-app .app-drawer-list .lite-icon{width:18px;height:18px}
/* Drawer: see-through so it blends with the feed, and only as wide as its items (no empty space on the right). */
body.unified-app .app-drawer-panel{width:max-content;min-width:200px;max-width:min(78vw,250px);background:rgba(var(--dk-card-rgb),.78);-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);border-color:rgba(255,255,255,.08)}
body.unified-app .app-drawer-head{border-bottom-color:rgba(255,255,255,.08)}
body.unified-app .app-drawer-list.lite-menu-grid :is(a,button){padding-right:14px;white-space:nowrap}
/* Drawer as a card hanging from the menu button (2026-10-06): starts level with the button, which stays on top of
   it as the toggle; drops down from the button's corner instead of sliding in from the side. */
body.unified-app .lite-round[data-drawer-toggle]{position:relative;z-index:1001}
body.unified-app .app-drawer-panel{top:0;right:12px;border:1px solid rgba(255,255,255,.08);border-radius:18px;transform:translateY(-10px) scale(.96);transform-origin:top right;opacity:0;transition:transform .22s cubic-bezier(.2,.8,.2,1),opacity .18s ease}
body.unified-app .app-drawer.is-open .app-drawer-panel{transform:none;opacity:1}
body.unified-app .app-drawer-head{min-height:34px;padding:0 50px 8px 4px}
/* Slimmer header (2026-10-06): the logo row was 72px for ~38px of content, the icon row 50px. */
body.unified-app .lite-header .lite-headrow{min-height:0!important;height:58px!important;padding-top:4px!important;padding-bottom:0!important;align-items:center}
body.unified-app .lite-primary-tabs,body.unified-app .lite-primary-tabs a{height:46px!important;min-height:0!important}
body.unified-app .app-navigation>.app-bottom-navigation .lite-primary-tabs.lite-primary-tabs{height:46px!important}
body.unified-app .app-navigation>.app-bottom-navigation .lite-primary-tabs.lite-primary-tabs a{height:46px!important;min-height:0!important}
/* the five icons a bit closer to the logo row */
body.unified-app .lite-header .lite-headrow{height:50px!important;padding-top:6px!important}
body.unified-app .lite-header .lite-headrow{height:44px!important;padding-top:6px!important}
/* Home shortcut tiles (Cari kapal, Trip Laut, Air Tawar & Air Payau; captain tiles too): icon + text centred as a group. */
body.unified-app .ocean-shortcuts>a{justify-content:center!important;text-align:left}
body.unified-app .ocean-shortcuts>a>div{width:auto!important;flex:0 1 auto!important;min-width:0}
/* Cari kapal: the 3 steps sit at the right of the title, compact */
body.unified-app .trip-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
body.unified-app .trip-steps.trip-steps-head{display:flex;flex-direction:column;gap:3px;flex:none}
body.unified-app .trip-steps.trip-steps-head li{padding:3px 8px 3px 4px;font-size:.66rem;border-radius:999px}
body.unified-app .trip-steps.trip-steps-head b{width:16px;height:16px;font-size:.6rem}
/* Cari kapal steps: one row, left to right (wraps under the title on narrow phones instead of stacking) */
body.unified-app .trip-head{flex-wrap:wrap;row-gap:6px}
body.unified-app .trip-steps.trip-steps-head{flex-direction:row;align-items:center;gap:0;margin-left:auto}
body.unified-app .trip-steps.trip-steps-head li{border:0;background:transparent;padding:2px 2px;font-size:.7rem}
body.unified-app .trip-steps.trip-steps-head li+li::before{content:'›';margin:0 5px 0 3px;color:var(--dk-muted)}
/* steps on the same line as the title (title a bit smaller so both fit on a phone) */
body.unified-app .trip-head{flex-wrap:nowrap;align-items:flex-start}
body.unified-app .trip-head>div{min-width:0}
body.unified-app .trip-head h1{font-size:1.2rem;line-height:1.3;white-space:nowrap}
body.unified-app .trip-steps.trip-steps-head{margin-top:3px;flex-wrap:nowrap}
body.unified-app .trip-steps.trip-steps-head li{font-size:.64rem;white-space:nowrap;padding:2px 0}
body.unified-app .trip-steps.trip-steps-head li+li::before{margin:0 3px 0 2px}
body.unified-app .trip-steps.trip-steps-head b{width:15px;height:15px;font-size:.58rem}
body.unified-app .trip-head>div{flex:none}
body.unified-app .trip-head h1{font-size:1.15rem}
body.unified-app .trip-steps.trip-steps-head{min-width:0;justify-content:flex-end}
body.unified-app .trip-steps.trip-steps-head li{gap:3px;font-size:.6rem}
body.unified-app .trip-steps.trip-steps-head li+li::before{margin:0 2px 0 1px}
body.unified-app .trip-steps.trip-steps-head b{width:14px;height:14px;font-size:.55rem}
body.unified-app .trip-steps.trip-steps-head{gap:6px}
body.unified-app .trip-steps.trip-steps-head li+li::before{content:none}
@media (max-width:379px){body.unified-app .trip-head h1{font-size:1.02rem}body.unified-app .trip-steps.trip-steps-head{gap:4px}body.unified-app .trip-steps.trip-steps-head li{font-size:.56rem;gap:2px}body.unified-app .trip-steps.trip-steps-head b{width:13px;height:13px}}
body.unified-app .trip-head>div{flex:1 1 auto;min-width:max-content}
body.unified-app .trip-head>div>p{white-space:normal}
body.unified-app .trip-steps.trip-steps-head{flex:none}
body.unified-app .trip-head>div{min-width:0}
body.unified-app .trip-head>div>h1{width:max-content}
body.unified-app .trip-head>div>p{white-space:nowrap;overflow:visible}
/* Pull to refresh indicator (assets/pull_refresh.js); the browser's own pull-to-refresh is turned off so they never double up. */
html,body{overscroll-behavior-y:contain}
.ptr{position:fixed;left:50%;top:calc(env(safe-area-inset-top,0px) + 8px);z-index:2000;transform:translate(-50%,-48px);opacity:0;pointer-events:none}
.ptr.is-back{transition:transform .22s ease,opacity .22s ease}
.ptr-ring{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--dk-raised,#202c33);color:var(--dk-muted,#8696a0);box-shadow:0 4px 14px rgba(0,0,0,.45)}
.ptr-ring svg{width:20px;height:20px}
.ptr.is-ready .ptr-ring{color:var(--dk-accent,#2dd4bf)}
.ptr.is-busy .ptr-ring{color:var(--dk-accent,#2dd4bf);animation:ptr-spin .8s linear infinite}
@keyframes ptr-spin{to{transform:rotate(360deg)}}
/* Notifikasi: "Tandai semua dibaca" on the right of the title */
body.unified-app .notification-page>.section-head{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:space-between!important;gap:10px;flex-wrap:nowrap}
body.unified-app .notification-page>.section-head h1{margin:0}
body.unified-app .notification-page>.section-head form{margin:0;flex:none}
body.unified-app .notification-page>.section-head .button{padding:8px 14px;font-size:.8rem;min-height:0}
/* Facebook Lite style composer (assets/composer_sheet.js) */
body.unified-app .fbl-trigger{display:flex;align-items:center;gap:10px;padding:10px 12px!important}
body.unified-app .fbl-trigger[hidden]{display:none!important}
body.unified-app .fbl-trigger-me .avatar{width:42px;height:42px;border-radius:50%}
body.unified-app .fbl-pill{flex:1;min-width:0;display:grid;gap:1px;text-align:left;padding:8px 16px;border:0;border-radius:999px;background:var(--dk-raised);color:var(--dk-text);cursor:pointer;min-height:0}
body.unified-app .fbl-pill span{font-size:.92rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .fbl-pill small{font-size:.72rem;color:var(--dk-muted)}
body.unified-app .fbl-photo{flex:none;display:grid;justify-items:center;gap:1px;padding:2px 4px;border:0;background:transparent;color:#4ade80;cursor:pointer;min-height:0}
body.unified-app .fbl-photo .lite-icon{width:26px;height:26px}
body.unified-app .fbl-photo small{font-size:.68rem;color:var(--dk-text)}
/* the form is hidden in the feed and becomes a full-screen sheet when opened */
body.unified-app .lite-composer.is-sheet:not(.is-open){display:none!important}
body.unified-app .lite-composer.is-sheet.is-open{position:fixed;inset:0;z-index:1500;margin:0!important;border:0!important;border-radius:0!important;display:flex!important;flex-direction:column;overflow-y:auto;background:var(--dk-bg,#0b141a)!important;padding:env(safe-area-inset-top,0px) 0 calc(16px + env(safe-area-inset-bottom,0px))!important}
html.composer-sheet-lock,html.composer-sheet-lock body{overflow:hidden}
body.unified-app .lite-composer:not(.is-sheet) .fbl-head{display:none}
body.unified-app .fbl-head{display:flex;align-items:center;gap:12px;padding:12px 14px;border-bottom:1px solid var(--dk-line)}
body.unified-app .fbl-head b{flex:1;font-size:1.05rem}
body.unified-app .fbl-back{width:36px;height:36px;min-height:0;padding:0;border:0;border-radius:50%;background:transparent;color:var(--dk-text);font-size:1.4rem;cursor:pointer}
body.unified-app .fbl-post{min-height:0;padding:6px 4px;border:0;background:transparent;color:var(--dk-accent);font-weight:800;font-size:.95rem;letter-spacing:.02em;cursor:pointer}
body.unified-app .fbl-post:disabled{opacity:.4}
body.unified-app .fbl-me{display:flex;align-items:center;gap:10px;padding:12px 14px}
body.unified-app .fbl-me .avatar{width:44px;height:44px;border-radius:50%}
body.unified-app .fbl-me b{font-size:.98rem}
body.unified-app .lite-composer.is-sheet textarea#post-body{min-height:180px;margin:0 14px!important;padding:10px 0!important;border:0!important;background:transparent!important;font-size:1.25rem;line-height:1.4;resize:none;box-shadow:none!important}
body.unified-app .lite-composer.is-sheet .composer-footer{display:flex;flex-direction:column;align-items:stretch;gap:0;margin-top:auto;padding:0;border-top:1px solid var(--dk-line)}
body.unified-app .lite-composer.is-sheet .composer-tools{display:flex;flex-direction:column;align-items:stretch;gap:0}
body.unified-app .lite-composer.is-sheet .composer-add{display:flex;align-items:center;gap:14px;width:100%;height:auto;min-height:0;padding:12px 16px;border:0;border-radius:0;background:transparent!important;color:var(--dk-text)!important;font-size:1rem;justify-content:flex-start}
body.unified-app .lite-composer.is-sheet .composer-add .lite-icon{width:24px;height:24px}
body.unified-app .lite-composer.is-sheet [data-media-pick] .lite-icon{color:#4ade80}
body.unified-app .lite-composer.is-sheet [data-tag-toggle] .lite-icon{color:#60a5fa}
body.unified-app .lite-composer:not(.is-sheet) .fbl-label{display:none}
body.unified-app .lite-composer.is-sheet .composer-submit{margin:12px 14px 0;width:auto;justify-content:center;border-radius:10px;font-weight:800;letter-spacing:.03em}
body.unified-app .lite-composer.is-sheet :is(.composer-previews,.composer-feedback,.composer-progress,.composer-tags,.composer-tag-panel){margin-left:14px;margin-right:14px}
/* composer sheet: the text box is tall enough for the two-line hint and typing (other rules fixed its height) */
body.unified-app form#buat-postingan.lite-composer.is-sheet textarea#post-body{display:block;height:auto!important;min-height:200px!important;max-height:none!important;overflow-y:auto;font-size:1.15rem!important;line-height:1.45!important;padding:12px 0!important;margin:0 14px!important;flex:0 0 auto}
body.unified-app .lite-composer.is-sheet.is-open .fbl-me{padding-top:16px}
/* Feed trigger: the hint alternates (slides up) like Facebook Lite */
body.unified-app .fbl-pill{display:block;height:44px;padding:0 16px;overflow:hidden;position:relative}
body.unified-app .fbl-rot{position:relative;display:block;height:100%}
body.unified-app .fbl-rot>span{position:absolute;left:0;right:0;top:50%;font-size:.95rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--dk-muted);transform:translateY(-50%);animation:fbl-rot 7s infinite}
body.unified-app .fbl-rot>span:nth-child(2){animation-delay:-3.5s}
@keyframes fbl-rot{0%{opacity:0;transform:translateY(20%)}6%,44%{opacity:1;transform:translateY(-50%)}50%,100%{opacity:0;transform:translateY(-120%)}}
@media (prefers-reduced-motion:reduce){body.unified-app .fbl-rot>span{animation:none}body.unified-app .fbl-rot>span:nth-child(2){display:none}}
/* Sponsored banner in the feed (src/ads.php) */
body.unified-app .lite-post.feed-ad{padding:0 0 12px!important}
body.unified-app .feed-ad-head{display:flex;align-items:center;gap:8px;padding:12px 14px 10px;flex-wrap:wrap}
body.unified-app .feed-ad-badge{padding:2px 8px;border-radius:6px;background:rgba(251,191,36,.15);color:#fbbf24;font-size:.7rem;font-weight:700}
body.unified-app .feed-ad-head b{font-size:.95rem}
body.unified-app .feed-ad-head small{color:var(--dk-muted);font-size:.74rem}
body.unified-app .feed-ad-link{display:block;color:var(--dk-text);text-decoration:none}
body.unified-app .feed-ad-img{display:block;aspect-ratio:1.91/1;background:#0b1c22;overflow:hidden}
body.unified-app .feed-ad-img img{width:100%;height:100%;object-fit:cover;display:block}
body.unified-app .feed-ad-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px 0}
body.unified-app .feed-ad-foot>span:first-child{display:grid;gap:2px;min-width:0}
body.unified-app .feed-ad-foot b{font-size:.92rem}
body.unified-app .feed-ad-foot small{font-size:.76rem;color:var(--dk-muted)}
body.unified-app .feed-ad-cta{flex:none;padding:8px 14px;border-radius:999px;background:var(--dk-accent);color:#06221d;font-weight:700;font-size:.82rem}
/* ?page=ads_admin */
.ads-admin .ads-switch{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:10px}
.ads-admin .ads-toggle{display:flex!important;align-items:center;gap:10px;flex:1 1 220px}
.ads-admin .ads-toggle input{width:22px;height:22px;flex:none}
.ads-admin .ads-toggle span{display:grid}
.ads-admin .ads-toggle small{color:var(--ot-muted);font-size:.74rem}
.ads-admin .ads-every{display:grid;gap:2px;font-size:.78rem}
.ads-admin .ads-preview{max-width:240px;border-radius:8px}
.ads-admin .ads-check{display:flex!important;align-items:center;gap:8px}
.ads-admin .ads-check input{width:auto!important;flex:none!important}
.ads-admin .ads-row{cursor:default}
.ads-admin .ads-actions{display:flex;gap:10px;align-items:center;font-size:.8rem}
.ads-admin .ads-actions form{margin:0}
.ads-admin .ads-actions a,.ads-admin .ads-actions button{color:var(--ot-accent);background:none;border:0;padding:0;min-height:0;font:inherit;cursor:pointer}
.ads-admin .ads-actions .is-danger{color:#f87171}
body.unified-app .review-shortcut{margin-bottom:12px!important}
/* Iklan & endorse admin: compact bar + shop-like grid */
.ads-admin .ads-bar{display:flex;align-items:center;gap:8px;margin:0 0 8px}
.ads-admin .ads-switch-pill{display:flex!important;align-items:center;gap:8px;flex:1;padding:6px 12px 6px 6px;border:1px solid var(--ot-line);border-radius:999px;background:var(--ot-card);cursor:pointer}
.ads-admin .ads-switch-pill input{position:absolute;opacity:0;width:1px;height:1px}
.ads-admin .ads-knob{position:relative;flex:none;width:40px;height:24px;border-radius:999px;background:var(--ot-raised);transition:background .2s}
.ads-admin .ads-knob::after{content:'';position:absolute;left:3px;top:3px;width:18px;height:18px;border-radius:50%;background:#cbd5e1;transition:transform .2s}
.ads-admin .ads-switch-pill.is-on .ads-knob{background:var(--ot-accent)}
.ads-admin .ads-switch-pill.is-on .ads-knob::after{transform:translateX(16px);background:#06221d}
.ads-admin .ads-switch-pill b{font-size:.85rem}
.ads-admin .ads-bar select{flex:none;width:auto;min-height:0;padding:9px 10px;font-size:.82rem}
.ads-admin .ads-tile-img{position:relative;display:block;aspect-ratio:1.91/1;background:#0b1c22;overflow:hidden}
.ads-admin .ads-tile-img img{width:100%;height:100%;object-fit:cover;display:block}
.ads-admin .ads-tile-img .ot-state{position:absolute;left:6px;top:6px;font-size:.62rem;backdrop-filter:blur(4px)}
.ads-admin .ads-stats{font-size:.66rem;color:var(--ot-muted)}
body.unified-app .ads-admin .ads-tile .shop-tile-title{min-height:0}
.ads-admin .ads-tile .ads-actions{display:flex;align-items:center;gap:8px;margin-top:4px;font-size:.72rem}
.ads-admin .ads-tile .ads-actions .is-danger{margin-left:auto}
body.unified-app .ads-admin .ads-tile-img .ot-state{background:rgba(10,20,26,.88)!important;padding:3px 8px;border-radius:999px}
/* "Pilihan sponsor" strip under the post composer (src/ads.php adsStrip) */
body.unified-app .ads-strip{padding:10px 0 12px;border-bottom:1px solid var(--dk-line);background:var(--dk-card)}
body.unified-app .ads-strip-head{display:flex;align-items:baseline;justify-content:space-between;padding:0 14px 8px}
body.unified-app .ads-strip-head b{font-size:.9rem}
body.unified-app .ads-strip-head small{font-size:.68rem;color:#fbbf24;background:rgba(251,191,36,.12);padding:1px 7px;border-radius:6px}
body.unified-app .ads-strip-row{display:flex;gap:10px;overflow-x:auto;padding:0 14px;scroll-snap-type:x mandatory;scrollbar-width:none}
body.unified-app .ads-strip-row::-webkit-scrollbar{display:none}
body.unified-app .ads-strip-card{flex:none;width:230px;scroll-snap-align:start;border:1px solid var(--dk-line);border-radius:12px;overflow:hidden;background:var(--dk-bg);color:var(--dk-text);text-decoration:none}
body.unified-app .ads-strip-img{position:relative;display:block;aspect-ratio:1.91/1;background:#0b1c22}
body.unified-app .ads-strip-img img{width:100%;height:100%;object-fit:cover;display:block}
body.unified-app .ads-strip-kind{position:absolute;left:6px;top:6px;padding:2px 7px;border-radius:999px;background:rgba(10,20,26,.85);font-size:.64rem;font-weight:700}
body.unified-app .ads-strip-body{display:grid;gap:2px;padding:7px 9px 9px}
body.unified-app .ads-strip-body small{font-size:.68rem;color:var(--dk-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.unified-app .ads-strip-body b{font-size:.8rem;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.5em}
body.unified-app .ads-strip-cta{font-size:.72rem;font-weight:700;color:var(--dk-accent)}
body.unified-app .ads-strip .ads-strip-row{padding:0 14px!important}body.unified-app .ads-strip .ads-strip-row>a:first-child{margin-left:0}body.unified-app .ads-strip .ads-strip-row::after{content:"";flex:none;width:4px}
/* Pilihan sponsor, compact: smaller cards, one-line title, CTA beside the brand */
body.unified-app .ads-strip{padding:8px 0 10px}
body.unified-app .ads-strip-head{padding:0 14px 6px}
body.unified-app .ads-strip-head b{font-size:.82rem}
body.unified-app .ads-strip-row{gap:8px}
body.unified-app .ads-strip-card{width:168px;border-radius:10px}
body.unified-app .ads-strip-kind{font-size:.58rem;padding:1px 6px;left:4px;top:4px}
body.unified-app .ads-strip-body{gap:1px;padding:5px 7px 7px}
body.unified-app .ads-strip-body small{font-size:.6rem}
body.unified-app .ads-strip-body b{font-size:.72rem;-webkit-line-clamp:1;min-height:0;white-space:nowrap;text-overflow:ellipsis;display:block}
body.unified-app .ads-strip-cta{font-size:.64rem}
body.unified-app .ads-strip .ads-strip-row::before{content:"";flex:none;width:6px}
body.unified-app .ads-strip .ads-strip-row{scroll-padding-inline:14px}
body.unified-app .ads-strip{margin-bottom:10px!important}
.ads-admin .ads-tile .ads-actions select{width:auto;min-height:0;padding:2px 4px;font-size:.68rem;border-radius:6px}
body.unified-app .ads-admin .ads-tile .ads-actions{flex-wrap:wrap;row-gap:6px}
body.unified-app .ads-admin .ads-tile .ads-actions form:first-child{flex:1 1 100%}
body.unified-app .ads-admin .ads-tile .ads-actions select{width:100%!important;height:30px!important;min-height:0!important;padding:0 8px!important;font-size:.74rem!important;border-radius:8px!important}
body.unified-app .ads-strip{padding-top:10px}

/* "Promosikan" buttons on the boat and open trip pages (self-serve ads, public/ads_center_pages.php) */
body.unified-app .ad-promo-btn.button{display:flex;justify-content:center;margin:8px 0 10px;background:linear-gradient(135deg,#f59e0b,#ea580c);border-color:#ea580c;color:#1c1203;font-weight:700}

/* App header (logo, search, menu) on every page; the search button hides where the page has its own search field. */
body.unified-app:has(main input[type=search]) .lite-header a[aria-label="Cari komunitas"]{display:none!important}
body.unified-app.has-topbar .app-navigation .lite-frame{padding-left:0!important;padding-right:0!important}
body.unified-app .app-drawer-list a[aria-current="page"]{color:var(--dk-accent,#2dd4bf)!important;background:rgba(45,212,191,.1)!important;border-radius:10px}
/* Review center: photo of a bait shop waiting for verification */
.rc-photo{display:block;width:100%;max-height:220px;margin:8px 0;border-radius:12px;object-fit:cover}

/* Beranda tabs (Untuk Anda / Mengikuti / Postingan saya): ocean_app.css made only the first tab display:block, so its
   text sat higher than the others (flex, centred). Same box for all three: equal widths, text centred both ways. */
body.unified-app .lite-feed-filter>a,body.unified-app .lite-feed-filter>a:first-child{display:inline-flex;align-items:center;justify-content:center;flex:1 1 0;min-width:0;text-align:center;line-height:1.2}

/* Feed photos / videos: the frame around a tall or wide picture takes the post card colour (it was the old light
   mint), so the empty sides blend into the post instead of showing two pale bars. Follows the light theme too. */
body.unified-app .lite-post :is(.post-gallery,.post-gallery.gallery-1,.post-gallery .gallery-photo,.lite-post-media,.social-video,.gallery-video){background:var(--dk-card)!important}

/* Theme switch in the side-menu head, right of the name (left of the menu button). Track + knob with sun / moon. */
body.unified-app .app-drawer-head .app-drawer-me{flex:1;min-width:0}
body.unified-app .app-theme-switch{flex:none;position:relative;width:46px;height:26px;margin-left:auto;padding:0;border:0;border-radius:999px;background:var(--dk-raised)!important;box-shadow:inset 0 0 0 1px var(--dk-line);cursor:pointer}
body.unified-app .app-theme-switch i{position:absolute;top:3px;left:3px;width:20px;height:20px;display:grid;place-items:center;border-radius:50%;background:var(--dk-accent);color:#fff;transition:transform .2s ease}
body.unified-app .app-theme-switch svg{width:13px;height:13px}
body.unified-app .app-theme-switch[aria-checked="true"] i{transform:translateX(20px)}
body.unified-app .app-theme-switch .is-sun{display:none}
html[data-theme="light"] body.unified-app .app-theme-switch .is-sun{display:block}
html[data-theme="light"] body.unified-app .app-theme-switch .is-moon{display:none}
@media (prefers-reduced-motion:reduce){body.unified-app .app-theme-switch i{transition:none}}

/* ===== Light theme: the few places that are drawn for a dark background ===== */
/* Wordmark: metallic white text -> deep sea navy to teal */
html[data-theme="light"] body.unified-app .lite-wordmark .brand-name{background:linear-gradient(180deg,#0b3a4c 0%,#0e5d68 55%,#0f9688 100%);-webkit-background-clip:text;background-clip:text;filter:none}
html[data-theme="light"] body.unified-app .lite-wordmark .mancing-brand-type small{color:#0f7f8f!important}
/* Labels that used to sit on the sea wallpaper (white with a shadow) */
html[data-theme="light"] body.unified-app.scenic-bg :is(.feed-section-heading,.feed-section-heading *,.feed-eyebrow,.lite-section-title,.lite-section-title *,.inbox-subbar .inbox-hint,.inbox-subbar .inbox-read-all,.inbox-compact .inbox-group,.inbox-compact .inbox-none:not(.list-grid *)){color:var(--dk-text)!important;text-shadow:none!important}
html[data-theme="light"] body.unified-app.scenic-bg :is(.feed-eyebrow,.feed-section-heading>a,.feed-section-heading>a *){color:var(--dk-accent)!important}
html[data-theme="light"] body.unified-app.scenic-bg .feed-section-heading svg{stroke:var(--dk-accent)}
/* Room for the name next to the theme switch */
body.unified-app .app-drawer-panel{max-width:min(84vw,290px)}

/* Light theme: the cover photo's camera button keeps a dark glass so its white icon stays visible */
html[data-theme="light"] body.unified-app .profile-cover-edit{background:rgba(11,20,26,.55)}

/* Pengaturan akun: contact verification status (src/contact_verify.php) */
body.unified-app .contact-verify .contact-ok{color:var(--dk-accent);font-weight:600}
body.unified-app .contact-verify .contact-no{color:#f59e0b;font-weight:600}
body.unified-app .contact-verify-row{display:grid;gap:8px;padding:8px 0;border-top:1px solid var(--dk-line)}
body.unified-app .contact-verify-form{display:flex;gap:8px;align-items:flex-end}
body.unified-app .contact-verify-form label{flex:1}
/* Panggilan yang bisa diperkecil (2026-10-08) */
.call-min{position:absolute;left:12px;top:calc(12px + env(safe-area-inset-top));z-index:5;width:42px;height:42px;border-radius:50%;border:0;background:rgba(0,0,0,.35);color:#fff;display:grid;place-items:center;cursor:pointer}
.call-min svg{width:24px;height:24px}
.call-screen[data-mode="incoming"] .call-min,.call-screen[data-mode="ended"] .call-min{display:none}
/* Browser / aplikasi lama: gelembung di pojok halaman */
.call-screen.is-mini{inset:auto 12px calc(84px + env(safe-area-inset-bottom)) auto;width:128px;height:176px;border-radius:16px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.5);padding:0;cursor:pointer}
.call-screen.is-mini[data-kind="audio"],.call-screen.is-mini:not([data-mode="live"]){width:auto;min-width:150px;height:64px;padding:0 14px;flex-direction:row;align-items:center}
/* Jendela panggilan native: seluruh halaman = jendela kecil (gelembung / PiP) */
body[data-page=call]{background:#0b141a}
body[data-page=call] .app-navigation,body[data-page=call] .footer,body[data-page=call] .install-tip{display:none!important}
body[data-page=call] .call-screen.is-mini{inset:0;width:auto;height:auto;border-radius:0;box-shadow:none;min-width:0;padding:0}
.call-screen.is-mini :is(.call-min,.call-controls,.call-incoming,.call-banner,.call-local){display:none!important}
.call-screen.is-mini .call-remote{border-radius:0}
.call-screen.is-mini .call-info{margin:0;gap:2px;transform:none}
.call-screen.is-mini[data-kind="video"][data-mode="live"] .call-info{position:absolute;left:0;right:0;bottom:6px;font-size:.72rem}
.call-screen.is-mini[data-kind="video"][data-mode="live"] .call-name{display:none}
.call-screen.is-mini:is([data-kind="audio"],:not([data-mode="live"])) .call-info{flex-direction:row;align-items:center;gap:10px;text-align:left}
.call-screen.is-mini:is([data-kind="audio"],:not([data-mode="live"])) .call-avatar{width:40px;height:40px;font-size:1rem}
.call-screen.is-mini .call-name{font-size:.86rem;max-width:110px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.call-screen.is-mini .call-status{font-size:.76rem}
.call-screen.is-pip .call-info{display:none}
/* Pop-up update Google Play (2026-10-08) */
.play-update{position:fixed;inset:0;z-index:9500;display:grid;place-items:center;padding:20px;background:rgba(0,0,0,.6)}
.play-update[hidden]{display:none}
.play-update-card{width:min(360px,100%);padding:24px 20px 16px;border-radius:20px;background:var(--fx-surface,#111b21);color:var(--fx-ink,#e9edef);text-align:center;box-shadow:0 24px 60px rgba(0,0,0,.5)}
.play-update-card img{border-radius:18px;margin:0 auto 10px;display:block}
.play-update-card h2{margin:0 0 8px;font-size:1.15rem}
.play-update-card p{margin:0 0 12px;color:var(--fx-muted,#8696a0);font-size:.9rem;line-height:1.5}
.play-update-card ul{text-align:left;margin:0 0 14px;padding-left:18px;font-size:.86rem;line-height:1.5}
.play-update-later{margin-top:8px;width:100%;padding:10px;border:0;background:none;color:var(--fx-muted,#8696a0);font:inherit;cursor:pointer}
/* Tombol Update Google Play di samping logo (halaman komunitas) */
.lite-update-btn{display:inline-flex;align-items:center;gap:4px;margin-left:10px;margin-right:auto;padding:5px 11px;border-radius:999px;background:var(--fx-grad,linear-gradient(135deg,#0b8f8a,#12b3a6));color:#fff!important;font-size:.78rem;font-weight:700;line-height:1;white-space:nowrap;text-decoration:none!important;box-shadow:0 4px 12px -4px rgba(18,179,166,.6);align-self:center;animation:fh-update-pulse 2.4s ease-in-out infinite}
.lite-update-btn[hidden]{display:none}
.lite-update-btn svg{width:14px;height:14px}
body.unified-app .lite-update-btn span{color:#fff}
@keyframes fh-update-pulse{0%,100%{box-shadow:0 4px 12px -4px rgba(18,179,166,.6)}50%{box-shadow:0 4px 18px -2px rgba(18,179,166,.95)}}
body.unified-app .lite-header a.lite-update-btn{background:linear-gradient(135deg,#0b8f8a,#12b3a6)!important;color:#fff!important;border:0!important}
/* Verifikasi WhatsApp wajib (src/wa_verify.php): halaman tanpa menu, kolom kode besar */
body.unified-app.wa-gate .app-navigation{display:none!important}
body.unified-app .wa-verify .wa-verify-status{margin:4px 0 14px;padding:12px 14px;border-radius:12px;background:color-mix(in srgb,var(--dk-accent,#12b3a6) 12%,transparent);border:1px solid color-mix(in srgb,var(--dk-accent,#12b3a6) 35%,transparent);line-height:1.5}
body.unified-app .wa-verify .wa-verify-status.is-error{background:color-mix(in srgb,#ef4444 12%,transparent);border-color:color-mix(in srgb,#ef4444 40%,transparent)}
body.unified-app .wa-verify .wa-verify-status.is-sending{animation:fh-wa-pulse 1.4s ease-in-out infinite}
@keyframes fh-wa-pulse{50%{opacity:.6}}
body.unified-app .wa-verify .wa-verify-code{font-size:1.6rem;letter-spacing:.35em;text-align:center;font-variant-numeric:tabular-nums}
body.unified-app .wa-verify .wa-verify-resend,body.unified-app .wa-verify .wa-verify-later{margin-top:10px}
body.unified-app .wa-verify .fineprint{display:block;text-align:center;margin-top:6px}
body.unified-app .wa-verify .wa-verify-change{margin-top:14px;border-top:1px solid var(--dk-line,rgba(255,255,255,.12));padding-top:12px}
body.unified-app .wa-verify .wa-verify-change summary{cursor:pointer;font-weight:600;color:var(--dk-accent,#12b3a6)}
body.unified-app .wa-verify .wa-verify-change form{margin-top:10px}
body.unified-app .wa-verify .wa-verify-logout{margin-top:16px;text-align:center}
body.unified-app .wa-verify .wa-verify-logout button{background:none;border:0;color:var(--fx-muted,#8696a0);font:inherit;text-decoration:underline;cursor:pointer;padding:8px}
@media (prefers-reduced-motion:reduce){body.unified-app .wa-verify .wa-verify-status.is-sending{animation:none}}
/* Verifikasi identitas dengan kamera pintar (assets/kyc.js, src/kyc.php) */
body.unified-app .kyc-steps{margin:4px 0 6px;padding:0;list-style:none;counter-reset:kyc;display:grid;gap:10px}
body.unified-app .kyc-steps li{counter-increment:kyc;display:grid;grid-template-columns:30px 1fr;column-gap:10px;align-items:start}
body.unified-app .kyc-steps li::before{content:counter(kyc);grid-row:span 2;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-weight:700;background:color-mix(in srgb,var(--dk-accent,#12b3a6) 22%,transparent);color:var(--dk-accent,#12b3a6)}
body.unified-app .kyc-steps li span{color:var(--fx-muted,#8696a0);font-size:.9rem;line-height:1.45}
body.unified-app .kyc-msg{margin:0;padding:10px 12px;border-radius:12px;background:color-mix(in srgb,#ef4444 14%,transparent);border:1px solid color-mix(in srgb,#ef4444 40%,transparent)}
body.unified-app .kyc-msg:empty{display:none}
body.kyc-open{overflow:hidden}
.kyc-cam{position:fixed;inset:0;z-index:2147483000;background:#000;color:#fff;display:block;overscroll-behavior:contain}
.kyc-cam video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.kyc-cam video.is-mirror{transform:scaleX(-1)}
.kyc-cam .kyc-overlay{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.kyc-cam .kyc-top{position:absolute;left:0;right:0;top:0;display:flex;align-items:center;gap:10px;padding:calc(env(safe-area-inset-top,0px) + 10px) 14px 10px;background:linear-gradient(rgba(0,0,0,.6),transparent);font-size:.95rem}
.kyc-cam .kyc-close{width:40px;height:40px;border-radius:50%;border:0;background:rgba(255,255,255,.16);color:#fff;font-size:1.6rem;line-height:1;cursor:pointer}
.kyc-cam .kyc-say{position:absolute;left:50%;transform:translateX(-50%);top:calc(env(safe-area-inset-top,0px) + 66px);width:min(92vw,520px);margin:0;padding:12px 16px;border-radius:14px;background:rgba(10,20,26,.82);text-align:center;font-weight:600;font-size:1.02rem;line-height:1.4}
.kyc-cam .kyc-say[data-kind=ok]{background:rgba(21,128,61,.88)}
.kyc-cam .kyc-say[data-kind=error]{background:rgba(185,28,28,.9)}
.kyc-cam .kyc-say[data-kind=busy]{animation:fh-wa-pulse 1.4s ease-in-out infinite}
.kyc-cam .kyc-dots{position:absolute;left:0;right:0;bottom:calc(env(safe-area-inset-bottom,0px) + 96px);display:flex;justify-content:center;gap:10px;margin:0;padding:0;list-style:none}
.kyc-cam .kyc-dots li{width:12px;height:12px;border-radius:50%;background:rgba(255,255,255,.35)}
.kyc-cam .kyc-dots li.is-done{background:#22c55e}
.kyc-cam .kyc-bottom{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;align-items:center;gap:10px;padding:14px 16px calc(env(safe-area-inset-bottom,0px) + 18px);background:linear-gradient(transparent,rgba(0,0,0,.65))}
.kyc-cam .kyc-bottom .button{min-width:min(86vw,360px)}
.kyc-cam .kyc-alt{color:#e2f5f2;text-decoration:underline;cursor:pointer;font-size:.92rem;padding:6px}
.kyc-cam .kyc-preview{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(90vw,560px);border-radius:12px;box-shadow:0 10px 40px rgba(0,0,0,.6)}
@media (prefers-reduced-motion:reduce){.kyc-cam .kyc-say[data-kind=busy]{animation:none}}
/* Miniatur KTP & wajah di sampul profil (hanya owner) */
body.unified-app .profile-cover{position:relative}
body.unified-app .kyc-cover-badges{position:absolute;right:10px;bottom:10px;z-index:3;display:flex;align-items:flex-end;gap:6px;padding:6px;border-radius:12px;background:rgba(8,16,22,.72);backdrop-filter:blur(4px);color:#fff}
body.unified-app .kyc-cover-badges.is-empty{font-size:.72rem;padding:6px 10px;opacity:.85}
body.unified-app .kyc-thumb{position:relative;display:block;border-radius:8px;overflow:hidden;border:2px solid rgba(255,255,255,.85);cursor:zoom-in;line-height:0}
body.unified-app .kyc-thumb img{display:block;object-fit:cover}
body.unified-app .kyc-thumb-ktp img{width:76px;height:48px}
body.unified-app .kyc-thumb-selfie img{width:42px;height:54px}
body.unified-app .kyc-thumb span{position:absolute;left:0;right:0;bottom:0;padding:1px 0;background:rgba(0,0,0,.6);font-size:.6rem;line-height:1.3;text-align:center;font-weight:700}
body.unified-app .kyc-cover-note{position:absolute;right:6px;top:-18px;font-size:.62rem;white-space:nowrap;padding:1px 6px;border-radius:6px;background:rgba(8,16,22,.72)}
/* Halaman tinjauan verifikasi */
body.unified-app .kyc-review-photos{display:flex;flex-wrap:wrap;gap:10px;margin:8px 0}
body.unified-app .kyc-review-photos a{display:block;border-radius:10px;overflow:hidden;cursor:zoom-in;line-height:0}
body.unified-app .kyc-review-photos img{height:140px;width:auto;max-width:100%;object-fit:cover}
body.unified-app .kyc-review-facts{margin:4px 0 10px;padding-left:18px;display:grid;gap:4px}
body.unified-app .kyc-review-facts .kyc-warn{color:#f59e0b;font-weight:600}