:root{--ink:#123b50;--teal:#12bec2;--deep:#075f72;--line:#d7edf1;--panel:rgba(255,255,255,.95)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-rounded,"Arial Rounded MT Bold",system-ui,sans-serif;color:var(--ink);background:#eaf8f7}
header{height:74px;background:rgba(255,255,255,.96);display:flex;align-items:center;justify-content:space-between;padding:0 max(4vw,28px);position:sticky;top:0;z-index:10;border-bottom:1px solid #d8eef1}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}.brand .fish{font-size:32px}.brand b{font-size:25px;display:block}.brand b span{color:#12b7ba}.brand small{display:block;color:#5b7a86;font-size:11px;font-weight:700}
nav{display:flex;gap:28px}nav a{text-decoration:none;color:#244c5b;font-weight:800;font-size:14px}
.hero{min-height:400px;background:linear-gradient(90deg,rgba(15,194,202,.78),rgba(0,151,168,.42)),url("assets/cotd-background.png") center/cover no-repeat;display:flex;align-items:center}
.hero-inner{width:min(1180px,92%);margin:auto;padding:55px 0}.hero h1{font-size:clamp(30px,4vw,54px);line-height:1.08;margin:0 0 28px;color:#fff;text-shadow:0 2px 12px #006b7680}.hero em{font-style:normal;color:#fff59b}
.search{height:66px;background:#fff;border-radius:16px;display:flex;align-items:center;max-width:820px;box-shadow:0 8px 24px #07576c35}.search span{font-size:30px;padding:0 18px;color:#168b9b}.search input{border:0;outline:0;width:100%;font-size:18px;color:var(--ink);background:transparent;padding-right:20px}
.try{margin-top:15px;color:#eaffff;font-weight:800}.try button{border:1px solid rgba(255,255,255,.65);background:rgba(255,255,255,.22);color:#fff;border-radius:20px;padding:7px 12px;margin:5px 3px;cursor:pointer}
main{padding-bottom:45px}.panel{width:min(1180px,92%);margin:28px auto;background:var(--panel);border:1px solid var(--line);border-radius:18px;box-shadow:0 9px 30px #0b718014;padding:26px}
.resources{display:grid;grid-template-columns:230px 34px 1fr 34px;align-items:center;gap:15px}.resource-title h2{font-size:27px;margin:0}.resource-title p,.heading p{color:#66818b;margin:7px 0 0}.resource-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.resource-card{display:flex;align-items:center;gap:13px;padding:15px;border:1px solid var(--line);border-radius:14px;text-decoration:none;color:var(--ink);background:#fff}.resource-card:hover{transform:translateY(-2px);box-shadow:0 7px 18px #0b718018}.resource-icon{font-size:30px}.resource-card b{display:block}.resource-card small{color:#6b8791}.arrow{border:0;background:transparent;font-size:36px;color:#88a8b0;cursor:pointer}
.heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.heading h2{margin:0;font-size:29px}.heading button{border:0;background:#e5f7f6;color:#087f86;border-radius:18px;padding:8px 14px;font-weight:800;cursor:pointer}
.category-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.cat{border:1px solid var(--line);background:#fff;border-radius:14px;padding:17px 10px;text-align:center;cursor:pointer;color:var(--ink);font-weight:800}.cat:hover{background:#f1fbfb}.cat .ico{font-size:31px;display:block;margin-bottom:8px}
.faq-list{display:grid;gap:9px}.faq{border:1px solid var(--line);background:#fff;border-radius:12px;padding:13px 15px}.faq b{font-size:15px}.faq .pending{display:block;color:#8aa0a7;font-size:12px;margin-top:5px}
.popular-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 24px}.popular-item{padding:12px 14px;border-bottom:1px solid var(--line);font-weight:750}.popular-item span{float:right;color:#6fa6ad}
footer{background:#075f72;color:#dffafa;padding:25px max(4vw,28px);display:flex;justify-content:space-between}.hidden{display:none!important}
@media(max-width:850px){header nav{display:none}.resources{grid-template-columns:1fr}.resources .arrow{display:none}.resource-cards{grid-template-columns:1fr 1fr}.category-grid{grid-template-columns:repeat(3,1fr)}.popular-grid{grid-template-columns:1fr}}
@media(max-width:540px){.hero{min-height:370px}.hero-inner{padding:35px 0}.resource-cards{grid-template-columns:1fr}.category-grid{grid-template-columns:repeat(2,1fr)}.panel{padding:18px}footer{gap:8px;flex-direction:column}}

.brand-shark{
  width:76px;
  height:52px;
  object-fit:contain;
  transform:scaleX(-1);
  transform-origin:center;
  flex:0 0 auto;
}
@media(max-width:540px){
  .brand-shark{width:58px;height:40px}
}

.faq p{margin:8px 0 0;line-height:1.55;color:#3f626f}
.faq-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.faq-link{display:inline-block;text-decoration:none;color:#087f86;background:#e9f8f7;border:1px solid #cdeceb;border-radius:16px;padding:6px 10px;font-size:12px;font-weight:800}
.faq-link:hover{background:#dff4f2}

/* v0.1.14 — softer ocean color treatment; layout unchanged */
:root{--panel:rgba(230,247,247,.94);--line:#bcdfe2}
body{background:linear-gradient(155deg,#e5f5f4 0%,#dff2f6 48%,#eaf7ef 100%);background-attachment:fixed}
header{background:rgba(238,250,249,.97);border-bottom-color:#b9e1e3}
.search{background:#f2fffc;border:2px solid #a3e5e1;box-shadow:0 10px 26px #07576c30}
.panel{background:rgba(229,246,246,.94);border-color:#b9dfe2;box-shadow:0 9px 30px #0b718014}
.panel:has(.resources){background:rgba(216,241,233,.94)}
.resource-card{background:#e5f1fb;border-color:#c5e0ee}
.resource-card:nth-child(2){background:#e5f5f4;border-color:#bfe2de}
.resource-card:nth-child(3){background:#fff0d5;border-color:#efdcb8}
.cat{background:#e5f5f4;border-color:#c0e1dc;transition:background .15s,transform .15s}
.cat:nth-child(4n + 2){background:#e5f1fb;border-color:#c5dfee}
.cat:nth-child(4n + 3){background:#fff0d5;border-color:#eddab5}
.cat:nth-child(4n){background:#d8f1e9;border-color:#b9dfd2}
.cat:hover{background:#c6ece9;transform:translateY(-2px)}
.faq{background:#f0faf9;border-color:#c4e5e5}
.faq:nth-child(even){background:#e7f3fc;border-color:#c7dfea}
.faq:nth-child(4n){background:#fef3df;border-color:#eddfc2}
.popular-item{background:rgba(255,255,255,.24);border-radius:8px;border-bottom-color:#bddde0}
.faq-link{background:#d9f3ef}


/* v0.1.15 — consistent section color identities, muted sand */
body{background:linear-gradient(155deg,#e5f5f4 0%,#e6f4f6 55%,#e7f5f0 100%);background-attachment:fixed}
/* Community: coordinated ocean blue */
#resources.panel{background:#e3f0fc;border-color:#c4ddec}
#resources .resource-card,#resources .resource-card:nth-child(2),#resources .resource-card:nth-child(3){background:#f0f7fe;border-color:#c9dfef}
#resources .resource-card:hover{background:#d6eafb}
/* Categories: coordinated seafoam, not random alternating colors */
#categories.panel{background:#ddf3f1;border-color:#b7e0da}
#categories .cat,#categories .cat:nth-child(4n + 2),#categories .cat:nth-child(4n + 3),#categories .cat:nth-child(4n){background:#effaf8;border-color:#c0e2dc}
#categories .cat:hover{background:#ccece7}
/* Popular: quieter warm sand */
#popular.panel{background:#f4ebd9;border-color:#e6d9c0}
#popular .popular-item{background:#fbf5e9;border-bottom-color:#e3d5bd}
/* Search and FAQ details: unified lagoon green */
#searchPanel.panel,#categoryPanel.panel{background:#ddf1e9;border-color:#b8decd}
#searchPanel .faq,#categoryPanel .faq,#searchPanel .faq:nth-child(even),#categoryPanel .faq:nth-child(even),#searchPanel .faq:nth-child(4n),#categoryPanel .faq:nth-child(4n){background:#f0faf5;border-color:#c4e3d5}
#searchPanel .faq-link,#categoryPanel .faq-link{background:#dff3e9;border-color:#b7dfcd}

/* v0.1.16 — deepen section panes for button contrast */
#resources.panel{background:#bbdceb;border-color:#9bc8de}
#categories.panel{background:#b7ddd5;border-color:#96c9bf}

/* v0.1.18 — navigable popular questions and question submission */
.popular-item{display:block;width:100%;text-align:left;color:var(--ink);font:inherit;font-weight:750;cursor:pointer;border:1px solid #e3d5bd;border-radius:9px;transition:background .15s,transform .15s,box-shadow .15s}
.popular-item:hover,.popular-item:focus-visible{background:#fffaf1!important;transform:translateY(-2px);box-shadow:0 4px 12px #866c3820;outline-color:#0d8990}
.popular-item span{font-size:22px;line-height:1}
.faq{scroll-margin-top:100px}
.faq-highlight{outline:3px solid #159c9d;outline-offset:2px;box-shadow:0 0 0 6px #159c9d1b;background:#fff!important;transition:box-shadow .2s}
.submit-question{display:flex;align-items:center;justify-content:space-between;gap:24px;background:#dceee9;border-color:#a9d5c9}
.submit-copy h2{font-size:29px;margin:0 0 8px}
.submit-copy p{margin:0;color:#416b70;line-height:1.5;max-width:680px}
.submit-button{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:14px;padding:14px 22px;background:#087e88;color:white;text-decoration:none;font-weight:800;box-shadow:0 5px 15px #087e8825}
.submit-button:hover,.submit-button:focus-visible{background:#05646e}
@media(max-width:650px){.submit-question{flex-direction:column;align-items:stretch}.submit-button{width:100%}}

/* v0.1.26 — privacy footer link and standalone policy page */
footer a{color:#e6ffff;text-decoration:underline;text-underline-offset:3px;font-weight:700}
footer a:hover,footer a:focus-visible{color:#fff}
.privacy-main{width:min(880px,92%);margin:38px auto 55px;padding:0}
.privacy-panel{background:#f0faf5;border:1px solid #b8decd;border-radius:18px;padding:clamp(22px,4vw,44px);box-shadow:0 9px 30px #0b718014}
.privacy-panel h1{margin:0 0 8px;font-size:clamp(30px,4vw,42px)}
.privacy-panel h2{font-size:20px;margin:28px 0 8px}
.privacy-panel p,.privacy-panel li{line-height:1.7;color:#365a66}
.privacy-panel a{color:#087e88;overflow-wrap:anywhere}
.privacy-updated{font-size:14px;color:#66818b!important}
.privacy-back{display:inline-block;margin-bottom:18px;color:#087e88;font-weight:800;text-decoration:none}
@media(max-width:850px){footer{flex-wrap:wrap;gap:10px}}

/* v0.1.27 — centered footer privacy link */
footer{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;column-gap:20px}
footer>a{justify-self:center;text-align:center}
footer>span{justify-self:end;text-align:right}
@media(max-width:650px){footer{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px}footer>span{text-align:center}}

/* v0.1.31 — quieter, centered privacy link */
footer>a[href="privacy.html"]{font-size:12px;font-weight:400;color:#b8d5db;text-decoration-color:#9bbfc6;text-underline-offset:3px}
footer>a[href="privacy.html"]:hover,footer>a[href="privacy.html"]:focus-visible{color:#ffffff}

/* v0.1.32 — consistent resource carousel card dimensions */
#resources .resource-cards{align-items:stretch}
#resources .resource-card{height:104px;min-width:0;box-sizing:border-box;overflow-wrap:anywhere}
#resources .resource-card>span:last-child{min-width:0}
#resources .resource-card small{display:block;line-height:1.35}
@media(max-width:850px){#resources .resource-card{height:112px}}
@media(max-width:540px){#resources .resource-card{height:96px}}
/* Compact structured price table inside FAQ answers */
.faq-data-table{border-collapse:collapse;margin:12px 0 5px;max-width:390px;width:100%;font-size:14px}
.faq-data-table th,.faq-data-table td{border:1px solid #c9e2df;padding:7px 12px;text-align:left}
.faq-data-table th{background:#d8efea}
.faq-data-table tr:nth-child(even){background:#f3faf8}

/* v0.1.34: compact category rows, centered when incomplete */
.category-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.category-grid>.cat{box-sizing:border-box;min-width:0;flex:0 0 calc((100% - 60px)/6)}
@media(max-width:1050px){.category-grid>.cat{flex-basis:calc((100% - 24px)/3)}}
@media(max-width:540px){.category-grid>.cat{flex-basis:calc((100% - 12px)/2);padding:14px 7px}.category-grid>.cat .ico{font-size:27px}}

/* v0.1.35: consistent references and readable long-form FAQ answers */
.faq-links{display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.faq-link-item{font-size:.92em}
.faq p + p{margin-top:9px}

/* v0.1.37 — two-resource carousel and scannable daily rewards */
#resources .resource-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
.faq-bullets{margin:8px 0 5px;padding-left:21px;line-height:1.55}
.faq-bullets li+li{margin-top:5px}
@media(max-width:540px){#resources .resource-cards{grid-template-columns:minmax(0,1fr)}#resources .resource-card:nth-child(2){display:none}#resources .arrow{display:block}#resources .resources{grid-template-columns:32px minmax(0,1fr) 32px}#resources .resource-title{grid-column:1/-1}#resources #prev{grid-column:1;grid-row:2}#resources #resourceCards{grid-column:2;grid-row:2}#resources #next{grid-column:3;grid-row:2}}

/* v0.1.38 — restore three community resource cards on desktop */
@media(min-width:851px){#resources .resource-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:541px) and (max-width:850px){#resources .resource-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* v0.1.39 — anchor destinations clear the sticky header */
html{scroll-padding-top:110px}
#home,#resources,#categories,#popular,#submit-question,#categoryPanel,#searchPanel{scroll-margin-top:110px}
@media(max-width:540px){html{scroll-padding-top:78px}#home,#resources,#categories,#popular,#submit-question,#categoryPanel,#searchPanel{scroll-margin-top:78px}}

/* v0.1.40 — community acknowledgments */
.acknowledgments{background:#e8f5f1;border-color:#b8ddd4;text-align:center}
.acknowledgments-inner{max-width:780px;margin:0 auto}
.acknowledgments h2{margin-bottom:14px}
.acknowledgments p{line-height:1.65;margin:10px auto}
.footer-links{display:flex;justify-content:center;align-items:center;gap:18px}
.footer-links a{font-size:12px;font-weight:400;color:#b8d5db;text-decoration:underline;text-decoration-color:#9bbfc6;text-underline-offset:3px}
.footer-links a:hover,.footer-links a:focus-visible{color:white}
#acknowledgments{scroll-margin-top:110px}
@media(max-width:540px){#acknowledgments{scroll-margin-top:78px}.footer-links{flex-wrap:wrap}}


/* v0.1.41 — responsive community resource carousel */
#resources .resources{min-width:0}
#resources .resource-title,#resources .resource-cards,#resources .resource-card{min-width:0}
#resources .resource-card>span:last-child{min-width:0;overflow-wrap:normal;word-break:normal}
#resources .resource-card b,#resources .resource-card small{overflow-wrap:break-word;word-break:normal}
@media (min-width:541px) and (max-width:850px){
  #resources.resources{grid-template-columns:30px minmax(0,1fr) 30px;gap:10px}
  #resources .resource-title{grid-column:1/-1;grid-row:1}
  #resources #prev{display:block;grid-column:1;grid-row:2}
  #resources #resourceCards{grid-column:2;grid-row:2;grid-template-columns:repeat(2,minmax(0,1fr))}
  #resources .resource-card:nth-child(n+3){display:none}
  #resources #next{display:block;grid-column:3;grid-row:2}
}
@media (max-width:540px){
  #resources.resources{display:grid;grid-template-columns:24px minmax(0,1fr) 24px;column-gap:7px;row-gap:12px;align-items:center}
  #resources .resource-title{grid-column:1/-1;grid-row:1;width:100%}
  #resources .resource-title h2{font-size:clamp(22px,7vw,27px);line-height:1.15}
  #resources #prev{display:block;grid-column:1;grid-row:2;font-size:30px;padding:0}
  #resources #resourceCards{grid-column:2;grid-row:2;display:grid;grid-template-columns:minmax(0,1fr);width:100%;min-width:0;gap:0}
  #resources .resource-card{display:flex;min-width:0;width:100%;height:auto;min-height:106px;padding:12px 10px;gap:9px}
  #resources .resource-card:nth-child(n+2){display:none}
  #resources .resource-icon{font-size:25px;flex:0 0 auto}
  #resources #next{display:block;grid-column:3;grid-row:2;font-size:30px;padding:0}
}
/* Balanced wrapping without manual line breaks; preserves the approved copy. */
.acknowledgments-inner{max-width:880px}
.acknowledgments p{text-wrap:pretty}
.acknowledgments h2{text-wrap:balance}

/* v0.1.46 — understated live collection counts beneath suggested searches */
.hero-stats{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;margin-top:14px;color:rgba(255,255,255,.86);font-size:12px;font-weight:500;line-height:1.5;text-shadow:0 1px 3px rgba(0,70,80,.2)}
.hero-stats strong{color:#fff;font-weight:750}
.hero-stats-separator{opacity:.65}
@media(max-width:540px){.hero-stats{margin-top:12px;font-size:11px;gap:4px 7px}}

/* v0.1.48: understated, readable count on the ocean hero */
.hero-stats{color:#c6f5ee;font-weight:600}
.hero-stats strong{color:#f0fffb}

/* v0.1.53: search results are compact, accessible accordions without category labels. */
#searchPanel .search-faq{padding:0;overflow:hidden}
#searchPanel .search-faq summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;cursor:pointer;padding:13px 15px;font-size:15px;font-weight:750;color:var(--ink)}
#searchPanel .search-faq summary::-webkit-details-marker{display:none}
#searchPanel .search-faq summary::after{content:"⌄";font-size:20px;line-height:1;color:#4b8d90;flex-shrink:0;transition:transform .15s}
#searchPanel .search-faq[open] summary::after{transform:rotate(180deg)}
#searchPanel .search-faq summary:focus-visible{outline:2px solid #159c9d;outline-offset:-3px;border-radius:12px}
#searchPanel .search-faq-answer{border-top:1px solid #c4e3d5;padding:0 15px 14px}
#searchPanel .search-faq-answer p:first-child{margin-top:12px}


/* v0.1.54 color trial — Option 2 softened; CSS colors only.
   Preserve the original hero image, overlay, content and layout. */
body {
  background: linear-gradient(155deg, #ddf8f6 0%, #d1f3f6 52%, #e0f7f2 100%);
  background-attachment: fixed;
}
#categories.panel {
  background: #9edfdc;
  border-color: #80cfc9;
}
#categories .cat,
#categories .cat:nth-child(4n + 2),
#categories .cat:nth-child(4n + 3),
#categories .cat:nth-child(4n) {
  background: #effbfa;
  border-color: #a6ded9;
}
#categories .cat:hover {
  background: #d9f7f4;
}

/* v0.1.55 — early switch to two resource cards before three become cramped. */
@media (min-width:851px) and (max-width:1180px){
 #resources.resources{grid-template-columns:220px 30px minmax(0,1fr) 30px;gap:10px}
 #resources #resourceCards{grid-template-columns:repeat(2,minmax(0,1fr))}
 #resources .resource-card:nth-child(n+3){display:none}
}

/* v0.1.56a: tiny saturation adjustment ONLY. Keep all cards within each
   section identical; leave Featured Questions and FAQ cards untouched. */
#categories .cat,
#categories .cat:nth-child(4n + 2),
#categories .cat:nth-child(4n + 3),
#categories .cat:nth-child(4n) {
  background: #e6f9f6;
  border-color: #a0dcd5;
}
#resources .resource-card,
#resources .resource-card:nth-child(2),
#resources .resource-card:nth-child(3) {
  background: #e9f4fe;
  border-color: #c0ddef;
}

/* v0.1.57: Featured Questions only — subtle card-to-panel contrast.
   Preserve beige panel, category/resource colors and all layout rules. */
#popular .popular-item {
  background: #fffdf7;
  border-color: #d8c5a5;
  border-bottom-color: #d8c5a5;
}