/* Pyanodon: red and white identity on a layered charcoal workspace. */
:root {
  color-scheme:dark;
  --bg:#191b22; --panel:#23252e; --panel-2:#2c2e39; --line:#3b3d49;
  --muted:#a8a9b7; --text:#f1efe9; --accent:#f0666c; --green:#d3c4b5;
  --paper:#eeebe3; --ink:#292b34;
}
body { background:var(--bg); color:var(--text); font:16px/1.6 var(--sans); }
button { transition:background .15s,border-color .15s,color .15s; }
button:hover { filter:none; }
button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible,select:focus-visible { outline:2px solid #ff9296; outline-offset:4px; }
a { color:#ff9296; }
[hidden] { display:none!important; }
.sidebar { width:250px; padding:24px 16px; background:#13151b; border-right:1px solid #32343e; }
.brand { margin:0 5px 20px; gap:9px; font-size:16px; font-weight:750; letter-spacing:1.4px; }
.brand>img { width:64px; height:70px; object-fit:contain; }
.brand small { font:10px var(--mono); letter-spacing:2px; color:#a9a6ad; margin-top:5px; }
.edition { font-size:10px; line-height:1.9; color:#d9d4cf; padding:0 12px 18px; }
.edition>span:last-child { color:#8e909f; padding-left:12px; }
.live-dot { background:var(--accent); box-shadow:0 0 8px #f0666c55; }
.nav-label { color:#858895; font:10px var(--mono); letter-spacing:1.3px; margin:10px 12px 11px; }
.nav-item { border-radius:6px; font-size:14px; line-height:1.5; color:#b5b6c2; padding:12px; gap:12px; }
.nav-item:hover { background:#242630; color:#fff; }
.nav-item.active { color:#fff1ee; background:#3c272e; box-shadow:inset 3px 0 var(--accent); }
.nav-item>span:first-child { color:#9699a9; }
.nav-item.active>span:first-child { color:var(--accent); }
.sidebar-rule { margin:19px 10px; background:#30323d; }
.milestone-link { color:#aeb0bd; font-size:13px; padding:9px 10px; line-height:1.5; border-radius:5px; border-left:0; margin:1px 0; }
.milestone-link:hover { background:#272933; color:#fff; }
.milestone-link.selected { color:#fff; background:#32333e; box-shadow:inset 3px 0 var(--accent); }
.sidebar-bottom { padding:18px 10px 0; }
.text-button { font-size:12px; color:#a8a8b7; }
main { margin-left:250px; }
.topbar { min-height:84px; height:auto; padding:18px 36px; background:#1d1f27; border-bottom:1px solid var(--line); gap:24px; }
.breadcrumb { color:#7f8291; font-size:10px; letter-spacing:.5px; }
.breadcrumb>span { color:#525563; }
.breadcrumb strong { color:#d2cfd0; }
.search-wrap { background:#292b35; border:1px solid #41434f; border-radius:7px; height:45px; width:min(460px,100%); max-width:560px; padding:0 14px; }
.search-wrap>span { color:#9c9eab; }
.search-wrap input { color:#f4f0eb; font-size:14px; }
.search-wrap input::placeholder { color:#a0a0ad; }
kbd { color:#9496a3; border-color:#51535f; }
.search-results { background:#30323d; border:1px solid #656777; border-radius:8px; width:min(540px,85vw); padding:7px; box-shadow:0 20px 50px #0009; }
.search-result { border-bottom:1px solid #494b57; border-radius:4px; }
.search-result:hover { background:#45404b; }
.search-result small { color:#bbb3b8; }
.workspace,.production-mode { grid-template-columns:minmax(0,1fr); }
.canvas-column,.production-mode .canvas-column { padding:32px 36px 20px; min-width:0; }
.page-heading { justify-content:flex-start; gap:18px; margin-bottom:27px!important; }
.heading-copy { min-width:0; }
.heading-icon { width:82px; height:82px; display:grid; place-content:center; flex-shrink:0; background:#2c2d37; border:1px solid #454550; border-radius:14px; box-shadow:0 8px 20px #0002; }
.eyebrow { color:#d58d8e; font:10px var(--mono); letter-spacing:1.6px; }
h1,.production-mode h1 { color:#f5f1ec; font-size:34px; line-height:1.25; font-weight:650; letter-spacing:-.8px; margin:7px 0 9px; }
.page-heading p { color:#a7a7b5; font-size:14px; line-height:1.7; margin:0; }
.goal-badge { display:none!important; }
#recipe-overview { margin-bottom:30px; }
.recipe-settings { display:grid; grid-template-columns:minmax(0,1fr) 166px; gap:20px; align-items:start; padding:22px; background:#252731; border:1px solid #42444f; border-radius:10px; margin-bottom:28px; }
.picker-field-label,.quantity-box>label { display:block; font:10px var(--mono); letter-spacing:1px; color:#b8b4bb; margin-bottom:9px; }
.quantity-box>div { display:flex; gap:7px; }
.quantity-box input { width:100%; min-width:0; height:46px; color:#fff3ee; background:#1b1d25; border:1px solid #555663; border-radius:5px; text-align:right; padding:10px; font:17px var(--mono); }
.quantity-box>div>button { height:46px; width:40px; flex-shrink:0; border-radius:5px; border:1px solid #e06b70; background:#d85259; color:#fff; font-size:22px; }
.quantity-box>button { font-size:12px; color:#c6b3b7; text-align:left; padding:10px 0 0; }
.recipe-picker-field { min-width:0; }
.recipe-picker-trigger { background:#343642; color:#f6f1ed; border:1px solid #626471; border-radius:7px; padding:13px 16px; box-shadow:0 2px 0 #0002; }
.recipe-picker-trigger:hover { background:#3b3d4b; border-color:#9d8c94; }
.recipe-picker-trigger[aria-expanded=true] { border-color:#ff898d; box-shadow:0 0 0 2px #ef74752b; }
.picker-selected-title { font-size:16px; }
.picker-selected-inputs { color:#c4c1cb; font-size:13px; margin:5px 0 9px; }
.picker-chevron { color:#f8c1bf; }
.picker-tier-label { color:#b8b1bd; font:10px var(--mono); }
.recipe-tier { background:#242630; border-color:#595969; color:#e7e1dc; padding:3px 7px; font-size:12px; }
.recipe-tier.special,.recipe-tier.unknown { background:#473a2b; color:#f9d997; border-color:#8b7350; }
.recipe-menu { background:var(--paper); color:var(--ink); border:1px solid #c7c4bf; border-radius:8px; box-shadow:0 20px 60px #000b; }
.recipe-menu-heading { background:#393a46; color:#fff4ec; padding:15px 17px; border-bottom:1px solid #575663; }
.recipe-menu-heading>span { color:#ccc4cc; }
.recipe-choice { background:#eeebe4; color:#262832; border-bottom:1px solid #d0ccc6; padding:18px; }
.recipe-choice:hover,.recipe-choice:focus { background:#fffaf2; outline-color:#cd555f; }
.recipe-choice[aria-selected=true] { background:#f8e0db; box-shadow:inset 4px 0 #d84f59; }
.recipe-choice-title { color:#282a34; font-size:16px; }
.recipe-choice-check { color:#bf3f4d; font-size:18px; }
.recipe-choice-tiers .picker-tier-label { color:#6e6570; }
.recipe-choice-tiers .recipe-tier { background:#e2ded7; color:#35333a; border-color:#bcb3ad; }
.recipe-choice-tiers .recipe-tier.special,.recipe-choice-tiers .recipe-tier.unknown { background:#eaddbf; color:#6f511e; }
.recipe-choice-equation .material-chip { background:#f8f5ef; color:#494650; border-color:#cbc6bd; }
.recipe-choice-equation .material-chip strong { color:#292833; }
.recipe-choice-arrow { color:#bd4d59; }
.recipe-choice-machine { color:#57545e; }
.recipe-choice-unlock { color:#78616c; }
.recipe-other-outputs { color:#776670; border-color:#a4999b; }
.recipe-menu-note { background:#dedbd5; color:#605b66; border-top:1px solid #c1bcb5; }
.section-heading { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; margin-bottom:18px; }
.section-heading h2 { font-size:24px; line-height:1.3; font-weight:600; letter-spacing:-.4px; margin:5px 0 0; color:#f2ede8; }
.section-meta { font-size:12px; color:#a8a4b1; }
.ingredient-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(195px,1fr)); gap:12px; }
.ingredient-card { display:flex; align-items:center; gap:15px; border:1px solid #dbd6cd; border-radius:8px; background:#ede9df; color:#35323c; text-align:left; padding:18px; min-height:98px; box-shadow:0 3px 12px #0002; }
.ingredient-card:hover { background:#fff8ee; border-color:#f3a7a1; transform:translateY(-1px); }
.ingredient-card>.item-icon { filter:drop-shadow(0 2px 2px #0003); }
.ingredient-card>span:nth-child(2) { min-width:0; }
.ingredient-card strong { display:block; font:600 23px/1.2 var(--mono); color:#272530; margin-bottom:5px; }
.ingredient-card>span:nth-child(2)>span { font-size:14px; line-height:1.4; display:block; }
.ingredient-link { color:#97666e; margin-left:auto; align-self:flex-start; font-size:18px; }
.gather-note { color:#c7c0c7; margin:0; padding:20px; border:1px dashed #62606b; border-radius:8px; }
.starting-materials { margin-top:18px; border:1px solid #393b47; border-radius:7px; background:#20222b; color:#bbb5c2; }
.starting-materials summary { cursor:pointer; padding:12px 16px; font-size:13px; }
.starting-materials summary>span { float:right; color:#8f8d9e; font-size:11px; }
.starting-materials .supply-chips { padding:4px 16px 0; }
.starting-materials p { color:#9e98a9; font-size:12px; padding:0 16px 12px; margin:12px 0 0; }
.view-toolbar { border-bottom:1px solid #45444f; gap:20px; margin-bottom:26px!important; }
.view-tabs { gap:30px; overflow-x:auto; }
.view-tabs button { font-size:14px; padding-bottom:14px; color:#9693a4; border-bottom:2px solid transparent; }
.view-tabs button[aria-selected=true] { color:#fff2ec; border-color:#ee6269; }
.view-tabs button:hover { color:#fff; }
.view-tabs button span { background:#363440; color:#b8a9b6; }
.production-mode #roadmap-tab,.production-mode #research-tab { display:none; }
.workspace:not(.production-mode) #overview-tab,.workspace:not(.production-mode) #production-tab,.workspace:not(.production-mode) #guide-tab { display:none; }
.building-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:18px; }
.building-card { min-width:0; background:#252731; border:1px solid #41414d; border-radius:9px; overflow:hidden; }
.building-card-title { display:flex; align-items:center; gap:10px; padding:16px 18px; border-bottom:1px solid #3f3f4a; min-height:76px; }
.building-card-title h3 { color:#e6e0db; font-size:15px; line-height:1.5; font-weight:550; margin:0; }
.building-image-button { display:block; position:relative; width:100%; padding:0; text-align:center; border:0; }
.building-art { height:195px; padding:12px; display:flex; align-items:center; justify-content:center; background:radial-gradient(ellipse at 50% 70%,#383842 0,#20222b 70%); border-bottom:1px solid #3b3b47; overflow:hidden; }
.building-art>img { width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 8px 8px #0004); }
.building-art.unavailable { flex-direction:column; gap:18px; background:#20222a; }
.building-art.unavailable>span:last-child { font-size:11px; color:#7d7e8d; }
.building-art.large { height:460px; }
.building-sprite { position:relative; overflow:hidden; filter:drop-shadow(0 8px 5px #0005); }
.building-sprite>div { position:relative; }
.building-sprite span { display:block; position:absolute; background-repeat:no-repeat; }
.image-enlarge { position:absolute; bottom:12px; right:12px; font-size:11px; color:#e8d3d0; background:#171820d9; padding:4px 8px; border:1px solid #5b535e; border-radius:4px; opacity:0; }
.building-image-button:hover .image-enlarge,.building-image-button:focus-visible .image-enlarge { opacity:1; }
.building-card-body { padding:16px 18px; }
.building-used-for { font-size:12px; color:#a8a2b2; margin:0 0 16px; }
.machine-facts { display:flex; align-items:flex-start; flex-wrap:wrap; gap:14px 22px; color:#ddd4d6; font-size:13px; }
.machine-facts>span { flex:1; min-width:75px; }
.machine-facts small { display:block; color:#868492; font:9px var(--mono); letter-spacing:.4px; margin-bottom:5px; }
.building-card .machine-picker { border-top:1px solid #45414c; padding-top:12px; margin-top:16px; }
.building-card .machine-picker>.item-icon { display:none; }
.building-card .machine-picker small { color:#98909e; font-size:10px; }
.building-card .machine-label { font-size:13px; color:#cec0c9; }
.building-craft-link { display:flex; justify-content:space-between; width:100%; font-size:13px; text-align:left; color:#ed9696; padding:14px 0 0; }
.overview-output { margin-top:30px; border-top:1px solid #3b3c47; padding-top:26px; }
.output-main { display:flex; gap:18px; flex-wrap:wrap; align-items:center; }
.surplus-label { font-size:12px; color:#b4a2af; }
.section-label { color:#b1a1b0; font:10px var(--mono); letter-spacing:.7px; margin:22px 0 12px; }
.material-chip,.table-formula .material-chip { border:1px solid #56515c; background:#34313d; color:#d9d0d7; border-radius:5px; padding:8px 10px; font-size:14px; }
.material-chip strong { color:#f3e9e3; font-size:14px; }
.material-chip:hover { background:#46404a; }
.formula-plus { color:#a19aaa; }
.overview-chain-tools { display:flex; align-items:center; flex-wrap:wrap; gap:14px; border:1px dashed #4b4554; border-radius:7px; padding:16px; margin-top:28px; }
.overview-chain-tools>span { color:#a69baa; font-size:12px; margin-right:auto; }
.overview-chain-tools>button,.production-control-actions>button { color:#e79c9f; font-size:12px; }
.overview-chain-tools>button:last-child,.production-control-actions>button:last-child { color:#aaa0ad; }
.chain-toolbar { display:flex; justify-content:space-between; align-items:center; gap:18px; margin-bottom:18px; }
.chain-toolbar p { font-size:13px; color:#a99ead; margin:5px 0 0; }
.production-control-actions { display:flex; gap:10px; margin-left:auto; }
.production-content { background:#20222b; border:1px solid #45424f; border-radius:8px; }
.production-tree-scroll { background-color:#1d1f27; background-image:radial-gradient(#62596777 .65px,transparent .65px); height:560px; }
.recipe-node { background:#2e303b; border-color:#67616e; box-shadow:0 6px 15px #0003; }
.recipe-node.target { background:#3a2d36; border-color:#ee737a; }
.recipe-node-heading h3 { color:#fff0eb; }
.recipe-node-heading span { color:#bfacba; }
.machine-picker.compact { border-color:#5c515f; }
.machine-picker small { color:#a298a9; }
.machine-label,.machine-picker.compact .machine-label { color:#e0d6df; }
.machine-label::after { color:#ef9b9f; }
.node-inputs { color:#d6cbd7; }
.node-inputs>small { color:#b39aaa; }
.node-byproducts { color:#bbaaba; }
.node-actions { border-color:#5c4c59; }
.node-actions button { color:#f4a7ab; font-size:12px; }
.supply-node { background:#292c37; border-color:#545565; }
.supply-node strong { color:#ebe1e1; }
.supply-node small { color:#a4a1b4; }
.supply-node button { border-color:#82666f; background:#49343e; color:#ffb6b5; }
.supply-node.fluid-input { border-left-color:#7ebdd5; }
.guide-intro { background:#2b2b36; border-bottom:1px solid #4f4553; }
.guide-intro>span { color:#b8a7b7; }
.guide-table th { background:#32313e; color:#bfb0c1; }
.guide-table td,.guide-table tr { background:#252731; border-color:#45404f; }
.guide-table td { border-color:#46404e; }
.step-number { border-color:#ab6d7b; background:#4a303b; color:#ffd3cc; }
.recipe-arrow { color:#e8828b; }
.byproduct-output>small { color:#b9a8ba; }
.recipe-option-link,.machine-build-link { color:#ec9fa5; }
.batch-cell { color:#f0cccd; }
.batch-cell small { color:#b8a9b9; }
.guide-building-image .building-art { height:120px; margin-top:12px; border:1px solid #48424f; border-radius:6px; }
.guide-building-image .building-art>img { max-height:100px; }
.production-note { margin:22px 0 10px; }
.production-note p { color:#b5a9b9; font-size:13px; line-height:1.8; max-width:none; }
.production-footnote { color:#7f7e8f; font-size:11px; line-height:1.8; }
.production-warning { background:#493b2c; border-color:#857052; color:#e8cda3; border-radius:6px; }
.target-building-section { margin-bottom:30px; }
.target-building { display:grid; grid-template-columns:minmax(220px,1fr) 1fr; gap:24px; background:#292a35; padding:20px; border:1px solid #494452; border-radius:8px; }
.target-building .building-art { height:240px; border-radius:7px; border:1px solid #4a4452; }
.target-building .machine-facts { margin-top:12px; }
.target-building p { color:#aaa0b0; font-size:13px; }
.map-panel { background:#22242d; border-color:#48434f; }
.map-heading { color:#c3b1c1; border-color:#49414f; }
.map-heading>span:last-child { color:#aaa0b4; }
.graph-viewport { background-color:#1d1f27; background-image:radial-gradient(#64596875 .6px,transparent .6px); }
.milestone-card,.tech-card { background:#30303c; border-color:#62566a; color:#eadfe6; }
.milestone-card:hover,.tech-card:hover { background:#443a49; border-color:#bc7f92; }
.milestone-card.selected,.tech-card.selected { border-color:#ed727b; background:#45313d; }
.milestone-card small,.tech-card small { color:#baacbe; }
.map-footer { border-color:#48404f; }
.legend { color:#a99aad; }
.zoom-controls button { color:#dcc5d1; border-color:#64516a; }
.list-container,.list-filters { background:#242530; color:#c1b3c5; }
.list-row { border-color:#494150; }
.list-row.selected { background:#40303f; }
.select-tech { color:#e3d8e5; }
.select-tech small { color:#aa9bad; }
.inspector { background:#23242e; border:1px solid #47404d; border-radius:9px; margin-top:28px; }
.inspector-top,.detail-kicker,.detail-id { color:#a99aac; }
.detail-description { color:#c4b7c9; }
.detail-rule { border-color:#4a3d4e; }
.requirement { border-color:#4e4253; color:#d9cbdc; }
.requirement:hover { background:#3a2e3e; }
.detail-tree,.primary-button { color:#efadb5; }
.cost-chip { background:#352c3b; border-color:#5b4563; color:#dfcfe3; }
.detail-facts { color:#e9cfdf; }
.detail-facts small,.tiny-note,.unlocked-recipes { color:#ad9eaf; }
.field-note p { color:#a193a5; }
dialog,#production-dialog,#building-dialog { background:#292a35; color:#f1e8e8; border:1px solid #69606e; border-radius:12px; padding:28px; width:min(860px,94vw); box-shadow:0 25px 100px #000a; }
dialog::backdrop { background:#09090fba; backdrop-filter:blur(5px); }
.dialog-header { color:#b4a4b7!important; border-color:#55465b; }
.dialog-header button { color:#e6c7d1; font-size:27px; }
#building-dialog-title { font-size:23px; line-height:1.4; margin:0; }
.building-detail-name { display:flex; align-items:center; gap:12px; color:#bbaabb; font-size:13px; padding:18px 0; }
#building-dialog-content .machine-facts { padding-bottom:18px; }
#production-dialog-content h2 { color:#f5e9ed; }
.detail-recipe-equation { border-color:#69516b; background:#24212d; border-radius:7px; }
.compatible-machines button { background:#3a303f; border-color:#634d67; color:#e3d1e5; border-radius:5px; }
.version-comparison th,.version-comparison td { border-color:#544758; }
.version-comparison caption,.version-comparison thead th { color:#beadbf; }
.version-comparison td { color:#ddcedf; }
.app-footer { color:#747180; padding:20px 36px; border-top:1px solid #32313d; font-size:11px; }
#toast { background:#efe6df; color:#382a36; border:1px solid #bf919c; }
@media(min-width:1500px) { .canvas-column,.production-mode .canvas-column { padding:36px 50px 24px; max-width:1580px; margin:0 auto; width:100%; } .building-grid { grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); } }
@media(min-width:1200px) { .workspace:not(.production-mode) { grid-template-columns:minmax(0,1fr) 360px; } .workspace:not(.production-mode) .inspector { margin:32px 28px 24px 0; } }
@media(max-width:1100px) and (min-width:781px) { .sidebar { width:220px; } main { margin-left:220px; } .brand { font-size:13px; gap:5px; } .brand>img { width:58px; } .topbar { padding:18px 26px; } .canvas-column,.production-mode .canvas-column { padding:28px 26px; } .recipe-settings { grid-template-columns:minmax(0,1fr) 145px; gap:16px; padding:18px; } .building-grid { grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); } }
@media(max-width:780px) {
  .sidebar { position:static; width:100%; padding:12px 18px; flex-direction:row; align-items:center; border:0; border-bottom:1px solid #37313f; gap:16px; }
  .brand { margin:0; font-size:14px; } .brand>img { width:48px; height:51px; } .brand small { font-size:8px; }
  .edition { font-size:9px; margin-left:auto; padding:0; }
  main { margin-left:0; }
  .topbar { min-height:70px; padding:12px 18px; gap:12px; }
  .mobile-tools { color:#f0a9af; font-size:12px; }
  .search-wrap { height:42px; }
  .search-wrap input { font-size:14px; }
  .canvas-column,.production-mode .canvas-column { padding:26px 18px; }
  h1,.production-mode h1 { font-size:28px; }
  .heading-icon { width:64px; height:64px; border-radius:10px; }
  .heading-icon .item-icon { transform:scale(.8); }
  .page-heading { gap:13px; }
  .page-heading p { font-size:12px; }
  .recipe-settings { padding:16px; grid-template-columns:minmax(0,1fr); gap:15px; }
  .quantity-box { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
  .quantity-box>label { margin:0 6px 0 0; }
  .quantity-box>div { width:140px; }
  .quantity-box>button { margin-left:auto; padding:0; }
  .ingredient-grid { grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; }
  .ingredient-card { gap:10px; padding:13px; min-height:96px; }
  .ingredient-card .item-icon { transform:scale(.85); }
  .ingredient-card strong { font-size:21px; }
  .ingredient-card>span:nth-child(2)>span { font-size:13px; }
  .section-heading h2 { font-size:22px; }
  .starting-materials summary>span { float:none; display:block; margin:4px 0 0 16px; }
  .view-tabs { gap:26px; width:auto; }
  .view-tabs button { font-size:14px; }
  .building-grid { grid-template-columns:repeat(auto-fit,minmax(245px,1fr)); }
  .building-card-title { min-height:68px; }
  .chain-toolbar { align-items:flex-start; flex-wrap:wrap; }
  .chain-toolbar .production-control-actions { width:auto; margin-left:0; gap:12px; align-items:flex-start; }
  .guide-table tr { background:#252731; }
  .target-building { grid-template-columns:minmax(0,1fr); }
  .building-art.large { height:330px; }
  .app-footer { padding:18px; }
}
@media(prefers-reduced-motion:reduce) { button { transition:none; } .ingredient-card:hover { transform:none; } }
.building-art { position:relative; }
.building-art-label { position:absolute; left:10px; bottom:9px; z-index:2; font:9px var(--mono); letter-spacing:.2px; color:#d7c5cf; background:#191922dd; border:1px solid #62525f; border-radius:3px; padding:3px 6px; }
.mobile-browse { display:none; }
.browse-links { display:flex; flex-direction:column; gap:8px; }
.browse-links button,.browse-science button { text-align:left; padding:12px; border:1px solid #554658; border-radius:5px; color:#eddce7; background:#342b3a; font-size:14px; }
.browse-science { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.browse-science button { display:flex; align-items:center; gap:10px; }
#browse-dialog h2 { font-size:24px; }
@media(max-width:780px) {
  .mobile-browse { display:block; font-size:13px; color:#f2c9cf; padding:6px 0; }
  .topbar { display:grid; grid-template-columns:minmax(0,1fr) auto auto; }
  .mobile-tools { font-size:0; padding:0; width:24px; }
  .mobile-tools::after { content:'ⓘ'; font-size:21px; }
  .topbar .search-wrap { width:100%; max-width:none; }
  .browse-science { grid-template-columns:1fr; }
}
svg.building-sprite { width:100%; height:100%; max-width:100%; display:block; flex-shrink:1; }
.guide-building-image .building-art { height:145px; }

.chain-toolbar { flex-wrap:wrap; }
.chain-toolbar-actions { display:flex; align-items:center; gap:20px; margin-left:auto; min-width:0; }
.chain-toolbar-actions .production-control-actions { width:auto; min-width:0; flex:0 1 auto; flex-direction:column; align-items:flex-end; margin:0; }
.tree-fullscreen-button { display:inline-flex; align-items:center; justify-content:center; gap:8px; flex-shrink:0; min-height:44px; padding:9px 15px; border:1px solid #ee737a; border-radius:6px; background:#482e39; color:#fff0eb; font:500 14px var(--sans); }
.tree-fullscreen-button:hover { background:#613743; border-color:#ffa1a5; }
.tree-fullscreen-button>span { font-size:21px; line-height:1; }
.tree-fullscreen-title { display:none; }
body.tree-fullscreen-open { overflow:hidden; }
#production-tree-dialog { width:100vw; max-width:none; height:100vh; height:100dvh; max-height:none; margin:0; padding:24px; padding:max(20px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left)); border:0; border-radius:0; background:#191b22; color:var(--text); overflow:hidden; }
#production-tree-dialog[open] { display:flex; }
#production-tree-dialog #production-panel { display:flex; flex-direction:column; width:100%; min-width:0; min-height:0; }
#production-tree-dialog .chain-toolbar { flex-shrink:0; }
#production-tree-dialog .tree-fullscreen-title { display:flex; align-items:center; gap:12px; margin:0 0 12px; font-size:22px; line-height:1.3; }
#production-tree-dialog .tree-fullscreen-title small { display:block; margin-top:4px; font-size:12px; font-weight:400; color:#aaa2b2; }
#production-tree-dialog .production-content { flex:1; min-height:0; }
#production-tree-dialog .production-tree-scroll { width:100%; height:100%; }
#production-tree-dialog .production-note,#production-tree-dialog .production-footnote { display:none; }
#production-tree-dialog .production-warning { flex-shrink:0; max-height:100px; overflow:auto; }
@media(max-width:780px) {
  .chain-toolbar-actions { width:100%; margin-left:0; justify-content:space-between; gap:12px; }
  .chain-toolbar-actions .production-control-actions { flex:1; align-items:flex-start; gap:8px; }
  .tree-fullscreen-button { padding:9px 12px; font-size:13px; }
  #production-tree-dialog { padding:14px; padding:max(14px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left)); }
  #production-tree-dialog .chain-toolbar { gap:14px; }
  #production-tree-dialog .tree-fullscreen-title { font-size:20px; margin-bottom:8px; }
  #production-tree-dialog .chain-toolbar p { display:none; }
}