:root{--paper:#faf8f5;--red:#d92332;--ink:#161515}
[hidden]{display:none!important}
.home{padding:27px 23px 26px}.home-eyebrow{font:800 10px Arial;letter-spacing:1.8px;color:var(--red)}.home h2{font-size:45px;line-height:1.1;letter-spacing:-2px;margin:17px 0 12px}.home h2 em{font-style:normal;color:var(--red)}.home-lead{font-size:13px;color:#555;line-height:1.6}
.home-art{position:relative;height:205px;background:var(--red);border:2px solid var(--ink);border-radius:13px;box-shadow:4px 4px 0 var(--ink);margin:23px 0;overflow:hidden}.home-art svg{width:100%;height:100%;display:block}.art-caption{position:absolute;top:15px;left:13px;font:900 10px/1.35 Arial;color:white;letter-spacing:.5px;z-index:1}
.home .primary-full,.hunter-screen .primary-full{margin:17px 0 8px;width:100%;font-size:18px}.home .primary-full>span{font-family:inherit;font-size:18px;font-weight:800}.home-helper{text-align:center;font-size:11px;color:#666;letter-spacing:3px;margin:12px 0 23px}.diet-entry{display:flex;align-items:center;gap:12px;width:100%;padding:15px 14px;background:white;border:2px solid var(--ink);border-radius:12px;box-shadow:3px 3px 0 var(--ink);text-align:left;cursor:pointer}.diet-entry b,.diet-entry small{display:block}.diet-entry b{font-size:16px}.diet-entry small{font-size:11px;font-weight:400;color:#666;margin-top:6px}.diet-entry strong{margin-left:auto;font-size:24px}.diet-entry-icon{font-size:34px;color:var(--red)}.home-nav{display:flex;justify-content:center;gap:25px;margin-top:23px}.home-nav button{background:none;border:0;text-decoration:underline;text-underline-offset:5px;color:#555;font-family:inherit;font-size:12px;font-weight:600;cursor:pointer}
.hunter-screen{padding:0 22px 30px}.hunter-screen .screen-heading{margin:0 -22px 20px;padding:24px 22px 18px}.hunter-screen .screen-heading h2{font-size:30px}.capture-meta{display:flex;justify-content:space-between;gap:10px;font-size:11px;font-weight:700;color:#656565;margin:0 0 15px}.capture-meta span:last-child{color:var(--red)}
.capture-board{width:100%;aspect-ratio:1.12;background:white;border:2px solid var(--ink);border-radius:13px;box-shadow:4px 4px 0 var(--ink);position:relative;overflow:hidden}.capture-board>div{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:15px;gap:10px;background:radial-gradient(#d5d1cb 1px,transparent 1px) 0 0/12px 12px}.capture-board svg{width:73px;height:63px;color:var(--red);margin-bottom:7px}.capture-board b{font-size:17px;background:var(--paper);padding:5px}.capture-board span{font-size:11px;color:#656565;background:var(--paper);padding:3px}.capture-board img{width:100%;height:100%;object-fit:contain;position:absolute;inset:0;background:#eee}
.capture-actions{margin:19px 0 0;gap:12px}.capture-actions .hunter-file{margin:0;border-width:2px;min-height:49px;padding:13px 5px;font-size:14px;box-shadow:2px 2px 0 var(--ink)}.capture-actions .album-file{background:white;color:var(--ink)}.capture-consent{margin:17px 0!important;font-size:11px!important}.capture-consent input{accent-color:var(--red)}.quiet-status{font-size:12px;color:#666;line-height:1.65;margin:12px 0;overflow-wrap:anywhere}.quiet-status:empty{display:none}.hunter-screen .text-button{font-size:12px;color:#555}.primary-full:disabled{opacity:.45;cursor:not-allowed;transform:none}.empty-state{border:2px dashed #bbb;border-radius:12px;padding:40px 12px;text-align:center;line-height:1.9;color:#777;margin:20px 0}.hunter-badge{display:inline-block;line-height:1.5;margin-top:4px}.hunter-log button{min-height:40px}.hunter-debug pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px;background:var(--ink);color:white;padding:15px;border-radius:9px}
.diet-boundary{font-size:11px;color:#777;text-align:center;margin:18px 0}.diet-result-label{display:inline-block;background:var(--red);color:white;padding:5px 8px;font-size:11px;margin-bottom:14px}.hunter-panel small{font-size:11px;line-height:1.6;color:#777;display:block;margin-top:14px}.diet-board{aspect-ratio:1.3}.finish{overflow:auto}.finish .stamp{margin-bottom:25px}.finish h2{font-size:39px}.finish .finish-card{margin:21px 0}.finish .quiet-status{color:#666;font-size:12px;line-height:1.6}.finish-share-note:empty{display:none}.finish .hunter-secondary{margin-top:20px}.sound-gate__content{max-height:100%;overflow:auto}
@media(max-width:350px){.home{padding:22px 19px}.home h2{font-size:40px}.home-art{height:180px;margin:20px 0}.home-lead{font-size:12px}.hunter-screen{padding-left:18px;padding-right:18px}.hunter-screen .screen-heading{margin-left:-18px;margin-right:-18px;padding-left:18px;padding-right:18px}.hunter-screen .screen-heading h2{font-size:26px}.capture-board b{font-size:15px}.capture-board span{font-size:10px}.capture-actions .hunter-file{font-size:12px}.finish h2{font-size:34px}}
@media(prefers-reduced-motion:reduce){.wipe.run,.screen{animation:none!important}}

/* ===== 拍照页拓展动效 2026-10-10：取景框扫描 / 快门闪光 / 照片冲印 / 状态反馈 ===== */
@keyframes cbScan{0%{transform:translateY(-120%);opacity:0}12%{opacity:1}88%{opacity:1}100%{transform:translateY(215%);opacity:0}}
@keyframes cbBreath{0%,100%{transform:scale(1);opacity:.8}50%{transform:scale(1.015);opacity:1}}
@keyframes cbFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes cbRise{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@keyframes cbShutter{0%{opacity:0}14%{opacity:.95}100%{opacity:0}}
@keyframes cbDevelop{from{opacity:0;clip-path:inset(0 47% 0 47%);transform:scale(1.045);filter:brightness(1.18) saturate(.5)}to{opacity:1;clip-path:inset(0 0 0 0);transform:scale(1);filter:brightness(1) saturate(1)}}
@keyframes cbStamp{0%{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}58%{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--ink)}100%{transform:translate(0,0);box-shadow:3px 3px 0 var(--ink)}}
@keyframes cbNudge{0%,100%{transform:translateX(0)}18%{transform:translateX(-4px)}42%{transform:translateX(4px)}68%{transform:translateX(-2px)}}
@keyframes cbSpin{to{transform:rotate(360deg)}}
@keyframes cbProgress{0%{transform:translateX(-105%)}100%{transform:translateX(390%)}}
@keyframes cbLock{0%{box-shadow:4px 4px 0 var(--ink)}50%{box-shadow:6px 6px 0 var(--red)}100%{box-shadow:4px 4px 0 var(--ink)}}
.capture-board{--cb-frame:rgba(217,35,50,.85)}
.capture-board>div::before{content:'';position:absolute;inset:11px;z-index:2;pointer-events:none;opacity:.9;background-image:linear-gradient(var(--cb-frame),var(--cb-frame)),linear-gradient(var(--cb-frame),var(--cb-frame)),linear-gradient(var(--cb-frame),var(--cb-frame)),linear-gradient(var(--cb-frame),var(--cb-frame)),linear-gradient(var(--cb-frame),var(--cb-frame)),linear-gradient(var(--cb-frame),var(--cb-frame)),linear-gradient(var(--cb-frame),var(--cb-frame)),linear-gradient(var(--cb-frame),var(--cb-frame));background-repeat:no-repeat;background-size:20px 2px,2px 20px,20px 2px,2px 20px,20px 2px,2px 20px,20px 2px,2px 20px;background-position:left top,left top,right top,right top,left bottom,left bottom,right bottom,right bottom;animation:cbBreath 3.6s ease-in-out infinite}
.capture-board>div::after{content:'';position:absolute;left:0;right:0;top:0;height:32%;z-index:2;pointer-events:none;border-bottom:2px solid rgba(217,35,50,.5);background:linear-gradient(180deg,rgba(217,35,50,0) 0%,rgba(217,35,50,.1) 70%,rgba(217,35,50,.22) 100%);animation:cbScan 4.2s cubic-bezier(.45,0,.55,1) infinite}
.capture-board svg{animation:cbFloat 3.1s ease-in-out infinite}
.capture-board b,.capture-board span{animation:cbRise .5s cubic-bezier(.22,.61,.36,1) backwards}
.capture-board img:not([hidden]){animation:cbDevelop .55s cubic-bezier(.22,.61,.36,1) both}
.capture-board:has(img:not([hidden])){animation:cbLock .6s ease-out backwards}
.capture-board::after{content:'';position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0;background:radial-gradient(circle at 50% 44%,#fff 0%,rgba(255,255,255,.9) 44%,rgba(250,248,245,.3) 100%)}
.capture-board::before{content:'';position:absolute;top:13px;right:13px;width:24px;height:24px;z-index:4;border-radius:50%;border:3px solid rgba(22,21,21,.14);border-top-color:var(--red);opacity:0;pointer-events:none}
.capture-actions .hunter-file{transition:transform .12s,box-shadow .12s}
.capture-actions .hunter-file:active{transform:translate(2px,2px);box-shadow:0 0 0 var(--ink)}
#checkin.is-armed .capture-board>div::after,#diet.is-armed .capture-board>div::after{animation-duration:1.25s}
#checkin.is-capturing .capture-board>div::after,#diet.is-capturing .capture-board>div::after{animation-duration:1s}
#checkin.is-capturing .capture-board::after,#diet.is-capturing .capture-board::after{animation:cbShutter .62s ease-out both}
#checkin.is-capturing .capture-board,#diet.is-capturing .capture-board{border-color:var(--red)}
#checkin.is-error .capture-board,#diet.is-error .capture-board{animation:cbNudge .34s ease-out backwards}
#checkin:has(#hunterCamera:disabled) .capture-board::before,#diet:has(#dietCamera:disabled) .capture-board::before{opacity:1;animation:cbSpin .85s linear infinite}
#hunterSubmit,#dietAnalyze{position:relative;overflow:hidden}
#hunterSubmit:not(:disabled),#dietAnalyze:not(:disabled){animation:cbStamp .36s cubic-bezier(.22,.61,.36,1) backwards}
#checkin:has(#hunterCamera:disabled):has(#hunterPhotoPreview:not([hidden])) #hunterSubmit::after{content:'';position:absolute;left:0;bottom:0;height:4px;width:26%;background:rgba(255,255,255,.9);animation:cbProgress 1.05s cubic-bezier(.55,0,.45,1) infinite}
@media(prefers-reduced-motion:reduce){.capture-board,.capture-board>div::before,.capture-board>div::after,.capture-board::before,.capture-board::after,.capture-board svg,.capture-board img,.capture-board b,.capture-board span,#hunterSubmit,#hunterSubmit::after,#dietAnalyze{animation:none!important}}
.hunter-low-motion .capture-board,.hunter-low-motion .capture-board>div::before,.hunter-low-motion .capture-board>div::after,.hunter-low-motion .capture-board::before,.hunter-low-motion .capture-board::after,.hunter-low-motion .capture-board svg,.hunter-low-motion .capture-board img,.hunter-low-motion .capture-board b,.hunter-low-motion .capture-board span,.hunter-low-motion #hunterSubmit,.hunter-low-motion #hunterSubmit::after,.hunter-low-motion #dietAnalyze{animation:none!important}
