78 lines
1.5 KiB
CSS
78 lines
1.5 KiB
CSS
:root {
|
|
--bg-primary: #1e1e2e;
|
|
--bg-secondary: #2a2a3e;
|
|
--bg-tertiary: #353550;
|
|
--text-primary: #cdd6f4;
|
|
--text-secondary: #a6adc8;
|
|
--text-muted: #6c7086;
|
|
--accent: #89b4fa;
|
|
--accent-hover: #74c7ec;
|
|
--danger: #f38ba8;
|
|
--success: #a6e3a1;
|
|
--warning: #f9e2af;
|
|
--border: #45475a;
|
|
--clip-handle: #ffffff;
|
|
--timeline-bg: #181825;
|
|
--placeholder-gradient: linear-gradient(90deg, #2a2a3e 25%, #353550 50%, #2a2a3e 75%);
|
|
--font-mono: 'SF Mono', 'Fira Code', monospace;
|
|
}
|
|
|
|
* {
|
|
margin: 0;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
body {
|
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
background: var(--bg-primary);
|
|
color: var(--text-primary);
|
|
overflow: hidden;
|
|
height: 100vh;
|
|
}
|
|
|
|
#app {
|
|
display: flex;
|
|
flex-direction: column;
|
|
height: 100vh;
|
|
}
|
|
|
|
/* Player mode: app shell becomes relative for overlay positioning */
|
|
.app-shell.player-mode {
|
|
position: relative;
|
|
}
|
|
|
|
button {
|
|
cursor: pointer;
|
|
border: none;
|
|
background: var(--bg-tertiary);
|
|
color: var(--text-primary);
|
|
padding: 6px 12px;
|
|
border-radius: 4px;
|
|
font-size: 13px;
|
|
}
|
|
|
|
button:hover {
|
|
background: var(--accent);
|
|
color: var(--bg-primary);
|
|
}
|
|
|
|
button:disabled {
|
|
opacity: 0.4;
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
input[type='text'] {
|
|
background: var(--bg-tertiary);
|
|
color: var(--text-primary);
|
|
border: 1px solid var(--border);
|
|
padding: 8px 12px;
|
|
border-radius: 4px;
|
|
font-size: 14px;
|
|
outline: none;
|
|
}
|
|
|
|
input[type='text']:focus {
|
|
border-color: var(--accent);
|
|
}
|