.parcel-page {
    min-height:100vh;
    padding:120px 28px 80px;
    background:#070709;
    color:#f7f4ef;
    font-family:Lato,Arial,sans-serif;
}

.parcel-shell {
    width:min(1380px,100%);
    margin:auto;
}

.parcel-header>p,.parcel-kicker {
    color:#ff9d32;
    font:600 12px Oswald,sans-serif;
    letter-spacing:.2em;
    text-transform:uppercase;
}

.parcel-header h1 {
    margin:18px 0 25px;
    font:700 clamp(3.2rem,7vw,6.5rem)/.95 Oswald,sans-serif;
    text-transform:uppercase;
}

.parcel-header h1 span {
    color:#ff5c16;
}

.parcel-header>div {
    max-width:640px;
    color:#bcb8b3;
    line-height:1.7;
}

.parcel-toolbar {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    margin:36px 0 16px;
    flex-wrap:wrap;
}

.parcel-legend {
    display:flex;
    flex-wrap:wrap;
    gap:18px;
    font-size:13px;
    color:#d0cdc8;
}

.parcel-legend span {
    display:flex;
    align-items:center;
    gap:7px;
}

.parcel-legend i {
    display:block;
    width:10px;
    height:10px;
    border-radius:50%;
}

.parcel-legend .is-available {
    background:#42d27b;
}

.parcel-legend .is-reserved {
    background:#edb440;
}

.parcel-legend .is-booked {
    background:#eb6464;
}

.parcel-legend .is-disabled {
    background:#8e929a;
}

.parcel-legend .is-path {
    background:#c6bca9;
    border-radius:2px;
}

.parcel-legend .is-area {
    background:#98ab98;
    border-radius:2px;
}

.parcel-filters {
    display:flex;
    align-items:end;
    gap:12px;
    flex-wrap:wrap;
}

.parcel-filters label,.parcel-picker {
    display:grid;
    gap:6px;
    color:#bcb8b3;
    font-size:12px;
}

.parcel-page select {
    min-height:42px;
    max-width:100%;
    padding:8px 32px 8px 12px;
    border:1px solid #ffffff30;
    border-radius:4px;
    background:#141418;
    color:#fff;
    font:inherit;
}

.parcel-filters button {
    min-height:42px;
    padding:10px 14px;
    border:1px solid #ffffff30;
    border-radius:4px;
    color:#eee;
    background:#141418;
    cursor:pointer;
}

.parcel-page button:focus-visible,.parcel-page select:focus-visible {
    outline:2px solid #ff9d32;
    outline-offset:3px;
}

.parcel-layout {
    display:grid;
    grid-template-columns:minmax(0,1fr) 340px;
    gap:20px;
    align-items:start;
}

.parcel-map-card {
    min-width:0;
    border:1px solid #ffffff24;
    border-radius:8px;
    overflow:hidden;
    background:#101312;
}

.parcel-map {
    height:620px;
    min-height:400px;
    isolation:isolate;
    z-index:0;
    background:#cfd5c9;
    color:#111;
}

.parcel-map .parcel-map-label-anchor {
    border:0;
    background:none;
    pointer-events:none;
}

.parcel-map .parcel-map-label {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:2px;
    box-sizing:border-box;
    padding:1px 2px;
    overflow:hidden;
    white-space:nowrap;
    border:0;
    border-radius:2px;
    background:#ffffffe0;
    color:#172117;
    font:700 11px/1 Arial,sans-serif;
    pointer-events:none;
}

.parcel-map .parcel-map-label-name {
    min-width:0;
    overflow:hidden;
}

.parcel-map .parcel-map-electricity {
    display:block;
    flex-shrink:0;
}

.parcel-map-electricity svg {
    display:block;
    width:100%;
    height:100%;
    fill:#ffc320;
    stroke:#644500;
    stroke-width:.8;
    stroke-linejoin:round;
}

.parcel-legend .parcel-electricity-key {
    color:#ffc320;
    font-size:16px;
    line-height:10px;
}

.parcel-map .parcel-map-orientation {
    cursor:default;
}

.parcel-map .parcel-map-area-label {
    color:#344036;
    font-size:12px;
}

.parcel-map-note {
    margin:0;
    padding:12px 16px;
    color:#aaa6a2;
    font-size:11px;
    line-height:1.5;
}

.parcel-panel {
    min-height:400px;
    padding:25px;
    border:1px solid #ffffff24;
    border-radius:8px;
    background:#101013;
}

.parcel-picker {
    margin-bottom:30px;
}

.parcel-picker select {
    width:100%;
    font-size:14px;
}

.parcel-panel h2 {
    margin:8px 0 18px;
    font:600 2rem/1.15 Oswald,sans-serif;
    text-transform:uppercase;
    overflow-wrap:anywhere;
}

.parcel-panel p {
    line-height:1.65;
    color:#aaa6a2;
}

.parcel-panel .parcel-status {
    margin:0;
    color:#42d27b;
    font-size:12px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.1em;
}

.parcel-panel .parcel-status[data-state=reserved] {
    color:#edb440;
}

.parcel-panel .parcel-status[data-state=booked] {
    color:#eb6464;
}

.parcel-panel .parcel-status[data-state=disabled] {
    color:#a2a6ae;
}

.parcel-event {
    font-size:12px;
}

.parcel-description {
    white-space:pre-line;
    overflow-wrap:anywhere;
}

.parcel-panel .parcel-power,.parcel-panel .parcel-size {
    color:#e4d4b3;
    font-size:14px;
}

.parcel-price {
    display:grid;
    gap:5px;
    margin:24px 0;
}

.parcel-price strong {
    font:600 2.4rem Oswald,sans-serif;
}

.parcel-price small,.parcel-panel .parcel-checkout-note {
    color:#aaa6a2;
    font-size:11px;
}

.parcel-reserve {
    width:100%;
    min-height:48px;
    border:0;
    border-radius:4px;
    background:#ff5c16;
    color:white;
    font-size:14px;
    font-weight:700;
    cursor:pointer;
}

.parcel-reserve:disabled {
    background:#303036;
    color:#bbb;
    cursor:default;
}

.parcel-count {
    padding-top:18px;
    margin-top:24px;
    border-top:1px solid #ffffff18;
    font-size:12px;
}

.parcel-output {
    display:block;
    min-height:28px;
    margin-top:18px;
    color:#ffc37b;
    line-height:1.6;
}

.parcel-notice {
    padding:18px;
    border:1px solid #ffffff28;
    color:#c9c4bd;
    line-height:1.6;
}

.parcel-page [hidden] {
    display:none!important;
}

@media(max-width:1000px) {
    .parcel-layout {
        grid-template-columns:minmax(0,1fr) 290px;
    }
    .parcel-panel {
        padding:20px;
    }
    .parcel-map {
        height:560px;
    }
}

@media(max-width:760px) {
    .parcel-page {
        padding:100px 16px 50px;
    }
    .parcel-layout {
        grid-template-columns:1fr;
    }
    .parcel-map {
        height:470px;
        min-height:360px;
    }
    .parcel-panel {
        min-height:0;
    }
    .parcel-filters {
        width:100%;
    }
    .parcel-filters label {
        flex:1;
    }
    .parcel-filters button {
        font-size:12px;
    }
    .parcel-toolbar {
        gap:18px;
    }
    .parcel-legend {
        gap:12px;
        font-size:12px;
    }
}
