:root{--panel: #c6c6c6;--panel-light: #ffffff;--panel-dark: #555555;--slot: #8b8b8b;--slot-dark: #373737;--slot-light: #ffffff;--text: #262626;--text-muted: #4a4a4a;--text-on-dark: #ffffff;--accent: #5b8c32;--accent-dark: #3b5e1f;--focus: #ffd83d;--radius: 2px;--tile: 92px;--font: "Trebuchet MS", "Segoe UI", system-ui, -apple-system, sans-serif;color-scheme:light}*{box-sizing:border-box}html,body{margin:0;height:100%}body{font-family:var(--font);font-size:16px;color:var(--text);background-color:#3b2a1e;background-image:linear-gradient(#0000008c,#0000008c),var(--tex-dirt);background-size:auto,64px 64px;image-rendering:pixelated;overflow:hidden}.app{display:flex;flex-direction:column;height:100vh}img{image-rendering:pixelated}button{font:inherit;color:inherit;cursor:pointer}:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.ui-icon{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}.topbar{display:flex;align-items:center;gap:8px;padding:10px;background-image:linear-gradient(#00000026,#00000059),var(--tex-planks);background-size:auto,64px 64px;border-bottom:4px solid #2b1d12;position:relative;z-index:2}.icon-btn{flex:none;width:48px;height:48px;display:grid;place-items:center;color:var(--text-on-dark);background:#6f6f6f;border:3px solid;border-color:#aaaaaa #2e2e2e #2e2e2e #aaaaaa;border-radius:var(--radius);transition:transform 80ms ease,background-color .12s ease}.icon-btn:hover:not(:disabled){background:#7d8fbf}.icon-btn:active:not(:disabled){transform:translateY(1px)}.icon-btn:disabled{opacity:.45;cursor:default}.search-box{flex:1;min-width:0;display:flex;align-items:center;gap:6px;height:48px;padding:0 8px 0 10px;background:#000;color:#e0e0e0;border:3px solid #a0a0a0;border-radius:var(--radius)}.search-box:focus-within{border-color:var(--focus)}#search{flex:1;min-width:0;height:100%;border:0;outline:0;background:transparent;color:#fff;font:inherit;font-size:19px;font-weight:700}#search::placeholder{color:#9a9a9a}#search::-webkit-search-cancel-button{display:none}.clear-btn{width:32px;height:32px;display:grid;place-items:center;background:none;border:0;color:#bdbdbd;padding:0}#search:placeholder-shown+.clear-btn{visibility:hidden}main{flex:1;overflow-y:auto;padding:12px 10px 64px;scroll-behavior:smooth}main:focus{outline:none}.view{background:var(--panel);border:4px solid;border-color:var(--panel-light) var(--panel-dark) var(--panel-dark) var(--panel-light);box-shadow:0 0 0 3px #000;border-radius:3px;padding:14px 12px 16px;animation:view-in .16s ease-out}@keyframes view-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.view,.tile,.category,.icon-btn{animation:none;transition:none}}h1,h2{margin:0 0 10px;line-height:1.15}h1{font-size:24px}h2{font-size:18px;margin-top:14px}.muted{color:var(--text-muted)}.title,.list-title{display:flex;align-items:center;gap:10px}.title-icon{width:40px;height:40px}.count-label{font-size:16px;font-weight:400}.footer{margin:18px 0 0;font-size:13px;color:var(--text-muted);text-align:center}.category-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px}.category{display:flex;align-items:center;gap:10px;min-height:64px;padding:8px 10px;text-align:left;font-size:18px;font-weight:700;color:var(--text-on-dark);text-shadow:2px 2px 0 #3f3f3f;background:#6f6f6f;border:3px solid;border-color:#aaaaaa #2e2e2e #2e2e2e #aaaaaa;border-radius:var(--radius);transition:transform .1s ease,background-color .12s ease}.category:hover{background:#7d8fbf;transform:translateY(-2px)}.category-icon{width:40px;height:40px;flex:none}.tile-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--tile),1fr));gap:8px}.tile{display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 4px 6px;min-height:108px;background:var(--slot);border:3px solid;border-color:var(--slot-dark) var(--slot-light) var(--slot-light) var(--slot-dark);border-radius:var(--radius);transition:transform .1s ease,background-color .12s ease}.tile:hover{background:#a4a4a4;transform:translateY(-2px)}.tile .item-icon{width:52px;height:52px}.tile-name{font-size:13px;font-weight:700;line-height:1.15;text-align:center;color:#111;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}.section-head{display:flex;align-items:baseline;justify-content:space-between}.strip-row{display:grid;grid-auto-flow:column;grid-auto-columns:var(--tile);gap:8px;overflow-x:auto;padding-bottom:6px}.link-btn{background:none;border:0;color:#1d4ea8;font-weight:700;text-decoration:underline;padding:4px}.item-head{display:flex;align-items:center;gap:12px}.big-slot{flex:none;width:88px;height:88px;display:grid;place-items:center;background:var(--slot);border:4px solid;border-color:var(--slot-dark) var(--slot-light) var(--slot-light) var(--slot-dark)}.big-icon{width:72px;height:72px}.mid-icon{width:56px;height:56px}.item-title{flex:1;min-width:0}.item-title h1{margin-bottom:6px;word-break:break-word}.chip{display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 4px;font-size:14px;font-weight:700;background:#e2e2e2;border:2px solid #8b8b8b;border-radius:999px}.chip-icon{width:24px;height:24px}.star-btn{flex:none;width:56px;height:56px;display:grid;place-items:center;background:#6f6f6f;border:3px solid;border-color:#aaaaaa #2e2e2e #2e2e2e #aaaaaa;border-radius:var(--radius);transition:transform .12s ease}.star-btn img{width:34px;height:38px}.star-btn.on{background:#b88a1c}.star-btn:active{transform:scale(.92)}.tabs{display:flex;gap:6px;margin:16px 0 10px}.tab{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;font-size:16px;font-weight:700;background:#a9a9a9;border:3px solid;border-color:#dcdcdc #5c5c5c #5c5c5c #dcdcdc;border-radius:var(--radius)}.tab.active{background:var(--accent);color:#fff;text-shadow:1px 1px 0 #1f3310;border-color:#8cc15a var(--accent-dark) var(--accent-dark) #8cc15a}.tab-count{min-width:26px;padding:1px 6px;border-radius:999px;background:#00000040;color:#fff;font-size:13px;text-shadow:none}.pager{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}.pager-label{font-weight:700}.mc-btn{min-height:44px;min-width:44px;padding:6px 14px;display:inline-grid;place-items:center;font-weight:700;color:#fff;text-shadow:2px 2px 0 #3f3f3f;background:#6f6f6f;border:3px solid;border-color:#aaaaaa #2e2e2e #2e2e2e #aaaaaa;border-radius:var(--radius)}.mc-btn:hover:not(:disabled){background:#7d8fbf}.mc-btn:disabled{opacity:.4;cursor:default}.mc-btn.small{padding:4px}.recipe-card{background:#b5b5b5;border:3px solid;border-color:#8b8b8b #eeeeee #eeeeee #8b8b8b;padding:10px;border-radius:var(--radius)}.stations{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}.station{display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 4px;font-weight:700;font-size:15px;background:#e8e8e8;border:2px solid #6b6b6b;border-radius:var(--radius)}.station-icon{width:32px;height:32px}.recipe-row{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px}.grid3{display:grid;grid-template-columns:repeat(3,var(--slot-size));gap:3px}.recipe-card{--slot-size: 58px;--output-size: 76px;--arrow-w: 44px;container-type:inline-size}@container (max-width: 300px){.recipe-row{flex-wrap:nowrap;gap:6px}.grid3,.furnace-col,.brew-col{--slot-size: 46px}.recipe-row>.slot:not(.output){--slot-size: 46px}.recipe-row .slot.output{--output-size: 58px}.ui-tex.arrow{--arrow-w: 28px}.recipe-row.smithing .slot{--slot-size: 38px}.recipe-row.smithing .slot.output{--output-size: 46px}.ui-tex.plus{width:14px;height:14px}}@media(max-width:340px){main{padding:8px 6px 64px}.view{padding:12px 8px 14px}}.slot{position:relative;width:var(--slot-size);height:var(--slot-size);display:grid;place-items:center;padding:0;background:var(--slot);border:3px solid;border-color:var(--slot-dark) var(--slot-light) var(--slot-light) var(--slot-dark);border-radius:0}button.slot:hover{background:#a4a4a4}.slot.empty{background:#7a7a7a;background-image:linear-gradient(135deg,rgba(0,0,0,.06) 25%,transparent 25%,transparent 50%,rgba(0,0,0,.06) 50%,rgba(0,0,0,.06) 75%,transparent 75%);background-size:12px 12px}.slot .item-icon{width:80%;height:80%}.slot.cycling:after{content:"";position:absolute;right:2px;top:2px;width:7px;height:7px;background:var(--focus);border:1px solid #6b5400}.slot.output{width:var(--output-size);height:var(--output-size)}.count{position:absolute;right:3px;bottom:0;font-size:20px;font-weight:700;color:#fff;text-shadow:2px 2px 0 #3f3f3f}.badge-trim{position:absolute;bottom:-2px;left:50%;transform:translate(-50%);font-size:11px;font-weight:700;padding:0 4px;background:var(--focus);border:1px solid #6b5400}.ui-tex.arrow{width:var(--arrow-w);height:auto;flex:none}.ui-tex.flame{width:26px;height:26px}.ui-tex.plus{width:22px;height:22px}.ui-tex.brew-arrow{width:14px;height:52px}.furnace-col,.brew-col{display:flex;flex-direction:column;align-items:center;gap:4px}.hint{margin:10px 0 0;font-size:15px;font-weight:700;text-align:center}.hint.good{color:#245c0f}.hint.note{font-weight:400}.hint.source{font-size:13px;font-weight:400;color:var(--text-muted)}.empty-state{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:18px 8px}.empty-state p{margin:4px 0;font-size:17px;font-weight:700}.empty-state .muted{font-weight:400}.empty-text{text-align:center;padding:18px 0}.caption{position:fixed;left:50%;bottom:12px;transform:translate(-50%,8px);max-width:calc(100% - 24px);padding:6px 12px;font-weight:700;color:#fff;background:#100010f0;border:2px solid #2b0d5e;box-shadow:inset 0 0 0 2px #5000a0;border-radius:3px;opacity:0;pointer-events:none;transition:opacity .12s ease,transform .12s ease;z-index:5}.caption.show{opacity:1;transform:translate(-50%)}.loading,.load-error{margin:24px;color:#fff;font-size:18px;font-weight:700;text-shadow:2px 2px 0 #000}
