/* Daily Field Log — Field Companion design language. These are the keyframes, scrollbar-hide and qty-input rules
   lifted verbatim from the Claude-Design mockup's <style> block. The screen's color tokens (--brand, --surface…)
   are injected as inline CSS vars on the screen root (.dfl-root) by fieldLog.js, matching the design's tokens(mode). */
.dfl-root { font-family: 'Plus Jakarta Sans', system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
.dfl-scroll::-webkit-scrollbar { width: 0; height: 0; }
.dfl-scroll { scrollbar-width: none; }
.dfl-qty {
    font: 700 17px 'IBM Plex Mono';
    color: var(--ink);
    text-align: right;
    width: 84px;
    padding: 9px 11px;
    border: 1.5px solid var(--border);
    border-radius: 12px;
    background: var(--surface-2);
    outline: none;
}
.dfl-qty:focus { border-color: var(--brand); box-shadow: 0 0 0 4px rgba(78, 110, 242, .14); }
@keyframes dfl-pop { 0% { transform: scale(.9); opacity: 0 } 100% { transform: scale(1); opacity: 1 } }
@keyframes dfl-pulse { 0%, 100% { opacity: 1 } 50% { opacity: .35 } }
@keyframes dfl-spin { to { transform: rotate(360deg) } }

/* Same safe-area treatment as .pw-screen (see teamchat.css): the daily log builds its own 56px
   header, which sat under the status bar in standalone mode. */
.dfl-root::before { content: ''; display: block; flex: none; height: env(safe-area-inset-top, 0px); }