.date-difference-tool{padding:20px;border:1px solid var(--line);border-radius:22px;background:var(--white);box-shadow:0 14px 40px rgba(39,35,27,.0431372549)}.date-difference-fields{display:grid;grid-template-columns:repeat(2, minmax(0, 1fr));gap:14px}.date-panel{min-width:0;margin:0;padding:18px;border:1px solid var(--line);border-radius:14px;background:var(--paper)}.date-panel legend{padding:0;font-size:15px;font-weight:800}.date-field-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0 13px}.date-panel label,.date-options>label:not(.date-check){display:grid;gap:7px;color:var(--muted);font-size:11px;font-weight:700}.date-panel input,.date-options select{width:100%;padding:11px;border:1px solid var(--line);border-radius:8px;background:var(--white);color:var(--ink);font:13px inherit}.date-panel input:focus,.date-options select:focus{outline:2px solid var(--lime);outline-offset:1px}.date-options{display:grid;grid-template-columns:repeat(3, minmax(0, 1fr));gap:14px;align-items:end;margin-top:16px;padding-top:17px;border-top:1px solid var(--line)}.date-check{display:flex;align-items:center;gap:8px;min-height:38px;color:var(--ink);font-size:12px;font-weight:700}.date-check input{width:16px;height:16px;margin:0;accent-color:var(--ink)}.date-option-help{margin:12px 0 0;color:var(--muted);font-size:11px;line-height:1.5}.date-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.date-error{margin:16px 0 0;padding:12px 14px;border-radius:9px;background:#fde1e6;color:#9d315c;font-size:12px;font-weight:700}.date-result{margin-top:20px;padding:20px;border:1px solid var(--line);border-radius:17px;background:var(--paper)}.date-result-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.date-result-heading h2{margin:0;max-width:720px;font-size:clamp(27px,4vw,42px);letter-spacing:-0.06em}.date-direction,.date-timezone-note,.date-workdays{color:var(--muted);font-size:12px}.date-total-grid{display:grid;grid-template-columns:repeat(4, 1fr);gap:10px;margin-top:22px}.date-total-grid div,.date-breakdown-grid div{display:grid;gap:7px;padding:14px;border:1px solid var(--line);border-radius:11px;background:var(--white)}.date-total-grid span,.date-breakdown-grid span{color:var(--muted);font-size:11px}.date-total-grid strong{font:700 20px ui-monospace,SFMono-Regular,Menlo,monospace}.date-breakdown{margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}.date-breakdown h3{margin:0 0 12px;font-size:14px}.date-breakdown-grid{display:grid;grid-template-columns:repeat(6, 1fr);gap:9px}.date-breakdown-grid strong{font:700 21px ui-monospace,SFMono-Regular,Menlo,monospace}.date-workdays{margin:17px 0 0;font-weight:700}.date-timezone-note{margin:10px 0 0}.date-panel [data-time-field][hidden]{display:none}@media(max-width: 800px){.date-options{grid-template-columns:repeat(2, minmax(0, 1fr))}.date-total-grid{grid-template-columns:repeat(2, 1fr)}.date-breakdown-grid{grid-template-columns:repeat(3, 1fr)}}@media(max-width: 560px){.date-difference-tool{padding:11px;border-radius:15px}.date-difference-fields,.date-field-grid{grid-template-columns:1fr}.date-panel{padding:14px}.date-options{grid-template-columns:1fr}.date-result{padding:14px}.date-result-heading{display:grid}.date-result-heading .button{width:100%}.date-breakdown-grid{grid-template-columns:repeat(2, 1fr)}.date-actions .button{flex:1;justify-content:center}.date-total-grid strong{font-size:17px}}