.log-header-title { color: #f1fa8c; font-size: 1rem; font-weight: 700; margin-bottom: 8px; text-align: left;}.section-header { background: rgba(0, 0, 0, 0.8); border-bottom: 2px solid #443; padding: 10px; margin: 20px auto; width: 95%; max-width: 1250px; display: flex; align-items: center; justify-content: space-between;}.sh-left { display: flex; align-items: center; gap: 15px; flex: 1; justify-content: flex-start;}.sh-center { flex: 1; text-align: center; display: flex; justify-content: center;}.sh-right { flex: 1; display: flex; align-items: center; justify-content: flex-end; gap: 5px;}.section-header span.title { font-weight: 700; font-size: 1.125rem; color: #d3c6c6; display: flex; align-items: center; gap: 15px;}.strength-label { color: #fff; font-family: monospace; font-size: 1rem; white-space: nowrap; font-weight: 700;}.race-btn { padding: 4px 12px; font-size: 0.875rem; border: 1px solid #443; background: #1a1a1a; color: #888; cursor: pointer; border-radius: 3px; font-weight: 700; transition: 0.2s; white-space: nowrap;}.race-btn:hover { background: #333; color: #fff;}.race-btn.active { background: #ff4d4d; color: #000; border-color: #ff4d4d;}.grid-container { display: flex; flex-wrap: wrap; justify-content: center; gap: 15px; margin-bottom: 20px; margin-left: auto; margin-right: auto;}#enemiesGrid { max-width: 860px;}#alliesGrid { max-width: 650px;}.unit-card { background: rgba(20, 20, 20, 0.9); border: 1px solid #443; border-radius: 4px; padding: 8px; width: 145px; box-shadow: inset 0 0 15px #000; position: relative; box-sizing: border-box; transition: 0.2s border-color;}.unit-card:hover { border-color: #ff4d4d;}.active-card { border-color: #ff4d4d !important; box-shadow: inset 0 0 20px rgba(255, 77, 77, 0.25) !important;}.card-img-container { position: relative; width: 100%; height: auto; aspect-ratio: 135/164; margin: 0 auto; border: 1px solid #333; overflow: hidden; box-sizing: border-box;}.main-unit-img { width: 100%; height: 100%; object-fit: cover; object-position: top; display: block;}.bonus-overlay { position: absolute; top: 0; left: 0; width: 100%; height: calc(100% - 18px); background: rgba(0, 0, 0, 0.85); color: #fff; font-size: 0.688rem; line-height: 1.4; padding: 8px; box-sizing: border-box; opacity: 0; transition: opacity 0.2s ease-in-out; display: flex; align-items: center; justify-content: center; text-align: center; z-index: 10; pointer-events: none;}.card-img-container:hover .bonus-overlay { opacity: 1;}.stat-icon { width: 25px; height: 25px; object-fit: contain;}.icon-overlay { position: absolute; display: flex; align-items: center; gap: 2px; background: rgba(0, 0, 0, 0.5); padding: 1px 3px; border-radius: 2px; z-index: 5;}.stat-val { color: #fff; font-weight: 700; text-shadow: 1px 1px 2px #000; font-size: 0.75rem; margin-right: 2px;}.pos-tl { top: 2px; left: 2px;}.pos-tr { top: 2px; right: 2px;}.pos-bl { bottom: 20px; left: 2px;}.pos-br { bottom: 20px; right: 2px;}.unit-count-input { position: absolute; bottom: 0; left: 0; width: 100%; height: 21px; background: rgba(0, 0, 0, 0.8); color: #a6e3a1; border: none; border-top: 1px solid #443; text-align: center; font-weight: 700; font-size: 0.84rem; outline: 0; z-index: 15; box-sizing: border-box;}.unit-name { font-weight: 700; font-size: 0.85rem; margin: 3px 0 3px 0; color: #fff; display: flex; align-items: center; justify-content: center; gap: 4px;}.unit-name input[type="checkbox"] { cursor: pointer; width: 14px; height: 14px; accent-color: #ff4d4d;}.controls { display: flex; justify-content: center; align-items: center; gap: 2px; margin-top: 5px;}.controls button { background: #2a2a2a; border: 1px solid #555; color: #fff; font-size: 0.688rem; width: 32px; height: 30px; cursor: pointer; border-radius: 2px; font-weight: 700;}.controls button:hover { background: #ff4d4d; border-color: #ff4d4d;}.opt-limit { font-size: 0.625rem; color: #888; margin-top: 6px; display: flex; align-items: center; justify-content: center; gap: 4px;}.opt-limit input { width: 40px; background: #111; color: #ffb86c; border: 1px solid #443; text-align: center; border-radius: 2px; outline: 0; font-size: 0.688rem; height: 18px;}.opt-limit input:focus { border-color: #ff4d4d;}.action-panel { margin: 30px auto; width: 95%; max-width: 1250px; background: rgba(0, 0, 0, 0.7); padding: 15px; border: 1px solid #443; box-sizing: border-box; text-align: center;}.layer-box { margin-bottom: 20px; font-size: 1.125rem; color: #fff; display: flex; align-items: center; justify-content: center; gap: 4px;}.layer-box input { width: 60px; font-size: 1.25rem; background: #000; color: #fff; border: 1px solid #ff4d4d; text-align: center; height: 33px; box-sizing: border-box;}.layer-box button { background: #2a2a2a; border: 1px solid #555; color: #fff; font-size: 0.875rem; width: 40px; height: 33px; cursor: pointer; border-radius: 3px; font-weight: 700;}.layer-box button:hover { background: #ff4d4d; border-color: #ff4d4d; color: #000;}button.main-btn { padding: 10px 15px; margin: 5px; border: 1px solid #443; font-weight: 700; cursor: pointer; text-transform: uppercase; border-radius: 3px; transition: 0.2s; font-size: 0.75rem;}.btn-sim { background: #333; color: #fff;}.btn-sim:hover { background: #444;}.btn-best { background: #2b4f2d; color: #fff;}.btn-best:hover { background: #38663b;}.btn-safe { background: #6b3e1b; color: #fff;}.btn-safe:hover { background: #854d22;}.btn-cancel { background: #7a1f1f !important; border-color: #ff4d4d !important;}.log-container { height: auto; min-height: 400px; background: #050505; color: #a9b7c6; font-family: "Courier New", Courier, monospace; font-size: 0.813rem; padding: 15px; border: 1px solid #443; outline: 0; text-align: left; box-sizing: border-box; white-space: pre-wrap; line-height: 1.5;}.img-log { width: 45px; height: 48px; object-fit: cover; vertical-align: middle; border-radius: 3px; border: 1px solid #443; margin: 0 4px; box-shadow: 0 0 4px #000; object-position: top;}.log-actions { position: absolute; top: 10px; right: 10px; display: flex; gap: 8px; z-index: 20;}.copy-btn { background: #2a2a2a; border: 1px solid #555; color: #fff; padding: 6px 12px; border-radius: 3px; cursor: pointer; font-size: 0.75rem; font-weight: 700; transition: 0.2s;}.copy-btn:hover { background: #ff4d4d; color: #000; border-color: #ff4d4d;}#results-container { text-align: left; max-width: 100%; margin: 20px auto; background: rgba(0, 0, 0, 0.9); border: 1px solid #443; display: none; padding-bottom: 10px;}#results-header { padding: 10px; border-bottom: 1px solid #443; font-weight: 700; color: #ff4d4d; font-size: 0.875rem; text-transform: uppercase;}#results-list { width: 100%;}.result-item { padding: 10px; border-bottom: 1px solid #222; cursor: pointer; display: flex; justify-content: space-between; align-items: center; font-size: 0.813rem;}.result-item:hover { background: #1a1a1a; color: #ff4d4d;}.results-scroll { max-height: 580px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #ff4d4d #140a0a;}.results-scroll::-webkit-scrollbar { width: 9px; height: 9px;}.results-scroll::-webkit-scrollbar-track { background: #140a0a; border-radius: 5px;}.results-scroll::-webkit-scrollbar-thumb { background: linear-gradient(180deg, #ff4d4d, #7a1f1f); border-radius: 5px; border: 2px solid #140a0a;}.results-scroll::-webkit-scrollbar-thumb:hover { background: #f55;}.results-scroll::-webkit-scrollbar-corner { background: #140a0a;}#results-header { display: flex; align-items: center; justify-content: space-between; gap: 10px;}.results-filter-btn { background: #1a1a1a; color: #ffb86c; border: 1px solid #553; border-radius: 4px; width: 32px; height: 28px; cursor: pointer; flex-shrink: 0; transition: 0.2s;}.results-filter-btn:hover { background: #ff4d4d; color: #000; border-color: #ff4d4d;}.results-filter-btn.active { background: #5a3a1a; color: #ffd9a0; border-color: #ffb86c;}.results-filter-panel { background: #0d0808; border-bottom: 1px solid #443; padding: 12px 14px;}.rf-head { color: #fff; font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 10px; display: flex; align-items: center; gap: 6px;}.rf-head i { color: #ff4d4d;}.rf-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px 12px;}.rf-col { display: flex; flex-direction: column; align-items: center; gap: 5px; width: 96px;}.rf-img { width: 40px; height: 43px; object-fit: cover; object-position: top; border-radius: 3px; border: 1px solid #553;}.rf-inc,.rf-sort { background: #111; color: #fff; border: 1px solid #553; border-radius: 3px; padding: 3px 4px; font-size: 0.688rem; cursor: pointer; width: 100%; min-width: 0; box-sizing: border-box;}.rf-inc:focus,.rf-sort:focus { border-color: #ff4d4d; outline: 0;}.rf-foot { margin-top: 10px; text-align: right;}#rf-clear { background: #5a1f1f; color: #fff; border: 1px solid #f55; padding: 5px 12px; border-radius: 3px; cursor: pointer; font-size: 0.688rem; font-weight: 700;}#rf-clear:hover { background: #ff4d4d; color: #000;}#async-loader { display: none; align-items: center; justify-content: center; gap: 10px; color: #fff; font-weight: 700; padding: 15px;}@media (min-width: 769px) {#async-loader { padding-bottom: 0; }}.spinner { border: 4px solid #222; border-top: 4px solid #ffb86c; border-radius: 50%; width: 24px; height: 24px; animation: spin 1s linear infinite;}@keyframes spin { 0% { transform: rotate(0); } 100% { transform: rotate(360deg); }}.mode-toggle { display: flex; align-items: center; justify-content: center; gap: 10px; color: #fff; font-weight: 700; font-size: 0.875rem; margin-bottom: 15px;}.switch { position: relative; display: inline-block; width: 44px; height: 22px; margin: 0;}.switch input { opacity: 0; width: 0; height: 0;}.slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #2a2a2a; transition: 0.2s; border-radius: 22px; border: 1px solid #443; box-sizing: border-box;}.slider:before { position: absolute; content: ""; height: 14px; width: 14px; left: 3px; bottom: 3px; background-color: #888; transition: 0.2s; border-radius: 50%;}input:checked + .slider { background-color: #311; border-color: #ff4d4d;}input:checked + .slider:before { transform: translateX(22px); background-color: #ff4d4d;}.mode-lite,.mode-pro { font-size: 0.75rem; letter-spacing: 1px; transition: 0.2s;}.formation-container { display: block; width: 100%; line-height: 1.8;}.formation-title { font-size: 0.813rem; display: inline;}.formation-grid { display: inline;}.formation-unit { display: inline-flex; align-items: center; gap: 4px; font-size: 0.813rem; white-space: nowrap; vertical-align: middle;}.formation-unit .img-log { margin: 0;}.comma { display: inline; margin-right: 4px; font-weight: 700; color: #888;}.formation-est { color: #f1fa8c; font-weight: 700; margin-left: 10px; display: inline; white-space: nowrap;}.log-stats-bar { color: #a9b7c6; font-weight: 700; margin-bottom: 15px;}.stat-badge { display: inline-flex; align-items: center; background: #111; border: 1px solid #443; padding: 4px 10px; border-radius: 4px; margin-right: 5px; margin-bottom: 5px; font-size: 0.813rem;}.stat-badge i { color: #ffb86c; margin-right: 4px;}.log-unit-section { margin-top: 15px;}.log-unit-section:first-of-type { margin-top: 0;}.empty-log-msg { display: flex; align-items: center; justify-content: center; min-height: 360px; color: #666; font-size: 0.875rem; letter-spacing: 1px; text-align: center;}@media (max-width: 768px) { body { padding: 2px; } h1 { font-size: 1.25rem; margin-top: 24px; } .grid-container { gap: 10px; width: 100%; padding: 0 5px; box-sizing: border-box; } .unit-card { width: calc(50% - 5px); padding: 5px; box-sizing: border-box; } .bonus-overlay { font-size: 0.625rem; padding: 4px; } .layer-box input { width: 70px; font-size: 1.25rem; } .layer-box button { font-size: 1rem; width: 45px; height: 35px; } .section-header { flex-direction: column; gap: 8px; text-align: center; } .sh-center:empty { display: none; } .sh-center, .sh-left, .sh-right { width: 100%; justify-content: center !important; flex-wrap: wrap; } .controls button { width: 35px; height: 30px; font-size: 0.813rem; } button.main-btn { width: 100%; padding: 15px; font-size: 0.875rem; margin: 5px 0; }#results-container, .log-wrapper { width: 100%; max-width: 100%; box-sizing: border-box; margin-left: 0; margin-right: 0; border-radius: 0; } .log-container { font-size: 0.688rem; padding: 10px; border-radius: 0; } .log-header-row { align-items: stretch; } .log-header-row .log-actions { width: 100%; flex-direction: column; align-items: stretch; gap: 8px; justify-content: stretch; } .log-header-row .log-actions .copy-btn { width: 100%; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 11px 12px; } .comma { display: none !important; } .formation-container { display: flex; flex-direction: column; align-items: flex-start; gap: 5px; text-align: left; line-height: normal; } .formation-title { display: block; margin-bottom: 5px; font-size: 0.875rem; } .formation-grid { display: grid !important; grid-template-columns: repeat(4, 1fr); column-gap: 2px; row-gap: 12px; width: 100%; justify-items: center; margin-top: 2px !important; } .formation-unit { display: flex; flex-direction: column; gap: 4px; font-size: 0.844rem; font-weight: 700; } .formation-unit .img-log { width: 52px; height: 55px; } .formation-est { display: block; margin-top: 5px; margin-left: 0; white-space: normal; line-height: 1.4; text-align: left; } .log-stats-bar { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-bottom: 15px; } .stat-badge { margin: 0; padding: 6px; font-size: 0.75rem; text-align: center; background: rgba(20, 20, 20, 0.8); border: 1px solid #443; border-radius: 4px; display: flex; align-items: center; justify-content: center; } .log-container strong { display: block; margin-bottom: 2px !important; text-align: left; font-size: 0.938rem; letter-spacing: 0.5px; } .log-unit-section { margin-top: 25px !important; } .log-unit-section:first-of-type { margin-top: 0 !important; } .log-header-title { text-align: center; margin-top: 35px; margin-bottom: 15px; }}#engineControlsCard { display: none; background: rgba(20, 20, 20, 0.9); border: 2px solid #ff4d4d; border-radius: 4px; padding: 12px; width: 298px; box-sizing: border-box; position: fixed; right: 15px; top: 50%; transform: translateY(-50%); z-index: 100; max-height: 90vh; overflow-y: auto; transform-origin: bottom right; transition: transform 0.42s cubic-bezier(0.36, 0, 0.16, 1), opacity 0.38s ease;}#engineControlsCard.active { display: block;}#ecMinBtn { position: absolute; top: 8px; left: 10px; background: 0 0; border: none; color: #f88; font-size: 0.813rem; line-height: 1; cursor: pointer; z-index: 2; padding: 2px 4px;}#ecMinBtn:hover { color: #ff4d4d;}#engineControlsCard.genie-min { transform: translateY(-50%) translate(8px, 46vh) scale(0.05); opacity: 0; pointer-events: none;}#ecRestoreBtn { display: none; position: fixed; bottom: 20px; right: 20px; z-index: 1001; width: 50px; height: 50px; padding: 0; border-radius: 50%; background: #7a1f1f; color: #fff; border: 2px solid #f55; font-size: 1.25rem; cursor: pointer; box-shadow: 0 0 16px rgba(255, 77, 77, 0.55); transition: transform 0.2s ease, box-shadow 0.2s ease;}#ecRestoreBtn:hover { transform: scale(1.1); box-shadow: 0 0 22px rgba(255, 77, 77, 0.8);}body.ec-minimized #ecRestoreBtn { display: block; animation: ecGeniePop 0.34s cubic-bezier(0.2, 0.8, 0.3, 1.3);}@keyframes ecGeniePop { from { transform: scale(0.1) translate(20px, 20px); opacity: 0; } to { transform: scale(1) translate(0, 0); opacity: 1; }}#engineControlsCard h3 { color: #ff4d4d; font-weight: 700; margin: 0 0 12px 0; font-size: 0.75rem; text-align: center; letter-spacing: 1px;}.zombie-section-title { color: #ffb86c; font-size: 0.625rem; font-weight: 700; margin: 10px 0 6px 0; text-transform: uppercase; letter-spacing: 0.5px;}.zombie-option { margin: 6px 0; display: flex; align-items: flex-start; gap: 6px; padding: 5px 6px; background: rgba(0, 0, 0, 0.5); border-radius: 2px; border: 1px solid #333; transition: border-color 0.2s;}.zombie-option:hover { border-color: #ff4d4d;}.zombie-option input[type="radio"] { cursor: pointer; width: 13px; height: 13px; accent-color: #ff4d4d; flex-shrink: 0; margin-top: 1px;}.zombie-option label { cursor: pointer; color: #b09795; font-size: 0.688rem; margin: 0; flex: 1; line-height: 1.2;}@media (max-width: 1024px) {#engineControlsCard { position: static; transform: none; width: 100%; max-width: 600px; margin: 0 auto 20px auto; right: auto; top: auto; }}body.dev-mode-active { background: #000 !important;}#devModeContainer { display: none; margin: 20px 10px; width: calc(100% - 20px); max-width: none; text-align: left;}#devModeContainer table { width: 100%; border-collapse: collapse; background: #111; color: #fff; font-size: 0.688rem;}#devModeContainer td,#devModeContainer th { border: 1px solid #443; padding: 4px; text-align: center;}#devModeContainer th { background: #222;}#devModeContainer th img { width: 30px; height: 36px; vertical-align: middle; display: block; margin: 0 auto;}#devModeContainer .inp-small { width: 28px; background: #000; color: #fff; border: 1px solid #555; text-align: center;}#devModeContainer .inp-small:focus { border-color: #ff4d4d; outline: 0;}#devModeContainer .inp-small.zero-val { color: #383838;}#devModeContainer .btn-dev { background: #333; color: #fff; border: 1px solid #555; padding: 4px 8px; cursor: pointer; border-radius: 3px; font-weight: 700;}#devModeContainer .btn-dev:hover { background: #ff4d4d; color: #000;}.tb-mode-switch { display: inline-flex; border: 1px solid #553; border-radius: 6px; overflow: hidden;}.tb-mode-btn { background: #1a1416; color: #b09795; border: none; padding: 6px 12px; font-size: 0.75rem; cursor: pointer; font-weight: 700; transition: 0.15s;}.tb-mode-btn + .tb-mode-btn { border-left: 1px solid #553;}.tb-mode-btn.active { background: #7a1f1f; color: #fff;}.tb-mode-btn:hover:not(.active) { background: #2a1c1c; color: #ffb86c;}#devModeContainer:not(.mode-mass) .col-mass { display: none;}#devModeContainer.mode-mass .col-verify { display: none;}#devModeContainer.mode-mass #test-pass-indicator { display: none;}body.dev-mode-active > :not(#devModeContainer) { display: none !important;}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0;}input[type="number"] { -moz-appearance: textfield;}.round-check { -webkit-appearance: none; appearance: none; width: 18px; height: 18px; border-radius: 50%; border: 2px solid #f55; background: 0 0; cursor: pointer; position: relative; flex-shrink: 0; vertical-align: middle; transition: background 0.15s ease, box-shadow 0.15s ease;}.round-check:hover { box-shadow: 0 0 7px rgba(255, 85, 85, 0.6);}.round-check:checked { background: #ff4d4d; border-color: #ff4d4d;}.round-check:checked::after { content: ""; position: absolute; left: 50%; top: 50%; width: 4px; height: 8px; border: solid #15131a; border-width: 0 2px 2px 0; transform: translate(-50%, -62%) rotate(45deg);}.cultist-opts { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; width: fit-content; max-width: 100%; margin: 14px auto 4px; padding: 0 24px; box-sizing: border-box; font-size: 0.781rem;}.cultist-opts > div,.cultist-opts > label { text-align: left;}@media (max-width: 768px) { .cultist-opts { padding: 0 8px; }}#devModeContainer,#devModeContainer *,#engineControlsCard { scrollbar-width: thin; scrollbar-color: #7a1f1f #140a0a;}#devModeContainer ::-webkit-scrollbar,#devModeContainer::-webkit-scrollbar,#engineControlsCard::-webkit-scrollbar { width: 7px; height: 7px;}#devModeContainer ::-webkit-scrollbar-track,#devModeContainer::-webkit-scrollbar-track,#engineControlsCard::-webkit-scrollbar-track { background: #140a0a; border-radius: 4px;}#devModeContainer ::-webkit-scrollbar-thumb,#devModeContainer::-webkit-scrollbar-thumb,#engineControlsCard::-webkit-scrollbar-thumb { background: linear-gradient(180deg, #ff4d4d, #7a1f1f); border-radius: 4px; border: 1px solid #2a0e0e;}#devModeContainer ::-webkit-scrollbar-thumb:hover,#devModeContainer::-webkit-scrollbar-thumb:hover,#engineControlsCard::-webkit-scrollbar-thumb:hover { background: #f55;}#devModeContainer ::-webkit-scrollbar-corner,#engineControlsCard::-webkit-scrollbar-corner { background: #140a0a;}.cpopup-overlay { position: fixed; inset: 0; background: rgba(0, 0, 0, 0.72); z-index: 10000; display: flex; align-items: center; justify-content: center; opacity: 0; pointer-events: none; transition: opacity 0.2s ease;}.cpopup-overlay.show { opacity: 1; pointer-events: auto;}.cpopup { background: linear-gradient(180deg, #1a1416, #0d0808); border: 2px solid #ff4d4d; border-radius: 6px; padding: 22px 26px; max-width: 90%; width: 380px; box-sizing: border-box; box-shadow: 0 0 28px rgba(255, 77, 77, 0.35); text-align: center; transform: translateY(-14px) scale(0.98); transition: transform 0.2s ease;}.cpopup-overlay.show .cpopup { transform: translateY(0) scale(1);}.cpopup-title { color: #f55; font-size: 0.938rem; margin-bottom: 12px; letter-spacing: 1px;}.cpopup-title.ok { color: #8bf08b;}.cpopup-msg { color: #d8c9c9; font-size: 0.813rem; line-height: 1.55; margin-bottom: 18px; white-space: pre-wrap;}.cpopup-btn { background: #7a1f1f; color: #fff; border: 1px solid #f55; padding: 8px 24px; border-radius: 3px; cursor: pointer; font-weight: 700; font-size: 0.813rem; transition: 0.2s; letter-spacing: 0.5px;}.cpopup-btn:hover { background: #ff4d4d; color: #000;}.info-icon-btn { background: #1e1416; color: #f55; border: 1px solid #7a3030; width: 34px; height: 34px; border-radius: 50%; cursor: pointer; font-size: 0.938rem; line-height: 1; vertical-align: middle; transition: 0.2s; flex-shrink: 0;}.info-icon-btn:hover { background: #ff4d4d; color: #000; box-shadow: 0 0 12px rgba(255, 77, 77, 0.45);}.info-modal-overlay { position: fixed; inset: 0; background: rgba(0, 0, 0, 0.78); z-index: 10001; display: flex; align-items: center; justify-content: center; padding: 20px; opacity: 0; pointer-events: none; transition: opacity 0.2s ease;}.info-modal-overlay.show { opacity: 1; pointer-events: auto;}.info-modal { position: relative; background: linear-gradient(180deg, #1a1416, #0d0808); border: 2px solid #ff4d4d; border-radius: 8px; overflow: hidden; width: 860px; max-width: 100%; max-height: 88vh; box-shadow: 0 0 32px rgba(255, 77, 77, 0.35); transform: translateY(-14px) scale(0.98); transition: transform 0.2s ease; display: flex; flex-direction: column;}.info-modal-overlay.show .info-modal { transform: translateY(0) scale(1);}.info-modal-close { position: absolute; top: 8px; right: 12px; background: 0 0; border: none; color: #f88; font-size: 1.625rem; line-height: 1; cursor: pointer; z-index: 2; transition: 0.2s;}.info-modal-close:hover { color: #ff4d4d;}.info-modal-body { overflow-y: auto; padding: 26px 30px; text-align: left;}.info-modal-body::-webkit-scrollbar { width: 8px;}.info-modal-body::-webkit-scrollbar-thumb { background: #7a1f1f; border-radius: 4px;}.info-modal-body::-webkit-scrollbar-track { background: #140a0a;}.ai-h1 { color: #f55; font-size: 1.063rem; letter-spacing: 1px; margin: 0 0 4px; text-align: center;}.ai-sub { color: #888; font-size: 0.75rem; margin-bottom: 18px; text-align: center;}.ai-h2 { color: #ffb86c; font-size: 0.875rem; text-transform: uppercase; letter-spacing: 0.5px; margin: 24px 0 10px; padding-bottom: 6px; border-bottom: 1px solid #443; display: flex; align-items: center; gap: 8px;}.ai-h2 i { color: #ff4d4d;}.ai-p { color: #d4c5a9; line-height: 1.6; font-size: 0.813rem; margin: 0 0 10px;}.ai-ol { margin: 0 0 10px; padding-left: 4px; list-style: none; counter-reset: step;}.ai-ol li { color: #d4c5a9; line-height: 1.55; font-size: 0.813rem; margin-bottom: 6px; padding-left: 30px; position: relative; counter-increment: step;}.ai-ol li::before { content: counter(step); position: absolute; left: 0; top: 0; width: 20px; height: 20px; background: #7a1f1f; color: #fff; border-radius: 50%; font-size: 0.688rem; font-weight: 700; text-align: center; line-height: 20px;}.ai-ol li b { color: #ffb86c;}.ai-unit-row { display: flex; gap: 14px; align-items: flex-start; padding: 12px 0; border-bottom: 1px solid #221;}.ai-unit-row:last-child { border-bottom: none;}.ai-unit-row img { width: 40px; height: 43px; object-fit: cover; object-position: top; border-radius: 3px; border: 1px solid #443; flex-shrink: 0;}.ai-unit-info { flex: 1; min-width: 0;}.ai-unit-name { color: #ffb86c; font-weight: 700; font-size: 0.813rem; margin-bottom: 3px;}.ai-unit-name .ai-none { color: #777; font-weight: 400; font-style: italic;}.ai-unit-bonus { color: #d4c5a9; font-size: 0.781rem; line-height: 1.5;}.ai-when { display: inline-block; margin-top: 5px; font-size: 0.688rem; color: #8be9fd; background: rgba(139, 233, 253, 0.08); border: 1px solid #2b4f5a; border-radius: 3px; padding: 1px 7px;}.ai-imgs { display: flex; gap: 4px; flex-shrink: 0;}.ai-imgs img { width: 40px; height: 43px;}.ai-chips { display: flex; flex-wrap: wrap; gap: 5px; margin: 5px 0 6px;}.ai-chip { display: inline-flex; align-items: center; gap: 4px; background: #0d0808; border: 1px solid #443; border-radius: 4px; padding: 2px 7px; font-size: 0.688rem; color: #d4c5a9;}.ai-chip img { width: 13px; height: 13px; border: none; border-radius: 0;}.ai-chip i { line-height: 1;}.ai-chip i { font-size: 0.688rem; color: #ffb86c;}.ai-passive { color: #d4c5a9; font-size: 0.781rem; line-height: 1.5; margin-top: 2px;}.ai-passive b { color: #ffb86c;}.ai-interp { color: #b09b87; font-size: 0.75rem; line-height: 1.5; margin-top: 3px; font-style: italic;}.ai-interp b { color: #ffb86c; font-style: normal;}.ai-how { color: #9fd9e6; font-size: 0.75rem; line-height: 1.55; margin-top: 5px; background: rgba(139, 233, 253, 0.06); border-left: 2px solid #2b4f5a; border-radius: 0 3px 3px 0; padding: 5px 10px;}.ai-how b { color: #8be9fd;}.ai-link,.ai-p a { color: #ffb86c; font-weight: 700; text-decoration: none;}.ai-link:hover,.ai-p a:hover { color: #ff4d4d;}.type-wheel { display: flex; flex-direction: column; gap: 9px; margin: 6px 0 4px; background: rgba(0, 0, 0, 0.3); border: 1px solid #332; border-radius: 6px; padding: 14px 16px;}.type-line { display: flex; align-items: center; gap: 10px; color: #d4c5a9; font-size: 0.813rem; line-height: 1.4;}.type-line img { width: 28px; height: 28px; flex-shrink: 0;}.tt-brute { color: #ff9d5c; font-weight: 700;}.tt-occult { color: #bd93f9; font-weight: 700;}.tt-mons { color: #ff6b6b; font-weight: 700;}.tt-up { color: #50fa7b;}.tt-down { color: #f55;}.so-openbtn { background: #0d0505; color: #f94; border: 1px solid #f94; border-radius: 4px; padding: 8px 14px; font-weight: 700; font-size: 0.688rem; letter-spacing: 0.4px; cursor: pointer; width: 100%; transition: 0.2s;}.so-openbtn:hover { background: #ff4d4d; color: #000; border-color: #ff4d4d;}.so-openbtn .so-count { color: #50fa7b; font-weight: 700;}.so-overlay { position: fixed; inset: 0; background: rgba(0, 0, 0, 0.55); z-index: 10002; display: flex; align-items: center; justify-content: center; padding: 16px; opacity: 0; pointer-events: none; transition: opacity 0.2s ease;}.so-overlay.show { opacity: 1; pointer-events: auto;}body.dev-mode-active > #rowLogOverlay.so-overlay,body.dev-mode-active > #soOverlay.so-overlay { display: flex !important;}body.dev-mode-active > #cConfirmOverlay.cpopup-overlay,body.dev-mode-active > #cPopupOverlay.cpopup-overlay { display: flex !important;}.so-modal { position: relative; background: linear-gradient(180deg, #1a1416, #0d0808); border: 2px solid #ff4d4d; border-radius: 8px; width: 1480px; max-width: 100%; max-height: 90vh; box-shadow: 0 0 32px rgba(255, 77, 77, 0.4); opacity: 0.9; display: flex; flex-direction: column; transform: translateY(-12px) scale(0.98); transition: transform 0.2s ease;}.so-overlay.show .so-modal { transform: none;}.so-close { position: absolute; top: 5px; right: 12px; background: 0 0; border: none; color: #f88; font-size: 1.625rem; line-height: 1; cursor: pointer; z-index: 3; transition: 0.2s;}.so-close:hover { color: #ff4d4d;}.so-head { padding: 16px 22px 8px;}.so-title { color: #f55; font-size: 0.938rem; letter-spacing: 1px;}.so-sub { color: #8a8a8a; font-size: 0.688rem; margin-top: 5px; line-height: 1.5;}.so-sub b { color: #ffb86c;}.so-scroll { overflow: auto; padding: 4px 14px 14px; scrollbar-width: thin; scrollbar-color: #ff4d4d #140a0a;}.so-scroll::-webkit-scrollbar { width: 9px; height: 9px;}.so-scroll::-webkit-scrollbar-track { background: #140a0a; border-radius: 5px;}.so-scroll::-webkit-scrollbar-thumb { background: linear-gradient(180deg, #ff4d4d, #7a1f1f); border-radius: 5px; border: 2px solid #140a0a;}.so-scroll::-webkit-scrollbar-thumb:hover { background: #f55;}.so-scroll::-webkit-scrollbar-corner { background: #140a0a;}.so-imgs { display: flex; gap: 3px; justify-content: center;}.so-table { width: 100%; border-collapse: collapse; font-size: 0.688rem;}.so-table th { position: sticky; top: 0; background: #241a1a; color: #f94; font-size: 0.625rem; text-transform: uppercase; letter-spacing: 0.3px; padding: 7px 6px; border-bottom: 1px solid #553; z-index: 2; white-space: nowrap;}.so-table td { border-bottom: 1px solid #2a1c1c; padding: 4px; text-align: center; color: #d4c5a9;}.so-table tr:hover td { background: rgba(255, 77, 77, 0.05);}.so-table td.so-name { text-align: left; color: #ffb86c; font-weight: 700; white-space: nowrap; padding-left: 6px;}.so-table td.so-name small { color: #777; font-weight: 400;}.so-table img { width: 26px; height: 28px; object-fit: cover; object-position: top; border-radius: 3px; border: 1px solid #443; display: block;}.so-inp { width: 44px; background: #000; color: #fff; border: 1px solid #555; border-radius: 3px; text-align: center; padding: 3px 2px; font-size: 0.688rem;}.so-inp:focus { border-color: #ff4d4d; outline: 0;}.so-inp::placeholder { color: #444;}.so-inp.ovr { border-color: #ffb86c; color: #ffd9a0; background: #16100a;}.so-sel { background: #111; color: #ffb86c; border: 1px solid #553; border-radius: 3px; padding: 3px; font-size: 0.625rem; cursor: pointer;}.so-sel.ovr { border-color: #ffb86c;}.so-table .so-ctiming,.so-table .so-t7mode,.so-table .so-zrevive,.so-table .so-zrevtarget { width: 250px; max-width: 250px; box-sizing: border-box;}.so-chk { cursor: pointer;}.so-na { color: #444;}.so-foot { padding: 10px 22px; border-top: 1px solid #332; display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap;}.so-foot .so-hint { color: #777; font-size: 0.625rem;}.so-reset { background: #5a1f1f; color: #fff; border: 1px solid #f55; padding: 6px 14px; border-radius: 3px; cursor: pointer; font-size: 0.688rem; font-weight: 700; transition: 0.2s;}.so-reset:hover { background: #ff4d4d; color: #000;}.log-header-row { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; margin-bottom: 10px;}.log-header-row #stress-toggle-label { align-self: flex-end; max-width: 100%;}.log-header-row .log-actions { position: static; top: auto; right: auto; flex-shrink: 0; flex-wrap: wrap; justify-content: flex-end;}#stress-toggle-label { flex: 1 1 240px; min-width: 0; margin: 0 !important;}#devModeTable thead th { position: sticky; z-index: 6; background: #222;}#devModeTable thead tr:first-child th { top: 0; height: 26px; box-sizing: border-box; z-index: 7;}#devModeTable thead tr:nth-child(2) th { top: 26px;}#devModeTable thead th img { width: 35px; height: 38px; object-fit: cover; object-position: top; display: block; margin: 0 auto; border-radius: 2px;}#devModeTable td.col-layer,#devModeTable th.col-layer { background: rgba(80, 120, 200, 0.14);}#devModeTable td.col-enemy,#devModeTable th.col-enemy { background: rgba(200, 70, 70, 0.12);}#devModeTable td.col-ally,#devModeTable th.col-ally { background: rgba(90, 180, 110, 0.12);}#devModeTable thead th.col-layer { background: #1c2740;}#devModeTable thead th.col-enemy { background: #2c1818;}#devModeTable thead th.col-ally { background: #182c1d;}#advancedToolsWrap { width: 100%; margin: 0 0 15px 0;}.advanced-tools-btn { background: #0d0505; color: #f94; border: 1px solid #553; border-radius: 4px; padding: 9px 16px; font-weight: 700; font-size: 0.75rem; letter-spacing: 0.5px; cursor: pointer; transition: 0.2s;}.advanced-tools-btn:hover { background: #ff4d4d; color: #000; border-color: #ff4d4d;}#devAdvancedPanel { max-height: 0; overflow: hidden; opacity: 0; transition: max-height 0.4s ease, opacity 0.3s ease; width: 100%; box-sizing: border-box;}#devAdvancedPanel.open { max-height: 2200px; opacity: 1; margin-top: 10px;}#devAdvancedPanel .adv-inner { background: #0d0505; border: 1px solid #553; border-radius: 4px; padding: 14px; display: flex; flex-direction: column; gap: 16px; align-items: stretch;}#devAdvancedPanel .adv-row { display: flex; flex-wrap: wrap; gap: 14px; align-items: flex-start;}.adv-section-head { flex: 1 1 100%; color: #f94; font-size: 0.813rem; font-weight: 700; letter-spacing: 0.5px; display: flex; align-items: center; gap: 8px; margin: 0; padding-bottom: 9px; border-bottom: 1px solid #443;}.adv-section-head i { color: #ff4d4d;}.adv-cell { flex: 1 1 210px; display: flex; flex-direction: column; gap: 6px; background: rgba(0, 0, 0, 0.32); border: 1px solid #443; border-radius: 6px; padding: 11px 12px; box-sizing: border-box; transition: border-color 0.2s;}.adv-cell:hover { border-color: #6a4a2a;}.adv-cell-sort { flex: 1 1 250px;}.adv-cell-lbl { color: #ff9d66; font-size: 0.563rem; text-transform: uppercase; letter-spacing: 0.6px; font-weight: 700;}.adv-input { background: #111; color: #ffb86c; border: 1px solid #553; padding: 5px 6px; font-size: 0.688rem; border-radius: 3px; cursor: pointer; width: 100%; box-sizing: border-box;}.adv-input:focus { border-color: #ff4d4d; outline: 0;}.adv-sort-row { display: flex; gap: 5px; align-items: center;}.adv-sort-sel { background: #111; color: #ffb86c; border: 1px solid #553; padding: 4px 5px; font-size: 0.625rem; border-radius: 3px; cursor: pointer; flex: 1; min-width: 0;}.adv-sort-sel:focus { border-color: #ff4d4d; outline: 0;}.adv-dir-btn { background: #222; color: #ffb86c; border: 1px solid #553; padding: 4px 0; font-size: 0.625rem; font-weight: 700; cursor: pointer; border-radius: 3px; width: 26px; flex-shrink: 0; transition: 0.15s;}.adv-dir-btn:hover { background: #ff4d4d; color: #000; border-color: #ff4d4d;}#devAdvancedPanel .adv-ti-block { width: 100%; border-top: 1px solid #332; padding-top: 12px;}#devAdvancedPanel .adv-ti-block #ti-override-table-test { width: 100%;}#devAdvancedPanel .adv-ti-block table { width: 100%;}#devDrawerToggle { display: none;}#drawerCloseBtn { display: none;}@media (max-width: 768px) {#ecMinBtn { display: none !important; }#ecRestoreBtn { display: none !important; }#engineControlsCard.genie-min { transform: translateX(105%); opacity: 1; }#devDrawerToggle { display: none; position: fixed; bottom: 16px; right: 16px; top: auto; z-index: 1001; background: #7a1f1f; color: #fff; border: 1px solid #f55; border-radius: 50%; width: 46px; height: 46px; padding: 0; font-size: 1.125rem; cursor: pointer; box-shadow: 0 0 12px rgba(0, 0, 0, 0.7); } body.dev-drawer-enabled #devDrawerToggle { display: block; }#engineControlsCard.active { display: block; position: fixed; top: 0; right: 0; left: auto; height: 100vh; width: 298px; max-width: 96vw; margin: 0; border-radius: 0; border-width: 0 0 0 2px; transform: translateX(105%); transition: transform 0.3s ease; z-index: 1000; max-height: none; box-shadow: -6px 0 24px rgba(0, 0, 0, 0.7); }#engineControlsCard.active.drawer-open { transform: translateX(0); }#drawerCloseBtn { display: block; position: absolute; top: 8px; right: 10px; background: 0 0; border: none; color: #f55; font-size: 1.375rem; line-height: 1; cursor: pointer; } .grid-container { padding: 0 2px; gap: 8px; justify-content: flex-start; } .unit-card { width: calc(50% - 4px); flex: 0 0 calc(50% - 4px); min-width: 0; } .unit-card .controls { display: flex; flex-wrap: wrap; justify-content: center; gap: 3px; } .unit-card .controls button { flex: 1 1 auto; min-width: 0; }#devModeContainer { margin: 10px 2px; width: calc(100% - 4px); }#devModeTable { font-size: 0.625rem; }#devModeContainer .inp-small { width: 24px; }}.unit-tip { position: fixed; z-index: 10010; display: none; pointer-events: none; max-width: 320px; box-sizing: border-box; background: linear-gradient(180deg, #1a1416, #0d0808); border: 1px solid #ff4d4d; border-radius: 8px; padding: 11px 13px; box-shadow: 0 8px 26px rgba(0, 0, 0, 0.65), 0 0 14px rgba(255, 77, 77, 0.28);}.unit-tip .ut-head { display: flex; gap: 11px; align-items: flex-start;}.unit-tip .ut-img { width: 54px; height: 64px; object-fit: cover; object-position: top; border-radius: 4px; border: 1px solid #553; flex-shrink: 0;}.unit-tip .ut-body { min-width: 0;}.unit-tip .ut-name { color: #ffb86c; font-weight: 700; font-size: 0.813rem; margin-bottom: 5px;}.unit-tip .ai-chips { display: flex; flex-wrap: wrap; gap: 5px; margin: 0;}.unit-tip .ut-pass { color: #d4c5a9; font-size: 0.719rem; line-height: 1.45; margin-top: 8px; border-top: 1px solid #3a2a2a; padding-top: 7px;}.unit-tip .ut-pass b { color: #ffb86c;}