/* Source module: dialog.css */ .window { border: 1px solid #6c5a37; background: #050606; box-shadow: 0 18px 38px rgba(0, 0, 0, 0.8), inset 0 0 0 1px #0e1418; overflow: hidden; } .window-titlebar { position: relative; isolation: isolate; overflow: hidden; height: 28px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 8px; background: linear-gradient(#5a7099, #415272 55%, #313e58); border-bottom: 1px solid #1d2735; color: #f0f2ef; text-shadow: 0 1px 1px #000; font-size: 13px; transition: background 0.12s linear, color 0.12s linear; } .window-titlebar > :not(.window-title-effect) { position: relative; z-index: 2; } .window-titlebar .title { grid-column: 2; } .window-titlebar .close { width: 10px; height: 9px; image-rendering: auto; } .window-titlebar > .dialog-icon-button { grid-column: 3; justify-self: end; } .window-titlebar .title-actions { grid-column: 3; justify-self: end; display: flex; align-items: center; gap: 8px; } .window-titlebar .title-actions img { flex: 0 0 auto; image-rendering: pixelated; object-fit: contain; } .dialog-icon-button { appearance: none; width: 20px; height: 20px; padding: 0; display: inline-flex; align-items: center; justify-content: center; border: 0; background: none; box-shadow: none; cursor: pointer; } .dialog-icon-button > img { display: block; transform: translateY(0); filter: brightness(1); } .dialog-icon-button:hover > img, .dialog-icon-button:focus-visible > img, .dialog-icon-button:active > img { filter: brightness(1.28); } .dialog-icon-button:focus-visible { outline: 1px solid rgba(225, 204, 135, 0.72); outline-offset: -2px; } .dialog-icon-button:active > img { transform: translateY(1px); } .dialog-icon-button[aria-pressed="true"] > img { filter: brightness(1.28); } .window.is-unfocused > .window-titlebar { background: linear-gradient(#303b50, #263247 56%, #1d2839); color: #8993a0; text-shadow: 0 1px 1px #0a0d12; } .window.is-focused > .window-titlebar { background: linear-gradient(#6079a5, #435a80 55%, #30425f); color: #f4f6f2; } .window-title-effect { position: absolute; z-index: 1; left: 50%; top: 0; width: 1100px; height: 100%; max-width: none; transform: translateX(-50%); object-fit: fill; pointer-events: none; mix-blend-mode: screen; filter: brightness(1.55) contrast(1.06); opacity: 0.72; image-rendering: auto; } .window.is-unfocused > .window-titlebar .window-title-effect { display: none; } .window-content { min-height: 230px; padding: 14px; background: linear-gradient( 135deg, rgba(31, 36, 40, 0.82), rgba(4, 5, 5, 0.98) ); } .window-footer { height: 38px; padding: 4px 8px; display: flex; align-items: center; justify-content: flex-end; gap: 8px; border-top: 1px solid #332c22; background: linear-gradient(#20201d, #11110f); } .dialog-body-shell { padding: 10px !important; background: rgba(4, 5, 5, 0.82) !important; } .dialog-content-well { min-height: 0; padding: 0; border: 1px solid #262824; background: #000; color: var(--gold); } .dialog-body-shell > .dialog-content-well { min-height: 248px; } .dialog-footer { position: relative; background: rgba(4, 5, 5, 0.82); border-top-color: #2b2924; } .dialog-status { min-width: 0; margin-right: auto; color: #8fc885; font-size: 11px; line-height: 1; white-space: nowrap; } .dialog-status:empty { display: none; } .dialog-status.is-updated { animation: dialog-status-pulse 0.32s ease-out; } @keyframes dialog-status-pulse { from { opacity: 0.35; transform: translateY(1px); } to { opacity: 1; transform: translateY(0); } } .window.is-demo-dismissed { animation: dialog-dismiss-feedback 0.28s ease-out; } @keyframes dialog-dismiss-feedback { 50% { opacity: 0.58; } } .sheet-filter-button { appearance: none; padding: 2px 3px; border: 0; background: none; color: #9c8e64; font: inherit; cursor: pointer; } .sheet-filter-button:hover, .sheet-filter-button:focus-visible, .sheet-filter-button:active, .sheet-filter-button[aria-pressed="true"] { color: #d9c78a; outline: none; } .sheet-filter-button:active { transform: translateY(1px); } .sheet { width: 390px; } .sheet .window-content { min-height: 340px; } .sheet-tabs { display: flex; height: 30px; border-bottom: 1px solid #7b6439; } .sheet-tab { flex: 1; display: flex; align-items: center; justify-content: center; color: #b8a36b; border-right: 1px solid #322b20; } .sheet-tab.selected { color: #f2d97c; background: #271e0d; } .inventory-grid { display: grid; grid-template-columns: repeat(6, 38px); gap: 4px; margin-top: 12px; } .item-slot { position: relative; width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; background: #080909; border: 1px solid #3e3524; } .item-slot.rare, .item-slot.epic { border-color: #3e3524; box-shadow: none; } .item-slot.rare::after, .item-slot.epic::after { content: ""; position: absolute; z-index: 2; left: 50%; top: 50%; width: 28px; height: 28px; transform: translate(-50%, -50%); background-repeat: no-repeat; background-size: 28px 28px; pointer-events: none; image-rendering: pixelated; } .item-slot.rare::after { background-image: url("../img/equipment-rarity/rare.png"); } .item-slot.epic::after { background-image: url("../img/equipment-rarity/epic.png"); } .item-slot img { width: 28px; height: 28px; image-rendering: pixelated; } .popover { width: 420px; padding: 12px 14px; border: 1px solid #5e4d2d; background: rgba(4, 5, 4, 0.97); color: var(--gold); box-shadow: 0 12px 26px #000; } .popover-cols { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; } .popover h4 { margin: 0 0 7px; color: #d8bd5d; font-size: 13px; } .tooltip { padding: 5px 7px; border: 1px solid #6c5c3d; background: #020302; color: #f5f5ef; box-shadow: 0 6px 14px #000; font-size: 12px; } .tooltip.rich { width: 310px; padding: 10px; color: #e8e5da; line-height: 1.35; } .tooltip.rich strong { color: #e2c962; }