/* Shared TorchBuilds tool surfaces. Keep controls in one place across both planners. */
.tool-page{--bg:#101214;--surface:#181b1f;--raised:#20242a;--panel:#181b1f;--border:#34383f;--line:#34383f;--text:#eceef1;--muted:#a4aab4;--gold:#efb963;--gold-soft:#30281e;--gold-bg:#30281e;--radius:8px;color:var(--text);background:var(--bg);font-family:Inter,"Noto Sans TC","Microsoft JhengHei",system-ui,sans-serif;font-size:14px;line-height:1.6;color-scheme:dark}
.tool-page .icon{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}
.tool-page button,.tool-page input,.tool-page select,.tool-page textarea{font:inherit;color:var(--text);border-radius:var(--radius)}
.tool-page button{border:1px solid var(--border);background:var(--raised);min-height:40px;cursor:pointer;transition:background-color .15s,border-color .15s,color .15s}
.tool-page button:hover:not(:disabled){border-color:#77613f;background:#292921}
.tool-page button:disabled{opacity:.35;cursor:not-allowed}
.tool-page button.quiet{background:transparent;border-color:transparent;color:var(--muted)}
.tool-page button.quiet:hover:not(:disabled){color:var(--text);background:var(--raised);border-color:var(--border)}
.tool-page button.primary{color:var(--gold);background:var(--gold-soft);border-color:#735b36}
.tool-page button.primary:hover:not(:disabled){color:#ffd598;background:#403323;border-color:var(--gold)}
.tool-page button.danger{color:#f19191}
.tool-page :is(button,input,select,textarea,summary,a):focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.tool-page :is(input,select,textarea){background:var(--bg);border:1px solid var(--border);padding:9px 12px}
.tool-page :is(input,textarea)::placeholder{color:#818994}
.tool-page .tool-toolbar{display:flex;align-items:center;gap:24px;min-height:68px;padding:12px 28px;flex:none;position:relative;z-index:10;background:var(--surface);border-bottom:1px solid var(--border)}
.tool-page .tool-identity{display:flex;align-items:center;gap:16px;min-width:0;flex:1}
.tool-page .tool-toolbar .plan-name{font-size:15px;font-weight:500;width:230px;max-width:100%;min-width:0;min-height:44px;padding:8px 10px;border:1px solid transparent;background:transparent;color:var(--text)}
.tool-page .tool-toolbar .plan-name:hover,.tool-page .tool-toolbar .plan-name:focus{border-color:var(--border);background:var(--bg)}
.tool-page .tool-save-state{font-size:12px;color:var(--muted);white-space:nowrap}
.tool-page .tool-save-state.pending,.tool-page .tool-save-state.failed{color:var(--gold)}
.tool-page .tool-actions{display:flex;align-items:center;gap:6px;flex:none;margin-left:auto}
.tool-page .tool-icon-button,.tool-page .tool-actions .plan-more>summary{display:flex;justify-content:center;align-items:center;width:44px;height:44px;min-width:44px;min-height:44px;padding:10px;gap:0;border:1px solid transparent;border-radius:8px}
.tool-page .tool-icon-button .button-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.tool-page .tool-history{display:flex;gap:2px;margin-left:4px;padding-left:8px;border-left:1px solid var(--border)}
.tool-page .tool-actions .primary{border-color:transparent}
.tool-page .plan-more{position:relative}
.tool-page .plan-more>summary{list-style:none;color:var(--muted);cursor:pointer}
.tool-page .plan-more>summary::-webkit-details-marker{display:none}
.tool-page .plan-more>summary:hover,.tool-page .plan-more[open]>summary{color:var(--gold);background:var(--raised)}
.tool-page .plan-menu{position:absolute;top:calc(100% + 8px);right:0;z-index:20;width:216px;padding:6px;border:1px solid var(--border);border-radius:10px;background:var(--surface);box-shadow:0 14px 40px #0008}
.tool-page .plan-menu button{display:flex;align-items:center;gap:12px;width:100%;padding:9px 12px;min-height:44px;justify-content:flex-start;text-align:left;font-size:14px}
.tool-page .plan-menu button[data-action=about]{border-top:1px solid var(--border);border-radius:0 0 6px 6px;margin-top:4px}
.tool-page .plan-menu button[data-action=feedback]{color:var(--gold)}

.tool-page .tool-footer{display:flex;justify-content:space-between;align-items:center;flex:none;gap:12px;min-height:54px;max-width:none;width:auto;box-sizing:border-box;padding:4px 28px calc(4px + env(safe-area-inset-bottom));background:var(--surface);border-top:1px solid var(--border);margin:0;font-size:12px;color:var(--muted)}
.tool-page .tool-footer>span{display:block;min-width:0;font-size:12px}
.tool-page .tool-footer-actions{display:flex;flex-shrink:0;gap:10px;margin-left:auto}
.tool-page .tool-footer button{display:flex;align-items:center;gap:8px;min-height:40px;padding:8px;font-size:12px;white-space:nowrap}
.tool-page .tool-footer button[data-action=feedback]{color:var(--gold)}
.tool-page .tool-footer .icon{width:16px;height:16px}
.build-page #app{padding-bottom:calc(64px + env(safe-area-inset-bottom))}
.build-page .tool-footer{position:fixed;inset:auto 0 0;z-index:8}
@media(max-width:900px){.atlas-page #app{padding-bottom:53px}.atlas-page .tool-footer{position:fixed;inset:auto 0 0;z-index:8}}
/* Matching panel hierarchy while retaining each tool's workspace layout. */
.tool-page :is(.panel,.inspector,.group-picker-panel,.point-drawer>form,.loadout-disclosure[open]){background:var(--surface);border-color:var(--border);border-radius:10px}
.tool-page :is(.panel-head,.section-nav,.inspector-tabs){background:var(--surface);border-color:var(--border)}
.tool-page :is(.panel-head h2,.canvas-heading h2,.subheading h2){font-size:15px;font-weight:600;letter-spacing:.2px}
.tool-page .panel-head h2 .icon{color:var(--gold)}
.tool-page :is(.hero-choice,.equipment-slot,.trait-slot,.tree-tab,.god-card,.core-choice,.pick-card,.loadout-slot,.group-icon,.main-skill,.support-skill,.companion-shortcut){background:var(--bg);border:1px solid var(--border);border-radius:8px}
.tool-page :is(.active.tree-tab,.active.core-choice,.active.group-icon,.chosen.trait-slot){background:var(--gold-soft);border-color:#9d7d4b}
.tool-page :is(.hero-details,.summary-strip,.skill-row,.companion-panel,.forge-item){background:var(--surface);border-color:var(--border)}
.tool-page :is(.section-nav,.inspector-tabs){gap:4px}
.tool-page :is(.section-nav,.inspector-tabs)>button{border:0;border-bottom:2px solid transparent;border-radius:0;background:transparent;color:var(--muted)}
.tool-page :is(.section-nav,.inspector-tabs)>button.active,.tool-page .inspector-tabs>button[aria-selected=true]{border-bottom-color:var(--gold);color:var(--gold);background:transparent}
.tool-page :is(.atlas-navigation,#support-panel,.canvas-controls){background:var(--surface);border-color:var(--border)}
.tool-page .atlas-navigation{padding-inline:28px}
.tool-page #support-panel{padding-inline:28px}
.tool-page .canvas-heading button{background:var(--surface);border-color:var(--border)}
.tool-page .tree-canvas{background:radial-gradient(ellipse at center,#252729,var(--bg) 78%)}
.tool-page .layout{padding:24px 28px;gap:24px;max-width:none}
.tool-page :is(.panel-head,.subheading){padding:16px 20px}
/* Dialogs and feedback share the same frame, spacing, controls and focus treatment. */
.tool-page dialog{background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:12px;box-shadow:0 24px 80px #0009;padding:0;max-width:calc(100vw - 24px);max-height:calc(100dvh - 32px)}
.tool-page dialog::backdrop{background:#080a0dcc;backdrop-filter:blur(4px)}
.tool-page :is(.dialog-heading,.modal-head){display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 22px;background:var(--surface);border-bottom:1px solid var(--border)}
.tool-page :is(.dialog-heading,.modal-head) h2{font-size:18px;font-weight:600;line-height:1.5;margin:0}
.tool-page :is(.dialog-heading,.modal-head) button{display:grid;place-items:center;min-width:44px;width:44px;height:44px;padding:10px;flex:none}
.tool-page :is(.dialog-body,.modal-body){padding:22px}
.tool-page :is(.dialog-actions,.modal-actions){display:flex;justify-content:flex-end;flex-wrap:wrap;gap:10px;padding:16px 22px;border-top:1px solid var(--border);background:var(--surface)}
.tool-page :is(.dialog-actions,.modal-actions) button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:9px 16px}
.tool-page .feedback-dialog{width:min(560px,calc(100vw - 24px))}
.tool-page .feedback-dialog :is(.dialog-body,.modal-body){max-height:calc(100dvh - 230px);overflow:auto}
.tool-page .feedback-dialog form{display:flex;flex-direction:column;gap:16px}
.tool-page .feedback-dialog label{display:flex;flex-direction:column;font-size:14px;gap:8px;margin:0}
.tool-page .feedback-dialog :is(input,select,textarea){font-size:16px;width:100%;box-sizing:border-box}
.tool-page .feedback-dialog textarea{resize:vertical;min-height:130px}
.tool-page .feedback-dialog .feedback-context{display:flex;flex-direction:row;align-items:flex-start;padding:12px;border:1px solid var(--border);border-radius:8px;background:var(--bg)}
.tool-page .feedback-context input{width:18px;height:18px;flex:none;margin-top:3px;accent-color:var(--gold)}
.tool-page .feedback-context small{display:block;font-size:12px;font-weight:400;margin-top:4px;color:var(--muted)}
.tool-page .feedback-dialog .form-hint{font-size:12px;line-height:1.6;margin:0;color:var(--muted)}
.tool-page .feedback-trap{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.tool-page .feedback-success{padding:12px 0}.tool-page .feedback-success strong{font-size:18px;color:var(--gold)}
.tool-page .feedback-success code{font-size:16px;letter-spacing:1px}
.tool-page #dialog-error{color:#f19191;font-size:14px}
@media(max-width:1200px){.tool-page .tool-identity{flex-direction:column;align-items:flex-start;gap:0}.tool-page .tool-save-state{font-size:11px;padding-left:10px}.tool-page .tool-toolbar{gap:16px}}
@media(max-width:900px){.tool-page .tool-toolbar{padding-inline:16px}.tool-page .tool-save-state{display:none}.tool-page .tool-footer{padding-inline:16px}.tool-page .layout{padding:16px;gap:16px}.tool-page .atlas-navigation,.tool-page #support-panel{padding-inline:16px}.atlas-page #app{height:auto;min-height:100dvh}.atlas-page .workspace{flex:none;min-height:400px;height:52dvh}.atlas-page .loadout-dock{max-height:50dvh}.atlas-page .board-container{min-height:0}}
@media(max-width:600px){.tool-page .tool-toolbar{flex-wrap:wrap;gap:4px;padding-block:8px;min-height:104px}.tool-page .tool-identity{flex-basis:100%}.tool-page .tool-toolbar .plan-name{width:100%;font-size:16px;min-height:40px;padding:6px 0}.tool-page .tool-actions{justify-content:flex-end;width:100%;gap:4px}.tool-page .tool-footer{gap:6px;min-height:50px}.tool-page .tool-footer>span{font-size:10px;max-width:100px}.tool-page .tool-footer-actions{gap:2px}.tool-page .tool-footer button{min-height:44px;font-size:12px;padding:8px 6px;gap:6px}.tool-page :is(.dialog-heading,.modal-head,.dialog-body,.modal-body,.dialog-actions,.modal-actions){padding:16px}.tool-page :is(.panel-head,.subheading){padding:14px 16px}.tool-page .plan-menu{width:210px}}
@media(prefers-reduced-motion:reduce){.tool-page *{transition:none!important;scroll-behavior:auto!important}}