:root{font-family:system-ui,-apple-system,'Noto Sans TC',sans-serif;color:#213f40;background:#f3f1e8;font-synthesis:none}*{box-sizing:border-box}body{margin:0}main{max-width:1050px;padding:30px 28px;margin:auto}header{position:relative;margin-bottom:26px}a{color:inherit}.brand{font-size:12px;letter-spacing:2px;text-decoration:none;font-weight:800}.tools{float:right;display:flex;gap:8px}.eyebrow{color:#70877c;font-size:12px;letter-spacing:2px;font-weight:800}h1{font-size:clamp(32px,5vw,52px);letter-spacing:-2px;margin:18px 0 10px;font-weight:900}h1 span{color:#bf752f;margin-left:12px}h2{font-size:25px;margin:8px 0 14px}h3{font-size:17px;margin:8px 0}p{line-height:1.8}header>p:last-child{margin:0;color:#627976}.panel{background:#fffcf4;border:1px solid #deded1;border-radius:20px;padding:25px;margin:16px 0;box-shadow:0 6px 20px #38584605}.row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}input,select,button{font:inherit}button,select{border:1px solid #c8d2c7;border-radius:10px;padding:11px 17px;background:#fffcf4;color:#31534d;cursor:pointer;font-weight:700}button:hover:not(:disabled){background:#edf1e5;transform:translateY(-1px)}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #e9a441;outline-offset:3px}button:disabled{opacity:.5;cursor:wait}.primary{background:#235b52;color:#fff;border-color:#235b52}.primary:hover:not(:disabled){background:#17473f}input{display:block;margin:8px 0 16px;width:min(100%,380px);padding:13px;border:1px solid #b6c7bd;border-radius:9px;background:white}.note{font-size:13px;color:#677c71;border-left:3px solid #deb275;padding-left:12px}.status{display:flex;justify-content:space-between;font-size:14px;padding:16px 24px;font-weight:800}#progress{display:flex;gap:7px;margin:15px 3px}#progress span{flex:1;height:6px;border-radius:5px;background:#d5dcd1}#progress span.done{background:#d19846}#progress span.active{background:#366f61}.landscape{padding:0;overflow:hidden;background:#d8eeE4}.scene-heading{display:flex;justify-content:space-between;padding:15px 22px;font-size:13px;font-weight:700}#scene{display:block;width:100%;height:auto}#sceneCaption{min-height:38px;padding:9px 20px;background:#e6ecdc;font-size:13px;color:#4a6657}.badge{margin-left:auto;background:#edf0e3;border-radius:30px;font-size:12px;padding:7px 12px}.work>.row>.eyebrow{margin:0}#instruction{color:#60736a;margin:8px 0 18px}#choices{display:grid;grid-template-columns:repeat(10,1fr);gap:8px;margin:20px 0}#choices button{padding:12px 0;font-size:17px;border-radius:9px}#choices button[aria-pressed=true]{background:#dba14c;border-color:#bc8033;color:#223d36;box-shadow:inset 0 -3px #b77c3022}#selectionCount{font-size:13px;color:#6d7b70}#verification{border-top:1px solid #deded1;margin-top:22px;padding-top:18px}#tiles{display:grid;gap:4px;background:#e7e9db;border-radius:12px;padding:14px;margin:15px 0;min-height:80px;overflow:auto;max-height:410px;align-content:start}#tiles i{display:block;aspect-ratio:1.35;min-width:0;background:#d8a24c;border:1px solid #a77d3f;border-radius:3px;box-shadow:inset 0 3px #fff4;max-height:50px}#tiles i.rem{background:#d57549;border-color:#ac5632}#tiles i.enter{animation:tileIn .6s both}@keyframes tileIn{from{transform:translate(-30px,-32px);opacity:0}to{transform:translate(0,0);opacity:1}}#equation{font-size:23px;font-weight:800;color:#34584b}#dimensions{margin-left:auto;font-size:13px;color:#66796f}#pairs{display:flex;gap:8px;flex-wrap:wrap;margin:13px 0}#pairs span{padding:5px 10px;background:#eceddb;border-radius:7px;font-weight:700}#feedback{line-height:1.9;background:#f3eedb;border-radius:12px;padding:0 16px;margin:16px 0;white-space:pre-line}#feedback:not(:empty){padding:15px 16px}#error{background:#fff0e8;border:1px solid #d7a18b;border-radius:8px;padding:12px;color:#8f3d24}footer{text-align:center;color:#6e7b70;font-size:12px;padding:27px}footer a{text-underline-offset:4px}.new-part{animation:install 1s ease-out both}@keyframes install{from{opacity:.1;transform:translateY(-65px)}to{opacity:1;transform:translateY(0)}}.sheep-cross{animation:cross 3.5s ease-in-out forwards}@keyframes cross{from{transform:translate(165px,202px)}to{transform:translate(760px,202px)}}body.reduced *{animation:none!important;transition:none!important}body.reduced .sheep-cross{transform:translate(760px,202px)}[hidden]{display:none!important}#result{border:2px solid #b5c9ac}#resultTitle{color:#236358}
@media(max-width:620px){main{padding:22px 13px}.tools{float:none;margin-top:16px}.tools button{padding:7px 11px;font-size:12px}h1{letter-spacing:-1px}h1 span{margin-left:5px}.panel{padding:18px;border-radius:15px}.landscape{padding:0}.status{font-size:12px;padding:13px;gap:6px}#choices{grid-template-columns:repeat(6,1fr);gap:6px}#choices button{padding:10px 0}.scene-heading{font-size:11px;padding:13px}h2{font-size:21px}.row .primary{width:100%}#tiles{gap:3px;padding:9px}#equation{font-size:19px}#dimensions{margin:0}#progress{gap:4px}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;transition-duration:.001ms!important}}
.board-scroll{overflow:auto}table{width:100%;border-collapse:collapse;font-size:14px;white-space:nowrap}th,td{text-align:left;border-bottom:1px solid #e0e4d6;padding:12px 9px}th{font-size:12px;color:#657b70}.new-part{transform-box:fill-box;transform-origin:center}.new-part[data-kind="grow"]{animation:grow 1.1s ease-out both}.new-part[data-kind="draw"] path{stroke-dasharray:1000;stroke-dashoffset:1000;animation:draw 1.1s ease-out forwards}.new-part[data-kind="slide"]{animation:slide 1.1s ease-out both}.new-part[data-kind="turn"]{animation:turn 1.1s ease-out both}@keyframes grow{from{transform:scaleY(.05);opacity:0}to{transform:scaleY(1);opacity:1}}@keyframes draw{to{stroke-dashoffset:0}}@keyframes slide{from{transform:translateX(-100px);opacity:0}to{transform:translateX(0);opacity:1}}@keyframes turn{from{transform:rotate(-180deg);opacity:0}to{transform:rotate(0);opacity:1}}
.stock-wrap{padding:10px 20px 15px;background:#f1efdf}.stock-wrap>span{font-size:12px;color:#697b69}#stock{display:flex;gap:4px;flex-wrap:wrap;margin-top:8px;max-width:620px}#stock i{width:13px;height:10px;background:#c3944e;border-radius:2px;border:1px solid #a87f44}#tiles{overflow:visible;max-height:none;grid-auto-rows:22px;justify-content:start}#tiles i{aspect-ratio:auto;height:22px;max-width:65px}#tiles{grid-template-columns:repeat(var(--cols,1),minmax(0,65px))!important}

#tiles{grid-auto-rows:var(--tile-height,22px);gap:2px}#tiles i{height:var(--tile-height,22px)}

#scene{max-height:300px}

@keyframes cross{0%{transform:translate(165px,202px)}10%{transform:translate(230px,190px)}90%{transform:translate(660px,190px)}100%{transform:translate(760px,202px)}}
