/* THE ORDER — UI/UX refinement layer. Visual only; no game-state changes. */
:root{--ux-ease:cubic-bezier(.2,.75,.25,1);--ux-fast:160ms;--ux-med:240ms}
*{scrollbar-width:thin;scrollbar-color:#2b354a #080b12}*::-webkit-scrollbar{width:9px;height:9px}*::-webkit-scrollbar-track{background:#080b12}*::-webkit-scrollbar-thumb{background:#2b354a;border:2px solid #080b12;border-radius:8px}*::-webkit-scrollbar-thumb:hover{background:#3a4862}
button,.sidebar-item,.sidebar-subitem,input,select,textarea,.panel,.planet-panel,.gm-char-card{transition:border-color var(--ux-fast) var(--ux-ease),background var(--ux-fast) var(--ux-ease),color var(--ux-fast) var(--ux-ease),opacity var(--ux-fast) var(--ux-ease),transform var(--ux-fast) var(--ux-ease),box-shadow var(--ux-fast) var(--ux-ease)}
button:focus-visible,.sidebar-item:focus-visible,.sidebar-subitem:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid rgba(85,168,255,.65);outline-offset:2px}
button:disabled{cursor:wait;opacity:.58!important;filter:saturate(.65)!important;transform:none!important}.ux-busy{position:relative;padding-right:34px!important}.ux-busy:after{content:"";position:absolute;right:12px;top:50%;width:12px;height:12px;margin-top:-7px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:uxSpin .65s linear infinite}@keyframes uxSpin{to{transform:rotate(360deg)}}
/* stacked toasts */
#ux-toast-stack{position:fixed;right:22px;top:82px;z-index:10050;width:min(390px,calc(100vw - 28px));display:grid;gap:9px;pointer-events:none}.ux-toast{pointer-events:auto;display:grid;grid-template-columns:30px 1fr 24px;gap:10px;align-items:start;padding:13px 12px;border:1px solid rgba(153,170,205,.2);border-left:2px solid #55a8ff;border-radius:7px;background:linear-gradient(135deg,rgba(15,21,34,.98),rgba(8,12,20,.98));box-shadow:0 18px 50px rgba(0,0,0,.42);animation:uxToastIn .24s var(--ux-ease) both}.ux-toast.success{border-left-color:#37d17a}.ux-toast.error{border-left-color:#ef5350}.ux-toast.info{border-left-color:#55a8ff}.ux-toast-icon{width:28px;height:28px;border:1px solid rgba(85,168,255,.25);display:grid;place-items:center;border-radius:50%;color:#8dc7ff;font-weight:900}.ux-toast.success .ux-toast-icon{color:#62e49a;border-color:rgba(55,209,122,.25)}.ux-toast.error .ux-toast-icon{color:#ff817e;border-color:rgba(239,83,80,.25)}.ux-toast strong{display:block;color:#f3f6fb;font-size:12px;letter-spacing:.35px;margin:1px 0 3px}.ux-toast p{margin:0;color:#98a4ba;font-size:12px;line-height:1.45}.ux-toast-close{all:unset;cursor:pointer;color:#6f7b91;font-size:18px;line-height:20px;text-align:center}.ux-toast-close:hover{color:#fff}.ux-toast.out{animation:uxToastOut .18s ease forwards}@keyframes uxToastIn{from{opacity:0;transform:translateX(18px) scale(.98)}to{opacity:1;transform:none}}@keyframes uxToastOut{to{opacity:0;transform:translateX(16px)}}
/* command palette */
.ux-command-overlay{position:fixed;inset:0;z-index:10040;background:rgba(2,4,8,.68);backdrop-filter:blur(7px);display:grid;place-items:start center;padding-top:min(14vh,130px)}.ux-command-overlay[hidden]{display:none}.ux-command{width:min(680px,calc(100vw - 28px));border:1px solid rgba(153,170,205,.22);border-radius:9px;background:linear-gradient(180deg,#101623,#090d16);box-shadow:0 35px 100px rgba(0,0,0,.62);overflow:hidden}.ux-command-head{display:flex;align-items:center;gap:12px;padding:15px 17px;border-bottom:1px solid rgba(153,170,205,.13)}.ux-command-mark{color:#f3c94f;font-size:18px}.ux-command-input{flex:1!important;margin:0!important;border:0!important;background:transparent!important;box-shadow:none!important;font-size:15px!important;color:#f4f7fb!important;padding:5px!important;outline:0!important}.ux-command-key{font-size:9px;color:#738099;border:1px solid #293246;padding:3px 6px;border-radius:4px}.ux-command-list{max-height:430px;overflow:auto;padding:7px}.ux-command-item{width:100%;display:flex;align-items:center;gap:12px;text-align:left;background:transparent!important;border:1px solid transparent!important;padding:11px 12px!important;margin:0!important;color:#c8d1e1!important}.ux-command-item:hover,.ux-command-item.selected{background:rgba(85,168,255,.07)!important;border-color:rgba(85,168,255,.15)!important;color:#fff!important}.ux-command-item b{width:26px;height:26px;display:grid;place-items:center;border:1px solid #273146;border-radius:5px;color:#8dbbe8;font-size:11px}.ux-command-item span{display:flex;flex-direction:column;gap:2px}.ux-command-item small{color:#69758d;font-size:9px;letter-spacing:.8px}.ux-command-empty{padding:28px;text-align:center;color:#6f7b91;font-size:12px}.ux-command-foot{padding:9px 14px;border-top:1px solid rgba(153,170,205,.1);font-size:9px;color:#657087;letter-spacing:.7px}
/* contextual quick action */
.ux-quick{position:fixed;right:24px;bottom:24px;z-index:8000;border:1px solid rgba(243,201,79,.28)!important;background:linear-gradient(135deg,#20283a,#151b29)!important;color:#f6e6aa!important;padding:10px 14px!important;box-shadow:0 12px 32px rgba(0,0,0,.3)!important;font-size:11px!important;letter-spacing:.7px!important}.ux-quick:hover{border-color:rgba(243,201,79,.55)!important;transform:translateY(-1px)!important}.ux-quick kbd{margin-left:8px;color:#7f8aa5;font:9px inherit}
/* richer empty states without touching renderers */
.empty-state{min-height:76px;display:flex;align-items:center;justify-content:center;text-align:center;line-height:1.6;background:linear-gradient(135deg,rgba(255,255,255,.018),rgba(85,168,255,.018))!important}.empty-state:before{content:"◇";margin-right:10px;color:#52617c;font-size:18px}
/* better form readability */
label{color:#aeb8ca}input:hover,select:hover,textarea:hover{border-color:#35425e}input:focus,select:focus,textarea:focus{border-color:#4f78a8!important;box-shadow:0 0 0 3px rgba(85,168,255,.07)!important}.modal-overlay,.order-dialog-overlay{backdrop-filter:blur(5px)}
@media(max-width:860px){#ux-toast-stack{right:14px;top:70px}.ux-quick{right:14px;bottom:14px}.ux-command-overlay{padding-top:70px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* 0.7.2 — interaction quality layer */
.order-dialog-card #order-dialog-message{white-space:pre-line;line-height:1.65}.order-dialog-card #order-dialog-message:not(:empty){padding:10px 12px;border:1px solid rgba(126,145,180,.16);border-radius:6px;background:rgba(3,7,14,.28);color:#aeb9cc}
.ux-page-enter{animation:uxPageEnter .22s var(--ux-ease) both}@keyframes uxPageEnter{from{opacity:.25;transform:translateY(4px)}to{opacity:1;transform:none}}
button[disabled]:not(.ux-busy){cursor:not-allowed!important}.ux-disabled-reason{position:fixed;z-index:10100;max-width:280px;padding:8px 10px;border:1px solid #303b53;border-radius:6px;background:#0b101a;color:#aeb8ca;font-size:11px;line-height:1.4;box-shadow:0 12px 34px rgba(0,0,0,.4);pointer-events:none;animation:uxToastIn .12s ease both}
.ux-action-flash{position:fixed;z-index:10020;pointer-events:none;font-size:10px;font-weight:800;letter-spacing:.7px;color:#6ee7a1;text-shadow:0 0 14px rgba(55,209,122,.45);animation:uxActionFlash .85s ease both}@keyframes uxActionFlash{0%{opacity:0;transform:translateY(4px)}20%{opacity:1}100%{opacity:0;transform:translateY(-18px)}}
.ux-value-changed{animation:uxValueChanged .7s ease}@keyframes uxValueChanged{0%,100%{box-shadow:inherit}35%{box-shadow:0 0 0 1px rgba(55,209,122,.28),0 0 22px rgba(55,209,122,.12)}}

/* 0.7.3 — geometry-aware skeletons. The loader mirrors the target page instead of using one generic shape. */
/* 0.7.4 — navigation, forms and interaction polish */
#system-breadcrumb{display:flex;align-items:center;gap:7px}.ux-crumb-home{color:#7f8ba3}.ux-crumb-home:hover{color:#dce5f3}.ux-crumb-home+i,#system-breadcrumb i{font-style:normal;color:#3d475b}#system-breadcrumb b{color:#aeb9cc;font-weight:700}
.sidebar{position:relative}.ux-nav-marker{position:absolute;right:0;top:0;width:2px;min-height:24px;background:#f0c93e;box-shadow:0 0 12px rgba(240,201,62,.45);transition:transform .22s cubic-bezier(.2,.8,.2,1),height .22s ease;pointer-events:none;z-index:5}.sidebar-item,.sidebar-subitem{position:relative}.sidebar-item.ux-unread:after,.sidebar-subitem.ux-unread:after{content:"";position:absolute;right:10px;top:50%;width:5px;height:5px;border-radius:50%;background:#4bb7e8;box-shadow:0 0 9px rgba(75,183,232,.65)}
.ux-number-readable{display:block;margin:4px 0 0;color:#66748c;font-size:9px;letter-spacing:.35px;min-height:12px}.ux-amount-quick{display:flex;gap:5px;margin-top:6px}.ux-amount-quick button{min-height:24px!important;padding:3px 8px!important;font-size:9px!important;letter-spacing:.45px!important;background:#111827!important;border:1px solid #28334a!important;color:#8996ae!important}.ux-amount-quick button:hover{color:#e7edf7!important;border-color:#435474!important}
.ux-rich-hover{transition:transform .15s ease,border-color .15s ease,background .15s ease,box-shadow .15s ease}.ux-rich-hover:hover{transform:translateY(-1px);border-color:rgba(101,131,185,.35)!important;background-color:rgba(28,36,55,.72)!important;box-shadow:0 9px 24px rgba(0,0,0,.16)}
.ux-context-menu{position:fixed;z-index:11000;min-width:190px;padding:5px;border:1px solid #2a354c;border-radius:7px;background:#0b101a;box-shadow:0 18px 45px rgba(0,0,0,.5)}.ux-context-menu button{width:100%;text-align:left;background:transparent!important;border:0!important;padding:9px 10px!important;color:#b9c4d7!important}.ux-context-menu button:hover{background:rgba(85,168,255,.08)!important;color:#fff!important}
.ux-number-change{position:relative;animation:uxNumberPulse .9s ease}.ux-number-change:after{content:attr(data-ux-delta);position:absolute;left:0;top:calc(100% + 3px);z-index:6;white-space:nowrap;color:#6ee7a1;font-size:8px;font-weight:700;letter-spacing:.3px;animation:uxDelta 1.25s ease both}@keyframes uxNumberPulse{30%{text-shadow:0 0 16px rgba(80,210,145,.5);color:#9bf0bd}100%{text-shadow:none}}@keyframes uxDelta{0%{opacity:0;transform:translateY(3px)}20%,65%{opacity:1}100%{opacity:0;transform:translateY(-8px)}}
.ux-undo{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);z-index:11010;display:flex;align-items:center;gap:18px;padding:10px 12px 10px 14px;border:1px solid #303b53;border-radius:7px;background:#0b101a;color:#b9c4d7;box-shadow:0 16px 42px rgba(0,0,0,.45);font-size:11px}.ux-undo button{padding:5px 9px!important;border:1px solid rgba(243,201,79,.32)!important;background:rgba(243,201,79,.06)!important;color:#f3d56d!important;font-size:10px!important}
[data-ux-dirty="1"]{border-color:rgba(243,201,79,.24)!important}
@media(prefers-reduced-motion:reduce){.ux-nav-marker,.ux-rich-hover{transition:none!important}.ux-number-change,.ux-number-change:after{animation:none!important}}

/* 0.7.5 — cleaner upgrade preview + exchange field alignment */
.order-dialog-card.order-dialog-wide{width:min(620px,94vw)}
.order-dialog-card #order-dialog-message.order-dialog-rich{padding:0;border:0;background:transparent;color:inherit;white-space:normal}
.upgrade-preview{display:grid;gap:14px}.upgrade-preview-project{padding:14px 15px;border:1px solid #303a52;border-radius:9px;background:linear-gradient(145deg,rgba(22,28,45,.86),rgba(8,12,22,.76))}.upgrade-preview-project small,.upgrade-preview-section-title{display:block;color:#7d88a5;font-size:9px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}.upgrade-preview-project strong{display:block;margin:5px 0 12px;color:#edf1fb;font-size:15px}.upgrade-preview-project>div{display:flex;align-items:center;gap:9px;color:#8d97b2;font-size:11px}.upgrade-preview-project>div span{margin-right:auto}.upgrade-preview-project>div b{min-width:29px;padding:5px 8px;border:1px solid #35415d;border-radius:6px;background:#0b101c;color:#cbd3e6;text-align:center}.upgrade-preview-project>div b.next{border-color:#7b681e;background:rgba(250,204,21,.08);color:#f4d65d}.upgrade-preview-project>div i{color:#68738e;font-style:normal}.upgrade-preview-section-title{margin-top:2px}.upgrade-preview-rows{overflow:hidden;border:1px solid #293249;border-radius:9px;background:#090d17}.upgrade-preview-row{display:grid;grid-template-columns:minmax(120px,1fr) minmax(220px,1.4fr) auto;gap:12px;align-items:center;min-height:45px;padding:8px 12px;border-bottom:1px solid rgba(68,79,108,.38)}.upgrade-preview-row:last-child{border-bottom:0}.upgrade-preview-row>span{color:#aab3c8;font-size:11px}.upgrade-preview-values{display:flex;align-items:center;justify-content:flex-end;gap:8px;font-variant-numeric:tabular-nums}.upgrade-preview-values b{color:#d7ddeb;font-size:11px;font-weight:700}.upgrade-preview-values b.after{color:#eef2fa}.upgrade-preview-values i{color:#56627e;font-style:normal}.upgrade-preview-row>em{min-width:88px;color:#d98b92;font-size:10px;font-style:normal;text-align:right;font-variant-numeric:tabular-nums}.upgrade-preview-note{color:#68748f;font-size:10px;line-height:1.45}
.exchange-modal-two{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}.exchange-modal-two>label{min-width:0;align-self:start}.exchange-modal-two>label>input{box-sizing:border-box;width:100%!important;height:57px;min-height:57px}.exchange-modal-two .ux-number-readable{height:12px;margin-top:4px}.exchange-modal-two .ux-amount-quick{height:26px;margin-top:6px}
@media(max-width:600px){.upgrade-preview-row{grid-template-columns:1fr auto}.upgrade-preview-values{grid-column:1/3;justify-content:flex-start}.upgrade-preview-row>em{grid-column:2;grid-row:1}.exchange-modal-two>label>input{height:50px;min-height:50px}}

/* 0.7.8 convenience */
.ux-money-hint{display:block;margin-top:5px;color:#68758e;font-size:9px;line-height:1.4}.ux-money-hint b{color:#9aa7c0}.ux-money-hint span{color:#d8c35c;font-weight:700}.ux-money-invalid{border-color:#9d4148!important}.planet-overview-search{display:flex;align-items:center;gap:9px;margin:0 0 12px;max-width:430px}.planet-overview-search input{width:100%;box-sizing:border-box;background:#0b101c;border:1px solid #2b354c;border-radius:7px;color:#e4e9f4;padding:10px 12px}.planet-overview-search span{color:#69758e;font-size:10px;white-space:nowrap}.planet-bar .char-chip.planet-search-hidden{display:none!important}
