/* Tideborne Fish Wiki specimen lab. */
html{scrollbar-gutter:stable}
body.fish-highlight-open{overflow:hidden}

#fish-highlight-layer{position:fixed;inset:0;z-index:1200;pointer-events:none}
#fish-highlight-layer[hidden]{display:none!important}
.fish-highlight-backdrop{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;border:0;pointer-events:auto;background:rgba(2,8,15,.74);backdrop-filter:blur(5px) saturate(.9)}
.fish-highlight-modal{position:fixed;top:clamp(12px,2vh,24px);right:clamp(14px,2.7vw,44px);bottom:clamp(12px,2vh,24px);left:clamp(250px,18.5vw,306px);display:flex;flex-direction:column;min-width:0;overflow:hidden;pointer-events:auto;color:#e9f8fb;border:1px solid #2b6173;border-radius:17px;background:radial-gradient(900px circle at 72% 7%,rgba(69,211,202,.095),transparent 42%),linear-gradient(145deg,#0a1c2b,#071722 62%,#06131d);box-shadow:0 30px 110px rgba(0,0,0,.62),inset 0 1px rgba(147,237,230,.045)}
.fish-highlight-modal::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(circle at 1px 1px,rgba(111,213,218,.04) 1px,transparent 0);background-size:18px 18px;mask-image:linear-gradient(#000,transparent 55%)}
.fish-highlight-topbar{position:relative;z-index:5;display:flex;align-items:center;gap:8px;min-height:47px;padding:7px 10px 7px 13px;border-bottom:1px solid #23495b;background:rgba(5,20,31,.9);backdrop-filter:blur(12px)}
.fish-highlight-nav-label{flex:1;min-width:0;display:flex;align-items:center;gap:8px;color:#719cab;font:800 8px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.13em;text-transform:uppercase}
.fish-highlight-nav-label strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#eafcfe}
.fish-highlight-nav-btn,.fish-highlight-close{display:grid;place-items:center;height:31px;border:1px solid #31596a;border-radius:8px;background:#0a2232;color:#e1f9fb;cursor:pointer;transition:background 140ms ease,border-color 140ms ease,transform 140ms ease}
.fish-highlight-nav-btn{min-width:31px;padding:0 9px}.fish-highlight-close{width:33px;padding:0;font:800 20px/1 system-ui}
.fish-highlight-nav-btn:hover,.fish-highlight-close:hover{border-color:#54d8d0;background:#103044;transform:translateY(-1px)}
.fish-highlight-scroll{position:relative;z-index:2;flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:15px;scrollbar-width:thin;scrollbar-color:#2d6074 transparent}

.fish-lab-workspace{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(315px,.82fr);gap:14px}
.fish-lab-specimen-card,.fish-lab-console,.fish-lab-panel,.fish-lab-accordion{border:1px solid #285467;border-radius:14px;background:linear-gradient(150deg,rgba(11,34,49,.91),rgba(6,22,33,.8));box-shadow:inset 0 1px rgba(176,242,240,.035)}
.fish-lab-specimen-card{padding:16px;min-width:0}.fish-lab-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.fish-highlight-eyebrow{margin:0 0 6px;color:#42d8cf;font:800 8px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.15em;text-transform:uppercase}
.fish-highlight-title{margin:0;color:#fffdf5;font-family:Georgia,'Times New Roman',serif;font-size:clamp(31px,3vw,50px);line-height:.98;letter-spacing:-.027em}
.fish-lab-star-pill{padding:5px 8px;border:1px solid #675c2b;border-radius:999px;background:#111c1d;color:#ffe26a;font:800 10px/1 ui-monospace,monospace}
.fish-highlight-subline{display:flex;flex-wrap:wrap;gap:5px;margin:10px 0 0}.fish-highlight-subline span{padding:4px 7px;border:1px solid #2b5364;border-radius:999px;background:#081d2b;color:#acd7dc;font:700 8px/1 ui-monospace,monospace}

/* The render and ruler share one scene scale. 1 block = 100 cm. */
.fish-lab-render-stage{--block-px:150px;--fish-width:75px;position:relative;height:clamp(255px,34vh,350px);margin-top:13px;overflow:hidden;border:1px solid #28596a;border-radius:12px;background:radial-gradient(circle at 50% 42%,rgba(48,137,143,.19),transparent 57%),linear-gradient(180deg,#081d2b,#06151f)}
.fish-lab-water-grid{position:absolute;inset:0;opacity:.42;pointer-events:none;background-image:linear-gradient(rgba(68,145,153,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(68,145,153,.07) 1px,transparent 1px);background-size:32px 32px;mask-image:linear-gradient(to bottom,#000,transparent 92%)}
.fish-lab-orbit{position:absolute;left:50%;top:46%;width:min(55%,340px);aspect-ratio:1;translate:-50% -50%;border:1px dashed rgba(75,205,199,.11);border-radius:50%;pointer-events:none;animation:fish-lab-orbit 32s linear infinite}
.fish-lab-orbit::before{content:"";position:absolute;left:50%;top:-2px;width:4px;height:4px;border-radius:50%;background:#55d8cf;box-shadow:0 0 11px #55d8cf}
@keyframes fish-lab-orbit{to{rotate:360deg}}
.fish-lab-render-shell{position:absolute;left:4%;right:4%;top:8%;bottom:23%;display:flex;align-items:center;justify-content:center;overflow:visible}
.fish-lab-render-shell img{display:block;width:var(--fish-width)!important;height:auto!important;max-width:none!important;max-height:none!important;object-fit:contain!important;object-position:center!important;transform:none!important;image-rendering:pixelated;filter:drop-shadow(0 10px 15px rgba(0,0,0,.25));transition:width 220ms cubic-bezier(.2,.8,.2,1),filter 180ms ease!important}
.fish-lab-render-missing{color:#80a8b4;font:800 9px/1.5 ui-monospace,monospace;text-transform:uppercase;letter-spacing:.08em}
.fish-lab-scale-reference{position:absolute;left:13px;bottom:29px;z-index:4;display:flex;align-items:flex-end;gap:8px;pointer-events:none;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.fish-lab-block-icon{width:24px;height:24px;flex:0 0 24px;border:1px solid #4c9189;box-shadow:inset 0 0 0 2px rgba(3,18,24,.45),0 3px 8px rgba(0,0,0,.25);background:linear-gradient(90deg,transparent 47%,rgba(7,39,42,.35) 47% 54%,transparent 54%),linear-gradient(transparent 47%,rgba(7,39,42,.35) 47% 54%,transparent 54%),linear-gradient(135deg,#629b8e 0 25%,#39786f 25% 50%,#548d81 50% 75%,#326e68 75%);background-size:8px 8px,8px 8px,100% 100%;image-rendering:pixelated}
.fish-lab-ruler{width:var(--block-px);min-width:8px;transition:width 220ms cubic-bezier(.2,.8,.2,1)}
.fish-lab-ruler-ticks{display:block;height:11px;border-bottom:2px solid #59d8cf;background:repeating-linear-gradient(90deg,#59d8cf 0 1px,transparent 1px 10%);opacity:.85}
.fish-lab-ruler>div{display:flex;justify-content:space-between;gap:8px;margin-top:3px;white-space:nowrap}.fish-lab-ruler strong{color:#d9fbf7;font-size:7px;letter-spacing:.08em}.fish-lab-ruler em{color:#6fa5aa;font:normal 7px/1 ui-monospace,monospace}
.fish-lab-render-stage[data-scale-mode="fit"] .fish-lab-ruler strong::after{content:" · AUTO-FIT";color:#e2c96a}
.fish-lab-render-meta{position:absolute;left:12px;right:12px;bottom:8px;display:flex;justify-content:space-between;gap:12px;color:#7298a6;font:700 7px/1 ui-monospace,monospace;letter-spacing:.06em;text-transform:uppercase}.fish-lab-render-meta strong{color:#9ce8e0}

.fish-lab-console{padding:15px;display:flex;flex-direction:column;gap:11px;background:radial-gradient(520px circle at 88% 0%,rgba(62,208,199,.1),transparent 55%),rgba(5,21,31,.88)}
.fish-lab-score-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:10px;border-bottom:1px solid #234b5b}.fish-lab-score-head>div{display:flex;flex-direction:column;gap:2px}.fish-lab-score-head span{color:#6c98a7;font:800 7px/1 ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase}.fish-lab-score-head strong{color:#f0ffff;font:900 clamp(27px,2.7vw,40px)/1 ui-monospace,monospace;letter-spacing:-.04em}.fish-lab-live-dot{padding:5px 7px;border:1px solid rgba(68,221,207,.36);border-radius:999px;color:#5ce0d7!important;background:rgba(33,111,104,.13)}
.fish-lab-control-group{display:grid;gap:6px}.fish-lab-control-group>label,.fish-lab-control-label label{color:#85abb7;font:800 7px/1 ui-monospace,monospace;letter-spacing:.11em;text-transform:uppercase}.fish-lab-control-label{display:flex;justify-content:space-between;align-items:center}.fish-lab-control-label output{color:#e3fbfc;font:900 9px/1 ui-monospace,monospace}
.fish-lab-control-group select{width:100%;height:35px;padding:0 9px;border:1px solid #2b5668;border-radius:8px;background:#071a27;color:#e8fbfd;font:700 9px/1 ui-monospace,monospace;outline:none}.fish-lab-control-group select:focus{border-color:#54d8d0;box-shadow:0 0 0 2px rgba(84,216,208,.09)}
.fish-lab-segmented{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:4px;border:1px solid #275062;border-radius:9px;background:#071923}.fish-lab-segmented button{height:30px;border:0;border-radius:6px;background:transparent;color:#7099a8;font:800 8px/1 ui-monospace,monospace;cursor:pointer}.fish-lab-segmented button.active{color:#f0ffff;background:linear-gradient(#123b49,#0d2c39);box-shadow:inset 0 0 0 1px #3e8890}
.fish-lab-control-group input[type=range]{width:100%;accent-color:#55d8d0;cursor:pointer}.fish-lab-range-labels{display:flex;justify-content:space-between;color:#587e8b;font:700 7px/1 ui-monospace,monospace;text-transform:uppercase}
.fish-lab-perfect-note{padding:6px 8px;border:1px solid rgba(229,202,91,.28);border-radius:7px;background:rgba(112,89,21,.13);color:#e5d587;font:800 7px/1.35 ui-monospace,monospace;letter-spacing:.04em;text-transform:uppercase}.fish-lab-perfect-note[hidden]{display:none!important}
.fish-lab-breakdown{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #274f60;border-radius:9px;overflow:hidden}.fish-lab-fact{min-width:0;padding:8px 9px;border-right:1px solid #224a5a;border-bottom:1px solid #224a5a;background:rgba(5,24,35,.45)}.fish-lab-breakdown .fish-lab-fact:nth-child(3n){border-right:0}.fish-lab-breakdown .fish-lab-fact:nth-last-child(-n+3){border-bottom:0}.fish-lab-fact span{display:block;margin-bottom:4px;color:#5f8f9e;font:800 6px/1.2 ui-monospace,monospace;letter-spacing:.09em;text-transform:uppercase}.fish-lab-fact strong{display:block;overflow:hidden;text-overflow:ellipsis;color:#e9fcfd;font:900 9px/1.2 ui-monospace,monospace}.fish-lab-fact.accent strong{color:#5de0d6}.fish-lab-fact.wide{grid-column:1/-1}.fish-lab-multiplier{padding:6px 8px;border:1px solid #596d38;border-radius:7px;background:rgba(108,121,41,.12);color:#d4daa1;font:700 7px/1.3 ui-monospace,monospace}.fish-lab-multiplier strong{float:right;color:#fff0a5}

.fish-lab-summary-grid{display:grid;grid-template-columns:1.08fr .92fr;gap:13px;margin-top:13px}.fish-lab-panel{padding:13px}.fish-lab-panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px}.fish-lab-panel-head h2{margin:0;color:#fffdf6;font:700 16px/1.1 Georgia,serif}.fish-lab-panel-head span{color:#5b8796;font:800 6px/1 ui-monospace,monospace;text-transform:uppercase;letter-spacing:.1em}
.fish-lab-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid #285165;border-radius:9px;overflow:hidden}.fish-lab-facts .fish-lab-fact:nth-child(3n){border-right:0}.fish-lab-facts .fish-lab-fact.wide{grid-column:1/-1;border-right:0}
.fish-lab-condition-list{display:grid}.fish-lab-condition-list>div{display:grid;grid-template-columns:minmax(90px,.32fr) 1fr;gap:9px;padding:7px 0;border-bottom:1px solid #224957}.fish-lab-condition-list>div:last-child{border-bottom:0}.fish-lab-condition-list strong{color:#dcf6f8;font:800 7px/1.3 ui-monospace,monospace}.fish-lab-condition-list span,.fish-lab-condition-list p{margin:0;color:#8db0ba;font-size:8px;line-height:1.35}
.fish-lab-accordion{margin-top:10px;overflow:hidden}.fish-lab-accordion summary{list-style:none;display:flex;align-items:center;justify-content:space-between;padding:11px 13px;color:#dff7f9;font:800 8px/1 ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase;cursor:pointer}.fish-lab-accordion summary::-webkit-details-marker{display:none}.fish-lab-accordion summary i{color:#5edbd2;font:normal 17px/1 system-ui;transition:rotate 150ms ease}.fish-lab-accordion[open] summary i{rotate:45deg}.fish-lab-accordion-body{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding:0 13px 13px;border-top:1px solid #234a59}.fish-lab-accordion-body h3{margin:12px 0 8px;color:#fffdf6;font:700 14px/1 Georgia,serif}.fish-lab-reference-list{display:grid;gap:5px}.fish-lab-reference-list>div{display:flex;justify-content:space-between;gap:10px;padding:6px 7px;border:1px solid #244f60;border-radius:6px;color:#8fb1bb;font-size:8px}.fish-lab-reference-list strong{color:#dffafb;font-family:ui-monospace,monospace}.fish-lab-accordion dl{display:grid;grid-template-columns:72px 1fr;gap:5px 8px;margin:0;color:#91b0b9;font-size:8px}.fish-lab-accordion dt{color:#5f98aa;font-family:ui-monospace,monospace}.fish-lab-accordion dd{margin:0;overflow-wrap:anywhere}.fish-lab-related{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;padding:0 13px 13px}.fish-lab-related button{display:flex;flex-direction:column;gap:3px;padding:8px 9px;border:1px solid #285064;border-radius:7px;background:#081c29;color:#e9fbfc;text-align:left;cursor:pointer}.fish-lab-related button:hover{border-color:#4ccbc4;background:#0b2635}.fish-lab-related strong{font-size:9px}.fish-lab-related span{color:#729ba8;font-size:7px}

@media(max-width:1050px){.fish-highlight-modal{left:12px;right:12px;top:10px;bottom:10px}.fish-lab-workspace{grid-template-columns:1fr 360px}}
@media(max-width:800px){.fish-highlight-modal{left:6px;right:6px;top:6px;bottom:6px;border-radius:11px}.fish-highlight-scroll{padding:10px}.fish-lab-workspace,.fish-lab-summary-grid,.fish-lab-accordion-body{grid-template-columns:1fr}.fish-lab-render-stage{height:285px}.fish-lab-facts{grid-template-columns:repeat(2,1fr)}.fish-lab-related{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.fish-lab-facts,.fish-lab-breakdown{grid-template-columns:1fr}.fish-lab-fact{border-right:0!important}.fish-lab-related{grid-template-columns:1fr}.fish-lab-scale-reference{left:9px}.fish-highlight-title{font-size:30px}}
@media(prefers-reduced-motion:reduce){.fish-lab-orbit{animation:none}.fish-lab-render-shell img,.fish-lab-ruler{transition:none!important}}
