@import url(https://fonts.bunny.net/css?family=barlow:400,600);
:root {
    color-scheme: dark;
    --bg: #070a2d;
    --fg: #f0f6f6;
    --fg-strong: #ffffff;
    --muted: #a4b1ce;
    --muted-2: #838da5;
    --muted-3: #7c8aa8;
    --accent: #1fdcef;
    --accent-rgb: 31, 220, 239;
    --panel-rgb: 4, 9, 30;
    --panel-alpha: 0.92;
    --row-rgb: 11, 88, 94;
    --map-label-stroke-rgb: 2, 5, 15;
}
@media (prefers-color-scheme: light) {
    :root:not([data-theme]) {
        color-scheme: light;
        --bg: #f5f8fb;
        --fg: #131a2b;
        --fg-strong: #05070f;
        --muted: #51607e;
        --muted-2: #5b6478;
        --muted-3: #64708a;
        --accent: #067a8c;
        --accent-rgb: 6, 122, 140;
        --panel-rgb: 255, 255, 255;
        --panel-alpha: 0.9;
        --row-rgb: 179, 224, 227;
        --map-label-stroke-rgb: 255, 255, 255;
    }
}
:root[data-theme="light"] {
    color-scheme: light;
    --bg: #f5f8fb;
    --fg: #131a2b;
    --fg-strong: #05070f;
    --muted: #51607e;
    --muted-2: #5b6478;
    --muted-3: #64708a;
    --accent: #067a8c;
    --accent-rgb: 6, 122, 140;
    --panel-rgb: 255, 255, 255;
    --panel-alpha: 0.9;
    --row-rgb: 179, 224, 227;
    --map-label-stroke-rgb: 255, 255, 255;
}
html {
    overflow-x: hidden;
}
body {
    margin: 0;
    overflow-x: hidden;
    color: var(--fg);
    background-color: var(--bg);
    font-family: 'Barlow', sans-serif;
}
#top-menu {
    width: 100%;
    height: 3rem;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    box-sizing: border-box;
    padding: 0 1rem;
    border-bottom: 0.2rem solid var(--accent);
}
#top-menu > div {
    line-height: 3rem;
    color: var(--fg-strong);
    vertical-align: middle;
}
#top-menu #logo {
    display: flex;
    align-items: center;
    font-size: 1.25rem;
    font-weight: 600;
}
#logo-link {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    color: inherit;
    text-decoration: none;
}
#logo-circle {
    display: inline-block;
    flex-shrink: 0;
    height: 0.75rem;
    width: 0.75rem;
    margin-top: 0.25rem;
    transition: transform 0.15s ease;
    background-color: var(--accent);
    border-radius: 50%;
}
#logo-link:hover #logo-circle {
    transform: scale(1.25);
}
#top-menu #menu-actions {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.5rem;
    height: 100%;
}
#top-menu #area-select,
#top-menu #settings-select {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    height: 100%;
    font-size: 1rem;
    text-align: right;
    user-select: none;
}
#top-menu #area-select-toggle,
#top-menu #settings-select-toggle {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    cursor: pointer;
    background: rgba(var(--accent-rgb), 0.12);
    border: 0.075rem solid rgba(var(--accent-rgb), 0.4);
    border-radius: 1.5rem;
    padding: 0.3rem 0.75rem;
    line-height: 1.2;
    transition: background 0.15s ease, border-color 0.15s ease;
}
#top-menu #area-select-toggle:hover,
#top-menu #settings-select-toggle:hover {
    background: rgba(var(--accent-rgb), 0.22);
    border-color: var(--accent);
}
.toggle-hint {
    font-size: 0.65rem;
    font-weight: 400;
    color: var(--muted);
}
@media (max-width: 400px) {
    .toggle-hint {
        display: none;
    }
}
.toggle-code {
    font-weight: 600;
    color: var(--fg-strong);
}
.dropdown-panel {
    display: none;
    position: absolute;
    top: 2.25rem;
    right: 0;
    width: 18rem;
    max-width: calc(100vw - 2rem);
    background-color: rgba(var(--panel-rgb), var(--panel-alpha));
    border: 0.1rem solid var(--accent);
    border-radius: 0.5rem;
    backdrop-filter: blur(6px);
    box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.45);
    padding: 0.75rem;
    z-index: 2;
    max-height: calc(100vh - 4rem);
    overflow-y: auto;
    box-sizing: border-box;
}
@media (max-width: 699px) {
    .dropdown-panel {
        position: fixed;
        top: 3.25rem;
        left: 1rem;
        right: 1rem;
        width: auto;
        max-width: none;
    }
}
.icon-gear {
    width: 0.85rem;
    height: 0.85rem;
    flex-shrink: 0;
    background-color: var(--fg-strong);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15.516' height='15.503' viewBox='0 0 15.516 15.503'%3E%3Cpath d='M14.822,8.217c-.866-.232-1.062-2.263-.352-2.673A1.4,1.4,0,0,0,15,5,7.112,7.112,0,0,0,13.831,2.92a1.4,1.4,0,0,0-.768.187c-.775.448-2.377-.75-2.139-1.641A1.62,1.62,0,0,0,10.9.652,7.782,7.782,0,0,0,8.641.042a1.4,1.4,0,0,0-.433.7c-.253.943-2.253,1.08-2.682.337A1.456,1.456,0,0,0,4.937.519,8.477,8.477,0,0,0,2.906,1.667a2.037,2.037,0,0,0,.184.814c.429.743-.732,2.4-1.649,2.15a1.392,1.392,0,0,0-.876.049A9.493,9.493,0,0,0,0,6.894a1.384,1.384,0,0,0,.713.454,1.538,1.538,0,0,1,.354,2.687,1.215,1.215,0,0,0-.565.611,7.981,7.981,0,0,0,1.157,2.01,1.363,1.363,0,0,0,.814-.184C3.281,12,4.9,13.1,4.623,14.121a1.94,1.94,0,0,0,.014.818,7.26,7.26,0,0,0,2.314.606,1.445,1.445,0,0,0,.389-.7c.239-.892,2.211-1.176,2.678-.369a1.523,1.523,0,0,0,.525.562,6.5,6.5,0,0,0,2.139-1.2,1.361,1.361,0,0,0-.229-.764c-.5-.872.673-2.4,1.641-2.139a1.63,1.63,0,0,0,.8-.014,8.6,8.6,0,0,0,.626-2.271A1.284,1.284,0,0,0,14.822,8.217Zm-2.949.589A4.134,4.134,0,1,1,8.95,3.742,4.134,4.134,0,0,1,11.873,8.806Z' transform='translate(0 -0.042)' fill-rule='evenodd'/%3E%3C/svg%3E%0A");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15.516' height='15.503' viewBox='0 0 15.516 15.503'%3E%3Cpath d='M14.822,8.217c-.866-.232-1.062-2.263-.352-2.673A1.4,1.4,0,0,0,15,5,7.112,7.112,0,0,0,13.831,2.92a1.4,1.4,0,0,0-.768.187c-.775.448-2.377-.75-2.139-1.641A1.62,1.62,0,0,0,10.9.652,7.782,7.782,0,0,0,8.641.042a1.4,1.4,0,0,0-.433.7c-.253.943-2.253,1.08-2.682.337A1.456,1.456,0,0,0,4.937.519,8.477,8.477,0,0,0,2.906,1.667a2.037,2.037,0,0,0,.184.814c.429.743-.732,2.4-1.649,2.15a1.392,1.392,0,0,0-.876.049A9.493,9.493,0,0,0,0,6.894a1.384,1.384,0,0,0,.713.454,1.538,1.538,0,0,1,.354,2.687,1.215,1.215,0,0,0-.565.611,7.981,7.981,0,0,0,1.157,2.01,1.363,1.363,0,0,0,.814-.184C3.281,12,4.9,13.1,4.623,14.121a1.94,1.94,0,0,0,.014.818,7.26,7.26,0,0,0,2.314.606,1.445,1.445,0,0,0,.389-.7c.239-.892,2.211-1.176,2.678-.369a1.523,1.523,0,0,0,.525.562,6.5,6.5,0,0,0,2.139-1.2,1.361,1.361,0,0,0-.229-.764c-.5-.872.673-2.4,1.641-2.139a1.63,1.63,0,0,0,.8-.014,8.6,8.6,0,0,0,.626-2.271A1.284,1.284,0,0,0,14.822,8.217Zm-2.949.589A4.134,4.134,0,1,1,8.95,3.742,4.134,4.134,0,0,1,11.873,8.806Z' transform='translate(0 -0.042)' fill-rule='evenodd'/%3E%3C/svg%3E%0A");
}
.settings-group {
    margin-bottom: 0.75rem;
}
.settings-group:last-of-type {
    margin-bottom: 0.5rem;
}
.settings-label {
    font-size: 0.65rem;
    color: var(--muted);
    margin-bottom: 0.35rem;
}
#lang-options,
#currency-options,
#unit-toggle,
#theme-options {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}
.lang-option,
.currency-option,
.unit-option,
.theme-option {
    cursor: pointer;
    background: rgba(var(--accent-rgb), 0.08);
    border: 0.075rem solid rgba(var(--accent-rgb), 0.35);
    border-radius: 1rem;
    color: var(--fg);
    font-family: inherit;
    font-size: 0.75rem;
    padding: 0.25rem 0.6rem;
    transition: background 0.15s ease, border-color 0.15s ease;
}
.lang-option:hover,
.currency-option:hover,
.unit-option:hover,
.theme-option:hover {
    background: rgba(var(--accent-rgb), 0.2);
}
.lang-option.active,
.currency-option.active,
.unit-option.active,
.theme-option.active {
    background: rgba(var(--accent-rgb), 0.4);
    border-color: var(--accent);
    color: var(--fg-strong);
}
#use-location-btn {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    width: 100%;
    box-sizing: border-box;
    cursor: pointer;
    background: rgba(var(--accent-rgb), 0.08);
    border: 0.075rem solid rgba(var(--accent-rgb), 0.35);
    border-radius: 1rem;
    color: var(--fg);
    font-family: inherit;
    font-size: 0.75rem;
    padding: 0.4rem 0.75rem;
}
#use-location-btn:hover {
    background: rgba(var(--accent-rgb), 0.2);
}
#use-location-btn .icon-pin {
    background: var(--accent);
}
#area-map {
    position: relative;
    width: 100%;
    max-width: 20rem;
    margin: 0 auto;
    aspect-ratio: 300 / 404.61;
}
.map-svg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.zone-link {
    cursor: pointer;
}
.zone {
    fill: rgba(var(--accent-rgb), 0.08);
    stroke: rgba(var(--accent-rgb), 0.45);
    stroke-width: 0.8;
    stroke-linejoin: round;
    transition: fill 0.15s ease;
}
.zone-link:hover .zone {
    fill: rgba(var(--accent-rgb), 0.3);
}
.zone-link.active .zone {
    fill: rgba(var(--accent-rgb), 0.4);
    stroke: var(--accent);
    stroke-width: 1.1;
}
.zone-label {
    fill: var(--fg);
    font-family: 'Barlow', sans-serif;
    font-size: 10px;
    font-weight: 600;
    text-anchor: middle;
    dominant-baseline: middle;
    paint-order: stroke;
    stroke: rgba(var(--map-label-stroke-rgb), 0.65);
    stroke-width: 2px;
    stroke-linejoin: round;
    pointer-events: none;
}
.zone-link.active .zone-label {
    fill: var(--accent);
}
#hourly-data {
    color: var(--muted);
    box-sizing: border-box;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}
