#modal.garden-mode{width:min(1020px,96vw);max-height:94vh;padding:24px;background:#faf7ec}#modal.garden-mode .dialog-head{padding-bottom:4px}.g-intro{font-size:16px;color:#76816b;margin:5px 0 15px}.g-toolbar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}.g-toolbar button,.g-view button,.g-tabs button,.g-bottom button{background:#ececdd;padding:9px 13px;border-radius:12px;font-size:15px}.g-toolbar button:disabled{opacity:.4;cursor:default}.g-toolbar .chosen,.g-tabs .chosen{background:#6f895f;color:#fff}.g-canvas-wrap{position:relative;border-radius:24px;overflow:hidden;border:3px solid #fffdf5;box-shadow:0 6px 20px #62704d12}#g-canvas{width:100%;height:auto;display:block;touch-action:pan-y;cursor:crosshair}.g-view{position:absolute;top:12px;right:12px;display:flex;gap:7px}.g-view button{background:#fff9e8e8;font-size:13px;box-shadow:0 3px 9px #5c70441a}.g-selected{padding:12px 2px;color:#5d7550;font-size:15px;min-height:48px}.g-tabs{display:flex;gap:8px;padding-top:5px;border-top:1px solid #e4e3d2}.g-palette{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-top:13px}.g-item{border:2px solid transparent;background:#f0eddf;border-radius:15px;padding:12px 5px;font-size:14px;display:flex;flex-direction:column;align-items:center;gap:5px}.g-item span{font-size:28px;line-height:1.4}.g-item:hover{background:#e8eddb}.g-item.chosen{border-color:#8ba076;background:#e4ecd7}.g-status{font-size:14px;color:#6d7d61;padding:10px 0;min-height:44px}.g-bottom{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid #e1e1d1;padding-top:12px;font-size:12px;color:#818575}.g-bottom button{font-size:13px;white-space:nowrap}.g-access{font-size:13px;color:#7a816c;margin:6px 0 14px}.g-cells{display:grid;grid-template-columns:repeat(8,1fr);gap:4px;margin-top:10px}.g-cells button{background:#e4ead7;border-radius:6px;min-height:40px;font-size:19px}.g-cells button:focus{outline:3px solid #9e7e56}@media(max-width:700px){#modal.garden-mode{padding:16px;width:97vw;max-height:94dvh}.garden-mode h2{font-size:23px}.g-intro{font-size:14px}.g-toolbar{gap:5px}.g-toolbar button{font-size:13px;padding:9px}.g-canvas-wrap{border-radius:17px}#g-canvas{aspect-ratio:880/600;background:#e5ebd8}.g-palette{grid-template-columns:repeat(3,1fr);gap:7px}.g-item{padding:9px 4px}.g-view{top:8px;right:8px}.g-view button{font-size:12px;padding:6px 9px}.g-tabs button{font-size:13px;padding:9px 11px}.g-bottom{align-items:start}.g-selected{font-size:14px}}

