html,body{margin:0;width:100%;height:100%;overflow:hidden}
body{display:flex;flex-direction:column;background:#e9dfcd;font-family:"Microsoft YaHei",sans-serif}
#mount{position:relative;flex:1;min-height:0;overflow:hidden}
#loading{position:absolute;inset:0;display:grid;place-items:center;margin:0;font-size:24px;color:#624a32}
/* 试玩面板：画布外，不挤压画布 */
.control-panel{position:relative;flex:0 0 auto;max-height:40%;overflow:auto;padding:8px 24px;background:#3b2e21;color:#f3eadb;font-size:15px;box-sizing:border-box}
.control-panel summary{cursor:pointer;line-height:22px}.control-panel summary span{margin-left:20px}
.control-fields{display:flex;flex-wrap:wrap;gap:8px 28px;align-items:center;margin-top:8px}
.control-panel p{font-size:13px;line-height:1.7;margin:6px 0}.control-panel input{accent-color:#d9a55b;vertical-align:middle}
.control-panel button,.control-panel select{font-size:14px;padding:4px 10px;border-radius:6px;border:1px solid #6b573f;background:#f3eadb;color:#3b2e21;cursor:pointer}
.control-panel button:hover{background:#fff}
#live-status{color:#d9c3a3;font-size:13px}
.fd-hitbox{position:absolute;border:3px dashed #1552a0;background:#2b6cb033;border-radius:6px;box-shadow:0 0 0 2px #fffc,inset 0 0 0 2px #fffc}
/* A3-4：米杏纸感，620×620 双图，底部集中进度与查看答案 */
.public-game-shell .game-background{background:#f3eadb}
.fd-surface{width:1280px;height:728px;box-sizing:border-box;position:relative;background:#f3eadb;color:#624a32;font-family:"Microsoft YaHei",sans-serif;display:flex;flex-direction:column;align-items:center;padding:10px 12px;gap:15px;user-select:none;-webkit-user-select:none}
.fd-board{display:flex;gap:16px;align-items:center;justify-content:center}
.fd-picture{width:620px;height:620px;position:relative;box-shadow:0 5px 15px #83674324;outline:2px solid #fffaf0;border-radius:5px;overflow:hidden;cursor:pointer;touch-action:none}
.fd-picture img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}
.fd-layer{position:absolute;inset:0;pointer-events:none}
.fd-controls{display:flex;align-items:center;justify-content:center;gap:48px;width:1256px;height:64px;flex:none;position:relative}
.fd-progress{display:flex;gap:18px;align-items:center;font-size:24px}
.fd-track{width:430px;height:14px;border-radius:10px;background:#ded0bc;overflow:hidden}
.fd-fill{display:block;width:0;height:100%;background:#a98255;border-radius:10px;transition:width .3s}
.fd-answer{font:700 24px "Microsoft YaHei",sans-serif;color:#fff;background:#a98255;border:0;border-radius:7px;padding:15px 34px;min-height:60px;cursor:pointer}
.fd-answer:focus-visible{outline:4px solid #624a32;outline-offset:4px}
.fd-answer.shown{background:#cdbba2;color:#5f4a33;cursor:default}
/* 10 秒无进展：温和提示，不闪烁 */
.fd-answer-wrap{position:relative}
.fd-hint{position:absolute;left:calc(100% + 18px);top:50%;transform:translateY(-50%);margin:0;padding:8px 16px;border-radius:20px;background:#fffaf0;color:#7a5a36;font-size:20px;box-shadow:0 2px 8px #8367432a;opacity:0;transition:opacity .6s;pointer-events:none;white-space:nowrap}
.fd-hint.on{opacity:1}
/* 已找到：绿色实线框 + ✓；查看答案：橙色虚线框，无 ✓ */
.fd-mark{position:absolute;box-sizing:border-box;border-radius:10px}
.fd-mark.found{border:4px solid #418459;background:#41845916;box-shadow:0 0 0 2px #fff9}
.fd-mark.found b{position:absolute;right:-4px;top:-4px;transform:translate(40%,-40%);width:28px;height:28px;border-radius:50%;background:#418459;color:#fff;font-size:18px;line-height:28px;text-align:center;box-shadow:0 0 0 2px #fff}
.fd-mark.answer{border:5px dashed #e07b00;background:#ffb32e26;box-shadow:0 0 0 2px #fffc}
/* 现场得分浮字（公共规范第5节：绿 #15724D，描边 #FFFCEF） */
.fd-float{position:absolute;transform:translate(-50%,-100%);font:800 34px "Microsoft YaHei",sans-serif;color:#15724D;-webkit-text-stroke:5px #FFFCEF;paint-order:stroke fill;text-shadow:0 2px 4px #0003;white-space:nowrap;animation:fd-rise 1.1s ease-out forwards}
@keyframes fd-rise{0%{opacity:0;margin-top:6px}15%{opacity:1}70%{opacity:1}100%{opacity:0;margin-top:-34px}}