#hourly-data .row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    box-sizing: border-box;
    padding: 0 1rem;
    font-size: 1rem;
    vertical-align: middle;
    line-height: 2rem;
    height: 2rem;
}
#hourly-data .row div {
    vertical-align: middle;
    line-height: 2rem;
}
#hourly-data .row.header {
    background: rgba(var(--row-rgb), 0.5);
    font-weight: 600;
}
#hourly-data .row.item:nth-child(even) {
    background: rgba(var(--row-rgb), 0.3);
}
#hourly-data .row.item:nth-child(odd) {
    background: rgba(var(--row-rgb), 0.4);
}

#hourly-data .row .price {
    justify-content: center;
    align-items: center;
    display: flex;
}
#hourly-data .row .price-value {
    text-align: right;
    min-width: 1.8rem;
    padding-right: 0.25rem;
}
#hourly-grid {
    display: none;
}
.price-circle {
    opacity: 0.85;
    background-image: linear-gradient(90deg, #00FF00 0, #FFFF00 33%, #FF0000 100%);
    background-repeat: no-repeat;
    background-size: 200rem 1rem;
    display: inline-block;
    border-radius: 50%;
}
.price-circle.large {
    width: 0.75rem;
    height: 0.75rem;
    margin-right: 0.35rem;
}
.price-circle.small {
    width: 0.5rem;
    height: 0.5rem;
    margin-right: 0.25rem;
}
.price-percent-0 {background-position: 0% 0;}
.price-percent-1 {background-position: 1% 0;}
.price-percent-2 {background-position: 2% 0;}
.price-percent-3 {background-position: 3% 0;}
.price-percent-4 {background-position: 4% 0;}
.price-percent-5 {background-position: 5% 0;}
.price-percent-6 {background-position: 6% 0;}
.price-percent-7 {background-position: 7% 0;}
.price-percent-8 {background-position: 8% 0;}
.price-percent-9 {background-position: 9% 0;}
.price-percent-10 {background-position: 10% 0;}
.price-percent-11 {background-position: 11% 0;}
.price-percent-12 {background-position: 12% 0;}
.price-percent-13 {background-position: 13% 0;}
.price-percent-14 {background-position: 14% 0;}
.price-percent-15 {background-position: 15% 0;}
.price-percent-16 {background-position: 16% 0;}
.price-percent-17 {background-position: 17% 0;}
.price-percent-18 {background-position: 18% 0;}
.price-percent-19 {background-position: 19% 0;}
.price-percent-20 {background-position: 20% 0;}
.price-percent-21 {background-position: 21% 0;}
.price-percent-22 {background-position: 22% 0;}
.price-percent-23 {background-position: 23% 0;}
.price-percent-24 {background-position: 24% 0;}
.price-percent-25 {background-position: 25% 0;}
.price-percent-26 {background-position: 26% 0;}
.price-percent-27 {background-position: 27% 0;}
.price-percent-28 {background-position: 28% 0;}
.price-percent-29 {background-position: 29% 0;}
.price-percent-30 {background-position: 30% 0;}
.price-percent-31 {background-position: 31% 0;}
.price-percent-32 {background-position: 32% 0;}
.price-percent-33 {background-position: 33% 0;}
.price-percent-34 {background-position: 34% 0;}
.price-percent-35 {background-position: 35% 0;}
.price-percent-36 {background-position: 36% 0;}
.price-percent-37 {background-position: 37% 0;}
.price-percent-38 {background-position: 38% 0;}
.price-percent-39 {background-position: 39% 0;}
.price-percent-40 {background-position: 40% 0;}
.price-percent-41 {background-position: 41% 0;}
.price-percent-42 {background-position: 42% 0;}
.price-percent-43 {background-position: 43% 0;}
.price-percent-44 {background-position: 44% 0;}
.price-percent-45 {background-position: 45% 0;}
.price-percent-46 {background-position: 46% 0;}
.price-percent-47 {background-position: 47% 0;}
.price-percent-48 {background-position: 48% 0;}
.price-percent-49 {background-position: 49% 0;}
.price-percent-50 {background-position: 50% 0;}
.price-percent-51 {background-position: 51% 0;}
.price-percent-52 {background-position: 52% 0;}
.price-percent-53 {background-position: 53% 0;}
.price-percent-54 {background-position: 54% 0;}
.price-percent-55 {background-position: 55% 0;}
.price-percent-56 {background-position: 56% 0;}
.price-percent-57 {background-position: 57% 0;}
.price-percent-58 {background-position: 58% 0;}
.price-percent-59 {background-position: 59% 0;}
.price-percent-60 {background-position: 60% 0;}
.price-percent-61 {background-position: 61% 0;}
.price-percent-62 {background-position: 62% 0;}
.price-percent-63 {background-position: 63% 0;}
.price-percent-64 {background-position: 64% 0;}
.price-percent-65 {background-position: 65% 0;}
.price-percent-66 {background-position: 66% 0;}
.price-percent-67 {background-position: 67% 0;}
.price-percent-68 {background-position: 68% 0;}
.price-percent-69 {background-position: 69% 0;}
.price-percent-70 {background-position: 70% 0;}
.price-percent-71 {background-position: 71% 0;}
.price-percent-72 {background-position: 72% 0;}
.price-percent-73 {background-position: 73% 0;}
.price-percent-74 {background-position: 74% 0;}
.price-percent-75 {background-position: 75% 0;}
.price-percent-76 {background-position: 76% 0;}
.price-percent-77 {background-position: 77% 0;}
.price-percent-78 {background-position: 78% 0;}
.price-percent-79 {background-position: 79% 0;}
.price-percent-80 {background-position: 80% 0;}
.price-percent-81 {background-position: 81% 0;}
.price-percent-82 {background-position: 82% 0;}
.price-percent-83 {background-position: 83% 0;}
.price-percent-84 {background-position: 84% 0;}
.price-percent-85 {background-position: 85% 0;}
.price-percent-86 {background-position: 86% 0;}
.price-percent-87 {background-position: 87% 0;}
.price-percent-88 {background-position: 88% 0;}
.price-percent-89 {background-position: 89% 0;}
.price-percent-90 {background-position: 90% 0;}
.price-percent-91 {background-position: 91% 0;}
.price-percent-92 {background-position: 92% 0;}
.price-percent-93 {background-position: 93% 0;}
.price-percent-94 {background-position: 94% 0;}
.price-percent-95 {background-position: 95% 0;}
.price-percent-96 {background-position: 96% 0;}
.price-percent-97 {background-position: 97% 0;}
.price-percent-98 {background-position: 98% 0;}
.price-percent-99 {background-position: 99% 0;}
.price-percent-100 {background-position: 100% 0;}
.price-percent-none {display:none}

.price-box {
    align-items: baseline;
    padding: 0 1rem;
}
.price-box .label {
    color: var(--muted-2);
    font-size: 0.8rem;
    margin-bottom: 0.1rem;
}
.price-box .label-time {
    display: block;
    font-size: 0.65rem;
}
.price-box .price {
    font-size: 1.25rem;
}
.price-box .price .unit {
    font-size: 0.65rem;
    padding-left: 0.125rem;
}
#extreme-prices {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    background: rgba(var(--row-rgb), 0.3);
    padding: 0.75rem 0;
}
#price-chart-wrap {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    background: rgba(var(--row-rgb), 0.3);
    padding: 0.75rem 0;
}
#price-chart {
    display: block;
    width: 100%;
    height: 6rem;
}
.chart-area {
    fill: rgba(var(--accent-rgb), 0.08);
    stroke: none;
}
.chart-line {
    fill: none;
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
    vector-effect: non-scaling-stroke;
}
.chart-now {
    fill: var(--accent);
    stroke: var(--bg);
    stroke-width: 0.6;
}
.chart-gridline {
    stroke: rgba(var(--accent-rgb), 0.15);
    stroke-width: 0.4;
    vector-effect: non-scaling-stroke;
    pointer-events: none;
}
.chart-axis-label {
    font-family: 'Barlow', sans-serif;
    font-size: 7px;
    fill: var(--muted);
    pointer-events: none;
}
.chart-hour-label {
    text-anchor: middle;
}
.chart-y-label {
    text-anchor: start;
}
.chart-hover-col {
    fill: transparent;
    cursor: crosshair;
}
.chart-hover-col:hover {
    fill: rgba(var(--accent-rgb), 0.1);
}
#chart-tooltip {
    display: none;
    position: absolute;
    top: 0.25rem;
    background: rgba(var(--panel-rgb), var(--panel-alpha));
    border: 0.075rem solid var(--accent);
    border-radius: 0.35rem;
    padding: 0.2rem 0.5rem;
    font-size: 0.7rem;
    color: var(--fg);
    white-space: nowrap;
    pointer-events: none;
    z-index: 3;
}
.icon-pin {
    width: 0.6rem;
    height: 0.6rem;
    background: var(--accent);
    border-radius: 50% 50% 50% 0;
    transform: rotate(-45deg);
    display: inline-block;
    position: relative;
    flex-shrink: 0;
}
.icon-pin::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0.22rem;
    height: 0.22rem;
    background: var(--bg);
    border-radius: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
}

