:root{--bg:#16181d;--panel:#1f2229;--panel-2:#282c35;--border:#363b47;--text:#e6e8ec;--muted:#9097a5;--accent:#6cb4ff;--error:#ff7b72;--gui:#c6c6c6;--gui-light:#fff;--gui-dark:#555;--slot:#8b8b8b;--slot-dark:#373737;--gui-text:#3f3f3f;--focus:#ffd34d;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}@media (prefers-color-scheme:light){:root{--bg:#f4f5f7;--panel:#fff;--panel-2:#eceef2;--border:#d5d9e0;--text:#1d2026;--muted:#616a79;--accent:#1f6fd1;--error:#c62828;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--text);-webkit-text-size-adjust:100%;font:15px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif}#root{height:100%}a{color:var(--accent);text-decoration:none}button,input,select{font:inherit;color:inherit}button{cursor:pointer}code,.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.88em}.muted{color:var(--muted)}.error{color:var(--error)}.center{text-align:center}.loading{opacity:.6;transition:opacity .2s .15s}button.link{color:var(--accent);background:0 0;border:none;padding:0}.app{flex-direction:column;height:100%;display:flex}.top{background:var(--panel);border-bottom:1px solid var(--border);align-items:center;gap:10px;padding:8px 16px;display:flex}.brand{color:var(--text);white-space:nowrap;text-overflow:ellipsis;min-width:0;font-weight:600;overflow:hidden}.back{border:1px solid var(--border);background:var(--panel-2);border-radius:8px;flex:none;width:36px;height:36px;font-size:22px;line-height:1}.type-picker{border:1px solid var(--border);background:var(--panel-2);border-radius:8px;max-width:45%;margin-left:auto;padding:6px 8px}.split{flex:1;grid-template-columns:minmax(0,1fr) minmax(300px,40%);min-height:0;display:grid}.detail-pane{padding:16px 20px 40px;overflow-y:auto}.list-pane{border-left:1px solid var(--border);background:var(--panel);flex-direction:column;min-height:0;display:flex}@media (width<=800px){.split{grid-template-columns:minmax(0,1fr)}.split.at-home .detail-pane,.split.at-detail .list-pane{display:none}.list-pane{border-left:none}.detail-pane{padding:12px 16px 40px}}.message{text-align:center;max-width:560px;margin:15vh auto;padding:0 16px}.grid-panel{flex-direction:column;height:100%;min-height:0;display:flex}.search-row{padding:10px 12px 6px}.search-row input{border:1px solid var(--border);background:var(--panel-2);border-radius:8px;width:100%;padding:9px 12px;font-size:16px}.pager{justify-content:center;align-items:center;gap:12px;padding:2px 12px 6px;font-size:14px;display:flex}.pager button{border:1px solid var(--border);background:var(--panel-2);border-radius:6px;width:32px;height:28px;font-size:18px;line-height:1}.pager button:disabled{opacity:.35;cursor:default}.item-grid{flex:1;grid-template-columns:repeat(auto-fill,minmax(44px,1fr));align-content:start;gap:2px;padding:4px 10px 16px;display:grid;overflow-y:auto}.cell{aspect-ratio:1;border-radius:4px;justify-content:center;align-items:center;display:flex}.cell:hover,.cell:focus-visible{background:var(--panel-2);outline:1px solid var(--border)}.cell .icon,.cell.small{width:32px;height:32px}.cell.small .icon{width:24px;height:24px}.icon{image-rendering:pixelated;width:100%;height:100%;display:block}.icon.missing{color:#fff;background:#7a3a7a;justify-content:center;align-items:center;font-size:10px;font-weight:700;display:flex}.ingredient-head{align-items:flex-start;gap:14px;margin-bottom:12px;display:flex}.ingredient-head h2{margin:0;font-size:22px}.big-icon{background:var(--panel-2);border-radius:8px;flex:none;width:64px;height:64px;padding:6px}.ingredient-head .mono{word-break:break-all}.tooltip-lines{color:#8a8aff;margin-top:4px}.tags{flex-wrap:wrap;gap:4px;margin-top:6px;display:flex}.tag{background:var(--panel-2);color:var(--muted);border-radius:999px;padding:1px 7px;font-size:12px}.mode-tabs{border-bottom:1px solid var(--border);gap:4px;margin-bottom:10px;display:flex}.mode-tabs button{background:0 0;border:none;border-bottom:2px solid #0000;padding:8px 14px;font-weight:600}.mode-tabs button.active{border-bottom-color:var(--accent)}.type-tabs{scrollbar-width:thin;gap:6px;padding-bottom:6px;display:flex;overflow-x:auto}.type-tabs button{border:1px solid var(--border);background:var(--panel);border-radius:8px;flex:none;align-items:center;gap:6px;padding:5px 10px 5px 6px;font-size:13px;display:flex}.type-tabs button.active{border-color:var(--accent);background:var(--panel-2)}.type-tabs .icon{width:24px;height:24px}.type-title{margin:10px 0 6px;font-size:16px}.list-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px;display:flex}.catalysts{flex-wrap:wrap;align-items:center;gap:4px;font-size:13px;display:flex}.recipe{background:var(--panel);border:1px solid var(--border);border-radius:10px;max-width:640px;margin-bottom:12px;padding:12px}.layout-wrap{width:100%;max-width:560px}.layout{margin:0 auto;position:relative}.layout.frame{background:var(--gui);box-shadow:inset 2px 2px 0 var(--gui-light), inset -2px -2px 0 var(--gui-dark);outline:6px solid var(--gui);border-radius:3px;margin:6px auto}.layout .bg{width:100%;height:100%;image-rendering:pixelated;position:absolute;inset:0}.arrow{fill:var(--slot);position:absolute}.slot{display:block;position:absolute}.slot.framed{background:var(--slot);box-shadow:inset 1px 1px 0 var(--slot-dark), inset -1px -1px 0 var(--gui-light)}.slot:not(.empty):hover{background-color:#ffffff59}.slot.focused{box-shadow:inset 0 0 0 2px var(--focus)}.slot.not-consumed{box-shadow:inset 0 0 0 2px #5fb7ff}.fluid-fill{width:100%;height:100%;image-rendering:pixelated;background-repeat:repeat;display:block}.slot .count,.slot .chance,.slot .nc{color:#fff;text-shadow:1px 1px #3f3f3f;pointer-events:none;white-space:nowrap;font-size:1em;font-weight:700;line-height:1;position:absolute}.slot .count{bottom:1px;right:1px}.slot .count.fluid{font-size:.7em}.slot .chance{color:#ffe066;font-size:.8em;top:1px;left:1px}.slot .nc{color:#9fd4ff;font-size:.75em;top:1px;right:1px}.recipe-meta{margin-top:10px;font-size:14px}.recipe-meta .stats{font-weight:600}.data{margin-top:6px}.data-ns{grid-template-columns:max-content 1fr;gap:2px 12px;margin:0 0 4px;display:grid}.data-ns dt{color:var(--muted)}.data-ns dd{margin:0}.knapping{vertical-align:middle;gap:1px;width:70px;display:inline-grid}.knapping span{aspect-ratio:1}.knapping .on{background:#8f8a84}.knapping .off{outline:1px dashed var(--border);background:0 0}.recipe-foot{justify-content:space-between;align-items:baseline;gap:10px;margin-top:8px;font-size:12px;display:flex}.recipe-id{color:var(--muted);overflow-wrap:anywhere;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.recipe-foot button.link{white-space:nowrap;font-size:14px}.calc{border-top:1px solid var(--border);margin-top:10px;padding-top:10px}.calc-form{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.calc-form label{align-items:center;gap:6px;display:flex}.calc-form input,.calc-form select{border:1px solid var(--border);background:var(--panel-2);border-radius:6px;padding:5px 8px;font-size:16px}.calc-form input{width:100px}.calc-summary{margin:8px 0;font-weight:600}.calc-cols{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;display:grid}.calc h4{color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin:0 0 4px;font-size:13px}.calc ul{margin:0;padding:0;list-style:none}.calc li{align-items:center;gap:8px;padding:2px 0;display:flex}.calc-icon{flex:none;width:24px;height:24px}.calc-amount{text-align:right;min-width:3.5em;font-weight:700}.welcome h2{margin-top:0}.tips{padding-left:18px}.tips code{background:var(--panel-2);border-radius:4px;padding:1px 5px}.type-index{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:6px;display:grid}.type-link{background:var(--panel);border:1px solid var(--border);color:var(--text);border-radius:8px;align-items:center;gap:8px;padding:6px 10px;display:flex}.type-link .icon{flex:none;width:24px;height:24px}.type-link .muted{margin-left:auto}