/* Keep the design canvas intact; fit() scales it as one object on narrow screens. */
#game{flex-shrink:0}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{display:flex;align-items:center;justify-content:center;background:#deded8;color:#292c2a;font-family:system-ui,"Microsoft YaHei",sans-serif}button{font:inherit;color:inherit;min-height:44px;border:1px solid #92968d;border-radius:6px;background:#fffdf5;padding:8px 12px;cursor:pointer;touch-action:manipulation}button:hover{background:#e4eadb}button:active{transform:translateY(1px)}button:focus-visible{outline:3px solid #567261;outline-offset:2px}button:disabled{cursor:default;opacity:.45}button.unavailable{color:#888;background:#e7e7df}#game{width:390px;height:844px;background:#f3f0e7;position:relative;overflow:hidden;transform-origin:center}#prototype-label{height:28px;font-size:12px;text-align:center;line-height:28px;background:#e2dbbf}#screen{height:816px;position:relative}.page{height:100%;padding:24px;display:flex;flex-direction:column;gap:14px}.page h1{font-size:34px;line-height:1.4;margin:15px 0}.page h2{margin:5px 0;font-size:23px}.page p{line-height:1.7;margin:0;color:#555f58}.page .space{flex:1}.page .muted{font-size:13px;color:#686e67}.row{display:flex;gap:9px;align-items:center}.row>*{flex:1}.map-item{display:flex;align-items:center;justify-content:space-between;text-align:left;min-height:64px}.map-item small{font-size:12px;margin-left:10px}.game-header{height:88px;padding:8px 15px;display:flex;flex-direction:column;gap:7px}.game-header .row{gap:6px}.game-header strong{font-size:17px;flex:3}.game-header button{padding:4px 9px;min-height:36px;font-size:14px}.stats{font-size:13px;display:flex;justify-content:space-between}#scene{width:390px;height:556px;display:block;touch-action:none;background:#e8ece6}#scene:focus-visible{outline:3px solid #567261;outline-offset:-3px}.hint{height:46px;padding:8px 15px;font-size:12px;line-height:1.4;color:#4b5d50;background:#e3e9df;display:flex;align-items:center}.controls{height:126px;padding:12px 15px;display:flex;align-items:center;gap:9px;justify-content:space-between;background:#f3f0e7;border-top:1px solid #b6beb0}.controls button{font-size:14px;min-width:72px}.controls #season{height:90px;width:112px;border-radius:50%;border:2px solid #526b59;touch-action:none}.controls small{display:block;font-size:11px;margin-top:4px}.canvas-note{font-size:12px;margin-top:3px}.modal-backdrop{position:absolute;inset:28px 0 0;background:#1d282666;display:flex;align-items:center;justify-content:center;z-index:5;padding:22px}.modal{background:#fffdf5;width:100%;max-height:710px;overflow:auto;border:1px solid #7b8579;border-radius:8px;padding:22px;display:flex;flex-direction:column;gap:12px}.modal h2{font-size:22px;margin:0 0 5px}.modal p{font-size:14px;line-height:1.65;margin:0}.modal button{width:100%}.modal .row button{width:auto}.ledger{list-style:none;padding:0;margin:4px 0;border-left:2px solid #8a9d7d}.ledger li{font-size:13px;line-height:1.6;padding:5px 0 5px 14px}.toggle{display:flex;align-items:center;justify-content:space-between}.poem-card{border:1px solid #bbc1b5;padding:15px;font-family:serif;font-size:17px;line-height:1.7}#toast{position:absolute;bottom:155px;left:24px;right:24px;background:#25382eed;color:#fff;padding:12px 14px;border-radius:6px;font-size:14px;line-height:1.5;opacity:0;pointer-events:none;transition:opacity .15s;z-index:8}#toast.visible{opacity:1}.home-sketch{height:185px;display:flex;align-items:center;justify-content:center;border:1px dashed #879182;color:#626e62;font-family:serif;font-size:23px;line-height:2;text-align:center}.scroll-note{font-size:12px;text-align:center;color:#657260}.busy{pointer-events:none;opacity:.5}a{color:#355941}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
/* Representative art uses measured raster components; the other pages keep their explicit prototype presentation. */
.representative-art{font-family:KaiTi,"STKaiti","Microsoft YaHei",serif;color:#344d3b}
.representative-art .game-header,.representative-art .controls,.representative-art .hint{position:relative;background:#f7f2e7;border:0}
.representative-art .art-backplate{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:0}
.representative-art .game-header .row,.representative-art .stats,.representative-art .hint-text,.representative-art .controls>button{position:relative;z-index:1}
.representative-art .game-header{padding:5px 15px 8px}
.representative-art .game-header .row{height:46px;align-items:center}
.representative-art .game-header strong{font-size:19px;line-height:1.2;flex:1 1 auto;white-space:nowrap}
.representative-art .game-header #look-player{background:transparent;border:0;border-bottom:1px solid #87937e;border-radius:0;font-family:inherit;flex:0 0 58px;font-size:12px;padding:2px;min-height:32px}
.representative-art #pause{flex:0 0 44px;padding:2px;min-width:44px;min-height:44px}
.representative-art .stats{font-size:12px;line-height:20px;color:#53634d}
.representative-art #scene{background:#f7f2e7}
.representative-art .hint{padding:7px 20px;font-size:13px;line-height:1.35}
.representative-art .hint-text{display:block;width:100%;text-align:center}
.representative-art .controls{padding:11px 16px;gap:10px;align-items:center;justify-content:space-between}
.representative-art .art-control{position:relative;flex:none;display:flex;align-items:center;justify-content:center;background:transparent;border:0;border-radius:0;padding:0;color:#41533a;font-family:inherit;box-shadow:none}
.representative-art .art-control:hover{background:transparent;filter:brightness(1.03)}
.representative-art .art-control:disabled{filter:grayscale(.75);opacity:.45}
.representative-art .art-image{display:block;pointer-events:none;flex:none}
.representative-art .art-gourd{width:94px;height:92px;justify-content:flex-start}
.representative-art .gourd-count{font-family:serif;font-size:18px;line-height:1;position:absolute;right:2px;top:35px;color:#68582e;font-variant-numeric:tabular-nums}
.representative-art .controls #season{width:112px;height:100px;min-width:112px;min-height:100px;border:0;border-radius:0;touch-action:none}
.representative-art .dial-pointer{position:absolute;inset:0;width:112px;height:100px;pointer-events:none;transform-origin:56px 50px}
.representative-art .art-dial.is-preview{filter:drop-shadow(0 0 3px #a78b4f)}
.representative-art .art-rewind{width:84px;height:92px;flex-direction:column;gap:0}
.representative-art .control-label{font-size:14px;line-height:20px;margin-top:-3px;color:#536348}
#prototype-label{letter-spacing:.3px}
/* Header text sits inside the measured paper core, beyond its left bamboo ornament. */
.representative-art .game-header{padding:11px 17px 10px 80px;gap:1px}
.representative-art .game-header .row{height:40px;min-height:40px;flex-shrink:0;gap:5px}
.representative-art .game-header strong{font-size:18px;line-height:22px;min-width:0}
.representative-art .game-header #look-player{flex:0 0 44px;min-width:44px;min-height:44px;width:44px;height:44px;padding:0;border:0;background:transparent;border-radius:0}
.representative-art .game-header #pause{flex:0 0 44px;width:44px;height:44px;padding:0}
.representative-art .game-header .stats{height:17px;min-height:17px;line-height:17px;font-size:11px;gap:8px;white-space:nowrap}
.representative-art .control-symbol{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:inherit;font-size:15px;line-height:1;color:#42543b;pointer-events:none}
/* Bubble and text share one measured-ratio container below the playable floor. */
.representative-art .hint{height:46px;min-height:46px;padding:0;background:transparent;z-index:3;pointer-events:none}
.representative-art .hint-bubble{position:absolute;left:50%;top:-44px;width:180px;height:90px;transform:translateX(-50%);pointer-events:none}
.representative-art .hint-bubble .hint-text{position:absolute;left:28px;top:7px;width:124px;height:58px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:13px;line-height:18px;white-space:normal;overflow-wrap:anywhere;color:#4b5d43}
/* All three controls stay inside the shelf's measured visible paper body. */
.representative-art .controls{padding-left:48px;padding-right:48px;gap:10px}
.representative-art .art-gourd{width:80px}
.representative-art .gourd-count{font-size:17px;right:2px}
.representative-art .art-rewind{width:72px}
