*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{font-family:"Microsoft YaHei","PingFang SC",sans-serif;background:#e6ddcc}#mount{position:relative;width:100vw;height:100dvh}.public-game-shell{color:#514432}.game-background{background:#ede3ce;background-image:repeating-linear-gradient(0deg,#b5a07b08 0 1px,transparent 1px 4px),repeating-linear-gradient(90deg,#b5a07b08 0 1px,transparent 1px 4px)}.shop{height:100%;padding:16px 28px 10px;display:flex;flex-direction:column;gap:18px}.order{height:136px;flex-shrink:0;border:3px solid #d1c2a7;border-radius:26px;background:#fbf7ed;box-shadow:0 5px 0 #cbbda647;display:flex;align-items:center;padding:16px 24px;gap:24px}.order-caption{width:205px;flex-shrink:0;display:flex;flex-direction:column;gap:8px}.order-caption span{font-size:22px;color:#79694f;letter-spacing:2px}.order-caption strong{font-size:25px;color:#4c432e;white-space:nowrap}.digits{display:flex;flex:1;gap:12px;justify-content:center;align-items:center}.digit{position:relative;width:76px;height:82px;border:2px solid #e1d5bf;border-radius:16px;background:#eee5d4;display:grid;place-items:center;font:700 48px/1 Arial;color:#6b604f;box-shadow:0 3px 0 #cfbea4}.digit.active{background:#527558;color:#fff;border:4px solid #2f5339;box-shadow:0 4px 0 #344d37;transform:translateY(-5px)}.target-mark{position:absolute;bottom:-21px;left:50%;transform:translateX(-50%);font:700 16px/1.4 "Microsoft YaHei";background:#2f5339;color:white;padding:0 10px;border-radius:8px;white-space:nowrap}.panels{display:grid;grid-template-columns:1.35fr 1fr;gap:24px;flex:1;min-height:0}.panel{border-radius:28px;padding:18px 18px 20px;border:3px solid #d2c2a4;display:flex;flex-direction:column;background:#f5ecda;box-shadow:0 5px 0 #b8a78940;position:relative}.panel:after{content:"";position:absolute;inset:7px;border:1px dashed #ad987654;border-radius:21px;pointer-events:none}.reference{background:#dde6d2;border-color:#b6c3a5}.panel header{display:flex;align-items:center;justify-content:space-between;padding:0 6px 16px;height:56px;flex-shrink:0}.panel h1,.panel h2{font-size:29px;margin:0;font-weight:700;color:#57472f}.panel p{font-size:20px;margin:0;color:#71624c}.reference h2{color:#3f593d}.reference p{color:#52694a}.grid{display:flex;flex-wrap:wrap;align-content:center;justify-content:center;gap:14px;flex:1;min-height:0}.tile,.ref-tile{position:relative;background:#fcf9f0;border:2px solid #d3c8b2;border-radius:20px;overflow:hidden;height:128px;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 0 #bbab9038}.tile{width:calc((100% - 28px)/3);padding:4px;cursor:pointer;touch-action:manipulation}.tile:hover{border-color:#9c8965;background:#fffaf0}.tile:active{transform:translateY(3px);box-shadow:none}.tile:focus-visible{outline:5px solid #476a49;outline-offset:2px}.product{display:block;width:100%;height:100%;mix-blend-mode:multiply;pointer-events:none}.ref-tile{width:calc((100% - 28px)/3);padding:28px 4px 2px;border-color:#c1cbb4;box-shadow:0 4px 0 #9bac8a33}.ref-tile b{position:absolute;top:4px;left:8px;color:#3d5938;font:700 29px/1 Arial;z-index:1}.count-4{max-width:100%;padding:0 50px}.count-4 .tile{width:calc((100% - 20px)/2);height:160px}.count-4 .ref-tile{width:calc((100% - 20px)/2);height:160px}.hint{font-size:21px;line-height:30px;text-align:center;margin:0;color:#70634f;min-height:30px}.hint.reminder{color:#34553a;font-weight:700}.grid.count-5,.grid.count-6{align-content:center}.grid.count-5 .tile,.grid.count-6 .tile,.grid.count-5 .ref-tile,.grid.count-6 .ref-tile{height:152px}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* Keep targets and illustrations the same size across difficulty levels. */
.count-4{padding:0;display:grid;grid-template-columns:repeat(2,205px);grid-template-rows:repeat(2,128px);align-content:center;justify-content:center}
.reference .count-4{grid-template-columns:repeat(2,146px)}
.count-4 .tile,.count-4 .ref-tile{width:100%;height:128px}
.grid.count-5 .tile,.grid.count-6 .tile,.grid.count-5 .ref-tile,.grid.count-6 .ref-tile{height:128px}


/* 2026-09-17: centered order, concise copy and transparent product sheets. */
.shop{padding-bottom:24px}
.order{height:128px;display:flex;flex-direction:column;justify-content:center;gap:10px;padding:10px 24px}
.order-caption{display:block;width:100%;text-align:center;font-size:23px;line-height:28px;color:#4c432e}
.order-caption.reminder{color:#34553a}
.digits{width:100%;flex:0;gap:12px}
.digit{height:66px;font-size:43px}
.panel header{height:44px;padding-bottom:8px}
.grid,.grid.count-4,.grid.count-5,.grid.count-6{align-content:start;padding-top:20px}
.product{mix-blend-mode:normal}


.order{position:relative}
.shop-icon{position:absolute;left:20px;top:24px;width:80px;height:80px;object-fit:contain;border-radius:18px}
