@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+TC:wght@400;500;600;700&family=Noto+Serif+TC:wght@400;500;600&display=swap";:root{--paper:#f6f4ed;--deep:#ebe9de;--card:#fcfaf3;--green:#293f34;--ink:#29382e;--muted:#697365;--line:#d5d9ca;--orange:#dc7953;--serif:"Noto Serif TC",Georgia,serif;--sans:"DM Sans","Noto Sans TC",sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans)}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--orange);outline-offset:4px}.nav{max-width:1080px;margin:auto;padding:22px 32px;display:flex;justify-content:space-between;align-items:center;gap:20px}.logo{font-weight:700;font-size:27px}.nav nav{display:flex;gap:22px;font-size:13px}.nav nav a,.text-button,footer a{min-height:44px;display:inline-flex;align-items:center}.intro{max-width:680px;margin:35px auto 30px;padding:0 24px;text-align:center}.eyebrow{font-size:11px;letter-spacing:2px;color:var(--orange);font-weight:600}.intro h1,.demo-card h2{font-family:var(--serif);font-weight:500}.intro h1{font-size:clamp(35px,6vw,56px);line-height:1.35;margin:20px 0}.intro p{font-size:15px;line-height:1.9;color:var(--muted)}.intro strong{color:var(--ink)}.demo-card{width:min(620px,calc(100% - 40px));margin:0 auto 35px;padding:32px;background:var(--card);border:1px solid var(--line);border-radius:12px}.demo-heading{display:flex;justify-content:space-between;align-items:start;gap:15px}.demo-card h2{font-size:26px;margin:12px 0 22px}.counter{white-space:nowrap;background:var(--deep);padding:9px 12px;border-radius:5px;font-size:13px}.counter b{font-size:23px}label{display:block;font-size:13px;font-weight:600;margin-bottom:8px}input{width:100%;border:1px solid var(--line);border-radius:7px;padding:13px;background:#fffdf6;color:var(--ink);margin-bottom:18px}.viewfinder{height:300px;border-radius:9px;overflow:hidden;position:relative;background:var(--green)}.viewfinder img{width:100%;height:100%;object-fit:cover;filter:saturate(.75) sepia(.12)}.viewfinder>span{position:absolute;bottom:10px;left:10px;background:#293f34d9;color:#fff;padding:6px 9px;font-size:10px;letter-spacing:1px}.film-strip{height:68px;display:flex;gap:8px;justify-content:center;align-items:center}.film-strip img{width:52px;height:52px;object-fit:cover;border-radius:3px}.shutter,.reveal-button,.button{min-height:48px;border-radius:999px;padding:13px 22px;border:1px solid var(--green);display:flex;align-items:center;justify-content:center;font-weight:600}.shutter{width:100%;background:var(--orange);border-color:var(--orange);color:#fff;font-size:17px}.shutter span{font-size:11px;margin-left:7px;font-weight:400}.shutter:disabled{background:#b4b5a9;border-color:#b4b5a9}.reveal-button{width:100%;margin-top:12px;background:var(--green);color:#fff}.reveal-button:disabled{opacity:.45;cursor:not-allowed}.hint{font-size:12px;color:var(--muted);line-height:1.7;text-align:center;margin-bottom:0}.reveal-section[hidden]{display:none}.results{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:25px 0}.results figure{margin:0}.results img{aspect-ratio:3/4;width:100%;object-fit:cover;border-radius:5px}.results figcaption{font-size:11px;color:var(--muted);margin-top:7px}.actions{display:flex;gap:12px}.button{flex:1;text-align:center;font-size:13px}.button.primary{background:var(--green);color:#fff}.text-button{display:flex;margin:16px auto 0;background:none;border:0;color:var(--muted);font-size:12px;text-decoration:underline}footer{padding:30px 24px;display:flex;justify-content:center;gap:22px;flex-wrap:wrap;font-size:12px;color:var(--muted)}footer span{display:flex;align-items:center}@media(max-width:600px){.nav{padding:15px 20px}.logo{font-size:22px}.nav nav{gap:12px;font-size:11px}.nav nav a{max-width:125px}.intro{margin-top:20px}.demo-card{padding:23px 18px}.viewfinder{height:260px}.shutter{flex-direction:column;gap:3px}.shutter span{margin:0}.actions{flex-direction:column}.demo-card h2{font-size:22px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}