@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

:root {
    --read-font-family: "Merriweather", serif;
    --read-font-weight: 400;
    --read-font-style: normal;
    --system-font-family: "Average San", serif;
    --system-font-weight: 400;
    --system-font-style: normal;
    --mars-ink: #172426;
    --mars-text: #213234;
    --mars-muted: #56686b;
    --mars-surface: #ffffff;
    --mars-app-bg: #f7faf9;
    --mars-surface-alt: #f3f7f6;
    --mars-border: #c9d5d1;
    --mars-border-strong: #8da5a1;
    --mars-primary: #0d5160;
    --mars-primary-hover: #093e4a;
    --mars-primary-active: #062f39;
    --mars-primary-subtle: #dcebe7;
    --mars-focus-ring: rgba(13, 81, 96, 0.28);
    --mars-grid-header-bg: #12343b;
    --mars-grid-header-border: #28565f;
    --mars-grid-body-bg: #dfecea;
    --mars-grid-filter-bg: #d3e5e2;
    --mars-grid-edit-bg: #cfe4e8;
    --mars-grid-row-bg: #eef6f4;
    --mars-grid-alt-row: #e2ecea;
    --mars-danger: #9f261f;
    --mars-danger-hover: #7e1d18;
}

html, body {
    font-family: var(--system-font-family);
    height: 100%;
    margin: 0;
}

#app {
    min-height: 100%;
}

/* Prevent accidental long-press selection of static text in the MAUI shell. */
.maui-shell {
    -webkit-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
}

.maui-shell input,
.maui-shell textarea,
.maui-shell [contenteditable="true"],
.maui-shell [data-allow-text-selection],
.maui-shell .allow-text-selection,
.maui-shell .allow-text-selection * {
    -webkit-user-select: text;
    user-select: text;
    -webkit-touch-callout: default;
}

.maui-shell select,
.maui-shell a {
    -webkit-user-select: auto;
    user-select: auto;
    -webkit-touch-callout: default;
}

.para {
    font-family: var(--read-font-family);
    font-weight: var(--read-font-weight);
    font-style: var(--read-font-style);
    display: block;
    margin-bottom: 1em; /* bottom margin */
}

/* Ensure the layout wrapper takes up full height */
.layout-wrapper {
    height: 100vh; /* 100% of the viewport height */
}

.goal-templates-page {
    min-height: 100%;
    padding: 1rem;
}

.goal-templates-workspace {
    display: grid;
    grid-template-columns: minmax(14rem, 22rem) minmax(0, 1fr);
    gap: 1rem;
    min-height: min(48rem, calc(100vh - 8rem));
}

.goal-templates-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    min-height: 0;
    overflow-y: auto;
}

.goal-templates-editor {
    min-width: 0;
    overflow-y: auto;
}

.goal-template-editor-header,
.goal-template-header-actions,
.goal-template-milestone-grid,
.goal-template-task-row,
.goal-template-instantiate-grid {
    display: grid;
    gap: 0.75rem;
}

.goal-template-editor-header {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    margin-bottom: 1rem;
}

.goal-template-editor-header h2 {
    margin: 0;
    color: var(--mars-ink);
    font-size: 1.4rem;
}

.goal-template-header-actions {
    grid-auto-flow: column;
    align-items: center;
}

.goal-template-fields {
    margin-bottom: 1rem;
}

.goal-template-system-check {
    align-self: end;
}

.goal-template-milestone-panel {
    display: grid;
    gap: 0.75rem;
}

.goal-template-milestone-grid {
    grid-template-columns: minmax(0, 1fr) minmax(8rem, 12rem) minmax(12rem, 18rem);
    align-items: end;
}

.goal-template-task-list {
    display: grid;
    gap: 0.75rem;
}

.goal-template-task-row {
    grid-template-columns: minmax(0, 1fr) minmax(10rem, 14rem) auto;
    align-items: center;
}

.goal-template-task-delete-button {
    border-color: #8a1f11;
    color: #8a1f11;
}

.goal-template-task-delete-button:hover:not(:disabled),
.goal-template-task-delete-button:focus-visible:not(:disabled) {
    background: #8a1f11;
    color: white;
    outline: none;
}

.goal-template-task-draft {
    border-top: 1px solid var(--mars-border);
    padding-top: 0.75rem;
}

.goal-template-instantiate-dialog {
    width: min(42rem, calc(100vw - 2rem));
}

.goal-template-instantiate-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 1rem;
}

.goal-template-dialog-wide {
    grid-column: 1 / -1;
}

.goal-template-required-meetings {
    display: grid;
    gap: 0.75rem;
    margin-top: 1rem;
}

.goal-template-required-meetings h3 {
    margin: 0;
    color: var(--mars-ink);
    font-size: 1rem;
}

@media (max-width: 760px) {
    .goal-templates-page {
        height: 100%;
        min-height: 0;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        box-sizing: border-box;
    }

    .goal-templates-workspace,
    .goal-template-editor-header,
    .goal-template-milestone-grid,
    .goal-template-task-row,
    .goal-template-instantiate-grid {
        grid-template-columns: 1fr;
    }

    .goal-template-header-actions {
        grid-auto-flow: row;
    }

    .goal-templates-workspace {
        flex: 1 1 0;
        grid-template-rows: minmax(0, 40fr) minmax(0, 60fr);
        min-height: 0;
        overflow: hidden;
    }

    .goal-templates-list,
    .goal-templates-editor {
        height: 100%;
        max-height: none;
        min-height: 0;
        overflow-y: auto;
        box-sizing: border-box;
    }

    .goal-templates-list {
        align-self: stretch;
    }
}

.flex {
    flex: 1;
}

h1:focus {
    outline: none;
}

a, .btn-link {
    color: #0071c1;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.image {
    display: flex; /* establish flex context */
    flex-direction: column; /* stack children top→bottom */
    align-items: center; /* center them horizontally */
    width: 100%;
}

figure {
    display: inline-block;
}

    figure img {
        /* (optional) make sure it doesn’t stretch or shrink */
        max-width: 100%;
        height: auto;
    }

figcaption {
    text-align: center; /* if caption wraps to multiple lines */
    width: 100%;
    background-color: darkslategrey;
    color: bisque;
}


.content {
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.searchmark {
    background-color: yellow;
}

.float-image-left {
    float: left;
    margin: 10px;
}

.float-image-right {
    float: right;
    margin: 10px;
}

.navpane {
    background-color: rgb(240,240,240);
}

.maintop {
    height: 5%;
    max-height: 5%;
    display: flex;
    flex-direction: row;
    align-items: center; /* vertical centering */
    background-color: darkslategrey;
}

.heading00 {
    color: bisque;
    font-size: medium;
    font-weight: bold;
    text-align: center;
    margin: 0px;
    padding: 0px;
}

.heading01 {
    color: bisque;
    font-size: small;
    text-align: center
}

.title {
    color: bisque;
    font-size: small;
    font-weight: bold;
    text-align: center
}

.pagedisp {
    color: orange;
    background-color: black;
    font-family: sans-serif;
    font-variant: small-caps;
}

hr {
    background-image: url("divider2.svg");
}

.sectionview {
    display: flex;
    height: 100%;
    flex-direction: column;
}

.sectionheader {
    flex: 1;
    overflow-y: auto;
    background-color: rgb(32, 32, 32);
}

.sectiontopic {
    flex: 7;
    overflow-y: auto;
    margin: 1em;
    padding: 1em;
    box-sizing: border-box;
}

.Table_Norm_10 {
}

.Authority {
    font-weight: bold;
    padding-top: 0.5em;
    text-indent: 0em;
    margin-bottom: 0em;
}

.IndexLoc {
    margin: 0em;
    text-indent: 1em;
}

.textarea {
    background-color: lightblue !important;
}

.bookmarktext {
    background-color: lightblue;
}

.reference-grid {
    border: 1px solid var(--mars-border);
    color: var(--mars-ink);
    background: var(--mars-grid-body-bg);
}

.reference-grid-toolbar {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem;
    border-bottom: 1px solid var(--mars-border);
    background: #eef5f3;
}

.reference-grid-search {
    display: grid;
    width: min(18rem, 100%);
}

.reference-grid-scroll {
    overflow-x: auto;
}

.reference-grid-table {
    width: 100%;
    min-width: 54rem;
    border-collapse: collapse;
    background: var(--mars-grid-body-bg);
}

.reference-grid-table th,
.reference-grid-table td {
    padding: 0.55rem 0.65rem;
    border: 1px solid var(--mars-border);
    vertical-align: top;
}

.reference-grid-table thead tr:first-child th {
    border-color: var(--mars-grid-header-border);
    background: var(--mars-grid-header-bg);
    color: #ffffff;
}

.reference-grid-filter-row th {
    border-color: var(--mars-border-strong);
    background: var(--mars-grid-filter-bg);
}

.reference-grid-table tbody tr {
    background: var(--mars-grid-row-bg);
}

.reference-grid-table tbody tr:nth-child(even) {
    background: var(--mars-grid-alt-row);
}

.reference-grid-table tbody tr:hover {
    background: #dcebe7;
}

.reference-grid-table tbody tr.reference-grid-edit-row {
    background: var(--mars-grid-edit-bg);
}

.reference-grid-sort-button {
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    font-weight: 800;
    text-align: left;
}

.reference-grid-sort-button:hover,
.reference-grid-sort-button:focus-visible {
    text-decoration: underline;
    outline: none;
}

.reference-grid-sort-button:disabled {
    cursor: not-allowed;
    opacity: 0.72;
}

.reference-grid-input {
    width: 100%;
    min-height: 2.25rem;
    padding: 0.42rem 0.55rem;
    border: 1px solid var(--mars-border-strong);
    border-radius: 5px;
    background: #ffffff;
    color: var(--mars-ink);
    font: inherit;
}

.reference-grid-input:focus,
.reference-grid-check:focus-visible {
    border-color: var(--mars-primary);
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
    outline: none;
}

.reference-grid-input::placeholder,
.maui-login-input::placeholder,
.calendar-dialog-input::placeholder,
.goal-editor-input::placeholder,
.maui-drop-pin-input::placeholder,
.maui-meeting-note-input::placeholder {
    color: var(--mars-muted);
    opacity: 0.82;
}

.reference-grid-notes-input {
    min-height: 2.6rem;
    resize: vertical;
}

.reference-grid-check {
    width: 1.15rem;
    height: 1.15rem;
    margin-top: 0.45rem;
    border: 2px solid var(--mars-primary);
    background-color: #f6fbfa;
}

.reference-grid-actions-column {
    width: 17rem;
}

.reference-grid-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.reference-grid-button,
.reference-grid-primary-button,
.reference-grid-save-button,
.reference-grid-danger-button {
    min-height: 2.15rem;
    padding: 0.35rem 0.65rem;
    border: 1px solid var(--mars-border-strong);
    border-radius: 5px;
    background: #ffffff;
    color: var(--mars-ink);
    font-weight: 800;
}

.reference-grid-primary-button,
.reference-grid-save-button {
    border-color: var(--mars-primary);
    background: var(--mars-primary);
    color: #ffffff;
}

.reference-grid-danger-button {
    border-color: var(--mars-danger);
    color: var(--mars-danger);
}

.reference-grid-button:hover:not(:disabled),
.reference-grid-button:focus-visible:not(:disabled) {
    border-color: var(--mars-primary);
    background: var(--mars-primary-subtle);
    color: var(--mars-primary-active);
    outline: none;
}

.reference-grid-primary-button:hover:not(:disabled),
.reference-grid-primary-button:focus-visible:not(:disabled),
.reference-grid-save-button:hover:not(:disabled),
.reference-grid-save-button:focus-visible:not(:disabled) {
    border-color: var(--mars-primary-hover);
    background: var(--mars-primary-hover);
    color: #ffffff;
    outline: none;
}

.reference-grid-danger-button:hover:not(:disabled),
.reference-grid-danger-button:focus-visible:not(:disabled) {
    border-color: var(--mars-danger-hover);
    background: #fbe9e7;
    color: var(--mars-danger-hover);
    outline: none;
}

.reference-grid-button:disabled,
.reference-grid-primary-button:disabled,
.reference-grid-save-button:disabled,
.reference-grid-danger-button:disabled {
    cursor: not-allowed;
    opacity: 0.6;
}

.reference-grid-empty {
    padding: 1rem;
    color: var(--mars-muted);
    text-align: center;
    font-weight: 800;
}

.mars-save-activity-indicator {
    position: fixed;
    left: 50%;
    bottom: max(1rem, calc(env(safe-area-inset-bottom, 0px) + 0.75rem));
    z-index: 1200;
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    min-height: 2.5rem;
    padding: 0.45rem 0.85rem;
    border: 1px solid var(--mars-border-strong);
    border-radius: 999px;
    background: #ffffff;
    color: var(--mars-ink);
    box-shadow: 0 0.55rem 1.35rem rgba(23, 36, 38, 0.18);
    font-size: 0.9rem;
    font-weight: 800;
    transform: translateX(-50%);
}

.mars-save-activity-spinner {
    width: 1rem;
    height: 1rem;
    border: 2px solid var(--mars-border);
    border-top-color: var(--mars-primary);
    border-radius: 999px;
    animation: mars-save-activity-spin 0.75s linear infinite;
}

@keyframes mars-save-activity-spin {
    to {
        transform: rotate(360deg);
    }
}

.reference-grid-pager {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem;
    border-top: 1px solid var(--mars-border);
    background: #eef5f3;
    color: var(--mars-muted);
    font-weight: 800;
}

.reference-grid-pager-actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--mars-ink);
}

@media (max-width: 720px) {
    .reference-grid-toolbar,
    .reference-grid-pager {
        align-items: stretch;
        flex-direction: column;
    }

    .reference-grid-search {
        width: 100%;
    }

    .reference-grid-pager-actions {
        justify-content: space-between;
    }
}

.frontpagemarketing-title {
    color: white;
}

