:root{--fixed-width:252px;--metrics-width:244px}
.fixed-week,.fixed-days,.line-info{grid-template-columns:18px 26px 22px 30px 42px 38px 36px 40px}
.sort-percent-value{color:#2d6d89;text-align:center;font:600 9px ui-monospace,SFMono-Regular,Menlo,monospace}
.line-select{width:14px;height:14px;justify-self:center;margin:0;accent-color:#238bb2;cursor:pointer}
.line-override-select{appearance:none;width:14px;height:14px;justify-self:center;margin:0;border:1.5px solid #a4adb5;border-radius:3px;background:#fff;cursor:pointer;vertical-align:middle}
.line-override-select:checked{border-color:#c83f46;background-color:#c83f46;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 14V2m1 1h7l-2 3 2 3H5' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-size:12px 12px;background-position:center;background-repeat:no-repeat}
.line-override-select:focus-visible{outline:2px solid #d98589;outline-offset:2px}
.bulk-move-button{padding:0 9px;color:#526574;font-size:10px;white-space:nowrap}
.bulk-move-button:hover:not(:disabled){background:#eaf3f7;color:#245f7b}
.bulk-move-button:disabled{opacity:.42;cursor:default}
@media(max-width:1300px){:root{--fixed-width:238px;--metrics-width:230px}.fixed-week,.fixed-days,.line-info{grid-template-columns:18px 25px 21px 28px 40px 37px 33px 36px}.bulk-move-button{padding:0 7px}}
@media(max-width:900px){:root{--fixed-width:224px;--metrics-width:220px}.fixed-week,.fixed-days,.line-info{grid-template-columns:16px 24px 20px 26px 38px 35px 31px 34px}.bulk-move-button{padding:0 5px;font-size:9px}}

/* Keep package metrics on the right; commute ease sits beside SORT %. */
:root{--fixed-width:300px;--metrics-width:126px}
.fixed-week,.fixed-days,.line-info,.fixed-month{grid-template-columns:18px 26px 22px 30px 42px 38px 36px 40px 48px}
.metrics,.metric-labels{grid-template-columns:repeat(3,minmax(0,1fr))}
.commute-percent-value{color:#287a63;text-align:center;font:700 9px ui-monospace,SFMono-Regular,Menlo,monospace}
.commute-percent-value.commute-difficulty-easy{color:#218447}
.commute-percent-value.commute-difficulty-good{color:#70a97b}
.commute-percent-value.commute-difficulty-hard{color:#d8878c}
.commute-percent-value.commute-difficulty-poor{color:#c63d46}
@media(max-width:1300px){:root{--fixed-width:282px;--metrics-width:114px}.fixed-week,.fixed-days,.line-info,.fixed-month{grid-template-columns:18px 24px 20px 28px 40px 36px 34px 36px 46px}}
@media(max-width:900px){:root{--fixed-width:256px;--metrics-width:102px}.fixed-week,.fixed-days,.line-info,.fixed-month{grid-template-columns:16px 23px 18px 25px 36px 32px 30px 34px 42px}}

/* Dates Off priorities tint their calendar columns without obscuring trip bars. */
.date-priority-shade{z-index:0;pointer-events:none}
.shade-priority-1.date-priority-shade{background:rgba(52,150,77,.09)}
.shade-priority-2.date-priority-shade{background:rgba(223,137,40,.10)}
.shade-priority-3.date-priority-shade{background:rgba(197,65,65,.09)}
.day-heading.shade-priority-1{background:#e7f3e9}
.day-heading.shade-priority-2{background:#fff1df}
.day-heading.shade-priority-3{background:#f8e7e7}

/* Line schedules use the blue palette shown by the line-type legend. */
.legend-line,.display-legend .legend-line{border-color:#7caecc;background:#d8eaf5}
.color-coding .leg-chip.kind-line{border-color:#77afd1;background:#b6ddf4;color:#234f6c}
.color-coding .trip-span.kind-line{border-color:#7caecc;background:#d8eaf5;color:#315d78}
.color-coding.trip-footprint-only .trip-footprint.kind-line{border-color:#7caecc;background:#d8eaf5;color:#315d78}

.submission-actions{display:flex;align-items:center;gap:5px;margin-left:auto}
.submission-actions #packages-button,.submission-actions #commute-options-button{border:1px solid #d4e0e7;background:#f7fafc;color:#426276}
.flight-color-legend .calendar-time-zone-note{margin-left:auto;color:#637989;font-weight:600}
body.not-commuter{--fixed-width:252px}
body.not-commuter .fixed-week,body.not-commuter .fixed-days,body.not-commuter .line-info{grid-template-columns:18px 26px 22px 30px 42px 38px 36px 40px}
body.not-commuter .fixed-week>.com-ease-debug-trigger,body.not-commuter .line-info>.commute-percent-value,body.not-commuter .metric-week>.com-ease-debug-trigger,body.not-commuter .metric-labels>.com-ease-debug-trigger,body.not-commuter .metrics>.commute-percent-value{display:none}
body.not-commuter .metric-week,body.not-commuter .metric-labels,body.not-commuter .metrics{grid-template-columns:repeat(3,minmax(0,1fr))}
body.not-commuter .flight-color-legend>span:has(.commute-easy-sample),body.not-commuter .flight-color-legend>span:has(.commute-hard-sample){display:none}
@media(max-width:1300px){body.not-commuter{--fixed-width:236px}body.not-commuter .fixed-week,body.not-commuter .fixed-days,body.not-commuter .line-info{grid-template-columns:18px 24px 20px 28px 40px 36px 34px 36px}}
@media(max-width:900px){body.not-commuter{--fixed-width:214px}body.not-commuter .fixed-week,body.not-commuter .fixed-days,body.not-commuter .line-info{grid-template-columns:16px 23px 18px 25px 36px 32px 30px 34px}}
.month-band{height:26px}
.week-band{top:26px}
.day-header{top:49px}
.top-actions .save-status{padding:0;font-size:9px;white-space:nowrap}
.fixed-month{display:grid;grid-template-columns:18px 26px 22px 30px 42px 38px 36px 40px 48px;align-items:center;padding:0;border-right:1px solid #d7dce1;white-space:nowrap;overflow:visible}
.ranking-actions{grid-column:1;display:flex;width:20px;flex-direction:column;align-items:center;justify-content:center;gap:1px}
.ranking-actions.flag-actions{grid-column:2;width:26px}
.ranking-actions button{width:18px;height:18px;flex:0 0 18px;padding:0;border:1px solid #d6e0e6;border-radius:3px;background:#fff;color:#526574;font-size:11px;line-height:1;cursor:pointer}
.ranking-actions button:hover:not(:disabled){background:#eaf3f7;color:#245f7b;border-color:#a9c7d7}
.ranking-actions button:disabled{opacity:.4;cursor:default}
.metric-month{justify-content:flex-end;padding-right:9px;color:#647482;font:600 9px ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:0}
.fixed-week span:nth-child(2){color:#b8464d;font-weight:700}
.select-column-head,.flag-column-head{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;min-width:0;line-height:9px}
.select-column-head span,.flag-column-head span{font-size:7px;line-height:9px}
.flag-column-head span{color:#b8464d;font-weight:700}
.clear-marks-button{display:grid;place-items:center;width:13px;height:12px;padding:0;border:0;border-radius:2px;background:transparent;color:#778692;cursor:pointer}
.clear-marks-button svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round}
.clear-selection-button,.clear-flag-button{color:#8f9aa3}
.clear-marks-button:hover{background:#fff;color:#344d5e;box-shadow:0 0 0 1px #cbd7de}
@media(max-width:1300px){.fixed-month{grid-template-columns:18px 24px 20px 28px 40px 36px 34px 36px 46px}.ranking-actions{width:18px}.ranking-actions.flag-actions{width:25px}}
@media(max-width:900px){.submission-actions{gap:1px}.fixed-month{grid-template-columns:16px 23px 18px 25px 36px 32px 30px 34px 42px}.ranking-actions{width:16px}.ranking-actions.flag-actions{width:24px}}

/* Detail drawer displays both the packet's local clock and its Zulu equivalent. */
.trip-times{font-size:8px;line-height:1.55;white-space:normal}
.segment-row{grid-template-columns:42px 62px minmax(0,1fr) 150px}
.segment-time{display:grid;min-width:0;gap:3px;color:#536879;text-align:right;white-space:nowrap;font:8px ui-monospace,SFMono-Regular,Menlo,monospace}
.segment-time span{display:block}
@media(max-width:520px){.segment-row{grid-template-columns:35px 52px minmax(70px,1fr) 145px;gap:5px;padding:7px 7px}}
