:root{--paper:#f7f6f0;--ink:#253c32;--green:#315647;--muted:#788076;--line:#e5e7dc;--orange:#c6854b;--mint:#edf1e7;--white:#fff;--shadow:0 8px 35px #243e3010}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;font-size:15px}button,select{font:inherit}button{cursor:pointer}button,select,a{touch-action:manipulation}button:disabled{cursor:default;opacity:.45}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #dca06c;outline-offset:4px}button[hidden],[hidden]{display:none!important}a{color:inherit}.site-header{max-width:1440px;margin:auto;height:98px;padding:0 64px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;font-size:20px;font-weight:700;letter-spacing:1px}.brand small{display:block;font-size:9px;color:var(--muted);letter-spacing:2.1px;margin-top:4px}.header-note{font-size:12px;color:var(--muted);display:flex;gap:8px;align-items:center}.leaf-dot{width:8px;height:12px;border-radius:0 8px 0 8px;background:#739573;transform:rotate(22deg)}.help-button{border:1px solid #dce1d5;background:transparent;border-radius:100px;padding:10px 16px;color:var(--green);font-weight:600;font-size:13px}.help-button span{margin-left:7px}main{max-width:1440px;margin:auto;padding:44px 64px 0}.intro{position:relative;margin-bottom:32px}.eyebrow{margin:0 0 12px;font-size:11px;color:var(--orange);font-weight:700;letter-spacing:2px}.intro h1{font-family:"Songti SC","STSong","Noto Serif SC",serif;font-size:36px;line-height:1.5;letter-spacing:1px;margin:0;font-weight:600}.intro h1 span{color:#65826b}.intro-copy{margin:10px 0 0;font-size:13px;color:var(--muted)}.explorer{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:28px;align-items:stretch}.viewer-card{border:1px solid var(--line);border-radius:22px;background:white;overflow:hidden;box-shadow:var(--shadow)}.viewer-heading{height:52px;padding:0 22px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #eceee6;font-size:11px;color:#768075;letter-spacing:1px}.viewer-heading>div{display:flex;align-items:center;gap:8px}.live-dot{width:6px;height:6px;background:#8da67e;border-radius:50%}.icon-button{border:0;background:transparent;padding:6px;color:var(--ink);display:flex}.icon-button svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.5}.stage{height:420px;position:relative;background:#f4f4ed;isolation:isolate}.render-host{position:absolute;inset:0}.render-host iframe,.render-host canvas{height:100%;width:100%;border:0;display:block}.stage-message{position:absolute;inset:0;background:#f4f4ed;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:36px;z-index:2}.stage-message h2{font-family:"Songti SC",serif;font-size:20px;font-weight:500}.stage-message p{font-size:13px;color:var(--muted);max-width:380px;line-height:1.8}.stage-message button{border:1px solid #b8c5b3;background:#fff;border-radius:30px;padding:10px 20px;color:var(--green);margin-top:10px}.spinner{width:24px;height:24px;border:2px solid #dbe3d3;border-top-color:#617f60;border-radius:50%;animation:spin 1s linear infinite}.stage-message.error .spinner,.stage-message.pending .spinner{display:none}.gesture-hint{position:absolute;bottom:15px;left:50%;transform:translateX(-50%);white-space:nowrap;background:#fffef4e6;color:#63775f;display:flex;gap:8px;align-items:center;border:1px solid #ffffff80;border-radius:100px;padding:9px 14px;font-size:11px;pointer-events:none;box-shadow:0 3px 16px #0001}.gesture-hint svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.4}.toolbar{padding:17px 20px;display:flex;align-items:center;gap:10px;border-top:1px solid var(--line);flex-wrap:wrap}.primary-button{border:0;border-radius:12px;background:var(--green);color:#fff;padding:12px 16px;display:inline-flex;align-items:center;justify-content:center;gap:9px;font-size:12px;font-weight:600}.primary-button:hover:enabled{background:#254637}.animation-select select{max-width:145px;border:1px solid var(--line);background:#fafbf6;color:#52694f;border-radius:10px;padding:11px 23px 11px 10px;font-size:11px}.tool-button{border:0;background:transparent;color:#586b54;padding:10px 4px;font-size:12px;white-space:nowrap}.tool-button span{font-size:17px;margin-right:3px}.zoom-buttons{margin-left:auto;display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted)}.zoom-buttons button{border:1px solid var(--line);background:#fafbf6;border-radius:9px;width:31px;height:31px;color:var(--green);font-size:18px}.viewer-caption{padding:0 22px 16px;display:flex;justify-content:space-between;gap:12px;font-size:10px;color:#899184}.bird-info{padding:7px 0;display:flex;flex-direction:column}.info-top{display:flex;align-items:center;justify-content:space-between}.habitat-tag{display:inline-block;padding:6px 10px;border-radius:7px;background:#e9eee1;font-size:10px;color:#64815c;letter-spacing:1px}.bird-index{font-size:11px;color:#a5ad9e;font-family:monospace}.bird-info h2{font-family:"Songti SC","STSong",serif;font-size:46px;line-height:1.4;font-weight:600;margin:18px 0 1px;letter-spacing:4px}.english-name{font-family:Georgia,serif;font-style:italic;font-size:14px;color:#8b9584;margin:0 0 21px}.bird-description{font-size:13px;color:#677160;line-height:2;margin:0 0 24px}.fact-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0;margin-bottom:23px}.fact-grid span{display:block;font-size:10px;color:#959c8e;margin-bottom:9px}.fact-grid strong{font-size:12px;font-weight:500;color:#546449;line-height:1.7}.observe-box{background:#ebeee0;padding:20px 20px 18px;border-radius:15px}.small-heading{font-size:10px;color:#778366;letter-spacing:1px;margin:0 0 12px}.small-heading>span{font-size:17px}.observe-box h3{font-size:15px;font-weight:600;line-height:1.7;margin:0 0 9px}.observe-box>p:not(.small-heading){font-size:12px;color:#7a826a;line-height:1.9;margin:0}.discovery-button{display:flex;align-items:center;justify-content:space-between;width:100%;border:0;border-top:1px solid #dbe1cc;background:transparent;margin-top:18px;padding:13px 0 0;font-size:11px;color:var(--green);font-weight:600}.discovery-answer{margin-top:15px!important;color:#476841!important}.accuracy-note{font-size:10px;line-height:1.7;color:#a3a994;margin:13px 4px 0}.bird-library{margin-top:32px}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.section-heading h2{font-size:13px;font-weight:600;margin:0}.section-heading>span{font-size:11px;color:#9ca390}.bird-list{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.bird-card{border:1px solid var(--line);border-radius:16px;display:flex;text-align:left;align-items:center;gap:18px;padding:17px 20px;position:relative;background:#ffffff80;color:var(--ink);min-height:104px;transition:border-color .15s,background .15s,transform .15s}.bird-card:hover{background:white;transform:translateY(-2px)}.bird-card[aria-pressed="true"]{border-color:#87a085;background:#edf1e5}.bird-thumbnail{width:76px;height:65px;flex:none;display:grid;place-items:center;background:#eeeee2;border-radius:11px;overflow:hidden}.bird-thumbnail img{width:100%;height:100%;object-fit:contain}.bird-card h3{font-size:15px;font-weight:600;margin:0 0 6px}.bird-card p{font-size:10px;color:#929b87;margin:0;line-height:1.6}.card-state{margin-left:auto;color:#657e56;font-size:11px;border-radius:100px;white-space:nowrap}.card-state.pending{color:#aaad9f}.bird-card[aria-pressed="true"] .card-state{background:#d8e4ce;padding:5px 8px;font-size:9px}footer{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);margin-top:33px;padding:24px 0 30px;color:#a1a894;font-size:10px}footer button{border:0;background:transparent;color:#8b9680;padding:0;font-size:10px;margin-left:17px}dialog{border:1px solid var(--line);border-radius:24px;padding:36px;max-width:540px;width:calc(100% - 32px);background:var(--paper);color:var(--ink);box-shadow:0 24px 90px #142d3030}dialog::backdrop{background:#192d2966;backdrop-filter:blur(3px)}dialog h2{font-family:"Songti SC",serif;font-size:25px;font-weight:500;line-height:1.5;margin:0 0 20px}dialog p{font-size:13px;line-height:1.9;color:#76816c}.close-dialog{position:absolute;right:16px;top:11px;border:0;background:transparent;color:#8c9584;font-size:26px;padding:4px 8px}.help-list{list-style:none;padding:0;counter-reset:steps;display:grid;gap:20px;margin:27px 0}.help-list li{counter-increment:steps;display:grid;grid-template-columns:35px 1fr;gap:4px 12px}.help-list li:before{content:counter(steps);grid-row:span 2;width:30px;height:30px;background:#e5ecd9;border-radius:50%;display:grid;place-items:center;font-family:Georgia,serif;color:#6d825b}.help-list b{font-size:13px;font-weight:500}.help-list span{font-size:12px;color:#8a947f}.credits-entry{padding:14px 0;border-top:1px solid var(--line);font-size:12px;line-height:1.9}.credits-entry h3{font-size:14px;margin:0 0 4px}.credits-entry p{font-size:11px;margin:4px 0}.credits-entry a{color:var(--green);text-underline-offset:3px}.dialog-note{font-size:11px!important;line-height:1.8!important;color:#8b947f!important}.file-picker{display:block;position:relative;border:1px dashed #9aad8d;border-radius:12px;text-align:center;padding:20px;color:var(--green);font-size:14px;margin:22px 0;cursor:pointer}.file-picker input{position:absolute;inset:0;opacity:0;width:100%;cursor:pointer}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.stage:fullscreen{height:100vh;width:100vw}.stage:fullscreen .gesture-hint{bottom:20px}@keyframes spin{to{transform:rotate(360deg)}}@media(min-width:1350px){.stage{height:450px}.bird-info{padding-top:11px}.observe-box{margin-top:auto}}@media(max-width:1150px){.site-header{padding:0 36px}main{padding:35px 36px 0}.explorer{grid-template-columns:minmax(0,1fr) 270px;gap:22px}.stage{height:410px}.toolbar{gap:7px;padding:14px}.zoom-buttons span{display:none}.bird-card{gap:10px;padding:16px}.bird-thumbnail{width:60px}.viewer-caption span:last-child{display:none}}@media(max-width:820px){.site-header{padding:0 24px;height:80px}.header-note{display:none}main{padding:30px 24px 0}.intro h1{font-size:29px}.explorer{grid-template-columns:1fr}.stage{height:440px}.bird-info{display:grid;grid-template-columns:1fr 1fr;gap:0 28px}.info-top{grid-column:1/-1}.bird-info h2{grid-column:1;margin-top:12px;font-size:36px}.english-name{grid-column:1;margin-bottom:12px}.bird-description{grid-column:1;margin-bottom:12px}.fact-grid{grid-column:1;margin-bottom:0}.observe-box{grid-column:2;grid-row:2/6;align-self:center}.accuracy-note{grid-column:1/-1;margin-top:17px}.bird-card{padding:13px;gap:10px}.bird-thumbnail{width:45px;height:55px}.card-state{font-size:9px}.bird-card h3{font-size:13px}.bird-card p{font-size:9px}.bird-card[aria-pressed="true"] .card-state{padding:4px;font-size:8px}}@media(max-width:560px){.site-header{padding:0 18px;height:74px}.brand{font-size:17px;gap:9px}.brand img{width:36px;height:36px}.brand small{font-size:8px;letter-spacing:1.6px}.help-button{padding:8px 12px}.help-button span{font-size:11px}main{padding:25px 16px 0}.intro{margin-bottom:22px}.intro h1{font-size:25px;letter-spacing:0}.intro h1 span{display:block}.intro-copy{font-size:11px;line-height:1.8;max-width:260px}.eyebrow{font-size:10px}.viewer-heading{height:45px;padding:0 15px}.stage{height:350px}.toolbar{gap:7px;padding:13px 12px}.primary-button{padding:11px 13px;font-size:11px}.animation-select select{width:100px;max-width:100px;font-size:10px;padding:10px 18px 10px 8px}.tool-button{font-size:10px}.zoom-buttons{gap:4px}.zoom-buttons button{width:26px;height:29px;font-size:16px}.viewer-caption{padding:0 14px 13px;font-size:9px}.gesture-hint{font-size:10px;padding:8px 12px;bottom:13px}.bird-info{grid-template-columns:1fr;gap:0;padding:2px 6px}.info-top,.bird-info h2,.english-name,.bird-description,.fact-grid,.observe-box,.accuracy-note{grid-column:1;grid-row:auto}.bird-info h2{font-size:38px}.bird-description{font-size:12px}.fact-grid{padding:15px 0;margin:0 0 18px}.observe-box{padding:18px}.bird-library{margin-top:25px}.bird-list{gap:9px}.bird-card{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:12px 10px;border-radius:13px;min-height:160px}.bird-thumbnail{height:60px;width:100%}.bird-card h3{font-size:13px}.bird-card p{font-size:9px}.card-state{position:absolute;right:8px;top:10px;font-size:8px}.bird-card[aria-pressed="true"] .card-state{top:8px;right:5px}.section-heading span{font-size:9px}footer{font-size:9px;gap:12px;line-height:1.9;align-items:center}footer button{font-size:9px;margin-left:8px}dialog{padding:30px 24px}}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition:none!important}}
.photo-viewer{position:absolute;inset:0;overflow:hidden;background:#e8eadd;touch-action:none;cursor:grab}.photo-viewer:active{cursor:grabbing}.photo-viewer img{display:block;width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none;transform-origin:center}.bird-card[data-bird="egret"] .bird-thumbnail img{object-fit:cover}