*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font:16px/1.55 'DM Sans',system-ui,sans-serif}
button,input,select{font:inherit}
button{cursor:pointer}
button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #86a88a;outline-offset:3px}
img{display:block;max-width:100%}
.app-shell{min-height:100vh;display:flex;flex-direction:column}
.topbar{height:80px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 max(24px,calc((100vw - 1180px)/2));position:sticky;top:0;z-index:20}
.brand{border:0;background:none;display:flex;align-items:center;gap:10px;font-size:25px;padding:0}
.brand-mark{display:grid;place-items:center;flex:none}
.brand-mark img{object-fit:contain}
.nav{display:flex;gap:5px}
.nav button,.footer button{border:0;background:none;color:var(--muted);padding:10px 13px;border-radius:10px;font-size:14px;font-weight:600}
.nav button:hover,.nav button.active,.footer button:hover{color:var(--deep);background:var(--sage)}
.menu-toggle{display:none;border:0;background:none;padding:8px}
.menu-toggle span{display:block;width:22px;height:2px;margin:4px}
.footer{max-width:1180px;margin:auto auto 0;padding:24px 0 34px;display:flex;justify-content:space-between;font-size:13px}
main{width:min(1180px,calc(100% - 48px));margin:0 auto;flex:1}
.eyebrow{text-transform:uppercase;letter-spacing:.16em;color:var(--green);font-size:11px;font-weight:700}
.display{font-family:'Fraunces',Georgia,serif;margin:18px 0 20px}
.title{font-family:'Fraunces',Georgia,serif;font-size:clamp(32px,4vw,46px);line-height:1.15;margin:10px 0}
.sub{color:var(--muted);font-size:17px;max-width:590px}
.hero{display:grid;grid-template-columns:1fr .88fr;align-items:center}
.hero-copy{max-width:610px}
.hero-copy p{max-width:520px}
.hero-media{position:relative;border-radius:170px 170px 18px 18px;box-shadow:var(--shadow)}
.hero-media img{width:100%;height:490px}
.hero-note{position:absolute;left:20px;bottom:20px;background:rgba(255,254,250,.92);backdrop-filter:blur(8px);border-radius:14px;padding:13px 18px;max-width:230px;box-shadow:var(--shadow)}
.hero-note strong,.hero-note em{display:block}
.hero-note strong{font-size:14px}
.hero-note em{font-size:12px;color:var(--muted)}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:27px}
.btn{border:1px solid var(--line);background:var(--white);color:var(--ink);padding:12px 18px;font-size:14px;font-weight:700;min-height:46px}
.btn.primary{background:var(--deep);border-color:var(--deep);color:white}
.btn.primary:hover{background:#356549}
.btn.small{padding:8px 12px;min-height:36px;font-size:13px}
.btn:disabled{opacity:.5;cursor:not-allowed}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:20px}
.section-heading h2{font-family:'Fraunces',Georgia,serif;margin:0}
.section-heading p{color:var(--muted);margin:5px 0 0}
.mode-grid{display:grid;margin:10px 0 76px}
.mode-card{align-items:flex-start}
.mode-card .icon{width:48px;height:48px;border-radius:50%;background:var(--sage);color:var(--deep);display:grid;place-items:center;font-size:23px;margin-bottom:auto}
.mode-card h3{font-family:'Fraunces',Georgia,serif}
.mode-card p{color:var(--muted)}
.page-head{padding:54px 0 28px}
.page-head .sub{margin:8px 0}
.control-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:0 0 24px}
.select-wrap{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px;font-weight:700}
.select-wrap select,.search{appearance:none;background:var(--white);border:1px solid var(--line);border-radius:10px;color:var(--ink);padding:10px 35px 10px 12px;min-height:43px}
.search{appearance:auto;padding-right:12px;min-width:260px}
.study-layout,.quiz-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,.9fr);gap:28px;align-items:start;margin-bottom:80px}
.image-card,.content-card,.quiz-card,.side-card,.panel{background:var(--white);border:1px solid var(--line);border-radius:20px;overflow:hidden}
.image-frame{height:520px;background:#e1e6dd;position:relative}
.image-frame img{width:100%;height:100%;object-fit:cover}
.image-count{position:absolute;right:16px;bottom:15px;padding:5px 10px;font-size:12px;font-weight:700}
.image-foot{padding:14px 18px;display:flex;align-items:center;justify-content:space-between;gap:10px;color:var(--muted);font-size:12px}
.image-foot a{font-size:12px}
.content-card,.quiz-card,.side-card,.panel{padding:28px}
.content-card h2,.quiz-card h2{font-family:'Fraunces',Georgia,serif;font-size:43px;font-weight:500;letter-spacing:-.045em;line-height:1.1;margin:9px 0 0}
.latin{font-family:Georgia,serif;margin:8px 0 24px}
.rule{height:1px;margin:22px 0}
.mini-title{font-size:11px;text-transform:uppercase;letter-spacing:.13em;font-weight:700;color:var(--green);margin:0 0 8px}
.body-copy{color:#3f5146;margin:0 0 16px}
.feature-list{padding-left:19px;color:#3f5146;margin:5px 0 0}
.feature-list li{padding:3px 0}
.card-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:24px}
.quiz-card{min-height:430px}
.quiz-prompt{margin:28px 0 6px;color:var(--muted)}
.quiz-card h2.prompt-name{font-size:clamp(35px,5vw,56px);margin:8px 0 28px}
.quiz-form label{font-size:14px;font-weight:700;display:block;margin:0 0 8px}
.answer-row{display:flex;gap:8px}
.answer-row input{flex:1;min-width:0;border:1px solid #c9d5c9;border-radius:11px;background:#fff;padding:12px 14px}
.answer-row .btn{white-space:nowrap}
.hint{padding:15px 18px;font-size:14px;margin-top:18px}
.hint strong{display:block;margin-bottom:3px}
.text-link{border:0;background:none;padding:0;color:var(--green);font-weight:700;font-size:13px;text-decoration:underline;text-underline-offset:3px}
.quiz-photo{height:360px;border-radius:14px;overflow:hidden;background:#e1e6dd;margin:16px 0}
.quiz-photo img{height:100%;width:100%;object-fit:cover}
.result{padding:16px 18px;margin:22px 0 16px}
.result.ok{border-color:#c9dfc8}
.result.bad{border-color:#e8d1c5}
.result strong{display:block;font-size:17px}
.result p{margin:3px 0 0;font-size:14px}
.side-card h3,.panel h3{font-family:'Fraunces',Georgia,serif;font-size:25px;font-weight:500;margin:0 0 12px;letter-spacing:-.03em}
.side-card p{color:var(--muted);font-size:14px}
.side-card .stat{font-family:'Fraunces',Georgia,serif;font-size:44px;color:var(--deep);line-height:1}
.word-category{display:inline-block;border-radius:30px;padding:4px 10px;font-size:12px;font-weight:700}
.word-example{font-size:14px;color:var(--muted);margin-top:16px}
.segmented{display:inline-flex}
.segmented button{border:0;background:none;padding:7px 13px;font-size:13px;font-weight:700}
.segmented button.active{box-shadow:0 2px 7px #2c4b3614}
.library-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:75px}
.bird-tile{text-align:left;transition:transform .2s,box-shadow .2s}
.bird-tile:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.bird-tile img{object-fit:cover}
.bird-tile strong,.bird-tile em{display:block}
.bird-tile strong{font-size:17px}
.bird-tile em{font-family:Georgia,serif;color:var(--muted);font-size:14px;margin-top:2px}
.word-list{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:70px}
.word-item{border:1px solid var(--line);padding:14px 17px}
.word-item strong{font-family:Georgia,serif;font-size:18px}
.word-item span{display:block;color:var(--muted);font-size:13px}
.detail-back{margin:25px 0}
.detail-grid{display:grid;grid-template-columns:1fr .9fr;gap:26px;margin-bottom:70px}
.detail-grid .content-card{height:100%}
.detail-photos{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.detail-photos img{height:360px;width:100%;object-fit:cover;border-radius:12px}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:15px 0 32px}
.metric{background:var(--white);border:1px solid var(--line);border-radius:15px;padding:21px}
.metric strong{font-family:'Fraunces',Georgia,serif;font-size:35px;font-weight:500;display:block;line-height:1}
.metric span{color:var(--muted);font-size:13px}
.progress-bars{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:75px}
.mode-result{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:15px 0;border-bottom:1px solid var(--line)}
.mode-result:last-child{border-bottom:0}
.mode-result strong{font-size:15px}
.mode-result span{color:var(--muted);font-size:13px;text-align:right}
.setting-row{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px 0;border-bottom:1px solid var(--line)}
.setting-row strong,.setting-row span{display:block}
.setting-row span{color:var(--muted);font-size:13px}
.switch{position:relative;width:46px;height:27px;border-radius:20px}
.switch:after{content:'';position:absolute;top:3px;left:3px;width:21px;height:21px;border-radius:50%;background:white;transition:transform .2s}
.switch.on:after{transform:translateX(19px)}
.credits-list{display:grid;grid-template-columns:repeat(2,1fr);gap:8px 22px;margin-bottom:70px}
.credit{border-bottom:1px solid var(--line);padding:12px 0;font-size:13px}
.credit strong{display:block}
.credit a{word-break:break-word}
.empty{padding:55px 20px;background:var(--white);border:1px solid var(--line);border-radius:15px;text-align:center;color:var(--muted);grid-column:1/-1}
.confetti-layer{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:50}
.confetti-piece{position:absolute;left:50%;top:23%;width:var(--width);height:var(--height);background:var(--color);opacity:0;animation:confetti-burst var(--duration) cubic-bezier(.2,.7,.35,1) var(--delay) both}
@keyframes confetti-burst{0%{transform:translate3d(0,0,0) rotate(0) scale(.5);opacity:0}10%{opacity:1}75%{opacity:1}100%{transform:translate3d(var(--x),var(--y),0) rotate(var(--turn)) scale(.85);opacity:0}}
@media(max-width:900px){.hero{gap:30px}
.hero-media,.hero-media img{min-height:420px;height:420px}
.mode-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.mode-grid .mode-card:last-child{grid-column:span 2}
.study-layout,.quiz-layout,.detail-grid{grid-template-columns:1fr}
.image-frame{height:460px}
.quiz-layout .side-card{order:0}
.library-grid{grid-template-columns:repeat(2,1fr)}
.metrics{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){.topbar{height:66px;padding:0 20px}
.brand{font-size:23px}
.menu-toggle{display:block}
.nav{display:none;position:absolute;top:65px;left:0;right:0;background:var(--paper);padding:10px 20px 16px;border-bottom:1px solid var(--line);box-shadow:var(--shadow);flex-direction:column}
.nav.open{display:flex}
.nav button{text-align:left}
.footer{width:calc(100% - 40px);padding:20px 0;gap:10px;flex-wrap:wrap}
main{width:calc(100% - 40px)}
.hero{grid-template-columns:1fr;padding:45px 0}
.hero-media{min-height:320px;height:320px;border-radius:130px 130px 18px 18px}
.hero-media img{height:320px}
.mode-grid{gap:10px;margin-bottom:52px}
.mode-card{padding:17px;min-height:210px}
.mode-card h3{font-size:21px}
.page-head{padding:34px 0 20px}
.content-card,.quiz-card,.side-card,.panel{padding:22px}
.image-frame{height:350px}
.answer-row{flex-direction:column}
.answer-row .btn{width:100%}
.library-grid{gap:10px}
.bird-tile strong{font-size:14px}
.bird-tile em{font-size:12px}
.word-list,.progress-bars,.credits-list{grid-template-columns:1fr}
.detail-photos img{height:220px}
.search{width:100%}
.section-heading{display:block}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
.detail-photos.single{grid-template-columns:1fr}
.detail-photos.single img{height:510px}
.hero-media img,.image-frame img,.quiz-photo img,.bird-tile img,.detail-photos img{object-fit:contain}
.bird-tile img{width:100%;height:210px;background:#e5e9e0}
@media(max-width:640px){.bird-tile{padding:9px}
.bird-tile img{height:140px;border-radius:8px}
.bird-tile .tile-copy{padding:10px 3px 2px}
}
.wiki-info{margin:28px 0 10px;padding:24px}
.wiki-info>.mini-title{margin:0 0 15px}
.wiki-fact+.wiki-fact{border-top:1px solid var(--line);margin-top:15px;padding-top:15px}
.wiki-fact h3{font-size:14px;font-weight:700;color:var(--deep);margin:0 0 5px}
.wiki-fact p{font-size:15px;line-height:1.68;margin:0;max-width:72ch}
.wiki-source{border-top:1px solid var(--line);margin-top:20px;padding-top:18px;display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.wiki-source span{color:var(--muted);font-size:12px}
.wiki-link{display:inline-flex;align-items:center;text-decoration:none;white-space:normal;text-align:center}
@media(max-width:640px){.wiki-info{padding:18px}
.wiki-link{width:100%;justify-content:center}
}
.hero-credit{position:absolute;right:24px;top:100px;max-width:70%;padding:7px 10px;border-radius:8px;background:rgba(255,254,250,.9);color:var(--deep);font-size:11px;text-decoration:none;line-height:1.3}
.hero-media img{object-fit:cover;object-position:center center}
@media(max-width:640px){.hero-credit{right:15px;top:80px;font-size:10px;padding:6px 8px}
.hero-note{bottom:14px;left:14px}
}
.study-layout.with-wiki,.detail-grid.with-wiki{margin-bottom:24px}
.study-wiki{margin-bottom:80px}
.study-wiki .wiki-info{margin:0}
.term-tile{width:100%;text-align:left;cursor:pointer;transition:border-color .2s,transform .2s,box-shadow .2s}
.term-tile:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
.term-tile small{display:block;margin-top:10px;font-size:12px;font-weight:700}
.term-no-bird{max-width:700px;margin-bottom:75px}
.term-tile{text-decoration:none;color:var(--ink);display:block}
:root{--moss: #6A6A53;--mahogany: #4D342D;--olive: #9B9879;--eggshell: #EDE7DB;--linen: #DDCCB7;--sand: var(--eggshell);--surface: #F8F4EC;--terracotta: var(--mahogany);--sage-gray: var(--olive);--slate-blue: var(--moss);--navy: var(--mahogany);--quiet: #59483F;--hairline: #C8BDAE;--paper: var(--sand);--white: var(--surface);--ink: var(--navy);--muted: var(--quiet);--green: var(--moss);--deep: var(--moss);--sage: var(--linen);--line: var(--hairline);--clay: var(--terracotta);--soft: var(--surface);--ok: var(--sage-gray);--bad: var(--terracotta);--shadow: 0 15px 32px rgba(77, 52, 45, .10);--radius-card: 22px;--radius-control: 12px;--radius-pill: 999px}
html{background: var(--sand)}
body{background: var(--sand);color: var(--navy);font-family: 'DM Sans', Arial, sans-serif;font-size: 16px;line-height: 1.55}
button, input, select{color: var(--navy);font-family: inherit}
strong{font-weight: 500}
.nav button, .footer button, .btn, .segmented button,
.text-link, .quiz-form label, .select-wrap, .word-category,
.image-count{font-weight: 500}
button:focus-visible, input:focus-visible, select:focus-visible, a:focus-visible{outline: 3px solid var(--moss);outline-offset: 4px}
a{color: var(--navy);text-decoration: none}
a:not([class]), .text-link{color: var(--moss);text-decoration: none}
a:not([class]):hover, .text-link:hover{color: var(--moss);text-decoration: underline;text-underline-offset: 3px}
a:focus-visible, .text-link:focus-visible{text-decoration: none}
.topbar{background: var(--surface);border-bottom: 1px solid var(--hairline);backdrop-filter: blur(14px)}
.brand{color: var(--navy);font-family: 'Fraunces', Georgia, serif;font-weight: 500;letter-spacing: -.035em}
.brand-mark{width: 48px;height: 48px;background: transparent;border-radius: 0;overflow: visible}
.brand-mark img{width: 46px;height: 46px}
.nav button, .footer button{color: var(--navy);background: transparent;border-bottom: 0;border-radius: var(--radius-pill);padding: 10px 15px}
.nav button:hover, .footer button:hover{color: var(--moss);background: var(--eggshell);border-bottom-color: transparent}
.nav button.active, .nav button.active:hover{color: var(--surface);background: var(--moss)}
.nav .creator-link{background: rgba(106, 106, 83, .06);box-shadow: inset 0 0 0 1px rgba(106, 106, 83, .16);display: inline-flex;align-items: center;padding: 10px 15px;border-radius: var(--radius-pill);color: var(--moss);font-size: 14px;font-weight: 600;white-space: nowrap}
.nav .creator-link:hover{background: rgba(106, 106, 83, .11);text-decoration: none}
.menu-toggle span{background: var(--moss)}
.footer{border-top: 1px solid var(--hairline);color: var(--quiet)}
.eyebrow, .mini-title{color: var(--quiet);font-weight: 500}
.display, .title, .section-heading h2,
.mode-card h3, .content-card h2, .quiz-card h2,
.side-card h3, .panel h3, .metric strong, .side-card .stat{font-family: 'Fraunces', Georgia, serif;color: var(--navy)}
.latin, .word-item strong, .bird-tile em, .hero-note em{font-family: Georgia, serif;color: var(--navy)}
.display{font-size: clamp(40px, 4.3vw, 58px);font-weight: 400;letter-spacing: -.045em;line-height: 1.1;text-wrap: balance}
.title{font-weight: 400;letter-spacing: -.035em}
.section-heading h2{font-size: 31px;font-weight: 400;letter-spacing: -.03em}
.content-card h2, .quiz-card h2{font-weight: 400;letter-spacing: -.035em}
.side-card h3, .panel h3{font-weight: 400;letter-spacing: -.035em}
.metric strong, .side-card .stat{font-weight: 500}
.latin{font-size: 21px;font-weight: 400;font-style: italic}
.word-item strong{font-weight: 500}
.bird-tile em, .hero-note em{font-style: italic}
.sub, .section-heading p, .mode-card p, .body-copy,
.feature-list, .side-card p, .quiz-prompt, .word-example,
.image-foot, .credit, .wiki-source span, .setting-row span,
.metric span, .mode-result span, .word-item span,
.bird-tile em, .word-item small{color: var(--quiet)}
.hero{gap: 6vw;padding: 68px 0 78px;border-bottom: 0}
.hero-creator{margin: 7px 0 0;color: var(--quiet);font-size: 14px}
.hero-creator .creator-text-link{color: var(--moss);font-weight: 600}
.hero-creator .creator-text-link:hover{text-decoration: underline;text-underline-offset: 3px}
.hero-actions{display: flex;flex-wrap: wrap;gap: 10px;margin-top: 25px}
.hero-actions .btn{display: inline-flex;align-items: center;justify-content: center;min-height: 48px;padding: 11px 18px;font-weight: 500}
.hero-actions .hero-secondary{background: transparent;border: 1px solid var(--moss)}
#practice-modes{scroll-margin-top: 96px}
.hero-media{min-height: 0;height: auto;overflow: visible;background: transparent;border: 0;isolation: isolate}
.hero-media::before{content: '';position: absolute;z-index: -1;inset: 12px -12px 32px 12px;background: var(--olive);border-radius: 230px 230px var(--radius-card) var(--radius-card)}
.hero-media img{border: 0;border-radius: 230px 230px var(--radius-card) var(--radius-card);box-shadow: var(--shadow)}
.hero-credit:hover{text-decoration: none}
.section-heading{margin-top: 55px;padding-left: 0;border: 0}
.section-heading h2::after{content: '';display: block;width: 42px;height: 3px;margin-top: 12px;background: var(--olive);border-radius: var(--radius-pill)}
.mode-grid{grid-template-columns: repeat(3, minmax(0, 1fr));gap: 14px;margin-top: 22px;border: 0}
.mode-grid-featured{grid-template-columns: repeat(2, minmax(0, 1fr));margin-bottom: 14px}
.mode-grid-games{margin-top: 0}
.mode-card-featured{min-height: 230px}
.game-label{position: absolute;z-index: 1;top: 23px;right: 19px;color: var(--surface);border: 1px solid rgba(248,244,236,.75);border-radius: var(--radius-pill);padding: 4px 11px;font-size: 11px;font-weight: 600;letter-spacing: .04em}
.mode-card{display: flex;flex-direction: column;position: relative;min-height: 240px;padding: 96px 19px 24px;background: var(--eggshell);border: 1px solid var(--hairline);border-radius: var(--radius-card);text-align: left;overflow: hidden;transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease}
.mode-card::before{content: '';position: absolute;inset: 0 0 auto;height: 76px;background: var(--card-band, var(--moss));border-radius: var(--radius-card) var(--radius-card) 0 0}
.mode-card{--card-band: var(--moss)}
.mode-card.mode-card-game{--card-band: var(--mahogany)}
.mode-icon{position: absolute;z-index: 1;left: 18px;top: 18px;display: block;width: 38px;height: 38px;margin: 0;padding: 0;background: none;color: #fff}
.mode-card:hover{transform: translateY(-4px);box-shadow: var(--shadow) !important;border-color: var(--olive)}
.mode-card:hover h3{color: var(--moss)}
.mode-card h3{margin: 0 0 10px;font-size: 22px;font-weight: 500;letter-spacing: -.025em}
.mode-card p{margin: 0;padding-right: 5px;font-size: 13px;line-height: 1.5}
.page-head{border: 0;padding-left: 0}
.btn, .select-wrap select, .search, .answer-row input{background: var(--surface);color: var(--navy);border: 1px solid var(--hairline)}
.btn{border-radius: var(--radius-pill);transition: background-color .15s, color .15s, transform .15s}
.btn:hover{transform: translateY(-2px);background: var(--linen);border-color: var(--moss);text-decoration: none}
.btn.primary, .btn.primary:hover{background: var(--moss);border-color: var(--moss);color: var(--surface)}
.btn.primary:hover{text-decoration: none}
.btn.ghost{background: transparent}
.select-wrap, .select-wrap select{color: var(--navy)}
.select-wrap select{background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='m1 1 5 5 5-5' fill='none' stroke='%234D342D' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat: no-repeat;background-position: right 12px center}
.search::placeholder{color: var(--quiet);opacity: .55}
.answer-row input::placeholder{color: var(--quiet);opacity: .8}
.search, .select-wrap select, .answer-row input{border-radius: var(--radius-control)}
.search, .select-wrap select{border-bottom: 1px solid var(--hairline)}
.image-card, .content-card, .quiz-card, .side-card, .panel,
.bird-tile, .word-item, .metric, .empty{background: var(--surface);color: var(--navy);border: 1px solid var(--hairline)}
.image-card, .content-card, .quiz-card, .side-card, .panel,
.metric, .empty{border-radius: var(--radius-card);box-shadow: 0 6px 22px rgba(77, 52, 45, .045)}
.image-frame, .quiz-photo, .bird-tile img{background: var(--linen)}
.detail-grid .image-card{background: transparent;border: 0;border-radius: 0;box-shadow: none;overflow: visible;align-self: start}
.detail-grid .detail-photos{background: transparent}
.detail-grid .detail-photos img,
.detail-grid .detail-photos.single img{width: 100%;height: auto;object-fit: initial}
.detail-grid .image-foot{border-top: 0;padding: 10px 0 0}
.quiz-photo, .detail-photos img{border-radius: var(--radius-control)}
.image-count{border-radius: var(--radius-control)}
.image-count{background: var(--moss);color: var(--surface)}
.image-foot{border-top: 1px solid var(--hairline)}
.latin{color: var(--navy)}
.rule{background: var(--hairline);opacity: 1}
.hint{background: var(--linen);color: var(--navy);border-left: 4px solid var(--moss);border-radius: var(--radius-control)}
.side-card{background: var(--surface);color: var(--navy)}
.side-card h3, .side-card p, .side-card .eyebrow, .side-card .stat{color: var(--navy)}
.result{background: var(--surface);color: var(--navy);border: 1px solid var(--hairline);border-radius: var(--radius-control)}
.result.ok{background: var(--eggshell);color: var(--navy);border-left: 5px solid var(--moss)}
.result.bad{background: var(--linen);color: var(--navy);border-left: 5px solid var(--mahogany)}
.word-category{background: var(--linen);color: var(--navy);border: 1px solid var(--hairline)}
.segmented{background: var(--surface);border: 1px solid var(--hairline);border-radius: var(--radius-pill);gap: 3px;padding: 4px}
.segmented button{color: var(--navy);border-right: 0;border-radius: var(--radius-pill)}
.segmented button:last-child{border-right: 0}
.segmented button.active{background: var(--moss);color: var(--surface)}
.bird-tile, .term-tile{transition: transform .18s ease, box-shadow .18s ease}
.bird-tile{display: flex;flex-direction: column;padding: 0;overflow: hidden;background: var(--eggshell);border: 1px solid var(--hairline);border-radius: var(--radius-card)}
.bird-tile-main{display: flex;flex: 1;flex-direction: column;width: 100%;padding: 0;border: 0;background: transparent;text-align: left;color: inherit}
.bird-tile img{border: 0;border-radius: 0}
.bird-tile img.landscape{object-fit: cover}
.bird-tile .tile-copy{display: block;position: relative;width: 100%;padding: 24px 16px 12px;border-top: 0}
.bird-tile .tile-copy::before{content: '';position: absolute;top: 12px;left: 16px;width: 38px;height: 3px;border-radius: 999px;background: var(--moss)}
.tile-audio-row{margin-top: auto;padding: 0 16px 15px}
.sound-soon{color: var(--quiet);font-size: 12px;font-style: italic}
.tile-audio-button{display: inline-flex;align-items: center;gap: 9px;border: 1px solid var(--moss);background: transparent;color: var(--moss);font-size: 12px;font-weight: 600;border-radius: var(--radius-pill)}
.tile-audio-symbol{font-size: 11px}
.term-tile{padding: 18px 21px;background: var(--eggshell);border: 1px solid var(--hairline);border-left: 4px solid var(--moss);border-radius: var(--radius-card)}
.term-tile:nth-child(even){border-left-color: var(--olive)}
.term-tile:hover{border-color: var(--hairline);border-left-color: var(--moss)}
.term-tile:nth-child(even):hover{border-left-color: var(--olive)}
.word-item{background: var(--eggshell);border-radius: var(--radius-card)}
.bird-tile:hover, .term-tile:hover{transform: translateY(-2px);box-shadow: var(--shadow) !important}
.bird-tile-main:hover strong, .term-tile:hover strong{color: var(--moss)}
.term-tile small{color: var(--quiet)}
.wiki-info{background: var(--surface);color: var(--navy);border: 1px solid var(--hairline);border-top: 1px solid var(--hairline);border-radius: var(--radius-card)}
.wiki-fact h3, .wiki-fact p{color: var(--navy)}
.metric{border-top: 1px solid var(--hairline)}
.content-card, .quiz-card, .side-card, .panel{border-top: 1px solid var(--hairline)}
.content-card:nth-child(even), .panel:nth-child(even){border-top-color: var(--hairline)}
.quiz-layout{grid-template-columns: minmax(0, 760px);justify-content: center}
.quiz-photo.landscape{height: auto;aspect-ratio: 3 / 2}
.switch{background: var(--sage-gray);border: 1px solid var(--moss)}
.switch.on{background: var(--moss)}
.switch::after{background: var(--surface)}
.confetti-piece{border-radius: 0 !important}
.feature-source{margin: 14px 0 20px;color: var(--quiet);font-size: 13px}
.empty-pool{max-width: 640px;margin-bottom: 76px}
.result-actions{margin-top: 12px;margin-bottom: 28px}
.recognition-tabs{display: inline-flex;gap: 4px;padding: 4px;margin: 0 0 22px;border: 1px solid var(--hairline);border-radius: var(--radius-pill);background: var(--surface)}
.recognition-tabs button{min-height: 44px;padding: 9px 16px;border: 0;border-radius: var(--radius-pill);background: transparent;color: var(--moss);font-size: 14px;font-weight: 500}
.recognition-tabs button:last-child{border-right: 0}
.recognition-tabs button.active{background: var(--moss);color: var(--eggshell)}
.sound-question{margin: 0 0 26px;padding: 22px;border: 1px solid var(--hairline);border-radius: var(--radius-card);background: var(--linen)}
.sound-question audio{display: block;width: 100%;min-height: 48px;margin-top: 12px}
.detail-grid.has-sound{margin-bottom: 24px}
.bird-sound{max-width: 760px;margin: 0 0 28px;background: var(--eggshell)}
.bird-sound h2{font: 500 28px/1.2 'Fraunces', Georgia, serif;margin: 0 0 8px}
.bird-sound .sound-kind{display: block;margin: 0 0 16px;color: var(--moss);font-size: 12px;font-weight: 600;text-transform: uppercase;letter-spacing: .1em}
.bird-sound .body-copy{margin-bottom: 18px}
.bird-sound audio{display: block;width: 100%;min-height: 48px}
.sound-credit{font-size: 12px;line-height: 1.5;color: var(--quiet);margin: 12px 0 0;overflow-wrap: anywhere}
.sound-credit a{color: var(--moss)}
.audio-restart{display: inline-block;margin-top: 10px}
.result-count{color: var(--quiet);font-size: 13px;margin: -4px 0 15px}
.library-filters{margin-top: -11px}
.detail-section-nav{display: flex;flex-wrap: wrap;gap: 8px;margin: 0 0 22px}
.detail-section-nav a{display: inline-flex;align-items: center;min-height: 42px;padding: 8px 14px;background: var(--surface);border: 1px solid var(--hairline);border-radius: var(--radius-pill);color: var(--moss);font-size: 13px;font-weight: 500}
.detail-section-nav a:hover{border-color: var(--moss);background: var(--eggshell)}
#detail-features, #detail-sound, #detail-wiki{scroll-margin-top: 104px}
.detail-grid .image-foot{color: var(--quiet);font-size: 11px}
.practice-list{display: flex;flex-wrap: wrap;gap: 7px;max-height: 320px;overflow: auto;padding: 2px}
.practice-item{display: inline-flex;align-items: center;gap: 9px;padding: 7px 11px;border: 1px solid var(--hairline);border-radius: var(--radius-pill);background: var(--eggshell);font-size: 13px;text-align: left}
.practice-item:hover{border-color: var(--moss);color: var(--moss)}
.credits-intro{margin-bottom: 30px}
.credits-search{width: min(100%, 420px);margin-bottom: 18px}
.credits-groups{margin-bottom: 70px}
.credit-group{background: var(--surface);border: 1px solid var(--hairline);margin-bottom: 7px;border-radius: var(--radius-control)}
.credit-group summary{cursor: pointer;display: flex;align-items: baseline;flex-wrap: wrap;gap: 8px 13px;padding: 14px 17px}
.credit-group summary strong{font-weight: 600}
.credit-group summary em{color: var(--quiet)}
.credit-group summary span{margin-left: auto;color: var(--quiet);font-size: 12px}
.credit-group-body{border-top: 1px solid var(--hairline);padding: 8px 17px 15px;font-size: 13px}
.credit-group-body h3{margin: 12px 0 3px;font-size: 13px}
.credit-group-body p{margin: 5px 0;overflow-wrap: anywhere}
.word-bird-example{display: inline-flex;gap: 8px;align-items: baseline;padding: 8px 11px;border: 1px solid var(--hairline);border-radius: var(--radius-control);background: var(--eggshell);text-align: left}
.word-bird-example:hover{border-color: var(--moss)}
.word-bird-example em{font-size: 12px}
.wrong-comparison{margin: 17px 0;padding: 14px 17px;border-left: 4px solid var(--mahogany);background: var(--eggshell)}
@media (max-width: 640px){.library-filters .select-wrap{width: 100%;min-width: 0;flex-wrap: wrap}
.library-filters .select-wrap select{width: 100%;min-width: 0;max-width: 100%}
.topbar{padding-inline: 16px}
.brand{gap: 7px;min-height: 50px;font-size: 24px;white-space: nowrap}
.brand-mark, .brand-mark img{width: 50px;height: 50px}
.menu-toggle{min-width: 44px;min-height: 44px;flex: 0 0 auto}
.nav.open{background: var(--surface);border-bottom: 1px solid var(--hairline)}
.hero{padding: 42px 0 56px}
.hero-media::before, .hero-media img{border-radius: 130px 130px var(--radius-card) var(--radius-card)}
.display{font-size: clamp(30px, 8vw, 38px);line-height: 1.12}
.section-heading{margin-top: 42px}
.mode-grid{grid-template-columns: 1fr;gap: 11px}
.mode-grid-featured{margin-bottom: 11px}
.mode-grid-games{margin-top: 0}
.mode-card{min-height: 150px;padding: 21px 21px 21px 108px;justify-content: center}
.mode-card::before{inset: 0 auto 0 0;width: 88px;height: auto;border-radius: var(--radius-card) 0 0 var(--radius-card)}
.mode-icon{left: 25px;top: 50%;width: 38px;height: 38px;transform: translateY(-50%)}
.mode-card h3{margin-bottom: 7px}
.mode-grid .mode-card:last-child{grid-column: auto}
.bird-tile .tile-copy::before{display: none}
.recognition-tabs{display: grid;grid-template-columns: 1fr 1fr;width: 100%}
.recognition-tabs button{padding: 9px 11px;font-size: 12px}
.game-label{top: 14px;right: 12px;background: var(--mahogany);border-color: var(--mahogany)}
.detail-section-nav a{justify-content: center;font-size: 12px}
.sound-question{padding: 16px}
}
@media (min-width: 641px) and (max-width: 900px){.mode-grid{grid-template-columns: repeat(2, minmax(0,1fr))}
.mode-grid-games{grid-template-columns: repeat(3, minmax(0,1fr))}
.mode-grid .mode-card:last-child{grid-column: auto}
.mode-card{border: 1px solid var(--hairline)}
.mode-card:last-child{border: 1px solid var(--hairline)}
}
@media (max-width: 900px){.quiz-layout{grid-template-columns: 1fr}
}
.ui-icon{width: 18px;height: 18px;flex: 0 0 auto;display: inline-block;vertical-align: -3px}
a .ui-icon{margin-left: 3px}
.detail-section-nav a{gap: 5px;white-space: nowrap;flex: 0 0 auto}
.detail-section-nav .ui-icon{margin-left: 0;width: 16px;height: 16px}
.tile-audio-button{min-height: 48px;padding: 10px 14px;touch-action: manipulation}
.tile-audio-symbol{display: inline-flex;align-items: center;min-width: 18px}
.tile-audio-button .ui-icon{width: 18px;height: 18px;color: currentColor}
.tile-audio-button:hover, .tile-audio-button[aria-pressed="true"]{color: var(--moss);background: var(--linen)}
.tile-audio-button[aria-busy="true"] .ui-icon{animation: audio-loading .9s linear infinite}
.audio-message{display: block;font-size: 12px;color: var(--quiet);margin-top: 7px}
@keyframes audio-loading{ to { transform: rotate(360deg); } }
.bird-tile-main{touch-action: manipulation}
.footer{width: min(1180px,calc(100% - 48px));align-items: flex-start}
.footer button{padding: 0;min-height: 44px;text-align: left}
.study-next-arrow{position: absolute;right: 16px;top: 50%;transform: translateY(-50%);width: 48px;height: 48px;display: grid;place-items: center;border-radius: var(--radius-pill);border: 1px solid var(--moss);color: var(--moss);background: var(--eggshell);box-shadow: 0 2px 8px #0002;touch-action: manipulation}
.study-next-arrow:hover{background: var(--linen)}
.study-next-arrow .ui-icon{width: 24px;height: 24px}
@media (max-width: 640px){.library-grid{grid-template-columns: minmax(0,1fr);gap: 20px}
.bird-tile img{height: auto;aspect-ratio: 3 / 2;object-fit: cover}
.bird-tile strong{font-size: 19px}
.bird-tile em{font-size: 16px}
.bird-tile .tile-copy{padding: 16px 18px 12px}
.tile-audio-row{padding: 0 18px 18px}
.tile-audio-button{font-size: 14px;min-height: 48px}
.footer{width: calc(100% - 40px);flex-direction: column;gap: 8px}
.footer span{max-width: 34ch}
.footer button{padding: 0}
.detail-section-nav a{flex: 0 0 auto;padding: 9px 12px;min-height: 44px}
.image-foot{flex-wrap: wrap}
.image-foot a{display: inline-flex;align-items: center;white-space: nowrap}
}
@media (hover: none){.bird-tile:hover{transform: none}
}
.library-grid .bird-tile{content-visibility: auto;contain-intrinsic-size: auto 360px}
.library-more{display: flex;flex-direction: column;align-items: center;gap: 8px;padding: 24px 0}
.library-more span{color: var(--quiet);font-size: 12px}
.practice-help{position: relative;display: inline-flex;max-width: 100%}
.help-tooltip{position: absolute;right: 0;bottom: calc(100% - 2px);z-index: 20;width: 100%;box-sizing: border-box;padding: 10px 12px;border: 1px solid #DED5C8;border-radius: var(--radius-control);background: var(--surface);color: #74695E;box-shadow: 0 3px 12px rgba(77, 52, 45, .05);font-size: 12px;font-weight: 400;line-height: 1.5;text-align: left;visibility: hidden;opacity: 0;pointer-events: none}
.practice-help:hover .help-tooltip, .practice-help:focus-within .help-tooltip{visibility: visible;opacity: 1;pointer-events: auto}
.practice-help.help-dismissed .help-tooltip{visibility: hidden;opacity: 0;pointer-events: none}
#app.study-view{overflow-anchor: none}
.bird-sound.sound-wide{max-width: none;display: grid;grid-template-columns: minmax(180px, .4fr) minmax(0, 1fr);gap: 16px 28px;padding: 24px 28px}
.sound-wide .sound-heading, .sound-wide .sound-description, .sound-wide .sound-playback{min-width: 0}
.sound-wide .sound-kind, .sound-wide .body-copy{margin-bottom: 0}
.sound-wide .sound-description .sound-credit{margin-top: 8px}
.sound-wide .sound-playback{grid-column: 1 / -1}
.sound-wide .sound-playback .sound-credit{margin-top: 8px}
@media (max-width: 640px){.bird-sound.sound-wide{grid-template-columns: minmax(0, 1fr);gap: 14px;padding: 20px}
.sound-wide .sound-playback{grid-column: auto}
}
button.creator-text-link{border: 0;padding: 0;background: none;font: inherit;cursor: pointer}
.about-page{padding-bottom: 48px}
.about-hero{display: grid;grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr);gap: clamp(28px,4vw,60px);align-items: center;padding: 48px 0 64px}
.about-hero-copy{grid-column: 1;grid-row: 1;min-width: 0}
.about-hero-photo{grid-column: 2;grid-row: 1;margin: 0;aspect-ratio: 4 / 5;align-self: stretch;min-width: 0}
.about-hero-photo img{display: block;width: 100%;height: 100%;max-height: 820px;object-fit: cover;object-position: 47% center;border-radius: 180px 180px var(--radius-card) var(--radius-card)}
.about-hero-identity{display: flex;align-items: center;gap: 10px}
.about-hero-mark{width: 38px;height: 38px;flex: none}
.about-eyebrow{margin: 0;color: var(--moss);font-size: 11px;font-weight: 600;letter-spacing: .13em}
.about-hero h1{margin: 12px 0 24px;font: 400 clamp(40px,4.2vw,60px)/1.12 'Fraunces',Georgia,serif;letter-spacing: -.04em}
.about-facts{display: grid;grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr);gap: 6px 16px;margin: 0 0 24px}
.about-fact{display: flex;align-items: flex-start;gap: 8px;min-width: 0;padding: 4px 0}
.about-fact-icon{flex: 0 0 17px;width: 17px;height: 17px;fill: none;stroke: var(--moss);stroke-width: 1.5;stroke-linecap: round;stroke-linejoin: round}
.about-fact-label{display: block;margin-bottom: 2px;color: var(--quiet);font-size: 10px;line-height: 1.3}
.about-fact strong{display: block;font-size: 12px;font-weight: 500;line-height: 1.4;overflow-wrap: anywhere}
.about-project-link{border: 0;background: none;padding: 0;color: var(--moss);font: inherit;cursor: pointer}
.about-project-link:hover{text-decoration: underline;text-underline-offset: 3px}
.about-story-text{font-size: 15px;line-height: 1.65}
.about-story-text p{margin: 0}
.about-story-text p + p{margin-top: 13px}
.about-story-text p:first-child{color: var(--moss);font: 400 23px/1.35 'Fraunces',Georgia,serif}
.about-button{display: inline-flex;align-items: center;gap: 12px;min-height: 48px;padding: 11px 22px;border-radius: var(--radius-pill);font-size: 14px;font-weight: 500}
.about-button-primary{background: var(--moss);color: var(--surface)}
.about-button-primary:hover{background: var(--mahogany);color: var(--surface)}
.about-hero-button{margin-top: 24px}
.about-instagram-section{padding: 32px;background: var(--surface);border: 1px solid var(--hairline);border-radius: 60px var(--radius-card) var(--radius-card) var(--radius-card)}
.about-instagram-heading{margin-bottom: 24px}
.about-instagram-heading h2{margin: 8px 0 0;font: 400 clamp(32px,3.6vw,48px)/1.15 'Fraunces',Georgia,serif}
.about-carousel-shell{position: relative}
.about-carousel-controls{position: absolute;z-index: 2;inset: 0 12px;display: flex;align-items: center;justify-content: space-between;pointer-events: none}
.about-carousel-button{display: grid;place-items: center;width: 44px;height: 44px;border: 1px solid var(--moss);border-radius: var(--radius-pill);background: var(--surface);color: var(--moss);cursor: pointer;pointer-events: auto;box-shadow: 0 3px 10px #4d342d1a}
.about-carousel-button:hover{background: var(--moss);color: var(--surface)}
.about-carousel{display: flex;gap: 16px;overflow-x: auto;overscroll-behavior-x: contain;scroll-snap-type: x mandatory;scroll-padding-inline: 66px;scrollbar-width: thin;scrollbar-color: var(--moss) transparent;padding: 30px 66px;background: var(--linen);border-radius: 80px var(--radius-card) var(--radius-card) var(--radius-card)}
.about-post{flex: 0 0 260px;display: block;aspect-ratio: 1;scroll-snap-align: start;overflow: hidden;border-radius: var(--radius-control)}
.about-post img{display: block;width: 100%;height: 100%;object-fit: cover}
.about-carousel:focus-visible{outline: 3px solid var(--moss);outline-offset: 3px}
@media (max-width: 900px){.about-hero{display: flex;flex-direction: column;gap: 32px;padding: 36px 0 48px}
.about-hero-copy{display: flex;flex-direction: column;width: 100%}
.about-story-text{order: 1}
.about-facts{order: 2;margin: 22px 0 0}
.about-hero-button{order: 3;align-self: flex-start}
.about-hero-photo{width: min(100%,560px);align-self: center}
}
@media (max-width: 640px){.about-hero-identity .about-eyebrow{font-size: 10px;letter-spacing: .08em}
.about-hero-photo img{border-radius: 150px 150px var(--radius-card) var(--radius-card)}
.about-instagram-section{padding: 24px 16px;border-radius: 40px var(--radius-card) var(--radius-card) var(--radius-card)}
.about-carousel{gap: 12px;padding: 24px 52px;scroll-padding-inline: 52px;border-radius: 50px var(--radius-card) var(--radius-card) var(--radius-card)}
.about-post{flex-basis: min(260px,calc(100vw - 178px))}
.about-carousel-controls{inset: 0 8px}
.about-carousel-button{width: 40px;height: 40px}
}
@media (max-width: 390px){.about-facts{grid-template-columns: minmax(0,1fr)}
}
.study-comparison{margin: 0 0 24px;padding: 22px 24px;background: var(--surface)}
.comparison-heading{display: flex;align-items: baseline;justify-content: space-between;gap: 12px;margin-bottom: 16px}
.comparison-heading h3{margin: 0;font-size: 23px}
.comparison-heading > span{color: var(--quiet);font-size: 12px}
.comparison-layout{display: grid;grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr);gap: 24px;align-items: start}
.comparison-photos{display: grid;gap: 12px}
.comparison-photos figure{margin: 0;min-width: 0}
.comparison-photos img{display: block;width: 100%;height: 140px;border-radius: var(--radius-control)}
.comparison-photos figcaption{margin-top: 7px}
.comparison-photos strong{display: block;font-size: 13px;font-weight: 500}
.comparison-photos figcaption span{color: var(--quiet);font-size: 11px}
.comparison-copy table{width: 100%;border-collapse: collapse;table-layout: fixed;font-size: 12px;line-height: 1.5}
.comparison-copy th, .comparison-copy td{padding: 8px;text-align: left;vertical-align: top;border-bottom: 1px solid var(--hairline);overflow-wrap: anywhere}
.comparison-copy thead th{padding-top: 0;color: var(--moss);font-weight: 500}
.comparison-copy th:first-child{width: 23%}
.comparison-copy tbody th{font-weight: 500}
.comparison-note{margin: 12px 0 0;font-size: 12px;line-height: 1.5;color: var(--quiet)}
.comparison-credits{margin-top: 12px;color: var(--quiet);font-size: 11px}
.comparison-credits summary{cursor: pointer;width: fit-content;padding: 4px 0}
.comparison-credits p{margin: 8px 0 0}
.comparison-credits .image-foot{padding: 8px 0}
@media (max-width: 900px){.comparison-layout{grid-template-columns: minmax(0,1fr);gap: 16px}
}
@media (max-width: 640px){.study-comparison{padding: 18px}
.comparison-heading{display: block}
.comparison-heading h3{font-size: 21px;margin-bottom: 4px}
.comparison-photos img{height: 110px}
.comparison-copy th, .comparison-copy td{padding: 7px 4px}
}
.comparison-copy caption{position: absolute;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip-path: inset(50%);white-space: nowrap}
.study-comparison > h3{margin: 0 0 14px;font-size: 23px}
.comparison-photos{grid-template-columns: repeat(var(--comparison-count, 2), minmax(0,1fr))}
.comparison-photos img{object-fit: contain;background: transparent}
.comparison-photos figcaption small{display: block;color: var(--quiet);font-size: 10px;margin-top: 2px}
.comparison-level{white-space: nowrap;color: var(--moss) !important}
.comparison-trio .comparison-layout{grid-template-columns: minmax(0,1fr);gap: 16px}
.comparison-trio .comparison-photos img{height: 160px}
.comparison-extra{margin-top: 16px;border-top: 1px solid var(--hairline)}
.comparison-extra > summary{padding: 12px 0 0;color: var(--moss);font-size: 13px;cursor: pointer}
.comparison-extra .comparison-group{padding-top: 14px}
.comparison-voices{display: flex;gap: 12px 20px;flex-wrap: wrap;margin-top: 16px}
.comparison-voice-item{min-width: 0}
.comparison-voice-item > strong{display: block;color: var(--quiet);font-size: 12px;font-weight: 500;margin-bottom: 6px}
.comparison-voices .tile-audio-row{padding: 0}
.comparison-voices .tile-audio-button{min-height: 44px;font-size: 12px;padding: 8px 12px}
@media (max-width:640px){.comparison-heading{display: flex;align-items: flex-start;flex-wrap: wrap;gap: 4px 10px}
.comparison-trio .comparison-photos{grid-template-columns: minmax(0,1fr)}
.comparison-trio .comparison-photos figure{display: grid;grid-template-columns: minmax(0,1fr) minmax(0,1fr);align-items: center;gap: 12px}
.comparison-trio .comparison-photos img{height: 100px}
.comparison-trio .comparison-copy table{font-size: 11px}
.comparison-trio .comparison-copy th:first-child{width: 21%}
}