/* Timestamp Converter */
.timestamp-converter-panel [hidden] { display: none !important; }
.timestamp-converter-layout { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 18px; }
.timestamp-converter-card, .timestamp-converter-results, .timestamp-converter-current { border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }
.timestamp-converter-card { display: grid; align-content: start; gap: 10px; padding: 18px; }
.timestamp-converter-card-heading, .timestamp-converter-results-heading, .timestamp-converter-current { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.timestamp-converter-card-heading > span:first-child { color: var(--muted); font-size: 13px; font-weight: 700; }
.timestamp-converter-state { border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: 11px; font-weight: 800; padding: 4px 9px; }
.timestamp-converter-state.is-error { color: #ffb1b8; border-color: rgba(255,95,109,.42); background: rgba(255,95,109,.1); }
.timestamp-converter-card > label { color: var(--muted); font-size: 12px; font-weight: 700; }
.timestamp-converter-card .primary-button { margin-top: 4px; }
.timestamp-converter-zone-note { min-height: 18px; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.timestamp-converter-results { display: grid; gap: 16px; margin-top: 18px; padding: 18px; }
.timestamp-converter-results-heading h3 { margin: 0 0 4px; font-size: 16px; }
.timestamp-converter-results-heading p { margin: 0; color: var(--muted); font-size: 12px; }
.timestamp-converter-results-heading .ghost-button { min-height: 36px; padding-inline: 12px; font-size: 12px; }
.timestamp-converter-result-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 10px; }
.timestamp-converter-result-grid > div { display: grid; gap: 6px; min-width: 0; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--panel-2); padding: 12px; }
.timestamp-converter-result-grid span, .timestamp-converter-current span { color: var(--muted); font-size: 11px; font-weight: 700; }
.timestamp-converter-result-grid strong { overflow-wrap: anywhere; font-size: 14px; line-height: 1.45; }
.timestamp-converter-current { margin-top: 18px; padding: 15px 18px; }
.timestamp-converter-current > div { display: grid; gap: 4px; }
.timestamp-converter-current strong { color: var(--accent-strong); font: 800 20px/1.2 ui-monospace, monospace; }
.timestamp-converter-current small { color: var(--muted); font: 12px/1.4 ui-monospace, monospace; }
@media (max-width: 900px) { .timestamp-converter-result-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 620px) { .timestamp-converter-layout, .timestamp-converter-result-grid { grid-template-columns: minmax(0,1fr); } .timestamp-converter-card, .timestamp-converter-results { padding: 14px; } .timestamp-converter-results-heading, .timestamp-converter-current { align-items: stretch; flex-direction: column; } .timestamp-converter-results-heading .ghost-button, .timestamp-converter-current .secondary-button { width: 100%; } }