.farm-area{border-top:3px solid #3b291c;padding-top:44px}.farm-tools{display:flex;gap:10px;flex-wrap:wrap}.farm-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:26px;align-items:start}.farm-list{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(100%,400px),1fr))}#catList{grid-template-columns:repeat(auto-fit,minmax(min(100%,520px),1fr))}.farm-list>.farm-empty{grid-column:1/-1}
.farm-card{background:#3d2c20;border:1px solid #8d7044;outline:1px solid #2a1f16;border-radius:3px;padding:14px;display:grid;gap:12px}.farm-card-head{display:flex;gap:10px;align-items:flex-end}.farm-card-head .field{flex:1}
.farm-remove{background:#2b2018;border:1px solid #8d7044;color:#f1d8aa;border-radius:2px;height:41px;width:41px;font-size:18px;line-height:1;flex:none}.farm-remove:hover{background:#7a3a26}
.farm-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.farm-fields.two{grid-template-columns:repeat(2,minmax(0,1fr))}.building-example{position:relative;max-width:520px}.building-example img{display:block;width:100%;height:auto}.farm-fields.stats{grid-template-columns:repeat(5,minmax(0,1fr))}
.farm-card input[type=text],.farm-card input[type=number],.farm-card select{width:100%;height:41px;padding:0 10px;border:1px solid #ad8958;background:#32271f;border-radius:2px;color:#ffe2a6;font:600 16px var(--font);box-shadow:inset 0 2px 5px #0006;font-variant-numeric:tabular-nums}.farm-card input:focus{border-color:#ffd477}
.farm-card .field>span{font-size:10px}.farm-hint{font-size:12px;color:#d4ba94;margin:0}.farm-hint b{color:var(--gold)}
.traits{display:grid;gap:8px}.trait-row{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr) 36px;gap:8px}.trait-row .farm-remove{height:41px;width:36px;font-size:15px}
.farm-empty{margin:0;font-size:14px;color:#c2a882}

@media(max-width:700px){.farm-fields.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.farm-fields{grid-template-columns:1fr 1fr}.trait-row{grid-template-columns:1fr 36px}.trait-row input:nth-child(2){grid-column:1}}

.cat-example{position:relative;max-width:760px}.cat-example img{display:block;width:100%;height:auto}
#catList{grid-template-columns:repeat(auto-fit,minmax(min(100%,640px),1fr))}
.game-window{--g-line:#3a2a1c;background:repeating-linear-gradient(0deg,#5b412b 0,#5b412b 33px,#3d2b1d 34px,#69492f 36px);border:2px solid #17120e;outline:1px solid #6f5435;color:#e6d2ab;font:13px/1.3 var(--font);box-shadow:0 6px 0 #0006;min-width:0}
.g-head{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;background:#1e2022;border-bottom:2px solid #17120e}.g-head h4{margin:0;font:19px var(--heading);color:#f3e1bd}
.g-close{background:#1e2022;color:#f3e1bd;border:1px solid #c9b79a;border-radius:2px;width:34px;height:28px;font-size:17px;line-height:1;padding:0}.g-close:hover{background:#7a3a26}
.g-body{padding:16px 18px 18px;display:grid;gap:14px}
.game-window input{background:transparent;border:0;border-bottom:1px dashed transparent;border-radius:0;color:inherit;font:inherit;padding:1px 2px;margin:0;outline:0;min-width:0;appearance:textfield;-moz-appearance:textfield}.game-window input::-webkit-outer-spin-button,.game-window input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.game-window input:hover{border-bottom-color:#a0825a}.game-window input:focus{border-bottom:1px solid var(--gold);background:#ffffff12}.game-window input::placeholder{color:#ffffff40;font-weight:600}
.g-title{display:flex;align-items:baseline;justify-content:space-between;gap:14px}.g-name{font:700 24px var(--heading)!important;color:#f6e7c7}.g-id{text-align:right;color:#c6b08a;font-size:13px}
.g-top{display:grid;grid-template-columns:128px minmax(0,1fr);gap:16px;align-items:start}.g-portrait{background:#1e2022;border:1px solid #17120e;aspect-ratio:1;display:flex;align-items:center;justify-content:center}.g-portrait img{width:96px;height:96px;image-rendering:pixelated}
.g-info{min-width:0}.g-badges{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}
.g-badge{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border:1px solid #17120e;font:700 11px var(--font);letter-spacing:.5px;text-transform:uppercase;white-space:nowrap}.g-badge.dark{background:#1e2022;color:#f3e1bd}.g-badge.tan{background:#8a6a52;color:#f9e9cf}
.g-badge.r-common{background:#8e9d9d;color:#1d2425}.g-badge.r-uncommon{background:#77a050;color:#14200c}.g-badge.r-rare{background:#4f86c4;color:#0e1a2a}.g-badge.r-epic{background:#8f6bc4;color:#1a1028}.g-badge.r-legendary{background:#d9a53b;color:#2a1c05}
.g-badge input{font-weight:700;letter-spacing:.5px}.g-badge input.up{text-transform:uppercase}.g-badge input.lv{width:3ch;text-align:center}
.g-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:5px 0;border-bottom:1px solid var(--g-line);box-shadow:0 1px #7a5b3a66;color:#e0cba6}
.g-val{display:inline-flex;align-items:center;gap:3px;font-weight:700;color:#f6e7c7;justify-content:flex-end;white-space:nowrap}.g-val input{text-align:right;font-weight:700}.g-val input.n{width:6ch}.g-val input.n.w{width:7ch}
.g-bars{display:grid;gap:3px}.g-bar{display:grid;grid-template-columns:96px minmax(0,1fr) 56px;gap:8px;align-items:center;color:#e0cba6;font-size:12px}.g-track{position:relative;height:12px;background:#17181a;border:1px solid #101112}.g-track i{display:block;height:100%;background:#7da353}
.g-none{margin:0;color:#e0cba6}.g-traits,.g-res{display:grid;gap:2px}
.g-res .g-label{font-weight:400;color:#e0cba6;width:100%;flex:1}.res-row{padding:4px 0}.res-row .g-val{flex:none}
.trait-row{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr) 26px;gap:8px;align-items:center}.trait-row input{font-weight:700}
.g-x{background:none;border:0;color:#a88d68;font-size:12px;padding:2px 4px;line-height:1}.g-x:hover{color:#ff9d7d}.g-row .g-x{opacity:0}.g-row:hover .g-x,.g-row:focus-within .g-x{opacity:1}
.g-add{justify-self:start;background:none;border:1px dashed #8d7044;color:#d5b98b;font:700 11px var(--font);padding:3px 9px;margin-top:4px;border-radius:2px}.g-add:hover{background:#ffffff12}
@media(max-width:700px){.g-top{grid-template-columns:1fr}.g-portrait{max-width:128px}.g-bar{grid-template-columns:80px minmax(0,1fr) 52px}.g-title{flex-wrap:wrap}}
.trait-head{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr) 26px;gap:8px;font:800 10px var(--font);letter-spacing:.8px;color:#c6b08a}
.trait-parse{grid-column:1/-1;font-size:11px;color:#c6b08a;margin:-2px 0 4px}.trait-parse:empty{display:none}