#lastupdate .label {
    font-size: 0.65rem
}
#lastupdate .date {
    font-size: 1rem
}

#footer {
    line-height: 1rem;
    font-size: 0.75rem;
    width: 100%;
    display: flex;
    padding: 0.75rem 1rem;
    flex-direction: row;
    justify-content: space-between;
    box-sizing: border-box;
    border-top: 0.2rem solid rgba(var(--accent-rgb), 0.5);
}
#footer > div {
    color: var(--fg-strong);
    vertical-align: middle;
}
#footer a {
    color: var(--accent);
    text-decoration: none;
}
#footer a:hover {
    text-decoration: underline;
}

#page-info {
    padding: 1rem;
    color: var(--fg-strong);
    max-width: 45rem;
}
#page-info p {
    line-height: 1.5rem;
}
#page-info a:visited, #page-info a:link, #page-info a:active {
    color: var(--fg-strong);
    padding: 1rem 0;
}
#page-info li {
    margin: 1rem 0;
}
h2 {
    font-size: 1.25rem;
    margin: 1rem 0 0.5rem 0;
}
#slogan {
    font-size: 0.75rem;
    font-weight: 400;
    margin-left: 0.5rem;
}

@media (min-width: 700px) {
    #top-menu,
    #extreme-prices,
    #price-chart-wrap,
    #hourly-data,
    #hourly-grid,
    #page-info,
    #footer {
        max-width: 40rem;
        margin-left: auto;
        margin-right: auto;
    }

    #top-menu,
    #footer {
        padding-left: 0;
        padding-right: 0;
    }

    .price-box .label-time {
        display: inline;
        font-size: inherit;
        margin-left: 0.3rem;
    }

    #hourly-data {
        display: none;
    }

    #hourly-grid {
        display: flex;
        flex-direction: column;
        color: var(--muted);
        box-sizing: border-box;
        width: 100%;
    }

    #hourly-grid .grid-unit {
        text-align: right;
        font-size: 0.75rem;
        color: var(--muted-3);
        padding: 0 1rem 0.35rem;
    }

    #hourly-grid .grid-row {
        display: grid;
        grid-template-columns: 9.5rem repeat(4, 1fr);
        column-gap: 0.5rem;
        align-items: center;
        box-sizing: border-box;
        padding: 0 1rem;
        font-size: 1rem;
        line-height: 2rem;
        height: 2rem;
    }

    #hourly-grid .grid-row.header {
        background: rgba(var(--row-rgb), 0.5);
        font-weight: 600;
        text-align: center;
    }

    #hourly-grid .grid-row.header .date-label {
        text-align: left;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    #hourly-grid .grid-row.item:nth-child(even) {
        background: rgba(var(--row-rgb), 0.3);
    }

    #hourly-grid .grid-row.item:nth-child(odd) {
        background: rgba(var(--row-rgb), 0.4);
    }

    #hourly-grid .grid-row .hour {
        font-weight: 600;
    }

    #hourly-grid .grid-row .price {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    #hourly-grid .grid-row .price-value {
        text-align: right;
        min-width: 1.8rem;
        padding-right: 0.35rem;
    }

    #hourly-grid .grid-row .price.empty::after {
        content: '\2013';
        opacity: 0.4;
    }
}