:root{--navy:#101e38;--ink:#172945;--body:#43516b;--muted:#5d6b82;--blue:#2559d8;--ice:#55c7ff;--coral:#f4774e;--orange:#c8441f;--sand:#f5f7fc;--pale:#edf3ff;--line:#e1e7f0;--ok:#1d7a4c;--radius:18px;--shadow:0 14px 40px #1729450f}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{margin:0;font:16px/1.65 Arial,Helvetica,sans-serif;color:var(--body);background:#fff}
h1,h2,h3{font-family:Manrope,Arial,sans-serif;color:var(--ink);line-height:1.12;letter-spacing:-.02em;margin:0 0 .5em}
h1{font-size:clamp(34px,6vw,64px);font-weight:800}
h2{font-size:clamp(26px,3.6vw,40px);font-weight:800}
h3{font-size:20px;font-weight:700}
a{color:var(--blue)}
img{max-width:100%;height:auto;display:block}
small,.small{font-size:14px;color:var(--muted)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;z-index:9;background:#fff;padding:8px 12px}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}
.narrow{max-width:780px}
section,.sheet{padding:72px 0}
.head{padding:56px 0 72px}
.eyebrow{font:800 13px/1 Manrope,Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--blue);margin:0 0 14px}
.eyebrow::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--ice);margin-right:10px;vertical-align:1px}
.lead{font-size:18px;max-width:62ch;margin:0 0 28px}
.note{font-size:13px;color:var(--muted);margin-top:18px}
.empty{color:var(--muted)}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:8px;border:0;border-radius:12px;padding:14px 22px;font:700 15px/1 Manrope,Arial,sans-serif;background:var(--coral);color:#fff;text-decoration:none;cursor:pointer}
.btn:hover{background:#ec6337}
.btn.ghost{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line)}
.btn.ghost:hover{box-shadow:inset 0 0 0 1.5px var(--ink)}
.btn.ghost.light{background:transparent;color:#fff;box-shadow:inset 0 0 0 1.5px #ffffff55}
.btn.sm{padding:10px 14px;font-size:14px;border-radius:10px}
.btn.danger{background:#b3261e}
.btn[aria-pressed=true]{background:var(--ink);color:#fff;box-shadow:none}
.ctas{display:flex;flex-wrap:wrap;gap:12px;margin:0}
button.link{background:none;border:0;padding:0;color:var(--blue);text-decoration:underline;cursor:pointer;font:inherit}
:focus-visible{outline:3px solid var(--ice);outline-offset:2px}

/* Header */
.top{position:sticky;top:0;z-index:5;background:#fffffff2;backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;min-height:76px;gap:16px}
.logo img{width:230px}
.top .wrap{position:relative}
.menu-b{cursor:pointer;font:700 15px Manrope,Arial,sans-serif;color:var(--ink);padding:10px 14px;border-radius:10px;box-shadow:inset 0 0 0 1.5px var(--line);margin:0}
.menu-t:focus-visible+.menu-b{outline:3px solid var(--ice)}
.menu{display:none;flex-direction:column;position:absolute;right:20px;top:70px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:10px;min-width:230px}
.menu-t:checked~.menu{display:flex}
.menu a{padding:10px 12px;border-radius:10px;color:var(--ink);text-decoration:none;font:700 15px Manrope,Arial,sans-serif}
.menu a:hover,.menu a[aria-current]{background:var(--pale)}
.menu .acct{color:var(--blue)}
@media (min-width:1000px){
  .menu-b{display:none}
  .menu{display:flex;flex-direction:row;position:static;box-shadow:none;border:0;padding:0;min-width:0;gap:2px;align-items:center}
  .menu .acct{margin-left:10px;box-shadow:inset 0 0 0 1.5px var(--line)}
}

/* Hero: full-bleed photo, navy gradient behind the text, the fish drifts slowly under moving light */
.hero{padding:0;background:#fff}
.hero-card{position:relative;overflow:hidden;background:var(--navy);color:#cfd8ea;min-height:640px;display:flex;align-items:flex-end;isolation:isolate}
/* Layers: background, then the fish cut into body, tail and pelvic fins (one image, three clip-paths).
   .scene keeps the background's aspect ratio while covering the card, so the fish stays on its spot. */
.hero-stage{position:absolute;inset:0;z-index:-3;overflow:hidden;container-type:size}
.scene{position:absolute;right:0;top:50%;width:max(100cqw,calc(100cqh * 2560 / 1100));height:max(100cqh,calc(100cqw * 1100 / 2560));transform:translateY(-50%)}
.scene-bg{position:absolute;inset:0;width:100%;height:100%;max-width:none;transform-origin:60% 40%;animation:drift 22s ease-in-out infinite alternate}
.swimmer{position:absolute;left:52.8%;top:14.6%;width:45.1%;aspect-ratio:1600/880;animation:hover 7s ease-in-out infinite alternate}
.swimmer img{position:absolute;inset:0;width:100%;height:100%;max-width:none}
.f-body{clip-path:polygon(0 0,27% 0,27% 24%,35% 23%,45% 22.5%,55% 23.5%,65% 26.5%,72% 30%,80% 32%,80% 67%,100% 82%,100% 100%,54% 100%,52% 80%,40% 72%,32% 73%,30% 100%,0 100%)}
/* The tail overlaps the body and fades in over its first few percent, so the joint has no visible edge. */
.f-tail{clip-path:polygon(74% 36%,100% 18%,100% 82%,74% 63%);-webkit-mask:linear-gradient(90deg,#0000 74.5%,#000 78.5%);mask:linear-gradient(90deg,#0000 74.5%,#000 78.5%);transform-origin:78% 49%;animation:tail 2.6s ease-in-out infinite}
/* Dorsal fin: four strips cut from the body that sway one after another, front to tail. Each strip pivots on the fin's base and fades in over the one before it, so no seam opens. */
.f-dorsal{transform-origin:50% 25%;animation:dorsal 3s ease-in-out infinite}
.d1{clip-path:polygon(26% 0,41% 0,41% 26%,26% 27%);animation-delay:-.9s}
.d2{clip-path:polygon(39% 0,55% 0,55% 27%,39% 26%);-webkit-mask:linear-gradient(90deg,#0000 39%,#000 41%);mask:linear-gradient(90deg,#0000 39%,#000 41%);animation-delay:-.6s}
.d3{clip-path:polygon(53% 0,67% 0,67% 31%,53% 27%);-webkit-mask:linear-gradient(90deg,#0000 53%,#000 55%);mask:linear-gradient(90deg,#0000 53%,#000 55%);animation-delay:-.3s}
.d4{clip-path:polygon(65% 0,86% 0,86% 35%,76% 36%,65% 31%);-webkit-mask:linear-gradient(90deg,#0000 65%,#000 67%);mask:linear-gradient(90deg,#0000 65%,#000 67%);transform-origin:75% 32%}
@keyframes dorsal{0%,100%{transform:skewX(-4deg)}50%{transform:skewX(4deg)}}
/* Pectoral fin: it lies over the body, so a feathered copy (fin plus the scales under it) flutters on its base. */
.f-pec{-webkit-mask:radial-gradient(ellipse 10.5% 7.5% at 39.5% 59%,#000 55%,#0000 100%);mask:radial-gradient(ellipse 10.5% 7.5% at 39.5% 59%,#000 55%,#0000 100%);transform-origin:31% 57%;animation:pec 1.7s ease-in-out infinite}
@keyframes pec{0%,100%{transform:rotate(-2.5deg) scaleX(1)}50%{transform:rotate(2deg) scaleX(.95)}}
/* Gill cover: a feathered copy that flares out a little and back, like breathing. */
.f-gill{-webkit-mask:radial-gradient(ellipse 6.5% 19% at 27% 48%,#000 55%,#0000 100%);mask:radial-gradient(ellipse 6.5% 19% at 27% 48%,#000 55%,#0000 100%);transform-origin:22% 48%;animation:gill 2.3s ease-in-out infinite}
/* Blue blaze on the face, timed with the sun flash (same 7 s cycle). */
.f-face{-webkit-mask:radial-gradient(ellipse 13% 23% at 18% 47%,#000 45%,#0000 100%);mask:radial-gradient(ellipse 13% 23% at 18% 47%,#000 45%,#0000 100%);filter:brightness(1.3) saturate(1.9) contrast(1.05);opacity:0;animation:faceshine 7s ease-in-out infinite}
.f-glow{position:absolute;left:4%;top:24%;width:30%;height:46%;border-radius:50%;background:radial-gradient(closest-side,#1f6bff88,#1f5bff2e 60%,#0000);mix-blend-mode:screen;opacity:0;animation:faceshine 7s ease-in-out infinite}
@keyframes gill{0%,100%{transform:scaleX(1) skewY(0)}50%{transform:scaleX(1.035) skewY(-.6deg)}}
@keyframes faceshine{0%,58%,100%{opacity:.1}74%{opacity:.85}}
/* Same trick as the tail: the fin layer reaches a little into the belly and fades in, so no gap opens at its base. */
.f-pelvic{clip-path:polygon(29% 67%,40% 67%,41% 72%,52% 80%,55% 100%,27% 100%);-webkit-mask:linear-gradient(180deg,#0000 67.5%,#000 72.5%);mask:linear-gradient(180deg,#0000 67.5%,#000 72.5%);transform-origin:36% 73%;animation:pelvic 3.4s ease-in-out infinite}
@keyframes tail{0%,100%{transform:perspective(700px) rotateY(-24deg) skewY(-2deg)}50%{transform:perspective(700px) rotateY(24deg) skewY(2deg)}}
@keyframes pelvic{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3.5deg)}}
@keyframes hover{from{transform:translate(0,0) rotate(-.6deg)}to{transform:translate(-1.2%,2.5%) rotate(.8deg)}}
@keyframes drift{from{transform:scale(1)}to{transform:scale(1.04)}}
.hero-card::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#101e3800 0%,#101e38b3 45%,#101e38 78%)}
.hero-light{position:absolute;inset:-20%;z-index:-2;mix-blend-mode:soft-light;opacity:.55;background:radial-gradient(40% 30% at 30% 20%,#bfe9ff 0%,#bfe9ff00 70%),radial-gradient(35% 25% at 75% 10%,#ffffff 0%,#ffffff00 70%);animation:shimmer 9s ease-in-out infinite alternate}
.hero .wrap{width:100%;padding-top:260px;padding-bottom:48px}
.hero h1{color:#fff;text-shadow:0 2px 24px #0006}.hero h1 span{color:#7fb2ff}
.hero .eyebrow{color:#9ec3ff}
.hero .lead{color:#dfe7f3}
.hero .copy{max-width:600px}
@media (max-width:999px){.hero-card{background:#0c2a5a}.scene{left:0;right:auto;top:0;transform:none;width:100%;height:auto;aspect-ratio:1080/1350}.swimmer{left:7.75%;top:8.9%;width:86.8%}.hero-card::before{background:linear-gradient(180deg,#0c2a5a00 0%,#0c2a5a00 34%,#0c2a5acc 52%,#0b2350 70%)}.hero .wrap{padding-top:64vw}}
@keyframes shimmer{from{transform:translate(-4%,-2%) rotate(0deg)}to{transform:translate(5%,3%) rotate(4deg)}}
@media (min-width:1000px){
  .hero-card{min-height:min(78vh,720px);align-items:center}
  .hero-card::before{background:linear-gradient(90deg,#101e38 0%,#101e38e6 30%,#101e3866 55%,#101e3800 75%)}
  .hero .wrap{padding-top:80px;padding-bottom:80px}
  
}
/* Sun rays from the surface toward the fish: they sway, and every few seconds a brighter beam flashes down */
.hero-rays{position:absolute;inset:0;z-index:-2;pointer-events:none;mix-blend-mode:screen;transform-origin:var(--sun-x) -20%;
  --sun-x:52%;--flash-x:36%;--flash-from:141deg;
  background:conic-gradient(from 150deg at var(--sun-x) -20%,#0000 0deg,#cdeeff66 3deg,#0000 6deg,#0000 9deg,#e6f7ff55 11.5deg,#0000 14deg,#cdeeff44 17deg,#0000 21deg,#0000 24deg,#e6f7ff5e 26.5deg,#0000 30deg);
  -webkit-mask:linear-gradient(180deg,#000 0%,#000c 55%,#0000 95%);mask:linear-gradient(180deg,#000 0%,#000c 55%,#0000 95%);
  animation:rays 11s ease-in-out infinite alternate}
.hero-rays::after{content:"";position:absolute;inset:0;transform-origin:var(--flash-x) -20%;opacity:0;
  /* the flash comes down diagonally from the upper left onto the fish's face */
  background:conic-gradient(from var(--flash-from) at var(--flash-x) -20%,#0000 0deg,#e8f6ff55 4deg,#f4fbffee 8deg,#e8f6ff55 12deg,#0000 16deg);
  animation:sunflash 7s ease-in-out infinite}
@keyframes rays{from{transform:rotate(-3deg);opacity:.75}to{transform:rotate(3deg);opacity:1}}
@keyframes sunflash{0%,58%,100%{opacity:0;transform:rotate(-3deg)}74%{opacity:1}88%{opacity:0;transform:rotate(2deg)}}
@media (max-width:999px){.hero-rays{--sun-x:40%;--flash-x:4%;--flash-from:150deg;-webkit-mask:linear-gradient(180deg,#000 0%,#0008 35%,#0000 60%);mask:linear-gradient(180deg,#000 0%,#0008 35%,#0000 60%)}}
/* app.js adds .still while the hero is off screen, so the layers stop costing battery. */
.hero.still *,.hero.still ::after{animation-play-state:paused!important}
@media (prefers-reduced-motion:reduce){.scene-bg,.swimmer,.f-tail,.f-dorsal,.f-pec,.f-pelvic,.f-gill,.f-face,.f-glow,.hero-light,.hero-rays,.hero-rays::after{animation:none}}

.band{background:var(--sand);padding:28px 0}
.bigsearch{display:flex;flex-wrap:wrap;gap:10px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:10px;box-shadow:var(--shadow)}
.bigsearch input{flex:1 1 220px}
input,select,textarea{font:inherit;color:var(--ink);border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;background:#fff;width:100%}
.bigsearch select{flex:0 1 200px;width:auto}
input:focus,select:focus,textarea:focus{border-color:var(--blue);outline:0}
.trio{list-style:none;display:flex;flex-wrap:wrap;gap:10px 28px;padding:0;margin:18px 4px 0}
.trio a{font:700 15px Manrope,Arial,sans-serif;color:var(--ink);text-decoration:none}
.trio a::before{content:"→ ";color:var(--coral)}

/* Cards */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px}
.fish{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column}
.fish .pic{position:relative;display:block}
.fish .pic img{aspect-ratio:4/3;object-fit:cover;width:100%}
.chip{display:inline-block;font:700 12px/1 Manrope,Arial,sans-serif;background:#fff;color:var(--ink);padding:6px 10px;border-radius:999px}
.fish .chip{position:absolute;left:12px;top:12px}
.fav{position:absolute;right:12px;top:12px;width:38px;height:38px;border-radius:50%;border:0;background:#fff;color:#b8c2d3;font-size:18px;cursor:pointer;box-shadow:var(--shadow)}
.fav[aria-pressed=true]{color:var(--coral)}
.fish .body{padding:18px;display:flex;flex-direction:column;flex:1}
.fish h3{margin:0}.fish h3 a{color:inherit;text-decoration:none}
.sci{font-style:italic;color:var(--muted);margin:2px 0 8px;font-size:14px}
.fish p{margin:0 0 12px;font-size:15px}
.meta{display:flex;gap:8px;margin-top:auto!important}
.meta span{font-size:13px;background:var(--pale);color:var(--ink);padding:4px 10px;border-radius:999px}
.actions{display:flex;flex-wrap:wrap;gap:8px}
.deal{display:inline-block;font:800 12px/1 Manrope,Arial,sans-serif;background:#e5322d;color:#fff;padding:6px 10px;border-radius:999px;margin-bottom:10px}
.fish .deal{position:absolute;left:12px;bottom:12px;margin:0}
.price-tag s,.facts s{font-weight:500;opacity:.6;margin-right:4px}
.meta .price-tag{background:#fff1ea;color:var(--orange);font-weight:700}.meta .price-tag.out{background:#f0f2f6;color:var(--muted)}
.btn.off{background:#e9edf3;color:var(--muted);cursor:default;box-shadow:none}
.nophoto{display:block;aspect-ratio:4/3;background:linear-gradient(135deg,var(--pale),#dfe8f7)}
.thumbs{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}.thumbs img{width:88px;height:66px;object-fit:cover;border-radius:10px}
.finder{background:var(--sand);border-radius:var(--radius);padding:16px;display:grid;gap:12px}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pills button{font:700 14px Manrope,Arial,sans-serif;border:1.5px solid var(--line);background:#fff;color:var(--ink);padding:9px 14px;border-radius:10px;cursor:pointer}
.pills button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}
.bar{display:flex;justify-content:space-between;align-items:center;margin:20px 0 14px;font-size:14px;color:var(--muted)}
.bar label{display:flex;gap:8px;align-items:center}.bar input{width:auto}

.tint{background:var(--sand)}
.navy{background:var(--navy);color:#cfd8ea}.navy h2{color:#fff}.navy .eyebrow{color:#9ec3ff}
.split{display:grid;gap:36px}
@media (min-width:900px){.split{grid-template-columns:1fr 1fr;align-items:center}}
.values{list-style:none;padding:0;margin:0 0 28px;display:grid;gap:12px;font-size:18px;color:#fff}
.values li::before{content:"✓";color:var(--ice);margin-right:12px;font-weight:700}
.diary{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.diary li{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 18px;box-shadow:var(--shadow);display:flex;flex-direction:column}
.diary strong{color:var(--ink);font-family:Manrope,Arial,sans-serif}
.guides{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px}
.guide{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px;text-decoration:none;color:var(--body);box-shadow:var(--shadow);display:flex;flex-direction:column}
.guide:hover{border-color:var(--blue)}
.kicker{font:800 12px Manrope,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--blue);margin-bottom:10px}
.more{margin-top:auto;font-weight:700;color:var(--blue)}
.guide .thumb{margin:-24px -24px 18px;width:calc(100% + 48px);max-width:none;aspect-ratio:16/9;object-fit:cover;border-radius:var(--radius) var(--radius) 0 0}
.hero-img{border-radius:var(--radius);margin:0 0 32px;width:100%;aspect-ratio:16/9;object-fit:cover}
.prose ul,.prose ol{padding-left:22px}.prose li{margin-bottom:6px}
.prose table{border-collapse:collapse;width:100%;font-size:15px;margin:0 0 20px}.prose th,.prose td{border-bottom:1px solid var(--line);padding:8px 10px;text-align:left}
.cta{text-align:center;background:linear-gradient(135deg,var(--pale),#fff4ef)}
.cta p{font-size:18px;margin:0 0 24px}

/* Live feed on the home page */
.live{min-height:120px}
.mini-ads,.mini-threads{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.mini-ads a{display:grid;grid-template-columns:96px 1fr;grid-template-rows:auto auto auto;column-gap:14px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px;text-decoration:none;color:var(--ink)}
.mini-ads img{grid-row:1/4;width:96px;height:72px;object-fit:cover;border-radius:10px}
.mini-ads .chip{background:var(--pale);justify-self:start}
.price{font-weight:700;color:var(--orange)}
.mini-threads a{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px;text-decoration:none;color:var(--ink)}
.mini-threads span{font-size:14px;color:var(--muted)}

/* Species profile */
.crumbs{margin:0 0 18px;font-size:15px}
.sheet-grid{display:grid;gap:32px;margin-bottom:36px}
@media (min-width:900px){.sheet-grid{grid-template-columns:1.1fr 1fr;align-items:start}}
.sheet figure{margin:0}.sheet figure img{border-radius:var(--radius)}
figcaption{font-size:13px;color:var(--muted);margin-top:8px}
.facts{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0 0 24px}
.facts div{background:var(--sand);border-radius:12px;padding:12px 14px}
.facts dt{font:800 11px Manrope,Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.facts dd{margin:4px 0 0;color:var(--ink);font-weight:700}
.prose{max-width:72ch;font-size:17px;margin-bottom:40px}
.prose h2{font-size:24px;margin-top:1.6em}
.prose figure{margin:28px 0}.prose figure img{display:block;width:100%;height:auto;border-radius:var(--radius)}
.callout{background:var(--pale);border-left:4px solid var(--blue);padding:14px 18px;border-radius:0 12px 12px 0}
.src{font-size:14px;color:var(--muted)}
.sources{columns:2 260px;padding-left:20px}
.rules{font-size:18px;display:grid;gap:12px;padding-left:22px;margin:0 0 28px}

/* My aquarium and forms */
.tank{display:grid;gap:20px}
@media (min-width:900px){.tank{grid-template-columns:1fr 1.2fr;align-items:start}}
.panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}
.panel h2{font-size:24px}
label{display:block;font:700 14px Manrope,Arial,sans-serif;color:var(--ink);margin-bottom:14px}
label input,label select,label textarea{margin-top:6px;font-family:Arial,Helvetica,sans-serif;font-weight:400}
.row3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.vol{display:flex;justify-content:space-between;align-items:center;background:var(--pale);border-radius:12px;padding:14px 16px;margin:0 0 8px}
.vol strong{font:800 28px Manrope,Arial,sans-serif;color:var(--ink)}
.saved{color:var(--ok);font-weight:700}
.sync{background:var(--pale);border-radius:12px;padding:12px 16px;margin:-8px 0 24px;font-size:15px;color:var(--ink)}
.entry{display:grid;grid-template-columns:1fr 1fr;gap:0 12px;align-items:end}
.entry .wide{grid-column:1/-1}
.entry .btn{justify-self:start;margin-bottom:14px}
.log{list-style:none;padding:0;margin:8px 0 0;display:grid;gap:10px}
.log li{border:1px solid var(--line);border-left:4px solid var(--blue);border-radius:10px;padding:12px 14px;display:grid;grid-template-columns:1fr auto;gap:2px 10px}
.log li.t-water{border-left-color:var(--ice)}.log li.t-breed{border-left-color:var(--coral)}.log li.t-note{border-left-color:var(--muted)}
.log li.empty{border:1px dashed var(--line)}
.log strong{color:var(--ink)}.log time{font-size:13px;color:var(--muted);text-align:right}
.log p{margin:0;grid-column:1/-1;white-space:pre-wrap}
.log button{grid-column:1/-1;justify-self:start;font-size:13px}

/* Community app */
.form{max-width:560px}
.hint{font-size:13px;color:var(--muted);font-weight:400;display:block;margin-top:4px}
.alert{background:#fdecea;color:#8a1c12;border-radius:12px;padding:12px 16px;margin:0 0 18px}
.alert.ok{background:#e6f5ec;color:#145c37}
.hp{position:absolute;left:-5000px}
.toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0 0 20px}
.toolbar input,.toolbar select{width:auto;flex:1 1 180px}
.threads{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.threads li{display:grid;grid-template-columns:44px 1fr auto;gap:14px;align-items:center;padding:16px 18px;border-top:1px solid var(--line);background:#fff}
.threads li:first-child{border-top:0}
.threads a.t{font:700 17px Manrope,Arial,sans-serif;color:var(--ink);text-decoration:none}
.threads .by{font-size:14px;color:var(--muted)}
.threads .n{font:800 18px Manrope,Arial,sans-serif;color:var(--ink);text-align:center}
.threads .n small{display:block;font:400 12px Arial,sans-serif}
.avatar{width:44px;height:44px;border-radius:50%;background:var(--pale);color:var(--blue);display:grid;place-items:center;font:800 18px Manrope,Arial,sans-serif;text-transform:uppercase}
.post{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px 22px;margin-bottom:14px}
.post header{display:flex;gap:12px;align-items:center;margin-bottom:10px}
.post header a{font-weight:700;color:var(--ink)}
.post .text{white-space:pre-wrap;overflow-wrap:anywhere;color:var(--ink)}
.post footer{margin-top:10px;font-size:13px}
.hidden-note{font-size:13px;color:#8a1c12}
.ads{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px;list-style:none;margin:0;padding:0}
.ad{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.ad a{text-decoration:none;color:inherit;display:block}
.ad img,.ad .noimg{width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--pale)}
.ad .body{padding:14px 16px}
.ad h3{font-size:17px;margin:6px 0}
.ad .chip{background:var(--pale)}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin-bottom:20px}
.gallery img{border-radius:12px;width:100%;aspect-ratio:4/3;object-fit:cover}
.photos{display:flex;flex-wrap:wrap;gap:10px;margin:8px 0 14px}
.photos figure{margin:0;position:relative}
.photos img{width:110px;height:82px;object-fit:cover;border-radius:10px}
.photos button{position:absolute;top:4px;right:4px;border:0;border-radius:50%;width:24px;height:24px;background:#000a;color:#fff;cursor:pointer}
.status{font:700 12px Manrope,Arial,sans-serif;padding:4px 10px;border-radius:999px;background:var(--pale);color:var(--ink)}
.status.pending{background:#fff4d6;color:#7a5600}.status.rejected,.status.hidden{background:#fdecea;color:#8a1c12}
.admin-table{width:100%;border-collapse:collapse;font-size:14px}
.admin-table td,.admin-table th{border-bottom:1px solid var(--line);padding:10px;text-align:left;vertical-align:top}
.admin-table form{display:inline}
.profile-head{display:flex;gap:18px;align-items:center;margin-bottom:24px}
.profile-head .avatar{width:72px;height:72px;font-size:30px}
.tabs{display:flex;gap:8px;margin:0 0 24px;flex-wrap:wrap}

/* Shop */
.order-fish{display:flex;gap:14px;align-items:center;background:var(--sand);border-radius:14px;padding:12px;margin:0 0 22px}
.order-fish img{width:120px;height:90px;object-fit:cover;border-radius:10px}
.total{font-size:18px;margin:-6px 0 18px}.total strong{color:var(--orange)}
fieldset{border:1.5px solid var(--line);border-radius:14px;padding:12px 16px 4px;margin:0 0 16px}
legend{font:700 14px Manrope,Arial,sans-serif;color:var(--ink);padding:0 6px}
label.radio{display:flex;gap:10px;align-items:baseline;font-weight:400;font-family:Arial,Helvetica,sans-serif}
label.radio input{width:auto;margin:0}
/* Admin, after the ChatGPT design: full-width navy rail under the header, big titles, the moderation desk. */
.admin-rail{background:var(--navy);color:#adbdd5;margin:-56px calc(50% - 50vw) 34px;padding:0 20px}
.rail-inner{max-width:1140px;margin:0 auto;display:flex;align-items:center;gap:38px;min-height:62px}
.admin-label{display:flex;align-items:center;gap:10px;font-size:13px;letter-spacing:1.2px;text-transform:uppercase;font-weight:700;white-space:nowrap}
.status-dot{width:7px;height:7px;border-radius:50%;background:#55c7ff;box-shadow:0 0 0 4px #55c7ff22}
.admin-nav{display:flex;align-self:stretch;align-items:center;gap:28px;overflow-x:auto;scrollbar-width:none}
.admin-nav a{height:100%;min-height:62px;display:flex;align-items:center;gap:8px;font:700 14px Manrope,Arial,sans-serif;white-space:nowrap;position:relative;color:#adbdd5;text-decoration:none}
.admin-nav a:hover,.admin-nav a[aria-current]{color:#fff}
.admin-nav a[aria-current]:after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;border-radius:3px 3px 0 0;background:var(--coral)}
.admin-nav b{font-size:10px;background:#ffffff17;border-radius:5px;padding:1px 6px;color:#e0e8f6}
.admin-nav svg,.history-mark svg,.detail-empty svg,.report-symbol svg{width:17px;height:17px;stroke:currentColor;stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.page-head{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-bottom:28px;padding:0}
.page-head .eyebrow{font-size:10px;letter-spacing:1.7px;color:#647998;margin-bottom:12px}
.page-head .eyebrow:before{display:none}
.page-head h1{font-size:clamp(30px,5vw,40px);letter-spacing:-1.6px;margin:0}
.title-dot{color:var(--coral)}
.page-head p{font-size:15px;color:var(--muted);margin:10px 0 0}
.workspace-top{display:flex;align-items:center;justify-content:space-between;gap:20px}
.section-tabs{display:flex;gap:32px;overflow-x:auto;scrollbar-width:none}
.section-tabs a{display:flex;align-items:center;gap:9px;padding:0 0 16px;position:relative;font:700 15px Manrope,Arial,sans-serif;color:var(--muted);white-space:nowrap;text-decoration:none}
.section-tabs a[aria-current]{color:var(--ink)}
.section-tabs a[aria-current]:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:3px;background:var(--blue);border-radius:4px 4px 0 0}
.section-tabs a>span{min-width:23px;text-align:center;border-radius:5px;font-size:11px;background:#e7ecf5;padding:1px 5px;color:#60738e}
.section-tabs a[aria-current]>span{background:var(--blue);color:#fff}
.pending-summary{font-size:12px;color:var(--muted);padding-bottom:15px;white-space:nowrap}.pending-summary b{color:var(--ink)}
.workbench{padding:0;background:#fff;border:1px solid #dce4ef;border-radius:0 14px 14px 14px;box-shadow:0 8px 30px #14284b08;overflow:hidden}
.case-layout{display:grid;grid-template-columns:340px minmax(0,1fr);min-height:560px}
.queue{background:#fbfcfe;border-right:1px solid var(--line);min-width:0}
.queue-caption{display:flex;justify-content:space-between;padding:19px 21px 15px;color:#7b889a;font-size:10px;letter-spacing:1px;text-transform:uppercase;font-weight:700}
.case-list{padding:0 11px 11px;display:flex;flex-direction:column;gap:7px;max-height:640px;overflow-y:auto}
.case-row{display:grid;grid-template-columns:76px minmax(0,1fr);gap:13px;align-items:center;border:1px solid transparent;border-radius:10px;padding:12px 10px;color:var(--ink);text-decoration:none}
.case-row:hover{background:#f0f4fb}
.case-row[aria-current]{border-color:#c6d8fc;background:#edf3ff;box-shadow:inset 3px 0 var(--blue)}
.case-thumb{width:76px;height:74px;object-fit:cover;border-radius:7px;background:#e1e9f6;display:block}
.case-info{display:block;min-width:0}
.case-info strong{display:block;font-size:14px;line-height:1.4;margin-bottom:5px;overflow-wrap:anywhere}
.case-info small{display:block;font-size:11px;color:var(--muted);line-height:1.5;overflow-wrap:anywhere}
.case-subline{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:8px;font-size:10px;color:var(--muted)}
.tiny-dot{width:5px;height:5px;border-radius:50%;background:#e9a55b;display:inline-block;margin-right:4px;vertical-align:middle}
.queue-foot{padding:7px 21px 22px;font-size:11px;line-height:1.7;color:#7a889c;margin:0}
.member-row{grid-template-columns:48px minmax(0,1fr)}.member-row .avatar{width:45px;height:45px;font-size:15px}
.detail{min-width:0;display:flex;flex-direction:column}
.detail-head{padding:22px 27px 19px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.detail-head h2{font-size:23px;line-height:1.3;letter-spacing:-.6px;margin:0}
.detail-kicker{display:flex;align-items:center;gap:9px;color:#7b8aa1;font-size:10px;letter-spacing:.6px;margin-bottom:10px}
.pill{display:inline-flex;align-items:center;gap:5px;white-space:nowrap;padding:4px 8px;border-radius:5px;font-size:10px;line-height:1.4;font-weight:700;color:#95621b;background:#fff4df;vertical-align:middle}
.pill-blue{background:#eaf1ff;color:var(--blue)}.pill-green{background:#e8f5ee;color:#176e52}.pill-red{background:#fcecee;color:#a73338}.pill-neutral{background:#eef1f6;color:#637089}
.detail-scientific{font-size:12px;color:var(--muted);font-style:italic;margin:5px 0 0}
.price-block{text-align:right;white-space:nowrap;padding-top:26px}
.price-block strong{font-family:Manrope,Arial,sans-serif;display:block;font-size:23px;letter-spacing:-.7px}.price-block small{color:var(--muted);font-size:11px}
.detail-body{padding:22px 27px;flex:1}
.preview-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(190px,.9fr);gap:25px}
.photo-wrap{display:block;background:#e4eaf5;border-radius:9px;overflow:hidden;width:100%;height:206px}.photo-wrap img{width:100%;height:100%;object-fit:cover}
.photo-note{font-size:10px;color:#7a889a;margin:7px 0 0}
.facts{display:grid;grid-template-columns:1fr 1fr;gap:16px 15px;align-content:start;margin:2px 0 0}
.detail .facts div{min-width:0;background:none;padding:0;border-radius:0;border:0}.facts dt{font-size:10px;color:#7b889b;margin-bottom:4px}.facts dd{margin:0;font-size:13px;color:var(--ink);font-weight:700;line-height:1.45;overflow-wrap:anywhere}
.description{margin-top:21px;font-size:14px;line-height:1.8;color:var(--body)}.description p{margin:0 0 10px}
.seller-strip{display:flex;align-items:center;gap:11px;margin-top:19px;padding-top:16px;border-top:1px solid var(--line)}
.avatar{width:35px;height:35px;border-radius:50%;background:#eaf0fb;color:#4b6da4;display:grid;place-items:center;font-size:11px;font-weight:700;flex-shrink:0}
.seller-strip strong{font-size:13px;display:block}.seller-strip small{display:block;font-size:11px;color:var(--muted);margin-top:2px}.seller-strip>.pill{margin-left:auto}
.decision-bar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:18px 27px;border-top:1px solid var(--line);background:#fff}
.decision-bar form{display:contents}.decision-bar form:last-child .button-danger,.decision-bar>.button-danger{margin-left:auto}
.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);border-radius:7px;padding:11px 15px;min-height:43px;font:700 12px/1.45 Arial,sans-serif;background:#fff;color:var(--ink);cursor:pointer;text-decoration:none}
.button:hover{background:#f1f5fb}
.button-primary{background:var(--blue);border-color:var(--blue);color:#fff}.button-primary:hover{background:#1847b5}
.button-danger{color:#a73338;border-color:#edcfd3}.button-danger:hover{background:#fff0f1}
.detail-empty{display:grid;place-items:center;min-height:420px;padding:40px;text-align:center;flex:1}
.detail-empty svg{width:46px;height:46px;margin:0 auto 14px;color:#a4b6cf;display:block}.detail-empty h3{font-size:18px;margin:0 0 8px}.detail-empty p{font-size:13px;color:var(--muted);margin:0}
.report-symbol{width:76px;height:74px;display:grid;place-items:center;border-radius:8px;background:#fff0e8;color:#c5814f}.report-symbol.blue{background:#edf1fe;color:#6c82bc}.report-symbol svg{width:29px;height:29px}
.report-alert{display:flex;align-items:center;gap:12px;padding:15px 16px;background:#fff7ed;border:1px solid #f2e4d0;border-radius:8px;margin-bottom:24px;color:#98632a}
.report-alert strong{display:block;font-size:13px}.report-alert small{font-size:11px;color:#a57b4b}
.section-label{font-size:10px;letter-spacing:1px;text-transform:uppercase;color:#7b8a9f;font-weight:700;margin-bottom:9px}
.report-quote{margin:0;padding:19px;border-left:3px solid #d7e3f7;background:#f7f9fd;border-radius:0 7px 7px 0;font-size:14px;line-height:1.9;color:var(--body)}
.context-link{display:inline-flex;gap:6px;align-items:center;color:var(--blue);font-size:12px;font-weight:700;margin-top:17px;text-decoration:none}.context-link:hover{text-decoration:underline}
.profile-intro{display:flex;align-items:center;gap:17px;padding-bottom:24px}.profile-intro .avatar{width:72px;height:72px;font-size:23px}
.profile-intro h3{font-size:22px;letter-spacing:-.5px;margin:0 0 5px}.profile-intro p{font-size:13px;color:var(--muted);margin:0}
.profile-facts{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:20px 0;border-top:1px solid var(--line)}
.profile-facts span{font-size:11px;color:var(--muted);display:block;margin-bottom:4px}.profile-facts strong{font-size:13px;overflow-wrap:anywhere}
.profile-note{background:#f7f9fd;border-radius:8px;padding:17px;font-size:13px;color:var(--body);line-height:1.8;margin-top:15px}.profile-note strong{display:block;color:var(--ink);font-size:12px;margin-bottom:4px}
.history-header{padding:24px 27px;border-bottom:1px solid var(--line)}.history-header h2{font-size:21px;letter-spacing:-.5px;margin:0}.history-header p{font-size:12px;color:var(--muted);margin:5px 0 0}
.history-list{padding:0 27px}
.history-item{display:grid;grid-template-columns:35px minmax(0,1fr) auto;gap:15px;align-items:start;padding:22px 0;border-bottom:1px solid var(--line)}.history-item:last-child{border-bottom:0}
.history-mark{background:#eef4ff;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;color:var(--blue)}
.history-item h3{font-size:14px;margin:0 0 6px}.history-item p{font-size:12px;color:var(--body);margin:0 0 5px;overflow-wrap:anywhere}.history-item small{font-size:10px;color:var(--muted)}
.history-item .button{min-height:34px;padding:6px 11px;font-size:11px}
.offer-reject summary{list-style:none;min-height:34px;padding:6px 11px;font-size:11px}.offer-reject summary::-webkit-details-marker{display:none}
.offer-reject form{display:grid;gap:8px;margin-top:10px;min-width:240px}.offer-reject label{font-size:12px}.offer-reject textarea{width:100%}
@media (max-width:960px){.case-layout{grid-template-columns:280px minmax(0,1fr)}.case-row{grid-template-columns:56px minmax(0,1fr);gap:10px}.case-thumb,.report-symbol{width:56px;height:62px}.preview-grid{grid-template-columns:1fr}.facts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.rail-inner{display:block;padding-top:12px;min-height:0}.admin-label{font-size:10px}.admin-nav{gap:18px}.admin-nav a{min-height:50px;font-size:13px}
.workspace-top{flex-direction:column;align-items:flex-start;gap:4px}.pending-summary{padding-bottom:0}.workbench{border-radius:14px;margin-top:14px}
.case-layout{grid-template-columns:1fr}.queue{border-right:0;border-bottom:1px solid var(--line)}.case-list{max-height:300px}.detail-head{padding:18px}.detail-body{padding:18px}.decision-bar{padding:15px 18px}.price-block{padding-top:0}}
.admin-fish{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.admin-fish{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.admin-fish li{display:flex}
.admin-fish a{display:flex;background:#fff;border:1px solid var(--line);border-radius:14px;text-decoration:none;color:var(--ink);flex-direction:column;align-items:stretch;gap:0;padding:0;overflow:hidden;width:100%;transition:border-color .15s,box-shadow .15s}
.admin-fish a:hover{border-color:var(--coral);box-shadow:var(--shadow)}
.admin-fish img,.admin-fish .nophoto{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:0}
.admin-fish .af{display:block;padding:12px 14px 14px}
.admin-fish .af-price{display:block;margin-top:4px;font-weight:700;color:var(--orange)}.admin-fish .af-price s{font-weight:500;opacity:.6}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.chips .chip,.order .chip{background:var(--pale);font-weight:700}
.chip.ok,.chip.s-pagado{background:#e6f5ec;color:#145c37}.chip.warn,.chip.s-nuevo{background:#fff4d6;color:#7a5600}
.chip.off{background:#f0f2f6;color:var(--muted)}.chip.sale{background:#e5322d;color:#fff}.chip.info,.chip.s-entregado{background:var(--pale);color:var(--blue)}
.chip.s-cancelado{background:#fdecea;color:#8a1c12}
[data-min-hint]{color:#c62828;font-weight:700}
.admin-table{background:#fff;border:1px solid var(--line);border-radius:14px;border-collapse:separate;border-spacing:0;overflow:hidden}
.admin-table th{background:var(--sand);font:700 12px Manrope,Arial,sans-serif;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.admin-table tr:last-child td{border-bottom:0}
details.en{border:1.5px dashed var(--line);border-radius:14px;padding:10px 14px;margin:0 0 16px}details.en summary{cursor:pointer;font-weight:700;color:var(--ink)}
.post.order header{flex-wrap:wrap}

/* Footer */
.foot{background:var(--navy);color:#a9b6cc;padding:56px 0 28px;font-size:15px}
.foot .wrap{display:grid;gap:28px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.foot img{width:200px;filter:brightness(0) invert(1);opacity:.9;margin-bottom:12px}
.foot h2{font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:#fff;margin:0 0 12px}
.foot a{display:block;color:#d6deeb;text-decoration:none;margin-bottom:8px}
.foot a:hover{color:#fff}
.credit{margin:0;padding:14px 16px;background:#081a38;color:#8b9ab3;font-size:13px;text-align:center}
.credit a{color:#d6deeb;font-weight:700;text-decoration:none}
.credit a:hover{color:#fff;text-decoration:underline}
.foot .copy{grid-column:1/-1;border-top:1px solid #ffffff1f;padding-top:20px;margin:0;font-size:13px}
@media (max-width:560px){.form .row3{grid-template-columns:1fr 1fr}.form .row3>label:first-child{grid-column:1/-1}section,.sheet{padding:52px 0}.facts{grid-template-columns:1fr}.entry{grid-template-columns:1fr}.threads li{grid-template-columns:1fr auto}.threads .avatar{display:none}.logo img{width:180px}}

/* Profile page */
.profile-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;margin-bottom:28px;padding:0}
.profile-cover{height:120px;background:radial-gradient(circle at 85% 20%,#2559d855,transparent 55%),linear-gradient(120deg,var(--navy),#1d3a6e)}
.profile-body{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 24px;padding:0 28px}
.profile-id{display:flex;align-items:flex-end;gap:18px}
.profile-id .avatar{width:104px;height:104px;font-size:40px;border:5px solid #fff;background:var(--pale);color:var(--blue);box-shadow:0 6px 18px #17294522;margin-top:-52px;flex-shrink:0}
.profile-id h1{font-size:clamp(28px,5vw,38px);margin:14px 0 4px}
.profile-id p{margin:0;color:var(--muted);font-size:15px}
.profile-body .ctas{gap:8px;padding-bottom:8px}
.profile-bio{margin:18px 28px 0;color:var(--body)}
.profile-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:22px 0 0;border-top:1px solid var(--line)}
.profile-stats div{padding:16px 28px}.profile-stats div+div{border-left:1px solid var(--line)}
.profile-stats dt{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:1px}
.profile-stats dd{margin:4px 0 0;font:800 22px Manrope,Arial,sans-serif;color:var(--ink)}
.profile-sec{padding:0;margin:0 0 32px}
.profile-sec h2{font-size:24px;margin-bottom:14px}
.profile-empty{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px;background:var(--sand);border:1.5px dashed var(--line);border-radius:14px;padding:20px 24px}
.profile-empty p{margin:0;color:var(--muted)}
@media (max-width:640px){.profile-body{padding:0 18px}.profile-id{flex-direction:column;align-items:flex-start;gap:10px}.profile-id .avatar{width:84px;height:84px;font-size:32px}
.profile-stats div{padding:14px 12px}.profile-stats dt{font-size:10px;letter-spacing:.4px}.profile-stats dd{font-size:16px}.profile-bio{margin:16px 18px 0}}

/* Photo viewer on fish pages */
.sheet figure a{display:block}.sheet figure>a img{cursor:zoom-in}
.viewer{border:0;padding:0;background:transparent;max-width:100vw;max-height:100vh;width:100vw;height:100vh;overflow:hidden}
.viewer::backdrop{background:#0b1426ee}
.viewer[open]{display:grid;place-items:center}
.viewer img{max-width:min(92vw,1200px);max-height:84vh;object-fit:contain;border-radius:12px}
.viewer button{position:fixed;border:0;border-radius:50%;width:52px;height:52px;background:#ffffff1f;color:#fff;font:400 34px/1 Arial,sans-serif;cursor:pointer;display:grid;place-items:center}
.viewer button:hover,.viewer button:focus-visible{background:#ffffff40}
.viewer-prev{left:16px;top:50%;transform:translateY(-50%)}.viewer-next{right:16px;top:50%;transform:translateY(-50%)}
.viewer-x{top:16px;right:16px}
.viewer-n{position:fixed;bottom:18px;left:0;right:0;text-align:center;color:#dfe6f3;font:700 14px Manrope,Arial,sans-serif;margin:0}
@media (max-width:640px){.viewer button{width:44px;height:44px;font-size:28px}.viewer-prev{left:6px}.viewer-next{right:6px}}