:root[data-font="mono"], :host([data-font="mono"]) { font-family: PTMono, monospace; }
:host { display:block; height:100%; color:var(--text); font-family:FalloutClassic,PTMono,monospace; }
#details { margin: 10px 0 0; color: var(--dim); font-size: 14px; white-space: pre-line; overflow-wrap: anywhere; }
.dim, #footer { color: var(--dim); font-size: 13px; }
#actions { display: flex; gap: 10px; margin-top: 20px; flex-shrink: 0; }
#actions button, #actions .button { flex: 1; min-width: 0; margin: 0; font-size: 15px; }
button, .button { border-color:var(--button-border); background:var(--button); color:var(--button-text); }
#primary, .button { background: var(--primary); color: var(--primary-text); }
#progress-text { color: var(--dim); font-size: 13px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; margin: 6px 0 0; flex-shrink: 0; }
#saves-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 16px; }
#saves-actions button { flex: 1; min-width: 150px; margin: 0; font-size: 14px; }
#footer { margin: 12px 0 0; flex-shrink: 0; }
#footer #build { display: block; margin-top: 4px; }
a { color: var(--dim); }
.button { display: grid; place-items:center; text-decoration: none; text-align: center; padding: 8px 14px; border-radius: 8px; min-height: 48px; border:1px solid var(--button-border); }
.button:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.button:active, button:active { background:var(--button-pressed); }
#note { margin-top: 14px; white-space: pre-line; }
progress { appearance: none; border: 1px solid #4c8f57; border-radius: 8px; overflow: hidden; background: #14281a; }
progress::-webkit-progress-bar { background: #14281a; }
progress::-webkit-progress-value { background: #3f9a4c; border-radius: 6px; }
progress::-moz-progress-bar { background: #3f9a4c; }
progress:indeterminate { background: linear-gradient(90deg,#14281a 0%,#3f9a4c 35%,#14281a 70%); background-size: 200% 100%; animation: scan 1.4s ease-in-out infinite alternate; }
@keyframes scan { from { background-position: 0% 0; } to { background-position: 100% 0; } }
@media (prefers-reduced-motion: reduce) { progress:indeterminate { animation: none; } }

#back { position:fixed; z-index:2; top:calc(env(safe-area-inset-top) + 10px); right:calc(env(safe-area-inset-right) + 10px); width:52px; height:52px; min-height:52px; margin:0; padding:12px; }
#back img { display:block; }
/* Leave room for the native corner control when a tall panel reaches it. */
@media (max-width: 720px) { body.has-game #launcher, :host(.has-game) #launcher { padding-top:calc(env(safe-area-inset-top) + 72px); } }
:host(.error) #message { color:var(--warning); }