.tool-nav{display:flex;gap:5px;padding:5px;border:1px solid #dfe5da;background:#eef2e8;border-radius:12px;width:fit-content;margin:20px 0 0}.tool-nav a{padding:10px 18px;text-decoration:none;font-size:13px;color:#6b7968;border-radius:8px;min-height:40px;display:flex;align-items:center;gap:8px}.tool-nav a[aria-current=page]{background:white;color:#315c40;box-shadow:0 2px 6px #244b3710;font-weight:600}.tool-nav+.intro{padding-top:40px}.tz-main{max-width:1040px}.tz-intro{padding-top:35px;padding-bottom:32px}.tz-intro h1{font-size:clamp(35px,5vw,55px);margin-top:15px}.tz-intro .byline{font-size:24px}.tz-panel{background:white;border:1px solid #e2e7dd;border-radius:16px;padding:28px;box-shadow:0 6px 22px #27402e04}.tz-controls{border:0;padding:0;margin:0;min-width:0}.tz-fields{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:24px}.tz-field label{display:block;font-size:12px;font-weight:600;margin-bottom:9px;color:#546b56}.tz-field input{background:#fafbf8;width:100%;min-width:0;max-width:100%;height:51px;border:1px solid #dce3d6;border-radius:9px;padding:12px;color:#304638;font-size:16px}.tz-field .text-button{font-size:11px;padding:8px 0;text-align:left}.tz-detected{font-size:11px!important;color:#7e8881;margin:0 0 25px!important;line-height:1.5!important}.tz-add-form{display:flex;align-items:flex-end;gap:10px;padding-top:21px;border-top:1px solid var(--line)}.tz-add-form .tz-field{flex:1;min-width:0}.tz-add-form button{min-height:51px;white-space:nowrap;font-size:14px}.tz-reference{font-size:13px!important;color:#64746a;margin:26px 0 8px!important;line-height:1.6!important}.tz-results{list-style:none;padding:0;margin:0}.tz-row{display:grid;grid-template-columns:minmax(0,1fr) 122px 100px 32px;align-items:center;gap:12px;padding:22px 0;border-bottom:1px solid var(--line);margin:0!important}.tz-row:last-child{border-bottom:0}.tz-row strong,.tz-row span{display:block}.tz-place strong{font-size:15px;color:#304638;font-weight:600}.tz-place span{font-size:10px;color:#879180;margin-top:4px;overflow-wrap:anywhere}.tz-difference{color:#326b50}.tz-difference strong{font-size:22px;font-weight:550;letter-spacing:-.7px;white-space:nowrap}.tz-difference span,.tz-clock span{font-size:11px;margin-top:4px;color:#809078}.tz-clock strong{font-size:22px;font-weight:450;letter-spacing:-.6px;font-variant-numeric:tabular-nums}.tz-empty{text-align:center;padding:25px 12px 30px}.tz-empty h2{font-weight:500;font-size:21px;margin:8px 0}.tz-empty p{font-size:13px!important}.tz-examples{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.tz-examples button{padding:10px 14px;border-radius:20px;background:#eef3e7;color:#546e45;font-size:12px;min-height:40px}.tz-count{font-size:11px;color:#879180;border-top:1px solid var(--line);padding-top:15px}.tz-note{font-size:12px!important;line-height:1.7!important;margin:18px 0 0!important;color:#7b8777}.tz-status{font-size:12px;min-height:18px;color:#566e4a;margin:8px 0}.tz-editorial{margin-top:45px;max-width:800px}.tz-editorial h2{font-weight:550;font-size:22px;margin-top:32px}.tz-editorial p,.tz-editorial summary{font-size:14px;line-height:1.8;color:#64746a}.tz-editorial details{padding:15px 0;border-bottom:1px solid var(--line)}.tz-editorial summary{cursor:pointer;font-weight:550}.tz-editorial .guide-table{margin:20px 0}.tz-example-link{display:inline-block;margin-top:8px;font-size:13px;text-underline-offset:4px}.tz-main .page-footer{margin-top:45px}.tz-main .intro{padding-bottom:30px}.tz-main h1{max-width:none}@media(max-width:650px){.tool-nav{margin-top:8px}.tool-nav a{padding:10px 15px;font-size:12px}.tz-main{padding:15px 20px}.tz-panel{padding:20px 16px}.tz-fields{grid-template-columns:1fr;gap:12px}.tz-detected{margin-bottom:16px!important}.tz-row{grid-template-columns:minmax(0,1fr) 96px 28px;gap:8px;padding:18px 0}.tz-place{grid-column:1 / -2}.tz-place strong{font-size:14px}.tz-difference{grid-column:1;grid-row:2}.tz-clock{grid-column:2;grid-row:2}.tz-row .remove{grid-column:3;grid-row:1 / 3}.tz-difference strong,.tz-clock strong{font-size:22px}.tz-add-form{gap:8px}.tz-add-form button{padding:12px;font-size:12px}.tz-editorial .guide-table th:first-child{padding:10px;width:45%;font-size:12px}.tz-editorial .guide-table td{font-size:12px}.tz-intro h1{font-size:36px}.tz-intro .subtitle{font-size:14px}.tz-clock span{white-space:nowrap}}

/* The climate grid reserves a 38px remove column; example tables have no such column. */
.tz-editorial .guide-table table{table-layout:fixed;width:100%;min-width:0}
.tz-editorial .guide-table thead th:first-child,.tz-editorial .guide-table tbody th{width:44%;position:static;padding:12px;text-align:left}
.tz-editorial .guide-table thead th:not(:first-child){width:28%;padding:12px;text-align:left;letter-spacing:0;font-size:12px}
.tz-editorial .guide-table td{width:28%;padding:12px;white-space:normal;overflow-wrap:normal}
@media(max-width:480px){.tz-editorial .guide-table th:first-child,.tz-editorial .guide-table tbody th{width:40%;padding:10px 8px;font-size:12px}.tz-editorial .guide-table thead th:not(:first-child),.tz-editorial .guide-table td{width:30%;padding:10px 8px;font-size:12px}}

@media(max-width:480px){.tool-nav{width:100%;gap:2px;padding:4px}.tool-nav a{flex:1;justify-content:center;padding:10px 6px;font-size:11px;white-space:nowrap}}

/* Constrain native date controls to their grid track, including iOS Safari. */
.tz-field{min-width:0;max-width:100%}.tz-field input[type=date]{display:block;box-sizing:border-box;appearance:none;-webkit-appearance:none;width:100%;min-width:0;max-width:100%;text-align:left}.tz-field input[type=date]::-webkit-date-and-time-value{min-width:0;text-align:left}.tz-field input[type=date]::-webkit-datetime-edit{min-width:0;padding:0}.tz-field input[type=date]::-webkit-calendar-picker-indicator{flex-shrink:0;margin-left:4px}@media(max-width:650px){.tz-fields{grid-template-columns:minmax(0,1fr)}}