*,*::before,*::after { box-sizing:border-box; } html,body { margin:0; height:100%; } body { background:#F7F8FA; } .ico { display:inline-flex; align-items:center; justify-content:center; } .ico svg { display:block; } input.cmd, select.cmd { font-family:'Archivo',sans-serif; } input.cmd::placeholder { color:#A7B2BE; } input.cmd:focus, select.cmd:focus { border-color:#2F6FE0 !important; box-shadow:0 0 0 3px rgba(47,111,224,.12); } input[type=date].cmd::-webkit-calendar-picker-indicator { opacity:.45; cursor:pointer; } .navitem:hover { background:rgba(255,255,255,.06) !important; } @keyframes scrFade { from { opacity:0; } to { opacity:1; } } .screenfade { animation: scrFade .26s ease both; } .morph-clone { position:fixed; margin:0; z-index:99999; pointer-events:none; white-space:nowrap; transform-origin:0 0; font-family:'Archivo',sans-serif; } @keyframes mrevDown { from { opacity:0; transform:translateY(-16px); } to { opacity:1; transform:translateY(0); } } @keyframes mrevUp { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:translateY(0); } } @keyframes navFade { from { opacity:0; transform:translateX(-6px); } to { opacity:1; transform:translateX(0); } } /* Tracker long-press (hold to add/remove a requirement) */ .trk-cell { -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; transition:transform .12s ease, box-shadow .12s ease; } .trk-arming { animation: trkArm .35s ease forwards; } @keyframes trkArm { from { transform:scale(1); box-shadow:0 0 0 0 rgba(47,111,224,0); } 55% { box-shadow:0 0 0 3px rgba(47,111,224,.35); } to { transform:scale(1.22); box-shadow:0 0 0 4px rgba(47,111,224,.6); } } @keyframes trkToastIn { from { opacity:0; transform:translate(-50%,10px); } to { opacity:1; transform:translate(-50%,0); } } .trk-toast { animation: trkToastIn .2s ease both; } @media (prefers-reduced-motion: reduce) { .screenfade { animation: none; } .trk-arming { animation: none; box-shadow:0 0 0 3px rgba(47,111,224,.5); } .trk-toast { animation: none; } } .info-panel { max-height:0; } .info-panel.info-open { max-height:340px; } .col-grip { position:absolute; top:0; right:0; width:12px; height:100%; cursor:col-resize; z-index:8; touch-action:none; display:flex; align-items:center; justify-content:center; } .col-grip::after { content:''; width:2px; height:56%; border-radius:2px; background:#C4CCD4; transition:background .12s, height .12s; } .col-grip:hover::after, .col-grip:active::after { background:#2F6FE0; height:84%; } .prow:hover { background:#F8FAFD !important; } .prow:hover .openbtn { background:#2F6FE0; color:#fff; border-color:#2F6FE0; } .iconbtn:hover { background:#EEF2F6; } .delbtn:hover { background:#FDECEC !important; color:#DC2626 !important; } .copybtn:hover { filter:brightness(.96); } .actbtn:hover { background:#EEF2F6 !important; } .seg:hover { color:#1f2d3a; } .emailpre { font-family:'Archivo',-apple-system,'Segoe UI',sans-serif; font-size:13.5px; line-height:1.72; color:#28323C; white-space:pre-wrap; margin:0; } ::-webkit-scrollbar { width:9px; height:9px; } ::-webkit-scrollbar-thumb { background:#CBD3DC; border-radius:99px; border:2px solid #F7F8FA; } ::-webkit-scrollbar-thumb:hover { background:#A9B4C0; } /* ===================================================================== RESPONSIVE LAYER — additive only. Overrides the app's inline styles via !important + attribute / data-screen-label selectors. No markup, JS, data, or logic is changed; desktop/laptop render is untouched. Breakpoints: 768px (tablet), 480px (phone). ===================================================================== */ /* NOTE: the runtime re-serializes inline styles (": ", 0 -> 0px, hex -> rgb(), minmax(0,1fr) -> minmax(0px, 1fr)); selectors below match that serialized form. */ /* ---------- TABLET & SMALLER (<= 768px) ---------- */ @media (max-width:768px){ body{ overflow-x:hidden; } /* Sidebar collapse is handled in JS (state.sidebarCompact / Sidebar()), which swaps to an icons-only rail with hover tooltips below 900px — so no CSS overrides for