* { box-sizing: border-box; }
body { margin: 0; background: var(--tt-bg, #f5f7fb); color: var(--tt-text, #172033); font-family: var(--tt-font, Arial, sans-serif); }
.shell { max-width: var(--tt-maxw, 1120px); margin: 0 auto; padding: 42px 22px 70px; }
.intro { max-width: 720px; margin-bottom: 24px; }
.eyebrow { color: var(--tt-primary, #2563eb); font-size: .77rem; font-weight: 800; letter-spacing: .12em; margin: 0 0 8px; }
h1 { font-size: clamp(2rem, 5vw, 3.2rem); margin: 0 0 10px; line-height: 1.05; }
.intro p:not(.eyebrow) { color: var(--tt-muted, #5d6b82); margin: 0; line-height: 1.55; }
.tool-card, .panel, .summary article { background: var(--tt-surface, #ffffff); border: 1px solid var(--tt-line, #d9e1ef); border-radius: var(--tt-radius, 12px); box-shadow: var(--tt-shadow, 0 5px 18px rgba(23,32,51,.06)); }
.tool-card { padding: 20px; }
.controls { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.field label, .options > label { display: block; font-weight: 700; font-size: .9rem; margin-bottom: 7px; }
.field label span { color: var(--tt-muted, #5d6b82); font-weight: 400; }
input[type=file], select, textarea { width: 100%; border: 1px solid var(--tt-line, #d9e1ef); border-radius: 8px; color: var(--tt-text, #172033); background: var(--tt-surface-soft, #fbfdff); padding: 9px; }
textarea { height: 150px; margin-top: 9px; font: 13px/1.5 ui-monospace, monospace; resize: vertical; }
.options { display: flex; align-items: end; gap: 13px; flex-wrap: wrap; margin-top: 16px; }
.options select { width: 130px; }.options .check { margin: 0 8px 8px 0; font-weight: 500; }
button { border: 0; border-radius: 8px; padding: 11px 15px; background: var(--tt-primary, #2563eb); color: white; cursor: pointer; font-weight: 750; } button:hover { background: var(--tt-primary-dark, #1d4ed8); }
.privacy { margin: 15px 0 0; font-size: .88rem; color: var(--tt-success, #087443); }
.summary, .results-grid { display: grid; gap: 14px; margin-top: 18px; }.summary { grid-template-columns: repeat(3, 1fr); }.summary article { padding: 14px; }.summary span { display: block; color: var(--tt-muted, #5d6b82); font-size: .82rem; }.summary strong { display: block; margin-top: 4px; font-size: 1.45rem; }
.results-grid { grid-template-columns: repeat(2, 1fr); }.panel { padding: 16px; min-height: 130px; }.panel h2 { font-size: 1rem; margin: 0 0 10px; }.panel div, pre { font-size: .9rem; line-height: 1.6; margin: 0; white-space: pre-wrap; word-break: break-word; }.export { background: var(--tt-surface-soft, #fbfdff); }.export button { margin-top: 12px; font-size: .8rem; }.afterword { margin-top: 28px; }
.item { padding: 6px 0; border-bottom: 1px solid var(--tt-line, #d9e1ef); }.item:last-child { border: 0; }.muted { color: var(--tt-muted, #5d6b82); }
@media (max-width: 720px) { .shell { padding: 28px 14px; }.controls, .results-grid { grid-template-columns: 1fr; }.summary { grid-template-columns: 1fr 1fr; } }