/* Garden chapter 2: a lived-in courtyard */
#modal.garden-mode{width:min(1180px,97vw);padding:24px;max-height:95dvh}.garden-mode .g-heading{display:flex;align-items:center;justify-content:space-between;margin:0 0 15px;gap:12px}.garden-mode .g-intro{font-family:'STSong','SimSun',serif;font-size:22px;margin:0;letter-spacing:1px;color:#536b4c}.garden-mode #g-count{font-size:12px;color:#879277}.garden-mode .g-savebadge{font-size:12px;white-space:nowrap;background:#e8eedc;border:1px solid #dbe4cc;border-radius:20px;padding:7px 12px;color:#677c58}.garden-mode .g-pet-note{display:flex;align-items:center;gap:15px;background:#f3eadd;border:1px solid #e7ddc9;border-radius:15px;margin-bottom:12px;padding:10px 15px}.garden-mode .g-pet-note>span{font-size:13px;white-space:nowrap;color:#9b8063}.garden-mode .g-pet-note p{font-size:14px;color:#6b765d;flex:1;margin:0}.garden-mode .g-pet-note button{font-size:12px;padding:8px 12px;background:#fff9eb;border-radius:10px;white-space:nowrap;min-height:40px}.garden-mode .g-canvas-wrap{border:1px solid #e1e6d1;border-radius:24px;background:#e5edde;box-shadow:0 8px 25px #6274490a}.garden-mode #g-canvas{display:block;width:100%;height:auto;aspect-ratio:1000/720;touch-action:none;cursor:grab}.garden-mode #g-canvas:active{cursor:grabbing}.garden-mode .g-camera{position:absolute;bottom:16px;right:16px;display:flex;align-items:center;gap:4px;padding:5px;border-radius:15px;background:#fffcf0ef;border:1px solid #dedfca;box-shadow:0 3px 10px #4c633719}.garden-mode .g-camera button{padding:6px 10px;border-radius:10px;background:#edf0e0;font-size:15px;min-width:36px;min-height:36px}.garden-mode #g-zoom{font-size:12px;min-width:40px;text-align:center;color:#738364}.garden-mode .g-camera #g-center{font-size:12px}.garden-mode .g-pan{position:absolute;bottom:16px;left:16px;background:#fffbeded;border:1px solid #e0e2ce;border-radius:14px;display:flex;padding:4px;gap:3px}.garden-mode .g-pan button{min-width:34px;min-height:36px;border-radius:9px;background:#eef0e0;font-size:17px}.garden-mode .g-toolbar{margin:16px 0 0;padding:0;display:flex;gap:7px}.garden-mode .g-toolbar button{min-height:43px;border:1px solid #e2e3d2;background:#f2f0e4;border-radius:12px;padding:9px 13px}.garden-mode .g-toolbar button.chosen{background:#718960;border-color:#718960;color:#fff}.garden-mode .g-selected{font-size:13px;color:#7c886c;min-height:42px;padding:10px 3px}.garden-mode .g-tabs{padding-top:15px;gap:7px;flex-wrap:wrap}.garden-mode .g-tabs button{min-height:43px;font-size:14px}.garden-mode .g-palette{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:10px}.garden-mode .g-item{min-height:100px;font-size:13px;padding:12px 4px;border:1px solid #e2e5d3;border-radius:16px;background:#f1f1e5;box-shadow:0 3px 0 #e2e4d533}.garden-mode .g-item span{font-size:28px}.garden-mode .g-item.chosen{border:2px solid #8b9f76;background:#e6eddb}.garden-mode .g-item.g-set{grid-column:span 2;min-height:135px;padding:15px 10px}.garden-mode .g-set b{font-size:15px;font-weight:500}.garden-mode .g-set small{font-size:11px;color:#7a866b;line-height:1.6;max-width:170px}.garden-mode .g-status{font-size:13px;min-height:43px}.garden-mode .g-cells{grid-template-columns:repeat(10,minmax(0,1fr))}.garden-mode .g-cells button{min-width:0;min-height:40px}.garden-mode .g-bottom{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.garden-mode .g-bottom>div{display:flex;gap:7px;flex-wrap:wrap}.garden-mode .g-bottom button{font-size:12px;border:1px solid #e0e3ce;min-height:40px}.garden-mode #g-file[hidden]{display:none}
@media(min-width:1100px){.garden-mode .g-canvas-wrap{max-height:65vh;max-width:min(100%,calc(65vh * 1000 / 720));margin:0 auto}.garden-mode .g-toolbar{justify-content:center}.garden-mode .g-selected{text-align:center}}
@media(max-width:700px){#modal.garden-mode{padding:16px 12px;width:98vw}.garden-mode .dialog-head{margin-bottom:13px}.garden-mode .g-heading{align-items:start;margin-bottom:12px}.garden-mode .g-intro{font-size:17px;letter-spacing:0}.garden-mode .g-savebadge{font-size:10px;padding:5px 8px}.garden-mode #g-count{font-size:10px}.garden-mode .g-pet-note{padding:10px;gap:7px;flex-wrap:wrap}.garden-mode .g-pet-note>span{font-size:11px}.garden-mode .g-pet-note p{font-size:12px;flex-basis:65%;order:3}.garden-mode .g-pet-note button{font-size:11px;margin-left:auto;min-height:34px}.garden-mode .g-canvas-wrap{border-radius:18px}.garden-mode .g-view{top:7px;right:7px}.garden-mode .g-view button{min-height:32px;font-size:11px;padding:5px 9px}.garden-mode .g-camera{right:7px;bottom:7px;gap:2px;padding:3px;border-radius:12px}.garden-mode .g-camera button{min-width:30px;min-height:34px;padding:4px 7px}.garden-mode #g-zoom{font-size:10px;min-width:32px}.garden-mode .g-pan{left:7px;bottom:7px;gap:1px;padding:3px;border-radius:12px}.garden-mode .g-pan button{min-width:28px;min-height:34px;font-size:14px}.garden-mode .g-toolbar{gap:5px;justify-content:start;flex-wrap:wrap;margin-top:12px}.garden-mode .g-toolbar button{font-size:12px;padding:7px 10px;min-height:40px}.garden-mode .g-selected{text-align:left;font-size:12px}.garden-mode .g-tabs{gap:5px;padding-top:12px}.garden-mode .g-tabs button{font-size:12px;padding:8px 10px}.garden-mode .g-palette{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.garden-mode .g-item{font-size:11px;min-height:88px;padding:9px 3px;border-radius:13px}.garden-mode .g-item span{font-size:25px}.garden-mode .g-item.g-set{grid-column:span 2;min-height:130px}.garden-mode .g-set small{font-size:10px}.garden-mode .g-status{font-size:12px}.garden-mode .g-bottom{font-size:11px}.garden-mode .g-bottom button{font-size:11px}.garden-mode .g-cells{gap:3px}.garden-mode .g-cells button{font-size:15px;min-height:32px}}

/* Large garden navigation and editing */
.garden-mode .g-minimap{position:absolute;top:52px;right:13px;width:150px;height:auto;border:1px solid #d9dfc8;border-radius:12px;background:#fffbedec;box-shadow:0 4px 14px #536a4217;cursor:crosshair}.garden-mode .g-toolbar{justify-content:flex-start;flex-wrap:wrap;padding:12px;background:#f2f2e7;border:1px solid #e4e6d6;border-radius:16px;gap:6px}.garden-mode .g-toolbar button{background:#fffdf4;border-color:#e0e4ce;font-size:12px;min-height:40px;padding:8px 12px}.garden-mode .g-toolbar button.chosen{background:#718960;color:#fff}.garden-mode .g-schemes{background:#f1eee1;border:1px solid #e3dfcc;border-radius:17px;padding:16px;margin:18px 0}.garden-mode .g-schemes>label{font-family:'STSong','SimSun',serif;font-size:19px;letter-spacing:1px}.garden-mode .g-schemes>div:first-of-type{display:flex;align-items:center;gap:10px;margin-top:6px}.garden-mode #g-scheme-name{flex:1;width:auto;min-width:0;font-size:15px}.garden-mode .g-schemes button{min-height:40px;background:#e1e8d3;color:#536b46;font-size:13px;border-radius:10px;padding:8px 13px;white-space:nowrap}.garden-mode .g-scheme-row{display:flex;align-items:center;gap:8px;border-top:1px solid #e2e0d0;margin-top:7px;padding-top:9px}.garden-mode .g-scheme-row span{flex:1;font-size:14px;overflow-wrap:anywhere}.garden-mode #g-scheme-list p{font-size:12px;color:#7e886e;margin:8px 0}.garden-mode .g-camera{flex-wrap:wrap;max-width:285px}.garden-mode .g-access{overflow-x:auto;max-width:100%}.garden-mode .g-cells{grid-template-columns:repeat(24,minmax(36px,1fr));min-width:940px}.garden-mode .g-access summary{position:sticky;left:0}.garden-mode #g-brushsize{border-style:dashed}.garden-mode .g-item.g-set{grid-column:span 2}
@media(max-width:700px){.garden-mode .g-minimap{width:100px;right:7px;top:43px;border-radius:9px}.garden-mode .g-toolbar{padding:8px;gap:5px}.garden-mode .g-toolbar button{font-size:11px;padding:7px 9px;min-height:38px}.garden-mode .g-schemes{padding:12px}.garden-mode .g-schemes>label{font-size:17px}.garden-mode .g-schemes button{font-size:11px;padding:7px 9px}.garden-mode .g-camera{max-width:230px;gap:2px}.garden-mode .g-camera button{font-size:11px;min-width:27px;padding:5px}.garden-mode .g-pan{bottom:53px;left:7px}.garden-mode .g-scheme-row span{font-size:12px}}

