/* cartesianecu.com/tools/: the ECU Identifier (owner 2026-11-10). The page's hero is the distributors' (dist-hero, body.dist-page);
   below it one card at a time: the drop zone, the busy line, the result, the pause. Plain editorial layout, no badges, no glow;
   the site's tokens (--panel, --line, --accent, --text, --muted) and its button classes. */
.idt-wrap{max-width:760px}
.tools-page .section.idt{padding-top:28px}

/* the drop zone: a form that is a target (drag and drop) and a button (click, Enter, Space open the file dialog) */
.idt-drop{position:relative;display:block;padding:40px 24px 32px;border:1.5px dashed var(--line2);border-radius:18px;background:var(--panel);text-align:center;cursor:pointer;transition:border-color .15s,background .15s}
.idt-drop:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media (hover:hover){.idt-drop:hover{border-color:var(--accent)}}
.idt-drop.is-over{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--panel))}
.idt-file{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.idt-drop-in{display:flex;flex-direction:column;align-items:center;gap:10px}
.idt-ico{width:44px;height:44px;color:var(--accent)}
.idt-drop-t{margin:4px 0 0;font-size:20px;font-weight:600;color:var(--text)}
.idt-drop-s{margin:0;color:var(--muted);font-size:14px}
.idt-drop .btn{margin-top:4px}
.idt-note{margin:14px 0 0;max-width:520px;color:var(--muted);font-size:14px;line-height:1.5}

/* busy: one line and a bar that runs while the engine reads */
.idt-busy{padding:28px 24px;border:1px solid var(--line);border-radius:18px;background:var(--panel);text-align:center}
.idt-bar{position:relative;height:3px;margin:0 auto 18px;max-width:320px;border-radius:2px;background:var(--line);overflow:hidden}
.idt-bar::after{content:"";position:absolute;inset:0 auto 0 -40%;width:40%;border-radius:2px;background:var(--accent);animation:idtRun 1.1s ease-in-out infinite}
@keyframes idtRun{to{inset-inline-start:100%}}
.idt-busy p{margin:0;color:var(--muted);font-size:15px}
.idt-fname{color:var(--text);word-break:break-all}
@media (prefers-reduced-motion:reduce){.idt-bar::after{animation:none;inset:0;width:auto;opacity:.5}}

/* the result: the unit's name large, the make line under it, then CARTESIAN's word and its plans */
.idt-result,.idt-limit{padding:32px 28px;border:1px solid var(--line);border-radius:18px;background:var(--panel)}
.idt-result:focus{outline:none}
.idt-ecu{margin:4px 0 8px;font-size:clamp(26px,4vw,38px);font-weight:700;line-height:1.15;letter-spacing:-.01em;color:var(--text);word-break:break-word}
.idt-makes{margin:0 0 22px;font-size:16px;color:var(--text);line-height:1.5}
.idt-makes-l{color:var(--muted)}
.idt-cart{margin-top:22px;padding-top:22px;border-top:1px solid var(--line)}
.idt-cart-t{margin:0 0 14px;font-size:16px;font-weight:600;color:var(--text);line-height:1.45}
.idt-no{font-weight:500;color:var(--muted)}
.idt-plans{list-style:none;margin:0 0 18px;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.idt-plans li{padding:14px 14px 12px;border:1px solid var(--line);border-radius:12px;background:var(--bg)}
.idt-plans .idt-plan-n{display:block;font-weight:600;color:var(--text);margin-bottom:4px}
.idt-plans .idt-plan-f{display:block;font-size:14px;color:var(--muted);line-height:1.4}
.idt-plans .idt-plan-p{display:block;margin-top:8px;font-size:14px;color:var(--text)}
.idt-plans .idt-plan-p b{font-size:17px}
.idt-left{margin:22px 0 0;color:var(--muted);font-size:14px}
.idt-result .btn-ghost{margin-top:14px}
@media (max-width:640px){.idt-plans{grid-template-columns:1fr}.idt-result,.idt-limit{padding:24px 18px}.idt-drop{padding:32px 16px 26px}}

/* the pause: the day's five are used; a calm card with the time to the next one */
.idt-limit{text-align:center}
.idt-limit h2{margin:4px 0 10px;font-size:clamp(24px,3.6vw,32px);font-weight:700;color:var(--text)}
.idt-limit p{margin:0 auto;max-width:460px;color:var(--muted);font-size:15px;line-height:1.5}
.idt-timer{margin:18px auto 20px;font-size:clamp(40px,8vw,60px);font-weight:600;letter-spacing:.04em;color:var(--text);font-variant-numeric:tabular-nums;line-height:1}
.idt-limit .idt-note{margin:0 auto 20px}

.idt-err{margin:16px 0 0;padding:14px 16px;border:1px solid color-mix(in srgb,var(--accent) 45%,var(--line));border-radius:12px;background:color-mix(in srgb,var(--accent) 8%,var(--panel));color:var(--text);font-size:15px;line-height:1.5}
.idt-err[hidden],.idt-drop[hidden],.idt-busy[hidden],.idt-result[hidden],.idt-limit[hidden]{display:none}   /* the cards set display themselves: hidden must still win */
.idt-nojs{margin:16px 0 0;color:var(--muted);font-size:14px}