.frontpagemarketing {
    overflow: auto !important;
    color: navajowhite;
    position: relative;
    background-color: rgb(16,16,16);
    font-family: var(--read-font-family);
    font-size: larger;
    padding: 0;
    margin: 0;
    background-image: url(/images/marketing_background.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-blend-mode: soft-light;
}

.registerbutton, registerbutton:hover {
    color: black;
    font-size: large;
    width: 200px;
    height: 50px;
}

.last-error {
    color: red;
}

a {
    font-weight: bold;
    color: green;
}

.infinite-canvas {
    background-color: darkgray;
}

.maui-login-page,
.maui-home-page {
    box-sizing: border-box;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
    background:
        radial-gradient(circle at top left, rgba(19, 95, 112, 0.12), transparent 28rem),
        linear-gradient(135deg, #f7faf9 0%, #edf5f2 52%, #f4efe7 100%);
}

.maui-home-page {
    position: relative;
    isolation: isolate;
    min-height: 100%;
    height: 100%;
    overflow: hidden;
    color: #ffffff;
    background-color: #172426;
    background-image: url("assets/images/home_background.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.maui-home-page::before {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(9, 28, 32, 0.22) 0%, rgba(9, 28, 32, 0.58) 100%),
        rgba(9, 28, 32, 0.18);
    content: "";
    pointer-events: none;
}

.maui-home-content {
    position: relative;
    z-index: 1;
    width: min(100%, 24rem);
    display: grid;
    gap: 0.75rem;
    padding: 1.5rem;
    text-align: center;
    text-shadow: 0 0.15rem 0.9rem rgba(0, 0, 0, 0.45);
}

.maui-home-content h1 {
    margin: 0;
    color: #ffffff;
    font-size: 3rem;
    font-weight: 800;
    line-height: 1;
}

.maui-home-content p {
    margin: 0;
    color: rgba(255, 255, 255, 0.94);
    font-size: 1.18rem;
    font-weight: 700;
    line-height: 1.3;
}

.maui-home-corner-logo {
    position: absolute;
    top: max(1rem, env(safe-area-inset-top, 0px));
    left: max(1rem, env(safe-area-inset-left, 0px));
    z-index: 1;
    width: min(14rem, 52vw);
    max-width: calc(100% - 2rem);
    height: auto;
    display: block;
    object-fit: contain;
    opacity: 0.75;
}

.maui-home-panel {
    position: relative;
    z-index: 1;
    width: min(100%, 48rem);
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-rows: minmax(0, 31.25%) auto;
    align-content: space-between;
    gap: 0.75rem;
    padding: max(4.75rem, calc(env(safe-area-inset-top, 0px) + 4.25rem)) 1rem 1rem;
    box-sizing: border-box;
}

.maui-home-today-milestones,
.maui-home-tracking-panel {
    min-height: 0;
    border: 1px solid rgba(255, 255, 255, 0.34);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.94);
    color: var(--mars-text);
    box-shadow: 0 0.75rem 2rem rgba(8, 25, 29, 0.18);
}

.maui-home-today-milestones {
    overflow-y: auto;
    padding: 0.65rem;
}

.maui-home-today-milestones .calendar-month-selected-day-panel {
    height: 100%;
    max-height: none;
    min-height: 0;
}

.maui-home-today-milestones .calendar-month-milestone-detail {
    gap: 0.55rem;
}

.maui-home-tracking-panel {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    overflow: hidden;
    padding: 0.65rem;
}

.maui-home-tracking-row {
    display: grid;
    gap: 0.45rem;
    align-items: center;
}

.maui-home-tracking-panel .maui-home-tracking-button,
.maui-home-tracking-panel .maui-home-check-button {
    width: 100%;
    min-height: 2.65rem;
    margin-top: 0;
    padding: 0 0.95rem;
    white-space: nowrap;
}

.maui-home-checkout-group {
    width: 100%;
    display: grid;
    justify-items: center;
    align-items: center;
    gap: 0.3rem;
}

.maui-home-checkin-summary {
    width: 100%;
    display: grid;
    place-items: center;
    gap: 0.1rem;
    text-align: center;
}

.maui-home-tracking-status,
.maui-home-no-meetings,
.maui-home-state {
    margin: 0;
    color: var(--mars-muted);
    font-size: 0.93rem;
    font-weight: 700;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.maui-home-state {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.maui-home-state-error,
.maui-home-tracking-error {
    color: var(--mars-danger);
}

.maui-home-active-checkin {
    margin: 0;
    color: var(--mars-ink);
    font-size: 1.08rem;
    font-weight: 800;
    line-height: 1.25;
    text-align: center;
    overflow-wrap: anywhere;
}

.maui-home-checkin-time {
    margin: 0;
    color: var(--mars-muted);
    font-size: 0.92rem;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    overflow-wrap: anywhere;
}

.maui-home-no-meetings {
    font-weight: 800;
}

.maui-home-meeting-list {
    flex: 0 0 auto;
    max-height: min(16rem, 34vh);
    overflow-y: auto;
    display: grid;
    align-content: start;
    gap: 0.55rem;
    padding-right: 0.2rem;
}

.maui-home-meeting-choice {
    width: 100%;
    display: grid;
    gap: 0.25rem;
    padding: 0.75rem;
    border: 1px solid var(--mars-border);
    border-radius: 6px;
    background: #ffffff;
    color: var(--mars-text);
    text-align: left;
}

.maui-home-meeting-choice:hover:not(:disabled),
.maui-home-meeting-choice:focus-visible:not(:disabled) {
    border-color: var(--mars-primary);
    background: var(--mars-primary-subtle);
    color: var(--mars-primary-active);
    outline: none;
}

.maui-home-meeting-choice:focus-visible {
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
}

.maui-home-meeting-choice:disabled {
    cursor: wait;
    opacity: 0.72;
}

.maui-home-meeting-name {
    color: var(--mars-ink);
    font-weight: 800;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.maui-home-meeting-address {
    color: var(--mars-muted);
    font-size: 0.86rem;
    font-weight: 700;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.maui-login-card,
.maui-home-card {
    width: min(100%, 26rem);
    padding: 1.5rem;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.97);
    box-shadow: 0 1.25rem 3rem rgba(24, 42, 48, 0.14);
}

.maui-login-logo,
.maui-home-logo {
    width: min(16rem, 72vw);
    height: auto;
    display: block;
    margin: 0 auto 1.35rem;
}

.maui-login-heading {
    margin-bottom: 1.35rem;
    text-align: center;
}

.maui-eyebrow {
    margin: 0 0 0.35rem;
    color: var(--mars-muted);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: uppercase;
}

.maui-login-heading h1,
.maui-home-card h1 {
    margin: 0;
    color: var(--mars-ink);
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1.15;
}

.maui-login-form {
    display: grid;
    gap: 1rem;
}

.maui-field {
    display: grid;
    gap: 0.35rem;
}

.maui-field label {
    color: var(--mars-text);
    font-size: 0.92rem;
    font-weight: 700;
}

.maui-login-input {
    min-height: 3rem;
    border-color: var(--mars-border);
    border-radius: 6px;
    color: var(--mars-ink);
    background: #ffffff;
}

.maui-login-input:focus {
    border-color: var(--mars-primary);
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
}

.maui-primary-button,
.maui-secondary-button {
    width: 100%;
    min-height: 3rem;
    border-radius: 6px;
    font-weight: 700;
}

.maui-primary-button {
    margin-top: 0.25rem;
    border: 0;
    background: var(--mars-primary);
    color: #ffffff;
}

.maui-primary-button:hover:not(:disabled),
.maui-primary-button:focus-visible:not(:disabled) {
    background: var(--mars-primary-hover);
}

.maui-secondary-button {
    margin-top: 1.25rem;
    border: 1px solid var(--mars-primary);
    background: #ffffff;
    color: var(--mars-primary);
}

.maui-secondary-button:hover:not(:disabled),
.maui-secondary-button:focus-visible:not(:disabled) {
    background: var(--mars-primary-subtle);
    color: var(--mars-primary-active);
}

.maui-primary-button:disabled,
.maui-secondary-button:disabled {
    cursor: wait;
    opacity: 0.72;
}

.maui-login-status {
    min-height: 1.5rem;
    margin-top: 1rem;
    text-align: center;
}

.maui-login-error {
    margin: 0.85rem 0 0;
    color: var(--mars-danger);
    font-size: 0.9rem;
    overflow-wrap: anywhere;
}

.maui-home-card {
    text-align: center;
}

.maui-home-meta {
    margin: 0.75rem 0 0;
    color: var(--mars-muted);
    font-size: 0.95rem;
}

.maui-bottom-nav {
    position: relative;
    z-index: 11;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.45rem;
    min-height: 3.85rem;
    padding: 0.4rem max(0.75rem, env(safe-area-inset-right, 0px)) calc(0.4rem + env(safe-area-inset-bottom, 0px)) max(0.75rem, env(safe-area-inset-left, 0px));
    border-top: 1px solid rgba(255, 215, 64, 0.24);
    background: rgba(27, 29, 31, 0.98);
    box-shadow: 0 -0.45rem 1.35rem rgba(12, 22, 26, 0.22);
}

.maui-bottom-menu-button,
.maui-bottom-nav-button,
.maui-bottom-nav-placeholder {
    width: 3rem;
    height: 3rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    padding: 0;
    border: 1px solid rgba(255, 215, 64, 0.34);
    border-radius: 8px;
    color: #ffffff;
    background: rgba(255, 255, 255, 0.08);
    box-shadow: 0 0.35rem 0.85rem rgba(0, 0, 0, 0.24);
    text-decoration: none;
}

.maui-bottom-menu-button:hover,
.maui-bottom-menu-button:focus-visible,
.maui-bottom-menu-button.is-active,
.maui-bottom-nav-button:hover,
.maui-bottom-nav-button:focus-visible,
.maui-bottom-nav-button.active {
    color: #ffd740;
    background: rgba(255, 215, 64, 0.14);
    outline: none;
}

.maui-bottom-menu-button:focus-visible,
.maui-bottom-nav-button:focus-visible {
    box-shadow: 0 0 0 0.2rem rgba(255, 215, 64, 0.24), 0 0.35rem 0.85rem rgba(0, 0, 0, 0.24);
}

.maui-bottom-nav-placeholder {
    opacity: 0.42;
    box-shadow: none;
}

.maui-bottom-nav-placeholder:disabled {
    cursor: default;
}

.maui-bottom-nav-empty-marker {
    width: 1.35rem;
    height: 1.35rem;
    display: block;
    border: 2px dashed currentColor;
    border-radius: 6px;
}

.maui-bottom-nav-icon {
    width: 1.8rem;
    height: 1.8rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.maui-bottom-menu-button svg,
.maui-bottom-nav-button svg {
    width: 1.8rem;
    height: 1.8rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.maui-bottom-nav-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.maui-nav-popup-backdrop {
    position: absolute;
    inset: 0;
    z-index: 8;
    border: 0;
    background: transparent;
}

.maui-nav-popup {
    position: absolute;
    left: max(0.75rem, env(safe-area-inset-left, 0px));
    bottom: calc(4.25rem + env(safe-area-inset-bottom, 0px));
    z-index: 10;
    width: min(13.25rem, calc(100% - 1.5rem));
    max-height: min(70vh, calc(100% - 5.5rem));
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    overflow-y: auto;
    padding: 1rem 0.75rem;
    border: 1px solid rgba(255, 215, 64, 0.26);
    border-radius: 8px;
    background: rgba(27, 29, 31, 0.98);
    box-shadow: 0 0.85rem 1.85rem rgba(0, 0, 0, 0.28);
    scrollbar-color: rgba(255, 215, 64, 0.5) rgba(255, 255, 255, 0.08);
}

.maui-nav-popup-title {
    color: #ffd740;
    font-size: 1rem;
    font-weight: 900;
    line-height: 1.2;
}

.maui-nav-popup-link {
    min-height: 2.65rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    padding: 0.35rem 0.75rem;
    border: 1px solid #d9b82f;
    border-radius: 999px;
    color: #ffd740;
    background: rgba(255, 255, 255, 0.03);
    font-size: 0.98rem;
    font-weight: 800;
    line-height: 1.1;
    text-align: center;
    text-decoration: none;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04);
}

.maui-nav-popup-link:hover,
.maui-nav-popup-link:focus-visible,
.maui-nav-popup-link.active {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.14);
    outline: none;
}

.maui-nav-popup-link:focus-visible {
    box-shadow: 0 0 0 0.2rem rgba(255, 215, 64, 0.24), inset 0 0 0 1px rgba(255, 255, 255, 0.04);
}

.maui-nav-popup-icon {
    width: 1.15rem;
    height: 1.15rem;
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
}

.maui-nav-popup-icon svg {
    width: 100%;
    height: 100%;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.maui-profile-page {
    min-height: 100%;
    padding: 1rem;
    background: var(--mars-app-bg);
    color: var(--mars-text);
}

.maui-profile-content {
    width: min(100%, 42rem);
    margin: 0 auto;
    display: grid;
    gap: 1rem;
}

.maui-profile-panel,
.maui-profile-actions {
    padding: 1rem;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: var(--mars-surface);
}

.maui-profile-panel h2 {
    margin: 0 0 0.85rem;
    color: var(--mars-ink);
    font-size: 1.18rem;
    font-weight: 700;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.maui-profile-list {
    display: grid;
    gap: 0.85rem;
    margin: 0;
}

.maui-profile-list div {
    display: grid;
    gap: 0.2rem;
}

.maui-profile-list dt,
.maui-profile-access-group h3 {
    margin: 0;
    color: var(--mars-muted);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.maui-profile-list dd {
    margin: 0;
    color: var(--mars-text);
    overflow-wrap: anywhere;
}

.maui-profile-access-group {
    display: grid;
    gap: 0.6rem;
    padding-top: 0.85rem;
    border-top: 1px solid var(--mars-border);
}

.maui-profile-access-group:first-of-type {
    padding-top: 0;
    border-top: 0;
}

.maui-profile-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.maui-profile-chip-list li {
    max-width: 100%;
    padding: 0.32rem 0.55rem;
    border: 1px solid var(--mars-border);
    border-radius: 6px;
    background: var(--mars-surface-alt);
    color: var(--mars-text);
    font-size: 0.88rem;
    overflow-wrap: anywhere;
}

.maui-profile-muted,
.maui-profile-state p {
    margin: 0;
    color: var(--mars-muted);
    font-weight: 700;
}

.maui-profile-state {
    min-height: 12rem;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.maui-profile-actions .maui-secondary-button {
    margin-top: 0;
}

.maui-profile-error {
    margin: 0.85rem 0 0;
    color: var(--mars-danger);
    font-size: 0.9rem;
    text-align: center;
    overflow-wrap: anywhere;
}

.maui-search-page {
    min-height: 100%;
    padding: 1rem;
    overflow: auto;
    background: var(--mars-app-bg);
    color: var(--mars-text);
}

.maui-search-content,
.maui-search-accordion {
    width: min(100%, 42rem);
    margin: 0 auto;
}

.maui-search-accordion {
    display: grid;
    gap: 0.75rem;
}

.maui-search-accordion-item {
    overflow: hidden;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: var(--mars-surface);
}

.maui-search-category-button {
    width: 100%;
    min-height: 3.5rem;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 0.75rem;
    padding: 0.85rem 1rem;
    border: 0;
    background: var(--mars-surface);
    color: var(--mars-ink);
    font-weight: 800;
    text-align: left;
}

.maui-search-category-button:hover,
.maui-search-category-button:focus-visible {
    background: var(--mars-primary-subtle);
    outline: none;
}

.maui-search-category-button:focus-visible {
    box-shadow: inset 0 0 0 0.2rem var(--mars-focus-ring);
}

.maui-search-category-meta {
    color: var(--mars-muted);
    font-size: 0.8rem;
    font-weight: 800;
}

.maui-search-category-icon {
    display: flex;
    width: 1.2rem;
    height: 1.2rem;
    align-items: center;
    justify-content: center;
    color: var(--mars-primary);
}

.maui-search-category-icon svg {
    width: 100%;
    height: 100%;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.maui-search-category-panel {
    display: grid;
    gap: 1rem;
    padding: 1rem;
    border-top: 1px solid var(--mars-border);
}

.maui-search-form {
    display: grid;
    gap: 1rem;
}

.maui-search-input,
.maui-search-select {
    width: 100%;
    min-height: 2.8rem;
    padding: 0 0.75rem;
    border: 1px solid var(--mars-border-strong);
    border-radius: 6px;
    background: #ffffff;
    color: var(--mars-ink);
}

.maui-search-select {
    padding-right: 2rem;
}

.maui-search-input:focus,
.maui-search-select:focus {
    border-color: var(--mars-primary);
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
    outline: none;
}

.maui-search-input::placeholder {
    color: var(--mars-muted);
    opacity: 0.82;
}

.maui-search-mode-group {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.35rem;
    padding: 0.25rem;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: var(--mars-surface-alt);
}

.maui-search-mode-button {
    min-height: 2.55rem;
    padding: 0 0.45rem;
    border: 1px solid transparent;
    border-radius: 6px;
    background: transparent;
    color: var(--mars-muted);
    font-size: 0.86rem;
    font-weight: 800;
    line-height: 1.15;
}

.maui-search-mode-button:hover,
.maui-search-mode-button:focus-visible {
    border-color: var(--mars-border-strong);
    color: var(--mars-primary-active);
    outline: none;
}

.maui-search-mode-button:focus-visible {
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
}

.maui-search-mode-button-active {
    border-color: var(--mars-primary);
    background: #ffffff;
    color: var(--mars-primary);
}

.maui-search-radius {
    display: grid;
    gap: 0.5rem;
}

.maui-search-radius-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.maui-search-radius-label label,
.maui-search-radius-label output {
    color: var(--mars-text);
    font-size: 0.92rem;
    font-weight: 800;
}

.maui-search-slider {
    width: 100%;
    accent-color: var(--mars-primary);
}

.maui-search-place-grid {
    display: grid;
    gap: 0.85rem;
}

.maui-search-results-block {
    display: grid;
    gap: 0.75rem;
    min-height: 2rem;
}

.maui-search-status,
.maui-search-empty,
.maui-search-error {
    margin: 0;
    font-size: 0.92rem;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.maui-search-status,
.maui-search-empty {
    color: var(--mars-muted);
}

.maui-search-error {
    color: var(--mars-danger);
}

.maui-search-result-list {
    max-height: 15rem;
    overflow: auto;
    display: grid;
    gap: 0.45rem;
    padding: 0.35rem;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: var(--mars-surface-alt);
}

.maui-search-result {
    width: 100%;
    display: grid;
    gap: 0.18rem;
    padding: 0.75rem;
    border: 1px solid var(--mars-border);
    border-radius: 6px;
    background: #ffffff;
    color: var(--mars-text);
    text-align: left;
}

.maui-search-result:hover,
.maui-search-result:focus-visible {
    border-color: var(--mars-primary);
    background: var(--mars-primary-subtle);
    outline: none;
}

.maui-search-result:focus-visible {
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
}

.maui-search-result-active {
    border-color: var(--mars-primary);
    background: #edf7f4;
}

.maui-search-result-title,
.maui-meeting-picker-title,
.maui-meetings-item-title {
    min-width: 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.55rem;
}

.maui-search-result-name {
    color: var(--mars-ink);
    font-weight: 800;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.maui-saved-meeting-badge {
    flex: 0 0 auto;
    max-width: 100%;
    padding: 0.18rem 0.42rem;
    border: 1px solid #9bc4b2;
    border-radius: 6px;
    background: #e3f1e9;
    color: #24563d;
    font-size: 0.72rem;
    font-weight: 800;
    line-height: 1.1;
    text-transform: uppercase;
}

.maui-saved-meeting-button {
    flex: 0 0 auto;
    max-width: 100%;
    padding: 0.18rem 0.42rem;
    border: 1px solid #9bc4b2;
    border-radius: 6px;
    background: #e3f1e9;
    color: #24563d;
    font-size: 0.72rem;
    font-weight: 800;
    line-height: 1.1;
    text-transform: uppercase;
}

.maui-saved-meeting-button:hover:not(:disabled),
.maui-saved-meeting-button:focus-visible:not(:disabled) {
    border-color: #6aa987;
    background: #d2eadc;
    outline: none;
}

.maui-saved-meeting-button:focus-visible {
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
}

.maui-saved-meeting-button:disabled {
    cursor: wait;
    opacity: 0.72;
}

.maui-search-result-meta,
.maui-search-result-location,
.maui-search-result-distance {
    color: var(--mars-muted);
    font-size: 0.84rem;
    font-weight: 700;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.maui-search-result-distance {
    color: var(--mars-primary);
}

.maui-search-details .maui-meeting-details {
    flex: initial;
    width: 100%;
    max-width: none;
    min-width: 0;
    max-height: none;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
}

.maui-meetings-page {
    height: 100%;
    min-height: 0;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    padding: 1rem;
    overflow: hidden;
    background: var(--mars-app-bg);
    color: var(--mars-text);
}

.maui-meetings-content {
    flex: 1 1 auto;
    width: min(100%, 56rem);
    min-height: 0;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(15rem, 21rem) minmax(0, 1fr);
    gap: 1rem;
    align-items: stretch;
    overflow: hidden;
}

.maui-meetings-list-panel,
.maui-meetings-details-panel .maui-meeting-details {
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: var(--mars-surface);
}

.maui-meetings-list-panel {
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.maui-meetings-list {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow: auto;
    display: grid;
    align-content: start;
    gap: 0.45rem;
    padding: 0.75rem;
}

.maui-meetings-item {
    width: 100%;
    display: grid;
    gap: 0.18rem;
    padding: 0.75rem;
    border: 1px solid var(--mars-border);
    border-radius: 6px;
    background: #ffffff;
    color: var(--mars-text);
    text-align: left;
}

.maui-meetings-item:hover,
.maui-meetings-item:focus-visible {
    border-color: var(--mars-primary);
    background: var(--mars-primary-subtle);
    outline: none;
}

.maui-meetings-item:focus-visible {
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
}

.maui-meetings-item-active {
    border-color: var(--mars-primary);
    background: #edf7f4;
}

.maui-meetings-item-name {
    color: var(--mars-ink);
    font-weight: 800;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.maui-meetings-item-meta,
.maui-meetings-item-location,
.maui-meetings-item-time {
    color: var(--mars-muted);
    font-size: 0.84rem;
    font-weight: 700;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.maui-meetings-details-panel {
    min-width: 0;
    min-height: 0;
    display: flex;
    overflow: hidden;
}

.maui-meetings-details-panel .maui-meeting-details {
    flex: initial;
    width: 100%;
    height: 100%;
    min-height: 0;
    box-sizing: border-box;
    max-width: none;
    min-width: 0;
    max-height: none;
    overflow: auto;
}

.maui-meetings-state {
    width: min(100%, 42rem);
    min-height: 12rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin: 0 auto;
    padding: 1rem;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: var(--mars-surface);
    text-align: center;
}

.maui-meetings-state p {
    margin: 0;
    color: var(--mars-muted);
    font-weight: 700;
    overflow-wrap: anywhere;
}

.maui-checkins-page {
    width: min(100%, 70rem);
    min-height: 100%;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 0.85rem;
    padding: max(1rem, env(safe-area-inset-top, 0px)) 1rem 1rem;
    box-sizing: border-box;
}

.maui-checkins-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.maui-checkins-header h1 {
    margin: 0;
    color: var(--mars-ink);
    font-size: 1.35rem;
    font-weight: 800;
    line-height: 1.15;
}

.maui-checkins-content {
    min-height: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto auto;
    gap: 0.75rem;
}

.maui-checkins-table-scroll {
    min-height: 0;
    overflow: auto;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: #ffffff;
}

.maui-checkins-table {
    width: 100%;
    min-width: 48rem;
    border-collapse: collapse;
    color: var(--mars-text);
}

.maui-checkins-table th,
.maui-checkins-table td {
    padding: 0.65rem 0.75rem;
    border-bottom: 1px solid var(--mars-border);
    text-align: left;
    vertical-align: top;
    white-space: nowrap;
}

.maui-checkins-table th:first-child,
.maui-checkins-table td:first-child {
    min-width: 13rem;
    white-space: normal;
    overflow-wrap: anywhere;
}

.maui-checkins-table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--mars-grid-header-bg);
    color: #ffffff;
    font-size: 0.78rem;
    font-weight: 800;
}

.maui-checkins-table tbody tr:nth-child(even) {
    background: var(--mars-grid-alt-row);
}

.maui-checkins-table tbody tr:hover {
    background: #dcebe7;
}

.maui-checkins-state {
    min-height: 16rem;
    display: grid;
    place-items: center;
    gap: 0.75rem;
    text-align: center;
}

.maui-checkins-state p,
.maui-checkins-error {
    margin: 0;
    color: var(--mars-muted);
    font-weight: 800;
    line-height: 1.35;
}

.maui-checkins-error {
    color: var(--mars-danger);
}

.maui-checkins-load-more {
    justify-self: center;
    width: min(100%, 16rem);
    margin-top: 0;
}

.calendar-page {
    min-height: 100%;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    color: var(--mars-text);
}

.calendar-page-month {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

body .content:has(.calendar-page-month) {
    display: flex;
    overflow: hidden;
}

body .maui-shell-main-with-tabs:has(.calendar-page-month) {
    overflow: hidden;
}

body .maui-shell-main-with-tabs:has(.maui-meetings-page) {
    overflow: hidden;
}

body .maui-shell-main-with-tabs:has(.maui-checkins-page) {
    overflow: hidden;
}

.calendar-page-month > [role="status"] {
    flex: 0 0 auto;
}

.calendar-eyebrow {
    margin: 0 0 0.2rem;
    color: var(--mars-muted);
    font-size: 0.75rem;
    font-weight: 800;
    line-height: 1.2;
    text-transform: uppercase;
}

.calendar-shell {
    min-width: 0;
    min-height: 28rem;
    overflow: hidden;
    overflow-x: auto;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: var(--mars-surface);
}

.calendar-shell-day,
.calendar-shell-week,
.calendar-shell-timeline {
    overflow-x: auto;
}

.calendar-shell-month {
    overflow: hidden;
}

.calendar-page-month .calendar-shell-month {
    flex: 1 1 0;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
}

.calendar-shell.calendar-shell-agenda {
    overflow: hidden;
}

.calendar-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
    padding: 0.75rem;
    border-bottom: 1px solid var(--mars-border);
    background: color-mix(in srgb, var(--mars-surface) 88%, var(--mars-primary) 12%);
}

.calendar-toolbar-primary {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    flex-wrap: wrap;
    min-width: 0;
}

.calendar-toolbar-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    flex-wrap: wrap;
    min-width: 0;
}

.calendar-shell-month .calendar-toolbar {
    justify-content: space-between;
    padding-block: 0.55rem;
}

.calendar-toolbar-month {
    justify-content: flex-start;
    padding-block: 0.55rem;
}

.calendar-toolbar-month .calendar-toolbar-actions,
.calendar-toolbar-month .calendar-agenda-view-select {
    width: 100%;
}

.calendar-month-filter {
    display: inline-flex;
    align-items: center;
    gap: 0.15rem;
    padding: 0.18rem;
    border: 1px solid var(--mars-border-strong);
    border-radius: 999px;
    background: var(--mars-surface);
}

.calendar-month-filter-button {
    min-height: 2rem;
    padding: 0.25rem 0.65rem;
    border: 1px solid transparent;
    border-radius: 999px;
    background: transparent;
    color: var(--mars-muted);
    font: inherit;
    font-size: 0.82rem;
    font-weight: 900;
    line-height: 1;
    white-space: nowrap;
}

.calendar-month-filter-button:hover,
.calendar-month-filter-button:focus-visible {
    border-color: var(--mars-primary);
    color: var(--mars-primary-active);
    outline: none;
}

.calendar-month-filter-button-active,
.calendar-month-filter-button-active:hover,
.calendar-month-filter-button-active:focus-visible {
    border-color: var(--mars-primary);
    background: var(--mars-primary);
    color: #ffffff;
}

.calendar-range-label {
    min-width: 0;
    color: var(--mars-muted);
    font-size: 0.88rem;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.calendar-day-view,
.calendar-week-view {
    min-width: 52rem;
    background: var(--mars-surface);
}

.calendar-week-view {
    min-width: 92rem;
}

.calendar-time-view-header,
.calendar-all-day-row,
.calendar-time-grid {
    display: grid;
    grid-template-columns: 4.5rem repeat(var(--calendar-day-count, 1), minmax(12rem, 1fr));
}

.calendar-time-view-header-day,
.calendar-all-day-row-day,
.calendar-time-grid-day {
    --calendar-day-count: 1;
}

.calendar-time-axis-header,
.calendar-all-day-label,
.calendar-time-axis {
    border-right: 1px solid var(--mars-border);
    background: color-mix(in srgb, var(--mars-surface) 96%, var(--mars-primary) 4%);
}

.calendar-time-axis-header,
.calendar-time-day-header {
    min-width: 0;
    border-bottom: 1px solid var(--mars-border);
}

.calendar-time-day-header {
    display: grid;
    gap: 0.16rem;
    padding: 0.7rem 0.85rem;
    border-left: 1px solid var(--mars-border);
    background: color-mix(in srgb, var(--mars-surface) 94%, var(--mars-primary) 6%);
    color: var(--mars-muted);
    font-weight: 800;
    line-height: 1.1;
    text-align: center;
}

.calendar-time-day-header:first-of-type {
    border-left: 0;
}

.calendar-time-day-header span:first-child {
    color: var(--mars-ink);
    font-size: 0.78rem;
    text-transform: uppercase;
}

.calendar-time-day-header-today,
.calendar-time-day-column-today {
    background: color-mix(in srgb, var(--mars-surface) 90%, var(--mars-primary) 10%);
}

.calendar-all-day-row {
    min-height: 3.2rem;
    border-bottom: 1px solid var(--mars-border);
}

.calendar-all-day-label {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    color: var(--mars-muted);
    font-size: 0.76rem;
    font-weight: 900;
    text-transform: uppercase;
}

.calendar-all-day-lane {
    min-width: 0;
    display: flex;
    align-items: stretch;
    gap: 0.4rem;
    flex-wrap: wrap;
    padding: 0.5rem;
}

.calendar-week-all-day-grid {
    position: relative;
    display: grid;
    grid-template-columns: repeat(7, minmax(12rem, 1fr));
    grid-auto-rows: 2.7rem;
    min-height: calc((var(--calendar-all-day-lane-count, 1) * 2.7rem) + 0.4rem);
    padding: 0.3rem 0;
    isolation: isolate;
}

.calendar-week-grid-lines {
    position: absolute;
    inset: 0;
    z-index: 0;
    display: grid;
    grid-template-columns: repeat(7, minmax(12rem, 1fr));
    pointer-events: none;
}

.calendar-week-grid-lines span {
    border-left: 1px solid var(--mars-border);
}

.calendar-week-grid-lines span:first-child {
    border-left: 0;
}

.calendar-all-day-empty {
    z-index: 1;
    grid-column: 1 / -1;
    align-self: center;
    justify-self: center;
    color: var(--mars-muted);
    font-size: 0.82rem;
    font-weight: 800;
}

.calendar-time-grid {
    min-height: calc(var(--calendar-hour-count, 16) * 4.5rem);
}

.calendar-time-axis {
    min-height: calc(var(--calendar-hour-count, 16) * 4.5rem);
}

.calendar-time-axis-label {
    height: 4.5rem;
    padding: 0.35rem 0.5rem 0 0;
    border-bottom: 1px solid var(--mars-border);
    color: var(--mars-muted);
    font-size: 0.72rem;
    font-weight: 900;
    line-height: 1;
    text-align: right;
}

.calendar-time-day-column {
    position: relative;
    min-width: 0;
    min-height: calc(var(--calendar-hour-count, 16) * 4.5rem);
    border-left: 1px solid var(--mars-border);
    background-image: repeating-linear-gradient(
        to bottom,
        transparent 0,
        transparent calc(4.5rem - 1px),
        var(--mars-border) calc(4.5rem - 1px),
        var(--mars-border) 4.5rem);
}

.calendar-time-day-column:first-of-type {
    border-left: 0;
}

.calendar-slot-button {
    position: absolute;
    left: 0;
    z-index: 1;
    width: 100%;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.calendar-slot-button:hover:not(:disabled),
.calendar-slot-button:focus-visible:not(:disabled) {
    background: color-mix(in srgb, var(--mars-surface) 70%, var(--mars-primary) 30%);
    outline: 2px solid var(--mars-focus-ring);
    outline-offset: -2px;
}

.calendar-slot-button:disabled {
    cursor: default;
}

.calendar-timed-entry,
.calendar-all-day-entry,
.calendar-month-entry,
.calendar-month-detail-entry {
    z-index: 2;
    min-width: 0;
    border: 1px solid var(--mars-border);
    border-left-width: 4px;
    border-radius: 6px;
    background: color-mix(in srgb, var(--mars-surface) 92%, var(--mars-primary) 8%);
    color: var(--mars-ink);
    font: inherit;
    text-align: left;
}

.calendar-timed-entry {
    position: absolute;
    padding: 0.4rem 0.5rem;
    overflow: hidden;
}

.calendar-all-day-entry {
    padding: 0.35rem 0.5rem;
}

.calendar-week-all-day-entry {
    margin: 0.15rem 0.3rem;
}

.calendar-timed-entry:hover,
.calendar-timed-entry:focus-visible,
.calendar-all-day-entry:hover,
.calendar-all-day-entry:focus-visible,
.calendar-month-entry:hover,
.calendar-month-entry:focus-visible,
.calendar-month-detail-entry:hover,
.calendar-month-detail-entry:focus-visible {
    box-shadow: 0 0 0 0.15rem var(--mars-focus-ring);
    outline: none;
}

.calendar-month-view {
    --calendar-month-detail-panel-height: var(--calendar-month-detail-height, clamp(12rem, 28vh, 20rem));
    position: relative;
    min-width: 0;
    display: grid;
    grid-template-rows:
        minmax(0, var(--calendar-month-calendar-height, clamp(26rem, 52vh, 38rem)))
        auto
        minmax(0, var(--calendar-month-detail-panel-height));
    background: var(--mars-surface);
}

.calendar-month-scroll {
    position: relative;
    min-width: 0;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scroll-behavior: smooth;
    scroll-snap-type: y proximity;
    background: var(--mars-surface);
}

.calendar-month-block {
    min-width: 0;
    scroll-snap-align: start;
    border-bottom: 1px solid var(--mars-border);
    background: var(--mars-surface);
}

.calendar-month-block-active .calendar-month-title {
    color: var(--mars-primary-active);
}

.calendar-month-title {
    margin: 0;
    padding: 0.6rem 0.85rem 0.45rem;
    color: var(--mars-ink);
    font-size: 1.05rem;
    font-weight: 900;
    line-height: 1.15;
}

.calendar-month-calendar {
    min-width: 0;
}

.calendar-month-header,
.calendar-month-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
}

.calendar-month-header {
    border-bottom: 1px solid var(--mars-border);
    background: color-mix(in srgb, var(--mars-surface) 94%, var(--mars-primary) 6%);
}

.calendar-month-header div {
    min-width: 0;
    padding: 0.45rem 0.35rem;
    border-left: 1px solid var(--mars-border);
    color: var(--mars-ink);
    font-size: 0.74rem;
    font-weight: 900;
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
}

.calendar-month-header div:first-child {
    border-left: 0;
}

.calendar-month-grid {
    grid-auto-rows: minmax(4.1rem, 1fr);
}

.calendar-month-day {
    min-width: 0;
    min-height: 4.1rem;
    border-left: 1px solid var(--mars-border);
    border-bottom: 1px solid var(--mars-border);
    background: var(--mars-surface);
}

.calendar-month-day:nth-child(7n + 1) {
    border-left: 0;
}

.calendar-month-day-outside {
    background: color-mix(in srgb, var(--mars-surface) 88%, var(--mars-muted) 12%);
}

.calendar-month-day-today {
    background: color-mix(in srgb, var(--mars-surface) 86%, var(--mars-primary) 14%);
}

.calendar-month-day-selected {
    background: color-mix(in srgb, var(--mars-surface) 78%, var(--mars-primary) 22%);
}

.calendar-month-day-button {
    width: 100%;
    min-width: 0;
    min-height: 4.1rem;
    height: 100%;
    display: grid;
    grid-template-rows: auto 1fr auto;
    gap: 0.16rem;
    align-items: start;
    padding: 0.28rem 0.25rem;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--mars-ink);
    font: inherit;
    text-align: center;
    cursor: pointer;
}

.calendar-month-day-button:hover,
.calendar-month-day-button:focus-visible {
    background: color-mix(in srgb, var(--mars-surface) 70%, var(--mars-primary) 30%);
    outline: 2px solid var(--mars-focus-ring);
    outline-offset: -2px;
}

.calendar-month-day-number {
    min-width: 1.55rem;
    height: 1.55rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    justify-self: start;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: 0.88rem;
    font-weight: 900;
    line-height: 1;
}

.calendar-month-day-outside .calendar-month-day-number {
    color: var(--mars-muted);
    opacity: 0.72;
}

.calendar-month-day-today .calendar-month-day-number {
    border-color: var(--mars-primary);
    color: var(--mars-primary-active);
}

.calendar-month-day-selected .calendar-month-day-number,
.calendar-month-day-selected.calendar-month-day-today .calendar-month-day-number {
    border-color: var(--mars-primary);
    background: var(--mars-primary);
    color: #ffffff;
    opacity: 1;
}

.calendar-month-day-indicators {
    min-width: 0;
    min-height: 0.8rem;
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: end;
    gap: 0.14rem;
    overflow: hidden;
}

.calendar-month-day-dot {
    width: 0.34rem;
    height: 0.34rem;
    flex: 0 0 auto;
    border-radius: 999px;
    background: var(--mars-muted);
}

.calendar-month-day-dot.calendar-appointment-meeting {
    background: var(--mars-primary);
}

.calendar-month-day-dot.calendar-appointment-task {
    background: #4c6f33;
}

.calendar-month-day-dot.calendar-appointment-milestone {
    background: #7b4e1d;
}

.calendar-month-day-dot.calendar-appointment-goal-generated {
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--mars-primary) 35%, transparent);
}

.calendar-month-day-more {
    color: var(--mars-muted);
    font-size: 0.62rem;
    font-weight: 900;
    line-height: 1;
}

.calendar-month-filter-bar {
    display: flex;
    justify-content: center;
    min-width: 0;
    padding: 0.55rem 0.75rem;
    border-top: 1px solid var(--mars-border);
    background: color-mix(in srgb, var(--mars-surface) 96%, var(--mars-primary) 4%);
}

.calendar-month-selected-day-panel {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 0.75rem;
    height: var(--calendar-month-detail-panel-height);
    max-height: var(--calendar-month-detail-panel-height);
    min-height: 0;
    padding: 0.85rem;
    background: color-mix(in srgb, var(--mars-surface) 94%, var(--mars-primary) 6%);
    box-sizing: border-box;
    overflow: hidden;
}

.calendar-month-selected-day-header {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.calendar-month-selected-day-header > div {
    min-width: 0;
}

.calendar-month-selected-day-header h2 {
    margin: 0;
    color: var(--mars-ink);
    font-size: 1.2rem;
    font-weight: 900;
    line-height: 1.15;
    overflow-wrap: anywhere;
}

.calendar-month-add-button {
    width: 2.35rem;
    height: 2.35rem;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--mars-primary);
    border-radius: 7px;
    background: var(--mars-primary);
    color: #ffffff;
    font: inherit;
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 1;
}

.calendar-month-add-button:hover,
.calendar-month-add-button:focus-visible {
    border-color: var(--mars-primary-hover);
    background: var(--mars-primary-hover);
    outline: none;
}

.calendar-month-selected-day-empty {
    padding: 0.85rem;
    border: 1px dashed var(--mars-border-strong);
    border-radius: 6px;
    color: var(--mars-muted);
    font-weight: 800;
    text-align: center;
}

.calendar-month-selected-day-body {
    min-width: 0;
    min-height: 0;
    display: grid;
    align-content: start;
    gap: 0.75rem;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.calendar-month-selected-day-list {
    min-width: 0;
    display: grid;
    gap: 0.5rem;
}

.calendar-month-entry,
.calendar-month-detail-entry {
    min-height: 3.3rem;
    padding: 0.5rem 0.65rem;
}

.calendar-month-milestone-detail {
    min-width: 0;
    display: grid;
    gap: 0.65rem;
}

.calendar-month-goal-card {
    min-width: 0;
    overflow: hidden;
    border: 2px solid var(--mars-border-strong);
    border-radius: 8px;
    background: var(--mars-surface);
}

.calendar-month-goal-card-expanded {
    border-color: color-mix(in srgb, var(--mars-primary) 60%, var(--mars-border-strong));
}

.calendar-month-goal-card-header {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 0.4rem;
}

.calendar-month-goal-card-toggle {
    min-width: 0;
    min-height: 4.25rem;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 0.45rem;
    padding: 0.7rem 0.2rem 0.7rem 0.75rem;
    border: 0;
    background: transparent;
    color: var(--mars-ink);
    font: inherit;
    text-align: left;
}

.calendar-month-goal-card-toggle:hover,
.calendar-month-goal-card-toggle:focus-visible {
    color: var(--mars-primary-active);
    outline: none;
}

.calendar-month-goal-card-toggle:focus-visible {
    box-shadow: inset 0 0 0 0.18rem var(--mars-focus-ring);
}

.calendar-month-goal-card-chevron {
    width: 1.25rem;
    height: 1.25rem;
    margin-top: 0.05rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--mars-primary);
}

.calendar-month-goal-card-chevron svg {
    width: 1rem;
    height: 1rem;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2.4;
    transition: transform 140ms ease;
}

.calendar-month-goal-card-expanded .calendar-month-goal-card-chevron svg {
    transform: rotate(90deg);
}

.calendar-month-goal-card-summary {
    min-width: 0;
    display: grid;
    gap: 0.15rem;
}

.calendar-month-goal-card-goal {
    min-width: 0;
    color: var(--mars-ink);
    font-size: 0.95rem;
    font-weight: 900;
    line-height: 1.22;
    overflow-wrap: anywhere;
}

.calendar-month-goal-card-milestone,
.calendar-month-goal-card-category {
    min-width: 0;
    color: var(--mars-muted);
    font-size: 0.8rem;
    font-weight: 800;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.calendar-month-goal-card-category {
    color: var(--mars-primary-active);
}

.calendar-month-goal-card-open-button {
    width: 2rem;
    height: 2rem;
    margin: 0.55rem 0.55rem 0.55rem 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid color-mix(in srgb, var(--mars-primary) 35%, var(--mars-border));
    border-radius: 7px;
    background: #ffffff;
    color: var(--mars-primary);
}

.calendar-month-goal-card-open-button:hover,
.calendar-month-goal-card-open-button:focus-visible {
    border-color: var(--mars-primary);
    background: var(--mars-primary);
    color: #ffffff;
    outline: none;
}

.calendar-month-goal-card-open-button:focus-visible {
    box-shadow: 0 0 0 0.18rem var(--mars-focus-ring);
}

.calendar-month-goal-card-open-button svg {
    width: 1rem;
    height: 1rem;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2;
}

.calendar-month-goal-card-body {
    min-width: 0;
    display: grid;
    gap: 0.65rem;
    padding: 0.7rem 0.75rem 0.8rem;
    border-top: 1px solid var(--mars-border);
    background: color-mix(in srgb, var(--mars-surface) 92%, var(--mars-primary) 8%);
}

.calendar-month-goal-card-notes {
    min-width: 0;
    margin: 0;
    color: var(--mars-ink);
    font-size: 0.84rem;
    font-weight: 700;
    line-height: 1.38;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}

.calendar-month-goal-card-tasks {
    min-width: 0;
    display: grid;
    gap: 0.45rem;
}

.calendar-month-goal-card-empty-tasks {
    padding: 0.65rem;
    border: 1px dashed var(--mars-border-strong);
    border-radius: 6px;
    color: var(--mars-muted);
    font-size: 0.82rem;
    font-weight: 800;
    text-align: center;
}

.calendar-month-milestone-task-group {
    min-width: 0;
    display: grid;
    gap: 0.45rem;
}

.calendar-month-milestone-task-group h3 {
    margin: 0;
    color: var(--mars-ink);
    font-size: 0.9rem;
    font-weight: 900;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.calendar-month-milestone-task-list {
    min-width: 0;
    display: grid;
    gap: 0.4rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.calendar-month-milestone-task {
    min-width: 0;
    display: grid;
    gap: 0.4rem;
    padding: 0.55rem 0.65rem;
    border: 1px solid var(--mars-border);
    border-radius: 6px;
    background: var(--mars-surface);
}

.calendar-month-milestone-task-content {
    min-width: 0;
    display: grid;
    gap: 0.38rem;
}

.calendar-month-milestone-task-check {
    min-width: 0;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.5rem;
    align-items: center;
    margin: 0;
    color: var(--mars-ink);
    font-weight: 800;
}

.calendar-month-milestone-task-check input {
    width: 1.05rem;
    height: 1.05rem;
    accent-color: var(--mars-primary);
}

.calendar-month-milestone-task-title {
    min-width: 0;
    overflow-wrap: anywhere;
}

.calendar-month-milestone-task-title-complete {
    color: var(--mars-muted);
    text-decoration: line-through;
}

.calendar-month-milestone-task-meeting {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding-left: 1.55rem;
    color: var(--mars-muted);
    font-size: 0.82rem;
    font-weight: 800;
    line-height: 1.25;
}

.calendar-month-milestone-task-meeting-actions {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

.calendar-month-milestone-task-meeting-actions .maui-address-map-action {
    gap: 0.25rem;
}

.calendar-month-milestone-task-icon-button {
    width: 1.55rem;
    height: 1.55rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid rgba(13, 81, 96, 0.28);
    border-radius: 6px;
    background: #ffffff;
    color: var(--mars-primary);
    text-decoration: none;
}

.calendar-month-milestone-task-icon-button:hover,
.calendar-month-milestone-task-icon-button:focus-visible {
    border-color: var(--mars-primary);
    background: var(--mars-primary);
    color: #ffffff;
    outline: none;
}

.calendar-month-milestone-task-icon-button:focus-visible {
    box-shadow: 0 0 0 0.18rem var(--mars-focus-ring);
}

.calendar-month-milestone-task-icon-button svg {
    width: 0.92rem;
    height: 0.92rem;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2;
}

.calendar-month-milestone-task-meeting-name {
    min-width: 0;
    overflow-wrap: anywhere;
}

.calendar-month-milestone-task-confirm {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
    padding: 0.55rem 0.65rem;
    border: 1px solid color-mix(in srgb, var(--mars-primary) 45%, white);
    border-radius: 6px;
    background: color-mix(in srgb, var(--mars-primary) 7%, white);
}

.calendar-month-milestone-task-confirm p {
    margin: 0;
    color: var(--mars-primary-active);
    font-size: 0.82rem;
    font-weight: 800;
}

.calendar-month-milestone-task-confirm-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.45rem;
}

.calendar-month-milestone-task-confirm-actions .maui-primary-button,
.calendar-month-milestone-task-confirm-actions .maui-secondary-button {
    width: auto;
    min-height: 1.8rem;
    margin-top: 0;
    padding: 0.24rem 0.55rem;
}

.calendar-timeline-view {
    width: 100%;
    min-width: 122.5rem;
    background: var(--mars-surface);
}

.calendar-timeline-header,
.calendar-timeline-body,
.calendar-timeline-grid-lines {
    display: grid;
    grid-template-columns: repeat(7, minmax(17.5rem, 1fr));
}

.calendar-timeline-header {
    border-bottom: 1px solid var(--mars-border);
    background: color-mix(in srgb, var(--mars-surface) 94%, var(--mars-primary) 6%);
}

.calendar-timeline-day-header {
    min-width: 0;
    display: grid;
    gap: 0.16rem;
    padding: 0.7rem 0.85rem;
    border-left: 1px solid var(--mars-border);
    color: var(--mars-muted);
    font-weight: 800;
    line-height: 1.1;
}

.calendar-timeline-day-header:first-child {
    border-left: 0;
}

.calendar-timeline-day-header span:first-child {
    color: var(--mars-ink);
    font-size: 0.78rem;
    text-transform: uppercase;
}

.calendar-timeline-day-header-today {
    background: color-mix(in srgb, var(--mars-surface) 86%, var(--mars-primary) 14%);
}

.calendar-timeline-body {
    position: relative;
    min-height: calc((var(--calendar-timeline-lane-count, 1) * 5rem) + 1rem);
    grid-auto-rows: 5rem;
    padding: 0.55rem 0;
    isolation: isolate;
}

.calendar-timeline-grid-lines {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

.calendar-timeline-grid-lines span {
    border-left: 1px solid var(--mars-border);
}

.calendar-timeline-grid-lines span:first-child {
    border-left: 0;
}

.calendar-timeline-entry {
    z-index: 1;
    min-width: 0;
    min-height: 4.25rem;
    margin: 0.25rem 0.35rem;
    padding: 0.45rem 0.55rem;
    border: 1px solid var(--mars-border);
    border-left-width: 4px;
    border-radius: 6px;
    background: color-mix(in srgb, var(--mars-surface) 92%, var(--mars-primary) 8%);
    color: var(--mars-ink);
    font: inherit;
    text-align: left;
}

.calendar-timeline-entry:hover,
.calendar-timeline-entry:focus-visible {
    box-shadow: 0 0 0 0.15rem var(--mars-focus-ring);
    outline: none;
}

.calendar-timeline-entry .calendar-appointment-title {
    display: block;
}

.calendar-timeline-entry-time {
    min-width: 0;
    color: var(--mars-muted);
    font-size: 0.72rem;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.calendar-timeline-empty {
    z-index: 1;
    grid-column: 1 / -1;
    grid-row: 1;
    align-self: center;
    justify-self: center;
    padding: 2rem 1rem;
    color: var(--mars-muted);
    font-weight: 800;
    text-align: center;
}

.calendar-agenda-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
    padding: 0.75rem;
    border-bottom: 1px solid var(--mars-border);
    background: color-mix(in srgb, var(--mars-surface) 88%, var(--mars-primary) 12%);
}

.calendar-agenda-toolbar-primary {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    flex-wrap: wrap;
    min-width: 0;
}

.calendar-agenda-nav-button,
.calendar-agenda-date-input,
.calendar-agenda-view-select,
.calendar-toolbar-view-select {
    min-height: 2.5rem;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: var(--mars-surface);
    color: var(--mars-ink);
    font: inherit;
    font-weight: 800;
}

.calendar-agenda-nav-button {
    min-width: 2.5rem;
    padding: 0 0.75rem;
}

.calendar-agenda-nav-button:hover,
.calendar-agenda-nav-button:focus-visible,
.calendar-agenda-date-input:focus,
.calendar-agenda-view-select:focus,
.calendar-toolbar-view-select:focus {
    border-color: var(--mars-primary);
    box-shadow: 0 0 0 0.15rem var(--mars-focus-ring);
    outline: none;
}

.calendar-agenda-today-button {
    min-width: 5rem;
}

.calendar-agenda-date-input,
.calendar-agenda-view-select,
.calendar-toolbar-view-select {
    padding: 0 0.7rem;
}

.calendar-toolbar-view-select {
    min-height: 2.25rem;
}

.calendar-agenda-view {
    width: 100%;
    min-height: 24rem;
    background: var(--mars-surface);
}

.calendar-agenda-header,
.calendar-agenda-row {
    display: grid;
    grid-template-columns: minmax(10rem, 14rem) minmax(12rem, 18rem) minmax(16rem, 1fr);
}

.calendar-agenda-header {
    border-bottom: 1px solid var(--mars-border);
    color: var(--mars-ink);
    font-weight: 900;
}

.calendar-agenda-header span {
    padding: 0.75rem 1rem;
}

.calendar-agenda-row {
    border-top: 1px solid var(--mars-border);
    border-left: 4px solid transparent;
    min-height: 5.5rem;
}

.calendar-agenda-row:first-of-type {
    border-top: 0;
}

.calendar-agenda-date-cell,
.calendar-agenda-time-cell,
.calendar-agenda-entry-cell {
    min-width: 0;
    padding: 0.85rem 1rem;
}

.calendar-agenda-date-cell {
    display: grid;
    grid-template-columns: auto 1fr;
    column-gap: 0.65rem;
    align-items: center;
}

.calendar-agenda-day-number {
    grid-row: span 2;
    color: var(--mars-ink);
    font-size: 2.6rem;
    font-weight: 700;
    line-height: 0.95;
}

.calendar-agenda-day-name {
    align-self: end;
    color: var(--mars-ink);
    font-weight: 800;
    line-height: 1.1;
}

.calendar-agenda-month-year {
    align-self: start;
    color: var(--mars-muted);
    font-size: 0.88rem;
    font-weight: 800;
    line-height: 1.15;
}

.calendar-agenda-time-cell {
    display: grid;
    align-content: center;
    gap: 0.2rem;
    color: var(--mars-ink);
    font-weight: 800;
}

.calendar-agenda-time-cell span:last-child {
    color: var(--mars-muted);
    font-size: 0.8rem;
}

.calendar-agenda-entry-cell {
    display: flex;
    align-items: center;
}

.calendar-agenda-entry-button {
    min-height: 3.75rem;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    padding: 0;
    text-align: left;
}

.calendar-agenda-empty {
    padding: 3rem 1rem;
    color: var(--mars-muted);
    font-weight: 800;
    text-align: center;
}

@media (max-width: 720px) {
    .calendar-agenda-toolbar,
    .calendar-toolbar {
        align-items: stretch;
    }

    .calendar-agenda-toolbar-primary,
    .calendar-toolbar-primary,
    .calendar-toolbar-actions,
    .calendar-month-filter,
    .calendar-agenda-view-select {
        width: 100%;
    }

    .calendar-month-filter {
        justify-content: stretch;
    }

    .calendar-month-filter-button {
        flex: 1 1 0;
        padding-inline: 0.35rem;
        font-size: 0.78rem;
    }

    .calendar-agenda-date-input {
        flex: 1 1 10rem;
        min-width: 0;
    }

    .calendar-range-label {
        width: 100%;
    }

    .calendar-agenda-header {
        display: none;
    }

    .calendar-agenda-row {
        grid-template-columns: 1fr;
    }

    .calendar-agenda-date-cell,
    .calendar-agenda-time-cell,
    .calendar-agenda-entry-cell {
        padding: 0.7rem 0.85rem;
    }

    .calendar-agenda-date-cell {
        border-bottom: 1px solid var(--mars-border);
    }

    .calendar-month-view {
        --calendar-month-calendar-height: clamp(20rem, 48vh, 28rem);
        --calendar-month-detail-height: clamp(10rem, 30vh, 18rem);
    }

    .calendar-month-title {
        padding: 0.5rem 0.65rem 0.4rem;
        font-size: 0.96rem;
    }

    .calendar-month-header div {
        padding-inline: 0.2rem;
        font-size: 0.68rem;
    }

    .calendar-month-grid {
        grid-auto-rows: minmax(3.45rem, 1fr);
    }

    .calendar-month-day,
    .calendar-month-day-button {
        min-height: 3.45rem;
    }

    .calendar-month-day-button {
        padding: 0.24rem 0.12rem;
    }

    .calendar-month-day-number {
        min-width: 1.42rem;
        height: 1.42rem;
        font-size: 0.78rem;
    }

    .calendar-month-selected-day-header {
        align-items: flex-start;
    }
}

.calendar-page-month .calendar-month-view {
    --calendar-month-detail-panel-height: min(42%, 22rem);
    height: 100%;
    min-height: 0;
    grid-template-rows:
        minmax(0, 1fr)
        auto
        minmax(0, var(--calendar-month-detail-panel-height));
    overflow: hidden;
}

.calendar-page-month .calendar-month-scroll {
    height: 100%;
    overflow-y: auto;
}

.calendar-page-month .calendar-month-block {
    min-height: 100%;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
}

.calendar-page-month .calendar-month-calendar {
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
}

.calendar-page-month .calendar-month-grid {
    min-height: 0;
    grid-auto-rows: minmax(0, 1fr);
}

.calendar-page-month .calendar-month-day,
.calendar-page-month .calendar-month-day-button,
.calendar-page-month .calendar-month-selected-day-panel {
    min-height: 0;
}

.calendar-page-month .calendar-month-day-button {
    height: 100%;
}

.calendar-page-month .calendar-month-selected-day-panel {
    height: auto;
    max-height: none;
}

.calendar-state {
    min-height: 14rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: var(--mars-surface);
    text-align: center;
}

.calendar-state p {
    margin: 0;
    color: var(--mars-muted);
    font-weight: 700;
    overflow-wrap: anywhere;
}

.calendar-appointment-template {
    width: 100%;
    height: 100%;
    min-width: 0;
    display: grid;
    gap: 0.12rem;
    line-height: 1.15;
    cursor: pointer;
}

.calendar-appointment-template-goal-link {
    cursor: pointer;
}

.calendar-appointment-template:focus-visible {
    border-radius: 4px;
    box-shadow: 0 0 0 0.15rem var(--mars-focus-ring);
    outline: none;
}

.calendar-appointment-title {
    min-width: 0;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.calendar-appointment-meta {
    min-width: 0;
    font-size: 0.72rem;
    font-weight: 700;
    opacity: 0.88;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.calendar-appointment-meeting {
    border-color: var(--mars-primary);
}

.calendar-appointment-task {
    border-color: #4c6f33;
}

.calendar-appointment-milestone {
    border-color: #7b4e1d;
}

.calendar-appointment-goal-generated {
    opacity: 0.88;
}

.calendar-dialog-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    background: rgba(15, 23, 42, 0.42);
}

.calendar-dialog {
    width: min(100%, 42rem);
    max-height: min(92vh, 48rem);
    overflow: auto;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: var(--mars-surface);
    box-shadow: 0 1.2rem 3rem rgba(15, 23, 42, 0.22);
}

.calendar-dialog-backdrop.calendar-dialog-backdrop-month-detail {
    position: absolute;
    grid-row: 2 / 4;
    grid-column: 1 / -1;
    inset: 0;
    align-items: stretch;
    padding: 0.85rem;
    background: rgba(15, 23, 42, 0.28);
}

.calendar-dialog-backdrop-month-detail .calendar-dialog {
    max-height: 100%;
}

.calendar-dialog form {
    display: grid;
    gap: 1rem;
    padding: 1rem;
}

.calendar-dialog-header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 1rem;
}

.calendar-dialog-header h2 {
    margin: 0;
    color: var(--mars-ink);
    font-size: 1.3rem;
    font-weight: 700;
    line-height: 1.2;
}

.calendar-dialog-close {
    width: 2rem;
    height: 2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    border: 0;
    border-radius: 6px;
    color: var(--mars-muted);
    background: transparent;
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1;
}

.calendar-dialog-close:hover:not(:disabled),
.calendar-dialog-close:focus-visible:not(:disabled) {
    color: var(--mars-ink);
    background: var(--mars-primary-subtle);
    outline: none;
}

.calendar-dialog-close:focus-visible {
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
}

.calendar-dialog-form {
    display: grid;
    gap: 0.9rem;
}

.calendar-dialog-section {
    display: grid;
    gap: 0.75rem;
    margin: 0;
    padding-top: 0.9rem;
    border-top: 1px solid var(--mars-border);
}

.calendar-dialog-section h3 {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin: 0;
    color: var(--mars-ink);
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.25;
}

.maui-address-map-action {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    min-width: 0;
}

.maui-address-map-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.8rem;
    height: 1.8rem;
    padding: 0;
    border: 1px solid rgba(13, 81, 96, 0.32);
    border-radius: 6px;
    color: var(--mars-primary);
    background: #ffffff;
}

.maui-address-map-button:hover,
.maui-address-map-button:focus-visible {
    border-color: var(--mars-primary);
    color: #ffffff;
    background: var(--mars-primary);
    outline: none;
}

.maui-address-map-button:focus-visible {
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
}

.maui-address-map-button svg {
    width: 1rem;
    height: 1rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.maui-address-map-error {
    color: var(--mars-danger);
    font-size: 0.85rem;
    font-weight: 700;
    line-height: 1.2;
    text-transform: none;
    letter-spacing: 0;
}

.calendar-dialog-field {
    display: grid;
    gap: 0.35rem;
}

.calendar-dialog-field label,
.calendar-dialog-check {
    color: var(--mars-text);
    font-size: 0.92rem;
    font-weight: 700;
    line-height: 1.25;
}

.calendar-dialog-input {
    width: 100%;
    min-height: 2.65rem;
    min-width: 0;
    padding: 0.45rem 0.65rem;
    border: 1px solid var(--mars-border);
    border-radius: 6px;
    color: var(--mars-ink);
    background: #ffffff;
}

.calendar-dialog-input:focus {
    border-color: var(--mars-primary);
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
    outline: none;
}

.calendar-dialog-textarea {
    min-height: 5.5rem;
    resize: vertical;
}

.calendar-dialog-time-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.calendar-dialog-location-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.calendar-dialog-check {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    width: max-content;
}

.calendar-dialog-check input {
    width: 1rem;
    height: 1rem;
}

.calendar-dialog-confirm-delete {
    display: grid;
    gap: 0.35rem;
    padding: 0.75rem;
    border: 1px solid rgba(159, 38, 31, 0.28);
    border-radius: 6px;
    background: rgba(159, 38, 31, 0.08);
}

.calendar-dialog-confirm-delete p {
    margin: 0;
    color: var(--mars-danger);
    font-weight: 800;
}

.calendar-dialog-actions {
    display: flex;
    justify-content: end;
    gap: 0.65rem;
}

.calendar-dialog-actions .maui-primary-button,
.calendar-dialog-actions .maui-secondary-button,
.calendar-dialog-danger-button {
    width: auto;
    min-width: 7rem;
    min-height: 2.75rem;
    margin-top: 0;
    padding: 0 1rem;
}

.calendar-dialog-danger-button {
    border: 1px solid var(--mars-danger);
    border-radius: 6px;
    color: var(--mars-danger);
    background: #ffffff;
    font-weight: 700;
}

.calendar-dialog-danger-button:hover:not(:disabled),
.calendar-dialog-danger-button:focus-visible:not(:disabled) {
    color: #ffffff;
    background: var(--mars-danger);
    outline: none;
}

.calendar-dialog-danger-button:disabled {
    cursor: wait;
    opacity: 0.72;
}

.calendar-dialog-delete-button {
    margin-right: auto;
}

.calendar-dialog-message {
    margin: 0;
}

.goals-page {
    min-height: 100%;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem;
}

.goals-toolbar,
.goals-editor-header,
.goal-section-header,
.goal-task-list-header,
.goal-milestone-editor-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.goals-editor-header h2,
.goal-section-header h3,
.goal-milestone-editor-heading,
.goal-task-list-header h4 {
    margin: 0;
    color: var(--mars-ink);
    letter-spacing: 0;
}

.goals-editor-header h2 {
    font-size: 1.25rem;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.goal-section-header h3,
.goal-milestone-editor-heading {
    color: var(--mars-primary);
    font-size: 1.12rem;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.goal-task-list-header h4 {
    color: var(--mars-primary);
    font-size: 1.02rem;
    line-height: 1.2;
    text-align: center;
}

.goal-section-header,
.goal-task-list-header {
    justify-content: center;
    text-align: center;
}

.goal-milestone-editor-header {
    position: relative;
    align-items: stretch;
}

.goal-milestone-editor-title {
    min-width: 0;
    display: grid;
    gap: 0.15rem;
}

.goal-milestone-editor-summary {
    color: var(--mars-muted);
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1.2;
}

.goal-milestone-accordion-trigger {
    min-width: 0;
    flex: 1;
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.1rem 0.25rem;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--mars-ink);
    text-align: left;
}

.goal-milestone-accordion-trigger:hover,
.goal-milestone-accordion-trigger:focus-visible {
    background: color-mix(in srgb, var(--mars-primary) 8%, white);
    outline: none;
}

.goal-milestone-accordion-trigger:focus-visible {
    box-shadow: 0 0 0 0.15rem var(--mars-focus-ring);
}

.goal-milestone-accordion-icon {
    width: 1.4rem;
    height: 1.4rem;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--mars-primary);
    transition: transform 0.16s ease;
}

.goal-milestone-accordion-icon svg {
    width: 1.05rem;
    height: 1.05rem;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2;
}

.goal-milestone-editor-expanded .goal-milestone-accordion-icon {
    transform: rotate(90deg);
}

.goals-eyebrow,
.goal-editor-eyebrow {
    margin: 0 0 0.2rem;
    color: var(--mars-muted);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.goals-archive-pill {
    color: var(--mars-muted);
    font-size: 0.82rem;
    font-weight: 800;
    line-height: 1.2;
}

.goals-toolbar {
    flex-wrap: wrap;
}

.goals-view-toggle {
    display: inline-flex;
    gap: 0.25rem;
    padding: 0.2rem;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: var(--mars-surface);
}

.goals-toggle-button {
    min-height: 2rem;
    padding: 0.35rem 0.7rem;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--mars-muted);
    font-weight: 800;
}

.goals-toggle-button-active {
    background: var(--mars-primary);
    color: white;
}

.goals-workspace {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(14rem, 20rem) minmax(0, 1fr);
    gap: 1rem;
}

.goals-list,
.goals-editor-panel {
    min-width: 0;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: var(--mars-surface);
}

.goals-list {
    align-self: start;
    min-height: 14rem;
    max-height: calc(100vh - 12rem);
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0.5rem;
}

.goals-list-new-button {
    margin: 0 0 0.5rem;
}

.goals-list-empty,
.goals-editor-empty,
.goals-state,
.goal-empty-inline {
    color: var(--mars-muted);
    font-weight: 700;
    text-align: center;
}

.goals-state,
.goals-editor-empty {
    min-height: 14rem;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: var(--mars-surface);
}

.goals-state p {
    margin: 0;
}

.goals-list-empty,
.goal-empty-inline {
    padding: 1rem;
}

.goals-list-item {
    width: 100%;
    display: grid;
    gap: 0.25rem;
    padding: 0.7rem;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: var(--mars-ink);
    text-align: left;
}

.goals-list-item:hover,
.goals-list-item:focus-visible,
.goals-list-item-selected {
    border-color: var(--mars-primary);
    background: color-mix(in srgb, var(--mars-primary) 9%, white);
    outline: none;
}

.goals-list-title {
    font-size: 0.95rem;
    font-weight: 800;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.goals-list-status {
    color: var(--mars-primary);
    font-size: 0.72rem;
    font-weight: 800;
    line-height: 1.2;
    overflow-wrap: anywhere;
}

.goals-list-meta,
.goals-list-counts {
    color: var(--mars-muted);
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.25;
}

.goals-list-meta {
    display: grid;
    gap: 0.08rem;
}

.goals-list-counts {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.goals-editor-panel {
    min-height: 28rem;
    max-height: calc(100vh - 12rem);
    overflow-x: hidden;
    overflow-y: auto;
    padding: 1rem;
}

.goals-editor-panel form {
    display: grid;
    gap: 1rem;
}

.goals-editor-fields,
.goal-creation-panel,
.goal-milestones-section {
    display: grid;
    gap: 0.75rem;
}

.goals-editor-fields {
    grid-template-columns: minmax(0, 1fr) minmax(12rem, 16rem);
}

.goal-title-field,
.goal-start-field,
.goal-ending-field,
.goal-notes-field {
    grid-column: 1 / -1;
}

.goal-editor-field {
    min-width: 0;
    display: grid;
    gap: 0.35rem;
}

.goal-editor-field label,
.goal-editor-check {
    color: var(--mars-muted);
    font-size: 0.8rem;
    font-weight: 800;
}

.goal-editor-input {
    width: 100%;
    min-height: 2.35rem;
    padding: 0.48rem 0.62rem;
    border: 1px solid var(--mars-border);
    border-radius: 6px;
    background: white;
    color: var(--mars-ink);
    font: inherit;
}

.goal-editor-input:focus {
    border-color: var(--mars-primary);
    box-shadow: 0 0 0 0.15rem var(--mars-focus-ring);
    outline: none;
}

.goal-duration-stepper {
    display: grid;
    grid-template-columns: auto minmax(4rem, 1fr) auto;
    align-items: center;
    gap: 0.35rem;
}

.goal-duration-input {
    min-width: 0;
    text-align: center;
}

.goal-milestone-marker-strip {
    min-width: 0;
    display: grid;
    gap: 0.4rem;
    padding: 0.35rem 0;
}

.goal-milestone-scroll-window {
    width: 100%;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scrollbar-width: none;
}

.goal-milestone-scroll-window::-webkit-scrollbar {
    display: none;
}

.goal-milestone-scroll-content {
    width: max-content;
    min-width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    padding: 0.1rem 0;
}

.goal-milestone-marker-row {
    flex: 0 0 auto;
    display: inline-flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    min-width: 0;
}

.goal-milestone-scroll-slider {
    width: min(28rem, 100%);
    justify-self: center;
    margin: 0;
    accent-color: var(--mars-primary);
}

.goal-milestone-scroll-slider[hidden] {
    display: none;
}

.goal-milestone-marker {
    position: relative;
    width: 4rem;
    height: 4rem;
    flex: 0 0 4rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 2px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: #111111;
}

.goal-milestone-marker:hover,
.goal-milestone-marker:focus-visible,
.goal-milestone-marker-selected {
    border-color: var(--mars-primary);
    background: color-mix(in srgb, var(--mars-primary) 8%, white);
    outline: none;
}

.goal-milestone-marker:focus-visible {
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
}

.goal-milestone-marker-image {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
}

.goal-milestone-marker-number {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: currentColor;
    font-size: 1.18rem;
    font-weight: 900;
    line-height: 1;
    text-align: center;
    text-shadow:
        0 1px 0 rgba(255, 255, 255, 0.86),
        1px 0 0 rgba(255, 255, 255, 0.86),
        0 -1px 0 rgba(255, 255, 255, 0.86),
        -1px 0 0 rgba(255, 255, 255, 0.86);
    pointer-events: none;
}

.goal-milestone-add-button {
    width: 4rem;
    height: 4rem;
    flex: 0 0 4rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 2px dashed color-mix(in srgb, var(--mars-primary) 60%, white);
    border-radius: 50%;
    background: color-mix(in srgb, var(--mars-primary) 9%, white);
    color: var(--mars-primary);
    font-size: 2.4rem;
    font-weight: 800;
    line-height: 1;
}

.goal-milestone-add-button span {
    transform: translateY(-0.08rem);
}

.goal-milestone-add-button:hover,
.goal-milestone-add-button:focus-visible {
    border-style: solid;
    border-color: var(--mars-primary);
    background: var(--mars-primary);
    color: #ffffff;
    outline: none;
}

.goal-milestone-add-button:focus-visible {
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
}

.goal-milestone-marker-not-started {
    color: #111111;
}

.goal-milestone-marker-in-progress {
    color: #0b63ce;
}

.goal-milestone-marker-completed {
    color: #1b7f3a;
}

.goal-milestone-marker-expired {
    color: #b32121;
}

.goal-duration-stepper-button {
    width: 2.35rem;
    height: 2.35rem;
}

.goal-editor-readonly-output {
    display: flex;
    align-items: center;
    background: var(--mars-surface-alt);
    color: var(--mars-muted);
}

.goal-editor-textarea {
    min-height: 4.5rem;
    resize: vertical;
}

.goal-editor-check {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
}

.goal-task-completion-check {
    min-height: 1.8rem;
    align-self: end;
    color: var(--mars-ink);
    white-space: nowrap;
}

.goal-task-completion-checkbox {
    width: 1.1rem;
    height: 1.1rem;
    flex: 0 0 auto;
    accent-color: var(--mars-primary);
}

.goal-creation-panel,
.goal-milestone-editor,
.goal-task-editor,
.goals-confirm-delete {
    padding: 0.85rem;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: color-mix(in srgb, var(--mars-surface) 88%, white);
}

.goal-creation-grid,
.goal-milestone-editor-grid,
.goal-task-editor-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(10rem, 14rem) auto;
    align-items: end;
    gap: 0.75rem;
}

.goal-creation-grid {
    grid-template-columns: minmax(0, 1fr) auto;
}

.goal-milestone-editor {
    display: grid;
    gap: 0;
}

.goal-milestone-editor-expanded {
    background: #000000;
    border-color: #000000;
    color: white;
}

.goal-milestone-editor-body {
    display: grid;
    gap: 0.75rem;
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--mars-border);
}

.goal-milestone-editor-expanded .goal-milestone-editor-body {
    border-top-color: rgba(255, 255, 255, 0.24);
}

.goal-milestone-editor-expanded .goal-milestone-accordion-trigger {
    color: white;
}

.goal-milestone-editor-expanded .goal-milestone-accordion-trigger:hover,
.goal-milestone-editor-expanded .goal-milestone-accordion-trigger:focus-visible {
    background: rgba(255, 255, 255, 0.12);
}

.goal-milestone-editor-expanded .goal-milestone-editor-heading,
.goal-milestone-editor-expanded .goal-task-list-header h4 {
    color: white;
}

.goal-milestone-editor-expanded .goal-milestone-editor-summary,
.goal-milestone-editor-expanded > .goal-milestone-editor-body > .goal-milestone-editor-grid .goal-editor-field label {
    color: rgba(255, 255, 255, 0.74);
}

.goal-milestone-editor-expanded .goal-task-editor {
    background: white;
    color: var(--mars-ink);
}

.goal-milestone-editor-expanded .goal-task-editor .goal-editor-field label,
.goal-milestone-editor-expanded .goal-task-editor .goal-editor-check {
    color: var(--mars-muted);
}

.goal-milestone-editor-expanded .goal-task-editor .goal-task-completion-check {
    color: var(--mars-ink);
}

.goal-milestone-editor-actions {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-start;
    gap: 0.35rem;
}

.goal-icon-button {
    width: 2rem;
    height: 2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--mars-border);
    border-radius: 6px;
    background: white;
    color: var(--mars-ink);
    font-size: 1.1rem;
    font-weight: 800;
}

.goal-icon-button svg {
    width: 1.1rem;
    height: 1.1rem;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2;
}

.goal-icon-button:disabled {
    opacity: 0.45;
}

.goal-milestone-delete-button {
    border-color: #8a1f11;
    color: #8a1f11;
}

.goal-milestone-delete-button:hover:not(:disabled),
.goal-milestone-delete-button:focus-visible:not(:disabled) {
    background: #8a1f11;
    color: white;
    outline: none;
}

.goal-milestone-copy-button {
    width: auto;
    min-height: 1.9rem;
    margin-top: 0;
    padding: 0.28rem 0.7rem;
    font-size: 0.78rem;
    line-height: 1;
}

.goal-copy-dialog-content {
    display: grid;
    gap: 1rem;
    padding: 1rem;
}

.goals-danger-button {
    color: #8a1f11;
}

.goal-task-list {
    display: grid;
    gap: 0.75rem;
}

.tag-list-editor {
    display: grid;
    gap: 0.75rem;
}

.tag-list-editor-box {
    min-height: 2.75rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem;
    margin: 0;
    padding: 0.45rem;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: white;
    list-style: none;
}

.tag-list-editor-item {
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.35rem 0.35rem 0.62rem;
    border: 1px solid var(--mars-border);
    border-radius: 6px;
    background: color-mix(in srgb, var(--mars-surface) 92%, white);
}

.tag-list-editor-item[draggable="true"] {
    cursor: grab;
}

.tag-list-editor-item-dragging {
    border-color: color-mix(in srgb, var(--mars-primary) 45%, var(--mars-border));
    background: var(--mars-primary-subtle);
    opacity: 0.72;
}

.tag-list-empty {
    padding: 0 0.2rem;
}

.tag-list-editor-name {
    min-width: 0;
    color: var(--mars-ink);
    font-weight: 800;
    overflow-wrap: anywhere;
}

.tag-list-remove-button {
    width: 1.45rem;
    height: 1.45rem;
    border-color: transparent;
    background: transparent;
    color: #8a1f11;
}

.tag-list-remove-button:hover:not(:disabled),
.tag-list-remove-button:focus-visible:not(:disabled) {
    background: #8a1f11;
    color: white;
    outline: none;
}

.tag-list-editor-add-item,
.tag-list-editor-add-editor {
    max-width: 100%;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.tag-list-editor-add-editor {
    flex: 1 1 11rem;
    min-width: 10rem;
    position: relative;
}

.tag-list-new-entry {
    width: 100%;
    min-width: 0;
}

.tag-list-new-input-row {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.tag-list-add-button,
.tag-list-confirm-add-button {
    width: 1.9rem;
    height: 1.9rem;
    flex: 0 0 auto;
    border-color: color-mix(in srgb, var(--mars-primary) 52%, var(--mars-border));
    color: var(--mars-primary);
    font-size: 1.2rem;
    line-height: 1;
}

.tag-list-add-button:hover:not(:disabled),
.tag-list-add-button:focus-visible:not(:disabled),
.tag-list-confirm-add-button:hover:not(:disabled),
.tag-list-confirm-add-button:focus-visible:not(:disabled) {
    background: var(--mars-primary);
    color: white;
    outline: none;
}

.tag-list-new-input {
    width: auto;
    min-width: 8rem;
    min-height: 1.9rem;
    flex: 1 1 8rem;
    padding: 0.35rem 0.5rem;
}

.tag-list-new-input-invalid {
    border-color: #8a1f11;
}

.tag-list-existing-dropdown {
    position: absolute;
    z-index: 1080;
    top: calc(100% + 0.25rem);
    left: 0;
    right: 0;
    max-height: 10.5rem;
    overflow-y: auto;
    display: grid;
    padding: 0.25rem;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: white;
    box-shadow: 0 0.65rem 1.35rem rgba(15, 23, 42, 0.16);
}

.tag-list-existing-option {
    width: 100%;
    min-height: 2rem;
    display: flex;
    align-items: center;
    padding: 0.35rem 0.5rem;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--mars-ink);
    font-weight: 700;
    text-align: left;
    overflow-wrap: anywhere;
}

.tag-list-existing-option:hover,
.tag-list-existing-option:focus-visible,
.tag-list-existing-option-active {
    background: var(--mars-primary-subtle);
    color: var(--mars-primary);
    outline: none;
}

.tag-list-editor-error {
    margin: -0.35rem 0 0;
    color: #8a1f11;
    font-size: 0.82rem;
    font-weight: 800;
}

.goal-milestone-change-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-top: 0.75rem;
    border-top: 1px solid var(--mars-border);
}

.goal-milestone-change-actions .maui-primary-button,
.goal-milestone-change-actions .maui-secondary-button {
    width: auto;
    min-height: 2.35rem;
    margin-top: 0;
    padding: 0.48rem 0.8rem;
}

.goal-task-editor-grid {
    grid-template-columns: minmax(0, 1fr);
    row-gap: 0.4rem;
}

.goal-task-name-field,
.goal-task-meeting-field {
    grid-column: 1 / -1;
}

.goal-meeting-picker {
    position: relative;
    min-width: 0;
}

.goal-meeting-picker-button {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.55rem;
    text-align: left;
    cursor: pointer;
}

.goal-meeting-picker-button:disabled {
    cursor: default;
}

.goal-meeting-picker-button svg {
    width: 1rem;
    height: 1rem;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.goal-meeting-picker-selected {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.goal-meeting-picker-list {
    position: absolute;
    top: calc(100% + 0.25rem);
    right: 0;
    left: 0;
    z-index: 1090;
    max-height: min(18rem, 48vh);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 0.3rem;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 0.65rem 1.2rem rgba(12, 36, 42, 0.16);
}

.goal-meeting-picker-option {
    width: 100%;
    min-height: 2.35rem;
    display: flex;
    align-items: center;
    padding: 0.4rem 0.55rem;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--mars-ink);
    font: inherit;
    font-size: 0.88rem;
    line-height: 1.25;
    text-align: left;
    overflow-wrap: anywhere;
}

.goal-meeting-picker-option:hover,
.goal-meeting-picker-option:focus-visible,
.goal-meeting-picker-option-selected {
    background: var(--mars-primary-subtle);
    color: var(--mars-primary-active);
    outline: none;
}

.goal-task-editor-grid-has-completion {
    grid-template-columns: minmax(0, 1fr) auto;
}

.goal-task-editor-grid-has-meeting {
    grid-template-columns: minmax(0, 1fr) minmax(12rem, 18rem);
}

.goal-task-editor-grid-has-completion.goal-task-editor-grid-has-meeting {
    grid-template-columns: minmax(0, 1fr) minmax(12rem, 18rem) auto;
}

.goal-task-editor-grid-has-completion.goal-task-editor-grid-has-avoidance {
    grid-template-columns: minmax(0, 1fr) auto minmax(11rem, 14rem);
}

.goal-task-editor-grid-has-completion.goal-task-editor-grid-has-meeting.goal-task-editor-grid-has-avoidance {
    grid-template-columns: minmax(0, 1fr) minmax(12rem, 18rem) auto minmax(11rem, 14rem);
}

.goal-task-editor-has-delete {
    padding-right: 3.1rem;
}

.goal-task-delete-button {
    position: absolute;
    top: 0.55rem;
    right: 0.55rem;
    border-color: #8a1f11;
    color: #8a1f11;
}

.goal-task-delete-button:hover:not(:disabled),
.goal-task-delete-button:focus-visible:not(:disabled) {
    background: #8a1f11;
    color: white;
    outline: none;
}

.goal-small-delete-button {
    min-height: 1.8rem;
    padding: 0.24rem 0.55rem;
    border: 1px solid #8a1f11;
    border-radius: 5px;
    background: white;
    color: #8a1f11;
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1;
}

.goal-small-delete-button:hover,
.goal-small-delete-button:focus-visible {
    background: #8a1f11;
    color: white;
    outline: none;
}

.goal-inline-confirm-delete {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.65rem 0.75rem;
    border: 1px solid color-mix(in srgb, #8a1f11 45%, white);
    border-radius: 6px;
    background: color-mix(in srgb, #8a1f11 7%, white);
}

.goal-inline-confirm-delete p {
    margin: 0;
    color: #8a1f11;
    font-size: 0.85rem;
    font-weight: 800;
}

.goal-inline-confirm-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
}

.goal-inline-confirm-actions .maui-secondary-button {
    width: auto;
    min-height: 1.8rem;
    margin-top: 0;
    padding: 0.24rem 0.55rem;
    font-size: 0.78rem;
    line-height: 1;
}

.goal-delete-task-confirm-button {
    display: inline-flex;
    min-height: 2.4rem;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.18rem;
    line-height: 1.05;
}

.goal-delete-button-detail {
    max-width: 12rem;
    font-size: 0.72rem;
    font-weight: 700;
    overflow-wrap: anywhere;
}

.goal-task-editor {
    display: grid;
    position: relative;
    gap: 0.5rem;
}

.goals-confirm-delete {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.goals-confirm-delete p {
    margin: 0;
    color: #8a1f11;
    font-weight: 800;
}

.goals-confirm-delete div,
.goals-editor-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
}

.goals-confirm-delete .maui-secondary-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.35rem;
    margin-top: 0;
    padding: 0.48rem 0.8rem;
}

.goals-danger-button {
    min-height: 2.35rem;
    padding: 0.48rem 0.8rem;
    border: 1px solid #8a1f11;
    border-radius: 6px;
    background: white;
    font-weight: 800;
}

.goals-danger-button:hover:not(:disabled),
.goals-danger-button:focus-visible:not(:disabled) {
    background: #8a1f11;
    color: white;
}

.goals-delete-button {
    margin-right: auto;
}

@media (max-width: 720px) {
    .calendar-shell {
        min-height: 34rem;
    }

    .calendar-dialog-backdrop {
        align-items: stretch;
        padding: 0.65rem;
    }

    .calendar-dialog {
        max-height: calc(100vh - 1.3rem);
    }

    .calendar-dialog-time-grid,
    .calendar-dialog-location-grid,
    .calendar-dialog-actions {
        grid-template-columns: 1fr;
    }

    .calendar-dialog-actions {
        display: grid;
    }

    .calendar-dialog-actions .maui-primary-button,
    .calendar-dialog-actions .maui-secondary-button,
    .calendar-dialog-danger-button {
        width: 100%;
    }

    .calendar-dialog-delete-button {
        margin-right: 0;
    }

    .goals-page {
        height: 100%;
        min-height: 0;
        overflow: hidden;
        box-sizing: border-box;
        padding: 0.75rem;
    }

    .goals-editor-header {
        align-items: start;
        flex-direction: column;
        gap: 0.35rem;
    }

    .goals-workspace {
        flex: 1 1 0;
        grid-template-columns: 1fr;
        grid-template-rows: minmax(0, 40fr) minmax(0, 60fr);
        overflow: hidden;
    }

    .goals-list,
    .goals-editor-panel {
        height: 100%;
        max-height: none;
        min-height: 0;
        overflow-x: hidden;
        overflow-y: auto;
        box-sizing: border-box;
    }

    .goals-list {
        align-self: stretch;
    }

    .goals-editor-fields,
    .goal-creation-grid,
    .goal-milestone-editor-grid,
    .goal-task-editor-grid {
        grid-template-columns: 1fr;
    }

    .goal-milestone-editor-header {
        align-items: flex-start;
        flex-direction: row;
    }

    .goal-milestone-accordion-trigger {
        width: auto;
    }

    .goal-milestone-editor-actions {
        align-self: flex-start;
        align-items: flex-end;
        justify-content: flex-start;
    }

    .goal-inline-confirm-delete {
        align-items: stretch;
        flex-direction: column;
        text-align: center;
    }

    .goal-inline-confirm-actions {
        justify-content: center;
    }

    .goal-milestone-change-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .goals-confirm-delete,
    .goals-editor-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .goals-confirm-delete div {
        justify-content: stretch;
    }

    .goals-editor-actions .maui-primary-button,
    .goals-editor-actions .maui-secondary-button,
    .goal-milestone-change-actions .maui-primary-button,
    .goal-milestone-change-actions .maui-secondary-button,
    .goals-danger-button {
        width: 100%;
    }

    .goals-delete-button {
        margin-right: 0;
    }
}

.maui-map-page {
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: var(--mars-app-bg);
}

.maui-map-retry {
    min-height: 2.5rem;
    border-radius: 6px;
    font-weight: 700;
}

.maui-map-content {
    position: relative;
    flex: 1 1 0;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.maui-map-toolbar {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--mars-border);
    background: var(--mars-surface);
}

.maui-map-message-row {
    flex: 0 0 2.2rem;
    display: grid;
    grid-template-columns: 2.75rem minmax(0, 1fr);
    align-items: center;
    border-bottom: 1px solid var(--mars-border);
    background: var(--mars-surface-alt);
}

.maui-map-message-row.is-error {
    border-bottom-color: #e6b3ad;
    background: #fff3f1;
}

.maui-map-recenter-button {
    width: 2rem;
    height: 2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    justify-self: center;
    padding: 0;
    border: 0;
    border-radius: 6px;
    color: var(--mars-primary);
    background: transparent;
}

.maui-map-recenter-button:hover:not(:disabled),
.maui-map-recenter-button:focus-visible:not(:disabled) {
    color: var(--mars-primary-active);
    background: var(--mars-primary-subtle);
    outline: none;
}

.maui-map-recenter-button:focus-visible {
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
}

.maui-map-recenter-button:disabled {
    cursor: wait;
    opacity: 0.55;
}

.maui-map-recenter-button svg {
    width: 1.25rem;
    height: 1.25rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.maui-map-message-line {
    min-width: 0;
    margin: 0;
    padding: 0.52rem 1rem 0.52rem 0.35rem;
    color: var(--mars-muted);
    font-size: 0.88rem;
    font-weight: 700;
    line-height: 1.15;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.maui-map-message-row.is-error .maui-map-message-line {
    color: var(--mars-danger);
}

.maui-map-filter {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    min-width: 0;
}

.maui-map-filter label {
    flex: 0 0 auto;
    color: var(--mars-text);
    font-size: 0.92rem;
    font-weight: 700;
}

.maui-map-select {
    width: min(20rem, 58vw);
    min-height: 2.45rem;
    min-width: 0;
    padding: 0 2rem 0 0.75rem;
    border: 1px solid var(--mars-border-strong);
    border-radius: 6px;
    color: var(--mars-ink);
    background: #ffffff;
}

.maui-map-select:focus {
    border-color: var(--mars-primary);
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
    outline: none;
}

.maui-map-body {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    overflow: hidden;
}

.maui-map-frame {
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    display: flex;
}

.maui-current-map {
    flex: 1 1 auto;
    width: 100%;
    height: 100%;
    min-height: 16rem;
}

.maui-map-loading {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
    color: var(--mars-text);
    text-align: center;
    background: rgba(247, 250, 249, 0.84);
}

.maui-map-loading p {
    margin: 0;
    font-weight: 700;
}

.maui-map-action-backdrop {
    position: absolute;
    inset: 0;
    z-index: 2;
    border: 0;
    background: transparent;
}

.maui-map-menu-button {
    position: absolute;
    left: 0.85rem;
    bottom: 0.85rem;
    z-index: 4;
    width: 2.75rem;
    height: 2.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid rgba(12, 36, 42, 0.2);
    border-radius: 8px;
    color: var(--mars-ink);
    background: #ffffff;
    box-shadow: 0 0.45rem 1rem rgba(12, 36, 42, 0.16);
}

.maui-map-menu-button:hover,
.maui-map-menu-button:focus-visible,
.maui-map-menu-button.is-active {
    color: var(--mars-primary-active);
    background: var(--mars-primary-subtle);
    outline: none;
}

.maui-map-menu-button:focus-visible {
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring), 0 0.45rem 1rem rgba(12, 36, 42, 0.16);
}

.maui-map-filter-button {
    position: absolute;
    top: 0.85rem;
    right: 0.85rem;
    z-index: 4;
    width: 2.75rem;
    height: 2.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid rgba(12, 36, 42, 0.2);
    border-radius: 8px;
    color: var(--mars-ink);
    background: #ffffff;
    box-shadow: 0 0.45rem 1rem rgba(12, 36, 42, 0.16);
}

.maui-map-filter-button:hover,
.maui-map-filter-button:focus-visible,
.maui-map-filter-button.is-active {
    color: var(--mars-primary-active);
    background: var(--mars-primary-subtle);
    outline: none;
}

.maui-map-filter-button:focus-visible {
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring), 0 0.45rem 1rem rgba(12, 36, 42, 0.16);
}

.maui-map-menu-button svg,
.maui-map-filter-button svg,
.maui-map-time-filter-close svg,
.maui-drop-pin-color-button svg {
    width: 1.25rem;
    height: 1.25rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.maui-map-action-menu,
.maui-drop-pin-form,
.maui-user-pin-popup {
    position: absolute;
    left: 0.85rem;
    bottom: 4.05rem;
    z-index: 5;
    width: min(19rem, calc(100% - 1.7rem));
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 0.8rem 1.65rem rgba(12, 36, 42, 0.18);
}

.maui-map-action-menu {
    padding: 0.35rem;
}

.maui-map-filter-menu {
    position: absolute;
    top: 4.05rem;
    right: 0.85rem;
    z-index: 5;
    width: min(17rem, calc(100% - 1.7rem));
    padding: 0.35rem;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 0.8rem 1.65rem rgba(12, 36, 42, 0.18);
}

.maui-map-action-menu-item {
    width: 100%;
    min-height: 2.6rem;
    padding: 0 0.75rem;
    border: 0;
    border-radius: 6px;
    color: var(--mars-ink);
    background: transparent;
    font-weight: 800;
    text-align: left;
}

.maui-map-action-menu-item:hover,
.maui-map-action-menu-item:focus-visible {
    background: var(--mars-primary-subtle);
    color: var(--mars-primary-active);
    outline: none;
}

.maui-map-time-filter {
    position: absolute;
    top: 4.05rem;
    right: 0.85rem;
    z-index: 5;
    width: min(22rem, calc(100% - 1.7rem));
    display: grid;
    gap: 0.7rem;
    padding: 0.85rem;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    color: var(--mars-text);
    background: #ffffff;
    box-shadow: 0 0.8rem 1.65rem rgba(12, 36, 42, 0.18);
}

.maui-map-time-filter-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 0.75rem;
}

.maui-map-time-filter-drag-handle {
    min-width: 0;
    cursor: grab;
    touch-action: none;
    -webkit-user-select: none;
    user-select: none;
}

.maui-map-time-filter.is-dragging .maui-map-time-filter-drag-handle {
    cursor: grabbing;
}

.maui-map-time-filter h2 {
    margin: 0;
    color: var(--mars-ink);
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.2;
}

.maui-map-time-filter p {
    margin: 0.2rem 0 0;
    color: var(--mars-muted);
    font-size: 0.85rem;
    font-weight: 700;
    line-height: 1.25;
}

.maui-map-time-filter-close {
    width: 2.15rem;
    height: 2.15rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid color-mix(in srgb, var(--mars-danger) 35%, white);
    border-radius: 6px;
    color: var(--mars-danger);
    background: #ffffff;
}

.maui-map-time-filter-close:hover,
.maui-map-time-filter-close:focus-visible {
    color: #ffffff;
    background: var(--mars-danger);
    outline: none;
}

.maui-map-time-filter-slider {
    width: 100%;
    accent-color: var(--mars-primary);
}

.maui-map-time-filter-labels {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    color: var(--mars-muted);
    font-size: 0.76rem;
    font-weight: 800;
}

.maui-drop-pin-form {
    display: grid;
    gap: 0.85rem;
    padding: 0.9rem;
}

.maui-drop-pin-field {
    display: grid;
    gap: 0.35rem;
}

.maui-drop-pin-field label {
    color: var(--mars-muted);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.maui-drop-pin-color-picker {
    position: relative;
}

.maui-drop-pin-color-button,
.maui-drop-pin-input {
    width: 100%;
    min-height: 2.5rem;
    border: 1px solid var(--mars-border-strong);
    border-radius: 6px;
    background: #ffffff;
    color: var(--mars-ink);
}

.maui-drop-pin-color-button {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.5rem;
    padding: 0 0.65rem;
    text-align: left;
    font-weight: 700;
}

.maui-drop-pin-color-button:focus-visible,
.maui-drop-pin-input:focus {
    border-color: var(--mars-primary);
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
    outline: none;
}

.maui-drop-pin-input {
    padding: 0 0.65rem;
}

.maui-drop-pin-swatch {
    width: 0.95rem;
    height: 0.95rem;
    flex: 0 0 auto;
    border: 1px solid rgba(12, 36, 42, 0.28);
    border-radius: 3px;
}

.maui-drop-pin-color-list {
    position: absolute;
    right: 0;
    left: 0;
    top: calc(100% + 0.25rem);
    z-index: 6;
    max-height: 14rem;
    overflow: auto;
    padding: 0.3rem;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 0.65rem 1.2rem rgba(12, 36, 42, 0.16);
}

.maui-drop-pin-color-option {
    width: 100%;
    min-height: 2.25rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0 0.55rem;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--mars-ink);
    font-weight: 700;
    text-align: left;
}

.maui-drop-pin-color-option:hover,
.maui-drop-pin-color-option:focus-visible,
.maui-drop-pin-color-option[aria-selected="true"] {
    background: var(--mars-primary-subtle);
    color: var(--mars-primary-active);
    outline: none;
}

.maui-drop-pin-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.55rem;
}

.maui-drop-pin-actions .maui-primary-button,
.maui-drop-pin-actions .maui-secondary-button {
    margin-top: 0;
    min-height: 2.45rem;
}

.maui-drop-pin-status,
.maui-drop-pin-error {
    margin: 0;
    font-size: 0.88rem;
    font-weight: 700;
    line-height: 1.3;
}

.maui-drop-pin-status {
    color: var(--mars-muted);
}

.maui-drop-pin-error {
    color: var(--mars-danger);
}

.maui-user-pin-popup {
    left: auto;
    bottom: auto;
    transform: translate(-50%, calc(-100% - 1rem));
    padding: 0.85rem;
    color: var(--mars-text);
}

.maui-user-pin-popup::after {
    position: absolute;
    left: 50%;
    bottom: -0.45rem;
    width: 0.8rem;
    height: 0.8rem;
    border-right: 1px solid var(--mars-border);
    border-bottom: 1px solid var(--mars-border);
    background: #ffffff;
    content: "";
    transform: translateX(-50%) rotate(45deg);
}

.maui-user-pin-popup h2 {
    margin: 0 0 0.5rem;
    color: var(--mars-ink);
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.25;
}

.maui-user-pin-popup-meta {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin: 0 0 0.55rem;
    color: var(--mars-muted);
    font-size: 0.82rem;
    font-weight: 800;
}

.maui-user-pin-popup-description {
    margin: 0;
    color: var(--mars-text);
    font-size: 0.94rem;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.maui-map-state {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 1.25rem;
    text-align: center;
    color: var(--mars-text);
}

.maui-map-state p {
    max-width: 28rem;
    margin: 0;
    overflow-wrap: anywhere;
}

.maui-map-retry {
    padding: 0 1.25rem;
    border: 0;
    background: var(--mars-primary);
    color: #ffffff;
}

.maui-map-retry:hover,
.maui-map-retry:focus-visible {
    background: var(--mars-primary-hover);
}

.maui-meeting-details {
    flex: 0 0 22rem;
    width: 22rem;
    max-width: 36vw;
    min-width: 18rem;
    overflow: auto;
    padding: 1rem;
    border-left: 1px solid var(--mars-border);
    background: var(--mars-surface);
    color: var(--mars-text);
}

.maui-meeting-details h2 {
    margin: 0 0 0.9rem;
    color: var(--mars-ink);
    font-size: 1.15rem;
    font-weight: 700;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.maui-meeting-details-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.9rem;
}

.maui-meeting-details-heading h2 {
    margin: 0;
    min-width: 0;
}

.maui-meeting-details-actions {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
}

.maui-meeting-details-toolbar {
    margin-bottom: 0.85rem;
}

.maui-meeting-save-button {
    min-height: 2.25rem;
    padding: 0 0.65rem;
    border: 1px solid var(--mars-primary);
    border-radius: 6px;
    background: #ffffff;
    color: var(--mars-primary);
    font-size: 0.82rem;
    font-weight: 800;
    white-space: nowrap;
}

.maui-meeting-save-button:hover:not(:disabled),
.maui-meeting-save-button:focus-visible:not(:disabled) {
    background: var(--mars-primary-subtle);
    color: var(--mars-primary-active);
    outline: none;
}

.maui-meeting-save-button:focus-visible {
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
}

.maui-meeting-save-button:disabled {
    cursor: wait;
    opacity: 0.72;
}

.maui-meeting-unsave-confirm {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.9rem;
    padding: 0.65rem 0.75rem;
    border: 1px solid color-mix(in srgb, var(--mars-danger) 45%, white);
    border-radius: 6px;
    background: color-mix(in srgb, var(--mars-danger) 7%, white);
}

.maui-meeting-unsave-confirm p {
    margin: 0;
    color: var(--mars-danger);
    font-size: 0.85rem;
    font-weight: 800;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.maui-meeting-unsave-actions {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
}

.maui-meeting-unsave-actions .maui-secondary-button,
.maui-meeting-unsave-confirm-button {
    width: auto;
    min-height: 1.8rem;
    margin-top: 0;
    padding: 0.24rem 0.55rem;
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1;
}

.maui-meeting-unsave-confirm-button {
    border: 1px solid var(--mars-danger);
    border-radius: 5px;
    background: #ffffff;
    color: var(--mars-danger);
}

.maui-meeting-unsave-confirm-button:hover:not(:disabled),
.maui-meeting-unsave-confirm-button:focus-visible:not(:disabled) {
    background: var(--mars-danger);
    color: #ffffff;
    outline: none;
}

.maui-meeting-unsave-confirm-button:focus-visible {
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
}

.maui-meeting-unsave-confirm-button:disabled {
    cursor: wait;
    opacity: 0.72;
}

.maui-meeting-details-back {
    min-height: 2.35rem;
    padding: 0 0.75rem;
    border: 1px solid var(--mars-primary);
    border-radius: 6px;
    background: #ffffff;
    color: var(--mars-primary);
    font-size: 0.86rem;
    font-weight: 800;
}

.maui-meeting-details-back:hover,
.maui-meeting-details-back:focus-visible {
    background: var(--mars-primary-subtle);
    color: var(--mars-primary-active);
    outline: none;
}

.maui-meeting-details-back:focus-visible {
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
}

.maui-meeting-details-empty,
.maui-meeting-details-status,
.maui-meeting-details-error {
    margin: 0;
    color: var(--mars-muted);
    font-size: 0.95rem;
    font-weight: 700;
}

.maui-meeting-details-error {
    color: var(--mars-danger);
}

.maui-meeting-details-list {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    margin: 0;
}

.maui-meeting-details-list > div {
    padding-top: 0.85rem;
    border-top: 1px solid var(--mars-border);
}

.maui-meeting-details-list dt {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-bottom: 0.25rem;
    color: var(--mars-muted);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.maui-meeting-details-list dt .maui-address-map-button {
    width: 1.6rem;
    height: 1.6rem;
}

.maui-meeting-details-list dd {
    margin: 0;
    color: var(--mars-text);
    font-size: 0.95rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.maui-meeting-details-list address {
    display: flex;
    flex-direction: column;
    margin: 0;
    font-style: normal;
}

.maui-meeting-details-muted {
    color: var(--mars-muted);
}

.maui-meeting-phone-link {
    color: var(--mars-primary);
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 0.12em;
}

.maui-meeting-phone-link:hover,
.maui-meeting-phone-link:focus-visible {
    color: var(--mars-primary-active);
    outline: none;
}

.maui-meeting-phone-link:focus-visible {
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
}

.maui-meeting-picker-address {
    display: flex;
    flex-direction: column;
    margin: 0 0 0.9rem;
    color: var(--mars-muted);
    font-size: 0.9rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.maui-meeting-picker-list {
    display: grid;
    gap: 0.55rem;
}

.maui-meeting-picker-button {
    width: 100%;
    display: grid;
    gap: 0.22rem;
    padding: 0.75rem;
    border: 1px solid var(--mars-border);
    border-radius: 6px;
    background: #ffffff;
    color: var(--mars-text);
    text-align: left;
}

.maui-meeting-picker-button:hover,
.maui-meeting-picker-button:focus-visible {
    border-color: var(--mars-primary);
    background: var(--mars-primary-subtle);
    outline: none;
}

.maui-meeting-picker-button:focus-visible {
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
}

.maui-meeting-picker-name {
    color: var(--mars-ink);
    font-weight: 800;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.maui-meeting-picker-time {
    color: var(--mars-muted);
    font-size: 0.84rem;
    font-weight: 700;
    line-height: 1.25;
}

.maui-meeting-times {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    margin: 0;
    padding-left: 1.1rem;
}

.maui-meeting-note {
    display: grid;
    gap: 0.65rem;
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--mars-border);
}

.maui-meeting-note h3 {
    margin: 0;
    color: var(--mars-muted);
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.maui-meeting-note-input {
    width: 100%;
    min-height: 7rem;
    resize: vertical;
    padding: 0.65rem;
    border: 1px solid var(--mars-border-strong);
    border-radius: 6px;
    background: #ffffff;
    color: var(--mars-ink);
    line-height: 1.35;
}

.maui-meeting-note-input:focus {
    border-color: var(--mars-primary);
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
    outline: none;
}

.maui-meeting-note-save {
    margin-top: 0;
}

@media (max-width: 760px) {
    .maui-meetings-content {
        grid-template-columns: 1fr;
        grid-template-rows: minmax(0, 16rem) minmax(0, 1fr);
    }

    .maui-meetings-list {
        height: 100%;
        max-height: none;
    }

    .maui-map-body {
        flex-direction: column;
    }

    .maui-meeting-details {
        flex: 0 0 auto;
        width: 100%;
        max-width: none;
        max-height: 38vh;
        min-width: 0;
        border-top: 1px solid var(--mars-border);
        border-left: 0;
    }
}

@media (max-width: 520px) {
    .maui-login-page {
        padding: 1rem;
    }

    .maui-home-page {
        padding: 1rem 0.75rem;
    }

    .maui-home-panel {
        width: 100%;
        gap: 0.55rem;
        padding-right: 0;
        padding-left: 0;
    }

    .maui-home-tracking-panel {
        padding: 0.6rem;
    }

    .maui-home-tracking-row {
        align-items: center;
    }

    .maui-home-tracking-panel .maui-home-tracking-button,
    .maui-home-tracking-panel .maui-home-check-button {
        min-width: 0;
    }

    .maui-login-card,
    .maui-home-card {
        padding: 1.25rem;
    }

    .maui-bottom-nav {
        gap: 0.2rem;
        min-height: 3.25rem;
        padding: 0.25rem max(0.45rem, env(safe-area-inset-right, 0px)) calc(0.25rem + env(safe-area-inset-bottom, 0px)) max(0.45rem, env(safe-area-inset-left, 0px));
    }

    .maui-bottom-menu-button,
    .maui-bottom-nav-button,
    .maui-bottom-nav-placeholder {
        width: 2.45rem;
        height: 2.45rem;
    }

    .maui-bottom-nav-icon,
    .maui-bottom-menu-button svg,
    .maui-bottom-nav-button svg {
        width: 1.55rem;
        height: 1.55rem;
    }

    .maui-bottom-nav-empty-marker {
        width: 1.1rem;
        height: 1.1rem;
    }

    .maui-nav-popup {
        left: max(0.55rem, env(safe-area-inset-left, 0px));
        bottom: calc(4rem + env(safe-area-inset-bottom, 0px));
        width: min(12.75rem, calc(100% - 1.1rem));
        max-height: min(72vh, calc(100% - 5rem));
        gap: 0.55rem;
        padding: 0.9rem 0.65rem;
    }

    .maui-nav-popup-link {
        min-height: 2.55rem;
        font-size: 0.92rem;
    }

    .maui-map-toolbar {
        align-items: stretch;
        flex-direction: column;
        gap: 0.55rem;
    }

    .maui-map-filter {
        align-items: stretch;
        flex-direction: column;
        gap: 0.35rem;
    }

    .maui-map-select {
        width: 100%;
    }
}

.mars-stadia-map {
    position: relative;
    flex: 1 1 auto;
    align-self: stretch;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 16rem;
    overflow: hidden;
    background: var(--mars-surface-alt);
}

.mars-stadia-map .maplibregl-canvas {
    outline: none;
}

.mars-stadia-map .maplibregl-ctrl-top-right {
    top: 3.45rem;
}

.mars-stadia-map .maplibregl-ctrl button {
    min-width: 29px;
    min-height: 29px;
}

.mars-journal-page {
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 1rem;
    background: var(--mars-app-bg);
    color: var(--mars-text);
    box-sizing: border-box;
}

.mars-journal-header {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.mars-journal-header h1 {
    margin: 0;
    color: var(--mars-ink);
    font-size: 1.45rem;
    font-weight: 800;
    line-height: 1.15;
}

.mars-journal-message,
.mars-journal-error {
    margin: 0;
    color: var(--mars-muted);
    font-size: 0.9rem;
    font-weight: 800;
    line-height: 1.25;
}

.mars-journal-message.is-error,
.mars-journal-error {
    color: var(--mars-danger);
}

.goal-categories-page {
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.goal-categories-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.goal-categories-header h1 {
    margin: 0;
    color: var(--mars-ink);
    font-size: 1.35rem;
    line-height: 1.2;
}

.goal-categories-message {
    margin: 0;
    padding: 0.45rem 0.65rem;
    border: 1px solid #b7dfc2;
    border-radius: 6px;
    background: #eefaf1;
    color: #225b2e;
    font-size: 0.88rem;
    font-weight: 800;
}

.goal-categories-message.is-error {
    border-color: #efb4b4;
    background: #fff2f2;
    color: var(--mars-danger);
}

.goal-categories-state {
    display: grid;
    place-items: center;
    gap: 0.75rem;
    min-height: 14rem;
    padding: 1rem;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: var(--mars-surface);
    color: var(--mars-muted);
    font-weight: 800;
}

.goal-categories-state p {
    margin: 0;
}

.goal-categories-treegrid {
    min-height: 0;
    overflow: auto;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: var(--mars-surface);
}

.goal-categories-treegrid-header,
.goal-category-row {
    width: max-content;
    min-width: 100%;
    display: grid;
    grid-template-columns: max-content;
    align-items: stretch;
}

.goal-categories-treegrid-header {
    position: sticky;
    top: 0;
    z-index: 1;
    border-bottom: 1px solid var(--mars-border);
    background: var(--mars-surface-alt);
    color: var(--mars-muted);
    font-size: 0.78rem;
    font-weight: 900;
    letter-spacing: 0;
    text-transform: uppercase;
}

.goal-categories-treegrid-header > div,
.goal-category-row > div {
    min-width: 0;
    padding: 0.45rem 0.6rem;
    border-right: 1px solid var(--mars-border);
}

.goal-categories-treegrid-header > div:last-child,
.goal-category-row > div:last-child {
    border-right: 0;
}

.goal-categories-treegrid-body {
    width: max-content;
    min-width: 100%;
}

.goal-category-row {
    border-bottom: 1px solid var(--mars-border);
}

.goal-category-row:last-child {
    border-bottom: 0;
}

.goal-category-row:hover {
    background: var(--mars-primary-subtle);
}

.goal-category-create-row {
    background: #fbfdfc;
}

.goal-category-tree-cell {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.35rem;
    min-height: 2.45rem;
    padding-left: calc(0.6rem + (var(--goal-category-depth) * 1.4rem)) !important;
    white-space: nowrap;
}

.goal-category-row.has-parent .goal-category-tree-cell::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: calc(1.3rem + ((var(--goal-category-depth) - 1) * 1.4rem));
    border-left: 1px solid var(--mars-border-strong);
}

.goal-category-row.has-parent .goal-category-tree-cell::after {
    content: "";
    position: absolute;
    top: 50%;
    left: calc(1.3rem + ((var(--goal-category-depth) - 1) * 1.4rem));
    width: 1rem;
    border-top: 1px solid var(--mars-border-strong);
}

.goal-category-expander,
.goal-category-expander-spacer {
    position: relative;
    z-index: 1;
    width: 1.85rem;
    height: 1.85rem;
    flex: 0 0 auto;
}

.goal-category-expander,
.goal-category-icon-button,
.goal-category-info-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: 5px;
    background: transparent;
    color: var(--mars-primary);
}

.goal-category-expander .rz-icon,
.goal-category-icon-button .rz-icon,
.goal-category-info-button .rz-icon {
    font-size: 1.2rem;
}

.goal-category-name-button {
    min-height: 2rem;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    padding: 0 0.45rem;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--mars-text);
    font: inherit;
    font-weight: 800;
    line-height: 1.2;
    text-align: left;
    white-space: nowrap;
}

.goal-category-name-text {
    flex: 0 0 auto;
    padding: 0 0.45rem;
    color: var(--mars-text);
    font-weight: 800;
    line-height: 1.2;
    white-space: nowrap;
}

.goal-category-inline-input {
    width: min(100%, 22rem);
    min-width: 0;
    min-height: 2.1rem;
    flex: 1 1 10rem;
    padding: 0 0.55rem;
    border: 1px solid var(--mars-border-strong);
    border-radius: 6px;
    background: #ffffff;
    color: var(--mars-ink);
    font: inherit;
    font-weight: 800;
    box-sizing: border-box;
}

.goal-category-inline-input:focus {
    border-color: var(--mars-primary);
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
    outline: none;
}

.goal-category-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.55rem;
    min-height: 2.5rem;
    flex: 0 0 auto;
    margin-left: 0.3rem;
}

.goal-category-icon-button {
    width: 2.5rem;
    height: 2.5rem;
    flex: 0 0 auto;
}

.goal-category-info-button {
    width: 2rem;
    height: 2rem;
    flex: 0 0 auto;
    color: var(--mars-muted);
}

.goal-category-icon-button.is-danger {
    color: var(--mars-danger);
}

.goal-category-icon-button.is-confirm {
    color: #2d6f3b;
}

.goal-category-expander:hover:not(:disabled),
.goal-category-expander:focus-visible:not(:disabled),
.goal-category-name-button:hover,
.goal-category-name-button:focus-visible,
.goal-category-icon-button:hover:not(:disabled),
.goal-category-icon-button:focus-visible:not(:disabled),
.goal-category-info-button:hover,
.goal-category-info-button:focus-visible {
    background: var(--mars-primary-subtle);
    color: var(--mars-primary-active);
    outline: none;
}

.goal-category-icon-button.is-danger:hover:not(:disabled),
.goal-category-icon-button.is-danger:focus-visible:not(:disabled) {
    background: #fff2f2;
    color: var(--mars-danger);
}

.goal-category-expander:disabled,
.goal-category-icon-button:disabled {
    cursor: not-allowed;
    opacity: 0.52;
}

.goal-categories-empty {
    padding: 1.4rem;
    color: var(--mars-muted);
    font-weight: 800;
    text-align: center;
}

.goal-category-path-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1190;
    padding: 0;
    border: 0;
    background: transparent;
}

.goal-category-path-popup {
    position: fixed;
    left: 50%;
    top: 50%;
    z-index: 1200;
    width: min(28rem, calc(100vw - 2rem));
    display: grid;
    gap: 0.5rem;
    padding: 0.85rem 1rem;
    border: 1px solid var(--mars-border-strong);
    border-radius: 8px;
    background: #ffffff;
    color: var(--mars-text);
    box-shadow: 0 0.75rem 1.75rem rgba(23, 36, 38, 0.22);
    transform: translate(-50%, -50%);
}

.goal-category-path-popup h2,
.goal-category-path-popup p {
    margin: 0;
}

.goal-category-path-popup h2 {
    color: var(--mars-ink);
    font-size: 1rem;
    font-weight: 800;
}

.goal-category-path-popup p {
    overflow-x: auto;
    color: var(--mars-muted);
    font-weight: 800;
    white-space: nowrap;
}

@media (max-width: 700px) {
    .goal-categories-header {
        align-items: flex-start;
        flex-direction: column;
    }
}

.mars-journal-workspace {
    flex: 1 1 auto;
    min-height: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr) minmax(0, 2fr);
    gap: 0.75rem;
    overflow: hidden;
}

.mars-journal-tree-panel,
.mars-journal-editor-panel {
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: var(--mars-surface);
}

.mars-journal-toolbar {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.45rem;
    padding: 0.65rem;
    border-bottom: 1px solid var(--mars-border);
    background: var(--mars-surface-alt);
}

.mars-journal-toolbar .maui-secondary-button,
.mars-journal-save-button,
.mars-journal-dialog-actions .maui-primary-button,
.mars-journal-dialog-actions .maui-secondary-button,
.mars-journal-danger-button {
    width: auto;
    min-height: 2.25rem;
    margin-top: 0;
    padding: 0.35rem 0.75rem;
    border-radius: 6px;
    font-size: 0.86rem;
    font-weight: 800;
    line-height: 1.1;
}

.mars-journal-danger-button {
    border: 1px solid var(--mars-danger);
    background: #ffffff;
    color: var(--mars-danger);
}

.mars-journal-danger-button:hover:not(:disabled),
.mars-journal-danger-button:focus-visible:not(:disabled) {
    background: var(--mars-danger);
    color: #ffffff;
    outline: none;
}

.mars-journal-danger-button:disabled {
    cursor: not-allowed;
    opacity: 0.62;
}

.mars-journal-tree {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 0.5rem;
}

.mars-journal-tree-empty {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    color: var(--mars-muted);
    font-weight: 800;
}

.mars-journal-tree-group {
    display: grid;
    gap: 0.2rem;
}

.mars-journal-node,
.mars-journal-entry-node {
    width: 100%;
    min-height: 2.2rem;
    display: grid;
    grid-template-columns: 2rem minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.25rem;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--mars-text);
    text-align: left;
}

.mars-journal-node-folder {
    margin-left: 1rem;
}

.mars-journal-entry-node {
    grid-template-columns: 2rem minmax(0, 1fr);
    margin-left: 2rem;
    padding: 0 0.55rem;
    font: inherit;
}

.mars-journal-entry-node-root {
    margin-left: 1rem;
}

.mars-journal-expander {
    width: 1.8rem;
    height: 1.8rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: 5px;
    background: transparent;
    color: var(--mars-primary);
    font-weight: 900;
    line-height: 1;
}

.mars-journal-node-title {
    min-width: 0;
    min-height: 2rem;
    display: flex;
    align-items: center;
    padding: 0 0.55rem;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: inherit;
    font: inherit;
    font-weight: 800;
    line-height: 1.2;
    text-align: left;
    overflow-wrap: anywhere;
}

.mars-journal-node-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.2rem;
    min-width: 0;
    padding-right: 0.2rem;
}

.mars-journal-node-action-button {
    width: 1.85rem;
    height: 1.85rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    padding: 0;
    border: 0;
    border-radius: 5px;
    background: transparent;
    color: var(--mars-primary);
}

.mars-journal-node-action-button svg {
    width: 1.05rem;
    height: 1.05rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.mars-journal-node-action-button:disabled {
    cursor: not-allowed;
    opacity: 0.48;
}

.mars-journal-node-folder .mars-journal-node-title,
.mars-journal-entry-node {
    font-weight: 700;
}

.mars-journal-entry-marker {
    justify-self: center;
    width: 0.45rem;
    height: 0.45rem;
    border-radius: 999px;
    background: var(--mars-border-strong);
}

.mars-journal-expander:hover,
.mars-journal-expander:focus-visible,
.mars-journal-node-title:hover,
.mars-journal-node-title:focus-visible,
.mars-journal-node-action-button:hover:not(:disabled),
.mars-journal-node-action-button:focus-visible:not(:disabled),
.mars-journal-entry-node:hover,
.mars-journal-entry-node:focus-visible,
.mars-journal-node.is-selected .mars-journal-node-title,
.mars-journal-entry-node.is-selected {
    background: var(--mars-primary-subtle);
    color: var(--mars-primary-active);
    outline: none;
}

.mars-journal-editor-shell {
    flex: 1 1 auto;
    min-height: 0;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    overflow: hidden;
}

.mars-journal-editor-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.65rem;
    padding: 0.65rem;
    border-bottom: 1px solid var(--mars-border);
    background: var(--mars-surface-alt);
}

.mars-journal-entry-title,
.mars-journal-dialog-input {
    width: 100%;
    min-height: 2.35rem;
    min-width: 0;
    padding: 0 0.65rem;
    border: 1px solid var(--mars-border-strong);
    border-radius: 6px;
    background: #ffffff;
    color: var(--mars-ink);
    font: inherit;
    font-weight: 800;
    box-sizing: border-box;
}

.mars-journal-entry-title:focus,
.mars-journal-dialog-input:focus {
    border-color: var(--mars-primary);
    box-shadow: 0 0 0 0.2rem var(--mars-focus-ring);
    outline: none;
}

.mars-journal-editor-frame {
    min-height: 0;
    overflow: auto;
    padding: 0.65rem;
}

.mars-journal-html-editor {
    min-height: 100%;
    --mars-journal-selection-menu-clearance: 0rem;
}

.mars-journal-html-editor .rz-html-editor-toolbar {
    min-height: 2.65rem;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0.15rem;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0.25rem;
    white-space: nowrap;
}

.mars-journal-html-editor .rz-html-editor-toolbar > * {
    flex: 0 0 auto;
}

.mars-journal-html-editor .rz-html-editor-toolbar .rz-html-editor-button,
.mars-journal-html-editor .rz-html-editor-toolbar .rz-button {
    width: 2rem;
    min-width: 2rem;
    height: 2rem;
    min-height: 2rem;
    padding: 0;
}

.mars-journal-html-editor .rz-html-editor-toolbar .rz-html-editor-button .rzi,
.mars-journal-html-editor .rz-html-editor-toolbar .rz-button .rzi {
    font-size: 1.25rem;
}

.mars-journal-html-editor .rz-html-editor-toolbar .rz-dropdown,
.mars-journal-html-editor .rz-html-editor-toolbar .rz-colorpicker {
    min-height: 2rem;
}

.mars-journal-html-editor .rz-html-editor-toolbar .rz-dropdown {
    max-width: 8.5rem;
}

.mars-journal-html-editor .rz-html-editor-toolbar .rz-html-editor-separator {
    height: 1.6rem;
    margin-inline: 0.15rem;
}

.mars-journal-html-editor .rz-html-editor-content {
    min-height: 12rem;
    padding-block-start: calc(0.5rem + var(--mars-journal-selection-menu-clearance));
    scroll-padding-block-start: calc(0.5rem + var(--mars-journal-selection-menu-clearance));
}

.mars-journal-html-editor .rz-html-editor-source.rz-textarea {
    padding-block-start: calc(0.5rem + var(--mars-journal-selection-menu-clearance));
    scroll-padding-block-start: calc(0.5rem + var(--mars-journal-selection-menu-clearance));
}

.mars-journal-editor-empty,
.mars-journal-state {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 1.25rem;
    color: var(--mars-muted);
    text-align: center;
    font-weight: 800;
}

.mars-journal-state p,
.mars-journal-editor-empty {
    margin: 0;
}

.mars-journal-dialog-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1300;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    background: rgba(23, 36, 38, 0.42);
}

.mars-journal-dialog {
    width: min(28rem, 100%);
    display: grid;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid var(--mars-border);
    border-radius: 8px;
    background: #ffffff;
    color: var(--mars-text);
    box-shadow: 0 1rem 2rem rgba(12, 36, 42, 0.22);
}

.mars-journal-dialog h2 {
    margin: 0;
    color: var(--mars-ink);
    font-size: 1.15rem;
    font-weight: 800;
}

.mars-journal-dialog p {
    margin: 0;
    line-height: 1.35;
}

.mars-journal-dialog-field {
    display: grid;
    gap: 0.4rem;
    color: var(--mars-muted);
    font-size: 0.82rem;
    font-weight: 800;
}

.mars-journal-dialog-actions {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}

@media (max-width: 640px) {
    .mars-journal-page {
        padding: 0.65rem;
    }

    .mars-journal-html-editor {
        --mars-journal-selection-menu-clearance: 3.25rem;
    }

    .mars-journal-header {
        align-items: stretch;
        flex-direction: column;
        gap: 0.45rem;
    }

    .mars-journal-toolbar {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .mars-journal-toolbar .maui-secondary-button,
    .mars-journal-toolbar .mars-journal-danger-button {
        width: 100%;
    }

    .mars-journal-editor-header {
        grid-template-columns: 1fr;
    }

    .mars-journal-save-button {
        width: 100%;
    }
}

@media (pointer: coarse) {
    .mars-journal-html-editor {
        --mars-journal-selection-menu-clearance: 3.25rem;
    }
}