:root{color:#193b39;font-synthesis:none;text-rendering:optimizelegibility;--ink:#193b39;--muted:#718782;--line:#e5eeea;--green:#168475;--mint:#d9f2e9;--surface:#fff;--shadow:0 12px 34px #2149410e;background:#f4f9f7;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans KR,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:320px;margin:0}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent;color:inherit}.site-header{background:#ffffffc7;border-bottom:1px solid #eaf0ed;justify-content:space-between;align-items:center;height:76px;padding:0 max(5vw,24px);display:flex}.brand{letter-spacing:-.6px;align-items:center;gap:10px;font-size:19px;text-decoration:none;display:flex}.brand b{color:#168475;font-weight:700}.brand-icon{background:#e2f5ee;border-radius:13px;place-items:center;width:38px;height:38px;display:grid}.site-header nav,.site-footer nav{gap:26px;display:flex}.site-header nav a,.site-footer nav a{color:#58716c;font-size:13px;text-decoration:none}.site-header nav a:hover,.site-footer nav a:hover{color:#168475}.planner-shell{grid-template-columns:minmax(300px,1fr) minmax(390px,1.18fr) minmax(320px,1fr);align-items:start;gap:22px;max-width:1500px;margin:0 auto;padding:30px 34px 72px;display:grid}.tank-column,.results-column,.finder-column{min-width:0}.panel{background:var(--surface);box-shadow:var(--shadow);border:1px solid #e9f0ed;border-radius:22px}.tank-panel,.selected-panel,.result-panel,.finder-panel{padding:24px}.section-heading{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.eyebrow{text-transform:uppercase;letter-spacing:1.1px;color:#80a29a;margin:0 0 6px;font-size:11px;font-weight:700;line-height:1.4}.section-heading h1,.section-heading h2,.content-page h1{letter-spacing:-.8px;margin:0;font-size:24px;font-weight:750;line-height:1.25}.text-button{color:#77908a;text-underline-offset:3px;cursor:pointer;background:0 0;border:0;padding:9px;font-size:12px;text-decoration:underline}.tank-label{color:#41615b;margin-bottom:8px;font-size:13px;font-weight:600;display:block}.liter-input{background:#fbfdfc;border:1px solid #dce9e4;border-radius:13px;align-items:center;height:52px;padding:0 15px;display:flex}.liter-input input{color:#234641;background:0 0;border:0;outline:0;width:100%;font-size:24px;font-weight:700}.liter-input span{color:#73908a;font-size:15px}.quick-liters{flex-wrap:wrap;gap:7px;margin:12px 0 18px;display:flex}.quick-liters button,.filter-list button{color:#617a74;cursor:pointer;background:#fff;border:1px solid #e8efec;border-radius:20px;min-height:34px;padding:7px 12px;font-size:11px}.quick-liters button:hover,.quick-liters button.is-active,.filter-list button.is-active{color:#147b6e;background:#e1f5ef;border-color:#d4eee5}.aquarium{background:#f4f9f7;border-radius:20px;padding:5px}.tank-glass{background:linear-gradient(#c9eee8 0%,#a8ded6 48%,#c6e9d8 100%);border:5px solid #e0eeea;border-top:0;border-radius:0 0 16px 16px;height:255px;position:relative;overflow:hidden;box-shadow:inset 0 0 28px #ffffff7a}.tank-glass:before{content:"";pointer-events:none;background:linear-gradient(115deg,#ffffff61,#0000 30% 76%,#fff3);position:absolute;inset:0}.waterline{background:#ffffffa6;height:5px;position:absolute;top:0;left:0;right:0}.gravel{z-index:1;background:radial-gradient(at 15% 0,#bea782 0 3px,#0000 4px),radial-gradient(at 39%,#aa9a78 0 3px,#0000 4px),radial-gradient(at 71% 15%,#d4bd96 0 4px,#0000 5px),linear-gradient(#c9b993,#af9b76);height:25px;position:absolute;bottom:0;left:0;right:0}.plant{z-index:2;width:46px;height:92px;position:absolute;bottom:16px}.plant-one{left:13px}.plant-two{height:72px;right:16px;transform:scale(.8)}.plant:before{content:"";background:#438b68;border-radius:4px;width:3px;height:70px;position:absolute;bottom:0;left:22px}.plant i{background:#54a77c;border-radius:100% 0;width:22px;height:12px;position:absolute;bottom:15px;left:7px;transform:rotate(-32deg)}.plant i:nth-child(2){bottom:37px;left:19px;transform:rotate(28deg)scaleX(-1)}.plant i:nth-child(3){bottom:56px;left:3px;transform:rotate(-28deg)}.bubble{z-index:0;border:1px solid #ffffffc2;border-radius:50%;width:7px;height:7px;animation:5s ease-in infinite float;position:absolute;bottom:54px;right:30%}.bubble-two{width:5px;height:5px;animation-delay:1.2s;bottom:25px;right:34%}.bubble-three{width:4px;height:4px;animation-delay:2.3s;bottom:4px;right:28%}@keyframes float{to{opacity:.15;transform:translateY(-65px)}}.tank-fish{z-index:3;flex-wrap:wrap;place-content:center;align-items:center;gap:8px;display:flex;position:absolute;inset:12px 36px 24px}.tank-creature{filter:drop-shadow(0 3px 2px #1c5e5024);flex-direction:column;align-items:center;display:flex;position:relative}.tank-creature:nth-child(3n+1){transform:translateY(-13px)}.tank-creature:nth-child(3n){transform:translateY(12px)}.tank-creature span{color:#43756c;white-space:nowrap;background:#fff;border:1px solid #d9ece6;border-radius:12px;padding:2px 6px;font-size:10px;font-weight:700;position:absolute;top:-2px;right:-7px}.tank-empty{color:#6d9c93;text-align:center;font-size:12px;line-height:1.6}.tank-caption{text-align:center;color:#8ba19b;margin:11px 0 0;font-size:10px}.selected-panel{margin-top:16px}.selected-panel .section-heading{margin-bottom:10px}.selected-panel h2 span{vertical-align:middle;color:#32887b;background:#eaf5f1;border-radius:20px;margin-left:3px;padding:3px 8px;font-size:12px}.empty-selection{color:#96a9a4;padding:6px 0;font-size:12px}.selected-fish-row{border-bottom:1px solid #eff3f1;align-items:center;gap:8px;min-height:64px;display:flex}.selected-fish-row:last-child{border-bottom:0}.selected-glyph{background:#f0f8f5;border-radius:12px;place-items:center;width:44px;height:42px;display:grid}.selected-copy{flex:1;min-width:0}.selected-copy strong,.selected-copy small{display:block}.selected-copy strong{font-size:12px}.selected-copy small{color:#889c96;white-space:nowrap;margin-top:4px;font-size:10px}.count-control{align-items:center;gap:3px;display:flex}.count-control button{cursor:pointer;background:#fff;border:1px solid #e6efeb;border-radius:9px;width:29px;height:30px}.count-control span{text-align:center;min-width:30px;font-size:11px;font-weight:700}.count-control .remove-fish{color:#a17878;border:0;width:auto;padding:0 3px;font-size:10px}.add-fish-mobile{display:none}.status-card{border-radius:16px;align-items:center;gap:14px;margin:0 0 15px;padding:16px;display:flex}.status-icon{background:#ffffffba;border-radius:50%;flex:none;place-items:center;width:36px;height:36px;font-size:19px;font-weight:700;display:grid}.status-card h3,.pair-result h2{margin:0 0 4px;font-size:17px}.status-card p,.pair-result p{margin:0;font-size:11px;line-height:1.55}.status-empty{color:#536f68;background:#f4f8f6}.result-metrics{grid-template-columns:1fr 1fr;gap:9px;display:grid}.metric-card{border:1px solid #eaf0ed;border-radius:14px;min-width:0;padding:13px}.metric-card span,.metric-card small{color:#718780;font-size:10px;display:block}.metric-card strong{letter-spacing:-.5px;color:#294e48;margin:7px 0;font-size:17px;display:block}.metric-card small{line-height:1.4}.space-card{grid-column:1/-1;grid-template-columns:1fr auto;align-items:center;display:grid}.space-card strong{grid-area:1/2/span 2;margin:0;font-size:19px}.reasons-section{border-top:1px solid #edf2f0;margin-top:20px;padding-top:17px}.reasons-section h3{margin:0 0 10px;font-size:13px}.reasons-section ul{gap:9px;margin:0;padding:0;list-style:none;display:grid}.reasons-section li{color:#536d66;padding-left:17px;font-size:11px;line-height:1.55;position:relative}.reasons-section li:before{content:"✓";color:#168475;font-weight:700;position:absolute;top:0;left:0}.result-note{color:#718780;background:#f5f8f7;border-radius:10px;margin:16px 0 0;padding:10px;font-size:10px;line-height:1.5}.methodology-link{color:#5e8179;justify-content:space-between;margin:12px 4px;padding:12px 14px;font-size:11px;text-decoration:none;display:flex}.methodology-link span{font-size:16px}.finder-panel{padding:22px 18px}.finder-panel .section-heading{margin:0 3px 15px}.search-box{color:#80a198;background:#fbfdfc;border:1px solid #e3ece8;border-radius:12px;align-items:center;gap:9px;height:44px;padding:0 12px;display:flex}.search-box>span{font-size:22px;line-height:1}.search-box input{width:100%;color:var(--ink);background:0 0;border:0;outline:0;font-size:12px}.filter-list{flex-wrap:wrap;gap:6px;margin:11px 0 14px;display:flex}.filter-list button{min-height:34px;padding:5px 10px;font-size:10px}.fish-results{scrollbar-width:thin;scrollbar-color:#cbded7 transparent;min-height:220px;max-height:calc(100vh - 315px);overflow:auto}.fish-card{border-bottom:1px solid #eef3f0;align-items:center;gap:10px;padding:9px 2px;display:flex}.fish-art{background:#f2f8f5;border-radius:13px;flex:none;place-items:center;width:52px;height:47px;display:grid}.fish-glyph{display:block;overflow:visible}.fish-card-copy{flex:1;min-width:0}.fish-card-copy h3{margin:0 0 4px;font-size:12px}.fish-card-copy p{color:#6f8981;white-space:nowrap;text-overflow:ellipsis;margin:0;font-size:10px;overflow:hidden}.add-fish-button{color:#258477;cursor:pointer;background:#fff;border:1px solid #dcece6;border-radius:9px;flex:none;min-height:38px;padding:7px 9px;font-size:10px;font-weight:600}.no-results{text-align:center;color:#718780;padding:30px 10px;font-size:12px}.site-footer{color:#627a73;background:#fff;border-top:1px solid #e7efeb;justify-content:space-between;align-items:center;gap:18px;padding:28px 5vw 32px;font-size:11px;display:flex}.site-footer small{text-align:right;max-width:310px;font-size:10px}.quantity-dialog{width:min(380px,100% - 30px);color:var(--ink);border:0;border-radius:20px;padding:24px;position:fixed;box-shadow:0 24px 80px #123b3540}.quantity-dialog::backdrop{backdrop-filter:blur(2px);background:#112d2961}.dialog-close-form{position:absolute;top:10px;right:10px}.icon-button{cursor:pointer;background:#f1f6f4;border:0;border-radius:50%;width:38px;height:38px;font-size:22px}.quantity-fish{align-items:center;gap:14px;padding-right:26px;display:flex}.quantity-fish h2{margin:0 0 4px;font-size:20px}.quantity-fish p{color:#718780;margin:0;font-size:12px}.quantity-question{text-align:center;margin:24px 0 12px;font-size:14px;font-weight:600}.quantity-stepper{justify-content:center;align-items:center;gap:26px;display:flex}.quantity-stepper button{cursor:pointer;background:#f8fbf9;border:1px solid #dfebe6;border-radius:12px;width:44px;height:44px;font-size:22px}.quantity-stepper strong{text-align:center;min-width:34px;font-size:22px}.primary-button,.primary-link{color:#fff;cursor:pointer;background:#168475;border:0;border-radius:12px;justify-content:center;align-items:center;min-height:46px;padding:0 20px;font-size:13px;font-weight:700;text-decoration:none;display:flex}.primary-button{width:100%;margin-top:23px}.sheet-backdrop{display:none}.content-page{max-width:920px;min-height:65vh;margin:0 auto;padding:48px 24px 76px}.breadcrumbs{color:#70857f;gap:9px;margin-bottom:30px;font-size:12px;display:flex}.breadcrumbs a{text-decoration:none}.content-page h1{margin:0 0 14px;font-size:36px}.page-intro{color:#536d66;margin:0 0 30px;font-size:16px;line-height:1.7}.fish-hero{border:1px solid var(--line);background:#fff;border-radius:24px;grid-template-columns:210px 1fr;align-items:center;gap:38px;padding:35px;display:grid}.detail-glyph{background:#f2f8f5;border-radius:20px;place-items:center;min-height:175px;display:grid}.fish-hero h1{margin:0 0 5px}.fish-english{color:#56746b;margin:0 0 3px}.scientific-name{color:#718780;margin:0 0 18px;font-size:12px;font-style:italic}.fish-hero>div:last-child>p:not(.eyebrow,.fish-english,.scientific-name){color:#536f68;line-height:1.7}.beginner-badge{color:#28684f;background:#e4f5ec;border-radius:20px;padding:8px 12px;font-size:12px;font-weight:700;display:inline-flex}.detail-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:20px 0;display:grid}.detail-card{border:1px solid var(--line);background:#fff;border-radius:18px;padding:22px}.detail-card h2{margin:0 0 15px;font-size:16px}.detail-card p{color:#536d66;font-size:13px;line-height:1.8}.detail-card dl{margin:0}.detail-card dl div{border-bottom:1px solid #edf2ef;justify-content:space-between;padding:11px 0;font-size:13px;display:flex}.detail-card dl div:last-child{border:0}.detail-card dt{color:#647a73}.detail-card dd{margin:0;font-weight:700}.fish-detail-page>.primary-link,.prose-page>.primary-link{width:max-content;margin-top:24px}.prose-page{max-width:800px}.prose-page section{border-top:1px solid var(--line);padding:20px 0}.prose-page section h2,.prose-page h2{margin:0 0 10px;font-size:19px}.prose-page p{color:#536d66;font-size:14px;line-height:1.9}.prose-page a:not(.primary-link){color:#116e62}.pair-visual{text-align:center;border:1px solid var(--line);background:#fff;border-radius:22px;grid-template-columns:1fr 40px 1fr;align-items:center;padding:28px;display:grid}.pair-visual article{justify-items:center;gap:7px;display:grid}.pair-visual h2{margin:0;font-size:18px}.pair-visual p{color:#657d76;margin:0;font-size:12px}.pair-visual>span{color:#78958c;font-size:26px}.pair-result{border-radius:16px;align-items:center;gap:16px;margin:17px 0;padding:19px;display:flex}.pair-result.status-pass{color:#205f3b;background:#e4f5e9}.pair-result.status-warn{color:#754908;background:#fff2d9}.pair-result.status-fail{color:#85332f;background:#ffebea}.pair-result .status-icon{background:#ffffffb5}.pair-result p{font-size:13px}.compatibility-page>.detail-grid{grid-template-columns:1fr 1fr}.disclaimer{color:#657b75;font-size:11px}.not-found{text-align:center;align-content:center;justify-items:center;display:grid}.not-found h1{font-size:34px}.not-found p:not(.eyebrow){color:#536d66;margin-bottom:24px}.visually-hidden{clip:rect(0,0,0,0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;position:absolute!important}@media (width<=1150px){.planner-shell{grid-template-columns:minmax(280px,1fr) minmax(330px,1.1fr);max-width:1000px}.finder-column{grid-column:1/-1}.fish-results{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:18px;max-height:440px;display:grid}.tank-glass{height:245px}}@media (width<=760px){.site-header{height:64px;padding:0 18px}.brand{font-size:17px}.site-header nav{gap:15px}.site-header nav a{font-size:11px}.planner-shell{flex-direction:column;gap:13px;padding:16px 14px 44px;display:flex}.tank-column,.results-column,.finder-column{width:100%}.tank-panel,.selected-panel,.result-panel{border-radius:19px;padding:18px}.tank-panel .section-heading{margin-bottom:16px}.section-heading h1,.section-heading h2{font-size:21px}.tank-glass{height:220px}.selected-panel{margin-top:12px}.selected-fish-row{min-height:61px}.count-control{gap:2px}.count-control button{width:36px;height:36px}.count-control .remove-fish{width:auto}.add-fish-mobile{color:#fff;z-index:4;background:#168475;border:0;border-radius:12px;width:100%;height:48px;margin-top:12px;font-weight:700;display:block;position:sticky;bottom:10px;box-shadow:0 6px 18px #16847535}.results-column{order:2}.result-panel{padding:18px}.finder-column{order:3}.finder-column:not(.mobile-open){display:none}.finder-column.mobile-open{z-index:15;max-height:86dvh;padding:0 10px 10px;display:block;position:fixed;bottom:0;left:0;right:0}.mobile-open .finder-panel{border-radius:22px 22px 14px 14px;max-height:86dvh;padding:20px 16px 12px;overflow:hidden;box-shadow:0 -10px 44px #173c3433}.mobile-open .fish-results{min-height:140px;max-height:calc(86dvh - 200px);display:block;overflow:auto}.sheet-backdrop.is-open{z-index:14;background:#15332f65;display:block;position:fixed;inset:0}.quantity-dialog.as-sheet{z-index:18;border-radius:22px;width:calc(100% - 24px);margin:0 auto;position:fixed;top:auto;bottom:12px}.site-footer{grid-template-columns:1fr;gap:14px;padding:23px 18px;display:grid}.site-footer nav{flex-wrap:wrap;gap:18px}.site-footer small{text-align:left}.content-page{padding:30px 18px 54px}.content-page h1{font-size:29px}.breadcrumbs{margin-bottom:23px}.fish-hero{grid-template-columns:1fr;gap:18px;padding:20px}.detail-glyph{min-height:135px}.detail-grid{grid-template-columns:1fr}.pair-visual{grid-template-columns:1fr 26px 1fr;padding:20px 10px}.pair-visual h2{font-size:15px}.pair-visual p{font-size:10px}.compatibility-page>.detail-grid{grid-template-columns:1fr}.page-intro{font-size:14px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.fish-card-copy h3 a{text-decoration:none}.fish-card-copy h3 a:hover{color:#168475;text-underline-offset:2px;text-decoration:underline}.mobile-sheet-close{color:#486760;cursor:pointer;background:#fff;border:1px solid #dce9e4;border-radius:9px;min-height:38px;padding:8px 12px;font-size:12px;display:none}@media (width<=760px){.mobile-sheet-close{display:block}}:root{color:#18384a;--ink:#18384a;--muted:#637d8a;--line:#dce9ed;--green:#147f8b;--mint:#d9eef0;--surface:#fff;--shadow:0 12px 34px #1b4b5b12;background:#eef6f8}body{color:#18384a;background:radial-gradient(at 50% -30%,#e0f3f4 0,#0000 55%),#eef6f8}.site-header{backdrop-filter:blur(14px);background:#fcfeffe6;border-color:#dce9ed}.brand b,.site-header nav a:hover,.site-footer nav a:hover{color:#147f8b}.brand-icon{background:#dceff0}.panel,.fish-hero,.detail-card,.pair-visual{border-color:#dce9ed;box-shadow:0 12px 34px #1b4b5b0f}.eyebrow{color:#568d91}.section-heading h1,.section-heading h2,.content-page h1{color:#18384a}.liter-input{background:#f8fcfd;border-color:#d3e5e9}.liter-input:focus-within{border-color:#3e9aaa;box-shadow:0 0 0 3px #dceff0}.liter-input input{color:#18384a}.liter-input span,.tank-label{color:#527785}.quick-liters button.is-active,.filter-list button.is-active{color:#176f76;background:#dff0ef;border-color:#cbe6e4}.quick-liters button:hover,.filter-list button:hover{color:#176f76;border-color:#b9d9dc}.tank-glass{background:linear-gradient(#c8ebef 0%,#a9dce4 48%,#c8e9df 100%);border-color:#cde2e4;box-shadow:inset 0 0 28px #ffffff8c}.waterline{background:#ffffffc7}.plant:before{background:#43896d}.plant i{background:#59a779}.gravel{background:radial-gradient(at 15% 0,#b79b75 0 3px,#0000 4px),radial-gradient(at 39%,#aa906d 0 3px,#0000 4px),radial-gradient(at 71% 15%,#d0b58b 0 4px,#0000 5px),linear-gradient(#c6ad83,#ac9169)}.fish-art,.selected-glyph,.detail-glyph{background:#edf6f7}.selected-panel h2 span{color:#287b70;background:#e3f1ef}.metric-card{border-color:#deeaed}.metric-card span,.metric-card small{color:#617b85}.metric-card strong{color:#1c596b}.reasons-section{border-color:#e1ecee}.reasons-section li{color:#456572}.reasons-section li:before{color:#278c89}.result-note{color:#536f7b;background:#edf5f6}.methodology-link{color:#286e79}.search-box{color:#428894;background:#f9fcfd;border-color:#dce9ed}.search-box input{color:#18384a}.add-fish-button{color:#147884;background:#fcfefe;border-color:#c9e1e2}.add-fish-button:hover{background:#e8f5f4}.status-pass{color:#245f43;background:#e5f3e8}.status-warn{color:#81540e;background:#fff2dc}.status-fail{color:#8a3732;background:#ffebea}.primary-button,.primary-link{background:#147f8b}.primary-button:hover,.primary-link:hover{background:#106b76}.beginner-badge{color:#28684f;background:#e3f2e9}.site-footer{color:#536f7b;background:#fafdfe;border-color:#dce9ed}.pair-visual>span{color:#568d91}.fish-card-copy h3 a:hover{color:#147f8b}.fish-status-badges,.species-status-badges{flex-wrap:wrap;gap:4px;margin-top:5px;display:flex}.fish-status-badges span,.care-badge,.specialist-badge{color:#815914;background:#fff0d8;border-radius:12px;align-items:center;padding:3px 7px;font-size:9px;font-weight:650;line-height:1.25;display:inline-flex}.specialist-badge{color:#555286;background:#e8e8f8}.species-status-badges{gap:7px;margin-top:12px}.species-status-badges .beginner-badge,.species-status-badges .care-badge,.species-status-badges .specialist-badge{font-size:11px}.tank-empty{white-space:pre-line}.tank-caption{display:none}.language-picker select{color:#315b68;min-height:38px;font:inherit;cursor:pointer;outline-offset:3px;background:#f8fcfd;border:1px solid #d4e5e8;border-radius:11px;padding:0 30px 0 11px;font-size:12px}.language-picker select:focus-visible{outline:2px solid #268b98}.liter-input:focus-within,.search-box:focus-within{outline-offset:1px;outline:2px solid #268b98}@media (width<=760px){.language-picker select{min-height:38px;padding-left:9px;padding-right:25px;font-size:11px}.site-header{gap:4px;padding:0 12px}.site-header nav{display:none}.site-header .brand{white-space:nowrap;gap:7px;font-size:15px}.site-header .brand-icon{flex:none;width:34px;height:34px}}
