.ttform-expired {
    background-color: #f3f4f6 !important;
    color: red !important;
}

.ttform-active {
    background-color: #f0fdf4 !important;
    border-left: 4px solid #22c55e !important;
    color: red !important;
}

.ttform-future {
    background-color: #fefce8 !important;
    color: green !important;
}

.focus-mode-text {
    font-size: 1.5rem;
    line-height: 2.2rem;
}

.tt-message-page {
    min-height: 500px;
}

.live-reader-grid {
    display: grid;
    gap: 1.5rem;
    grid-template-rows: auto 1fr auto;
}

.tt-message-page {
    min-height: 500px;
    max-height: calc(100vh - 400px);
    overflow-y: auto;
    border: 1px solid #d1d5db;
    border-radius: 1rem;
    padding: 2rem;
    background: white;

    box-shadow:
        0 1px 2px rgba(0,0,0,.05),
        0 4px 12px rgba(0,0,0,.04);
}

.tt-reader-header,
.tt-reader-footer {
    border: 1px solid #e5e7eb;
    border-radius: .75rem;
    padding: 1rem;
    background: #f9fafb;
}

.tt-reader-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    text-align: center;
}

.tt-message-content {
    white-space: pre-line;
}

.tt-nickname {
    text-align: right;
}

.tt-focus-mode aside,
.tt-focus-mode nav,
.tt-focus-mode header {
    display: none !important;
}

.tt-new-messages {
    animation: pulse 1s infinite;
    color: #f59e0b;
}

.tt-buttons button, .tt-buttons div {
    padding-left: 15px;
    margin-left: 15px;
}
