:root{--ink:#102b35;--muted:#52717a;--paper:#f3f5ed;--lime:#dcf580;--orange:#ff956b;--line:#cad7d4;--teal:#006b64}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 'Noto Sans TC',system-ui,sans-serif}button,input,select{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer;border:1px solid var(--ink);border-radius:12px;padding:12px 20px;background:white;color:var(--ink);font-weight:600;min-height:48px}button:hover{background:var(--lime)}button:disabled{opacity:.55;cursor:wait}button.primary{background:var(--ink);color:white}button.primary:hover{background:var(--teal)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #db5723;outline-offset:4px}a{color:var(--teal)}header{max-width:1320px;margin:auto;padding:24px 30px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:20px}.brand{font-size:26px;font-weight:800;color:var(--ink);text-decoration:none;line-height:1.2}.brand span{color:var(--teal)}.brand small{display:block;letter-spacing:.08em;font-size:11px;margin-top:8px}nav{display:flex;align-items:center;gap:12px}nav button{border:none;background:transparent;padding:10px}nav a{font-size:14px}main{max-width:1240px;margin:auto;padding:36px 30px 70px;min-height:75vh}h1{font-size:clamp(32px,5vw,58px);line-height:1.2;letter-spacing:-.04em;margin:10px 0 18px}h2{font-size:28px;line-height:1.4;margin:12px 0}h3{font-size:22px;margin:8px 0}p{margin:10px 0 18px}.eyebrow{font-weight:800;letter-spacing:.14em;font-size:13px;color:var(--teal)}.intro{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:30px}.intro p{max-width:520px;color:var(--muted)}.tag{display:inline-block;border:1px solid var(--line);border-radius:30px;padding:5px 12px;font-size:13px;font-weight:600}.steps{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0 30px}.steps span{padding:8px 14px;background:white;border-radius:8px}.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}.card{overflow:hidden;border:1px solid var(--line);border-radius:20px;background:white;display:grid;grid-template-columns:43% 57%;min-height:255px}.card-art{background:var(--lime);overflow:hidden;display:flex;align-items:center;justify-content:center;position:relative}.card-art img{width:100%;height:100%;object-fit:cover}.card-copy{padding:26px}.card-copy p{font-size:14px;color:var(--muted)}.card-copy button{width:100%;margin-top:6px}.card:nth-child(2) .card-art{background:#d4e8f1}.card:nth-child(3) .card-art{background:var(--orange)}.bigtype{font-size:clamp(35px,5vw,64px);font-weight:800;line-height:1.25;text-align:center;letter-spacing:-.05em}.card-art .subtype{font-size:16px;letter-spacing:.1em;display:block;margin-top:18px}.panel{background:white;border:1px solid var(--line);border-radius:20px;padding:28px}.setup{max-width:700px;margin:0 auto}.setup ul{padding-left:22px}.setup label{display:block;font-weight:600;margin:20px 0 7px}input,select{border:1px solid #8baba9;border-radius:9px;padding:12px;background:white;color:var(--ink);max-width:100%}input{width:100%}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.actions>*{flex:1}.muted{color:var(--muted);font-size:14px}.gamebar{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:16px}.score{font-size:24px;font-weight:800}.progress{height:7px;background:#dce5df;border-radius:10px;margin-bottom:24px;overflow:hidden}.progress i{display:block;height:100%;background:var(--teal)}.pictures{display:grid;grid-template-columns:1fr 1fr;gap:18px}.picture{position:relative;line-height:0;overflow:hidden;border-radius:14px;background:#e9eddf}.picture img{width:100%;height:auto;display:block}.picture.interactive{cursor:crosshair}.picture .marker{position:absolute;transform:translate(-50%,-50%);width:42px;height:42px;border:4px solid #fff;border-radius:50%;box-shadow:0 0 0 3px #006b64;background:#006b6450;pointer-events:none}.picture .miss{position:absolute;width:22px;height:22px;transform:translate(-50%,-50%);border:3px solid #c33;border-radius:50%;pointer-events:none}.image-label{font-size:13px;font-weight:800;margin-bottom:8px}.feedback{margin-top:22px;background:#e6f1df;border-left:5px solid var(--teal);padding:18px 22px;border-radius:6px}.feedback.bad{background:#fff0e8;border-color:#bd5428}.face-layout{display:grid;grid-template-columns:1fr 1fr;gap:35px;align-items:center}.portrait{width:100%;height:470px;object-fit:contain;background:#dee8e7;border-radius:18px}.choices{display:grid;gap:12px;margin-top:22px}.choices button{text-align:left;padding:17px 20px}.chat{max-width:740px;margin:auto}.bubble{background:#e4f0dd;border-radius:2px 20px 20px 20px;padding:25px;font-size:22px;margin:20px 0}.result{text-align:center;max-width:790px;margin:auto}.result-score{font-size:84px;font-weight:800;line-height:1.2;margin:25px}.voucher{border:2px dashed var(--teal);border-radius:16px;padding:20px;margin:25px 0;background:#f3fadf}.voucher strong{font-size:30px;letter-spacing:.13em;display:block}.filters{display:flex;gap:12px;flex-wrap:wrap;margin:25px 0}table{border-collapse:collapse;width:100%;text-align:left}th,td{padding:16px 12px;border-bottom:1px solid var(--line)}th{font-size:13px;color:var(--muted)}tbody tr:first-child{background:#eff8ce}td:nth-child(3){font-weight:800}.empty{padding:50px;text-align:center;color:var(--muted)}footer{max-width:1240px;margin:auto;border-top:1px solid var(--line);padding:22px 30px;font-size:12px;color:var(--muted)}footer a{margin-left:15px}#notice:not(:empty){position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:20;background:var(--ink);color:white;padding:14px 24px;border-radius:14px;max-width:90vw}.guide{max-width:850px}.guide section{margin:35px 0}.guide li{margin:10px 0}.mobiletip{display:none}.board-mode header nav,.board-mode footer{display:none}.board-mode table{font-size:30px}.board-mode th,.board-mode td{padding:8px 16px}.board-mode h1{font-size:56px}.board-mode .filters{gap:12px}.board-mode main{max-width:1400px} @media(max-width:850px){.cards{grid-template-columns:1fr}.intro{display:block}.face-layout{gap:20px}.portrait{height:360px}}@media(max-width:580px){header{padding:18px;align-items:start}.brand{font-size:21px}nav{gap:4px;flex-wrap:wrap;justify-content:end}nav a{display:none}nav a.learnlink{display:inline-block;font-size:13px;padding:5px 8px}nav button{font-size:13px;padding:5px 8px}main{padding:26px 18px 55px}.card{grid-template-columns:36% 64%;min-height:230px}.card-copy{padding:20px}.card-copy h3{font-size:21px}.card-copy p{margin-bottom:9px}.panel{padding:20px}.pictures{grid-template-columns:1fr;gap:15px}.face-layout{grid-template-columns:1fr}.portrait{height:330px}.gamebar{font-size:13px}.score{font-size:20px}.mobiletip{display:block}h2{font-size:24px}.bubble{font-size:19px}.result-score{font-size:64px}th,td{padding:12px 7px;font-size:14px}.actions>*{flex-basis:40%}}@media(prefers-reduced-motion:no-preference){button{transition:background .15s}.card{transition:transform .15s}.card:hover{transform:translateY(-3px)}}

/* 2026-09-14 展前修補 */
.picture.interactive,.portrait{touch-action:manipulation;-webkit-touch-callout:none;user-select:none}
.picture.interactive.busy{cursor:wait;opacity:.85}
.picture .miss{position:absolute;transform:translate(-50%,-50%);width:26px;height:26px;border:3px solid #dc2626;border-radius:50%;background:rgba(220,38,38,.18);pointer-events:none}
#recover{display:block;margin:12px auto}
#notice{bottom:90px}

.quick{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:14px 0 6px;font-weight:700;color:var(--muted)}
.quick .chip{padding:8px 14px;border-radius:999px;background:#fff;border:1px solid var(--line);font-weight:700}
.quick .chip:hover{border-color:var(--teal);color:var(--teal)}

/* 9/19 彩蛋：滿分／贏 AI 標題、今日名次、四款全破 */
.confetti{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:99}
.result h1.win{color:var(--teal)}
.rank{margin:4px 0 10px;font-weight:700;color:var(--muted)}.rank strong{font-size:1.3em;color:var(--ink)}.rank.top{color:var(--teal)}
.badge-all{margin:14px 0;padding:14px 16px;border-radius:14px;background:var(--lime);border:2px solid var(--teal);font-weight:600;line-height:1.5}.badge-all strong{display:block;font-size:1.25em;margin-bottom:4px}
.quick .chip.done{background:var(--lime);border-color:var(--teal);color:var(--ink)}

/* 10/14 找碴擴充：進階挑戰的類型提示與點到疊字的說明 */
.kindtag{display:inline-block;margin:2px 0 8px;padding:6px 12px;border-radius:999px;background:#fff3cd;color:#7a4b00;font-weight:700}
.spot-note{margin:6px 0 10px;padding:8px 12px;border-radius:10px;background:#fde8e8;color:#9b1c1c;font-weight:600}
