/* ------------ Tweaks Panel ------------ */ #tweaks-panel { position: fixed; right: 20px; bottom: 20px; z-index: 9999; width: 320px; background: var(--paper); color: var(--ink); border: 1px solid var(--rule); box-shadow: 0 20px 60px rgba(0,0,0,0.18); padding: 20px; font-family: var(--font-body); font-size: 13px; display: none; max-height: 80vh; overflow-y: auto; } #tweaks-panel.show { display: block; } #tweaks-panel h5 { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--brass); margin: 14px 0 8px; } #tweaks-panel h5:first-child { margin-top: 0; } #tweaks-panel .header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; padding-bottom: 10px; border-bottom: 1px solid var(--rule); } #tweaks-panel .header .title { font-family: var(--font-display); font-size: 20px; font-weight: 500; } #tweaks-panel .opts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px; } #tweaks-panel .opt { border: 1px solid var(--rule); padding: 8px 10px; font-size: 11.5px; cursor: pointer; text-align: left; transition: background 0.2s, border-color 0.2s; background: var(--bg); } #tweaks-panel .opt:hover { background: var(--hover-bg); } #tweaks-panel .opt.active { background: var(--ink); color: var(--bg); border-color: var(--ink); } #tweaks-panel .opts.three { grid-template-columns: repeat(3, 1fr); } /* Touch: disable hover-only affordances for coarse-pointer devices */ @media (hover: none) { .contact-card:hover { background: color-mix(in oklab, var(--bg) 6%, var(--ink)); border-color: rgba(255,255,255,0.10); } .area:hover { background-color: transparent; } .area:hover::before { transform: none; } .area:hover .area-roman { color: var(--ink); transform: none; } .step:hover { background: transparent; } .step:hover::after { transform: none; } .value:hover { background: var(--bg); } .value:hover::after { transform: none; } } @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.05ms !important; } } /* Critical chat-panel hide — keeps the panel out of flow and invisible from frame 0, BEFORE the deferred chat CSS at the end of loads. Without these rules, the parser renders the panel inline at its DOM position with all its content visible, until the late