@font-face {
    font-family: DM;
    src: url(fonts/dm-sans.ttf) format("truetype");
    font-weight: 100 900;
    font-display: swap;
}
@font-face {
    font-family: Instrument;
    src: url(fonts/instrument-serif.ttf) format("truetype");
    font-display: swap;
}
:root {
    --ink: #192d27;
    --muted: #5f7068;
    --pine: #153c31;
    --forest: #0d3027;
    --lime: #d9efac;
    --paper: #f6f7f2;
    --line: #d9dfd6;
    --white: #fff;
    --radius: 17px;
}
* {
    box-sizing: border-box;
}
body {
    margin: 0;
    background: var(--paper);
    color: var(--ink);
    font:
        15px/1.5 DM,
        system-ui,
        sans-serif;
}
a {
    color: #215640;
    text-underline-offset: 3px;
}
button,
input,
select,
textarea {
    font: inherit;
    color: inherit;
}
button,
a,
summary {
    touch-action: manipulation;
}
a:hover {
    text-decoration: underline;
}
button {
    cursor: pointer;
}
button:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
summary:focus-visible {
    outline: 3px solid #689b59;
    outline-offset: 3px;
}
button img,
.btn img {
    width: 17px;
    height: 17px;
}
.btn,
.segments a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border-radius: 9px;
    text-decoration: none;
    font-weight: 650;
}
.btn {
    min-height: 43px;
    border: 1px solid var(--line);
    background: white;
    padding: 9px 17px;
    color: var(--ink);
}
.btn:hover:not(:disabled) {
    border-color: #759982;
    text-decoration: none;
}
.btn.primary {
    background: var(--pine);
    color: #fff;
    border-color: var(--pine);
}
.btn.primary:hover:not(:disabled) {
    background: #25513e;
}
.btn.primary img {
    filter: invert(1);
}
.btn.small {
    font-size: 13px;
    min-height: 37px;
    padding: 6px 12px;
}
.btn.wide {
    width: 100%;
    justify-content: space-between;
    padding: 13px 18px;
}
h1,
h2,
h3,
p {
    margin: 0;
}
h1,
.login-form h2 {
    font-weight: 560;
    line-height: 1.04;
    letter-spacing: -0.055em;
    font-size: clamp(36px, 4.5vw, 66px);
}
h2 {
    font-weight: 600;
    font-size: 23px;
    line-height: 1.2;
    letter-spacing: -0.045em;
}
h3 {
    font-size: 16px;
    line-height: 1.35;
    letter-spacing: -0.025em;
}
p + p {
    margin-top: 0.6em;
}
small,
.muted {
    color: var(--muted);
}
small {
    font-size: 12px;
}
.overline,
.eyebrow {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.13em;
}
.eyebrow {
    color: var(--muted);
    margin-bottom: 10px;
}
.skip {
    position: fixed;
    top: -100px;
    left: 8px;
    background: white;
    z-index: 20;
    padding: 10px;
}
.skip:focus {
    top: 8px;
}
.shell {
    display: grid;
    grid-template-columns: 232px minmax(0, 1fr);
    min-height: 100dvh;
}
.sidebar {
    position: sticky;
    top: 0;
    height: 100dvh;
    color: white;
    background: var(--forest);
    padding: 36px 19px 20px;
    display: flex;
    flex-direction: column;
}
.brand {
    color: inherit;
    display: inline-flex;
    align-items: center;
    gap: 11px;
    font-weight: 620;
    font-size: 36px;
    letter-spacing: -0.07em;
    text-decoration: none;
    line-height: 1;
}
.brand:hover {
    text-decoration: none;
}
.sidebar .brand,
.workspace {
    margin-left: 12px;
}
.mark {
    display: inline-flex;
    gap: 3px;
    align-items: end;
    height: 27px;
    transform: skewX(-15deg);
}
.mark i {
    display: block;
    background: var(--lime);
    width: 6px;
    height: 12px;
    border-radius: 2px;
}
.mark i:nth-child(2) {
    height: 19px;
}
.mark i:last-child {
    height: 27px;
}
.workspace {
    color: #c5d4c8;
    font-size: 12px;
    letter-spacing: 0.07em;
    margin-top: 12px;
}
.sidebar nav {
    margin-top: 39px;
    display: grid;
    gap: 5px;
}
.sidebar nav a {
    padding: 11px 13px;
    color: #d1ded6;
    font-size: 14px;
    font-weight: 520;
    display: flex;
    gap: 12px;
    align-items: center;
    text-decoration: none;
    border-radius: 8px;
}
.sidebar nav a.current {
    background: #305646;
    color: #e4f6bc;
}
.sidebar nav a:hover {
    background: #254b3e;
}
.sidebar nav img,
.logout img {
    width: 18px;
    height: 18px;
    filter: invert(92%) sepia(8%) saturate(303%) hue-rotate(96deg);
}
.sidebar hr {
    width: 100%;
    border: none;
    border-top: 1px solid #365347;
    margin: 16px 0;
}
.sidefoot {
    margin-top: auto;
    border-top: 1px solid #365347;
    display: flex;
    gap: 10px;
    align-items: center;
    padding: 18px 0 0;
}
.avatar,
.initial,
.lock-tile {
    background: var(--lime);
    color: var(--pine);
    display: inline-grid;
    place-items: center;
    border-radius: 12px;
    font-weight: 700;
}
.avatar,
.initial {
    width: 39px;
    height: 39px;
}
.sidefoot small,
.entity small {
    display: block;
}
.sidefoot small {
    color: #c4d1c9;
}
.sidefoot b {
    font-size: 13px;
}
.sidefoot form {
    margin-left: auto;
}
.logout,
.mobile-menu {
    border: 0;
    background: none;
    padding: 8px;
}
.mobile-menu {
    display: none;
}
.topbar {
    height: 64px;
    padding: 0 clamp(20px, 4vw, 62px);
    border-bottom: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: var(--muted);
    font-size: 13px;
}
.topbar b {
    color: #abb8ad;
    margin: 0 10px;
}
.top-private {
    display: flex;
    align-items: center;
    gap: 7px;
}
.top-private i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #548961;
}
.content {
    padding: 36px clamp(20px, 4vw, 62px) 62px;
    max-width: 1660px;
    margin: auto;
}
.page-head,
.panel-head,
.calbar,
.cal-nav,
.row-item,
.line,
.actions,
.entity,
.pager,
.chips {
    display: flex;
    align-items: center;
    gap: 12px;
}
.page-head,
.panel-head,
.line,
.row-item,
.calbar {
    justify-content: space-between;
}
.page-head {
    margin: 6px 0 25px;
    flex-wrap: wrap;
}
.page-head .btn {
    white-space: nowrap;
}
.panel,
.metric,
.filters,
.scope {
    border: 1px solid var(--line);
    background: var(--white);
    border-radius: var(--radius);
}
.panel {
    padding: 24px;
    min-width: 0;
}
.panel + .panel,
.panel + form {
    margin-top: 16px;
}
.panel h2 + form,
.panel h2 + p,
.panel h2 + .actions {
    margin-top: 17px;
}
.panel-head a,
.calbar > a,
.subtle {
    font-size: 13px;
    font-weight: 650;
}
.panel-head {
    margin-bottom: 16px;
}
.metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 22px;
}
.metric {
    position: relative;
    padding: 17px 20px;
    display: grid;
    gap: 9px;
}
.metric > img {
    position: absolute;
    right: 15px;
    bottom: 22px;
    width: 22px;
    opacity: 0.53;
}
.metric > span {
    font-size: 13px;
    color: var(--muted);
}
.metric strong {
    font-weight: 520;
    font-size: 38px;
    letter-spacing: -0.065em;
    line-height: 1.1;
}
.dashboard,
.split,
.editor {
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, 1.75fr) minmax(250px, 1fr);
    align-items: start;
}
.dashboard {
    align-items: stretch;
}
.dashboard.lower,
.notice,
.split + .panel {
    margin-top: 18px;
}
.dashboard .panel + .panel,
.split .panel + .panel {
    margin: 0;
}
.quick {
    background: #e2eccf;
    border-radius: var(--radius);
    padding: 24px;
}
.quick h2 {
    font-family: Instrument, Georgia, serif;
    font-weight: 400;
    font-size: 46px;
    line-height: 0.9;
    margin-bottom: 18px;
}
.quick a {
    display: flex;
    gap: 11px;
    align-items: center;
    padding: 9px 0;
    border-top: 1px solid #beceb0;
    color: var(--pine);
    text-decoration: none;
    font-weight: 570;
}
.quick a img {
    width: 17px;
}
.quick a b {
    margin-left: auto;
}
.week-strip {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 5px;
    padding: 10px 0 16px;
    border-bottom: 1px solid var(--line);
}
.week-strip a {
    display: grid;
    text-align: center;
    text-decoration: none;
    color: var(--ink);
    padding: 7px 0;
    border-radius: 10px;
}
.week-strip a.on {
    background: var(--pine);
    color: white;
}
.week-strip a.on small {
    color: #d2e0d5;
}
.empty {
    padding: 38px 15px;
    display: grid;
    gap: 6px;
    justify-items: center;
    text-align: center;
}
.empty > img {
    width: 33px;
    height: 33px;
    opacity: 0.65;
    margin-bottom: 10px;
}
.empty p,
.empty-line {
    font-size: 14px;
    color: var(--muted);
}
.empty-line {
    padding: 15px 0;
}
.line,
.row-item {
    padding: 11px 0;
    border-top: 1px solid var(--line);
    text-decoration: none;
    color: var(--ink);
}
.row-item > div {
    min-width: 0;
}
.row-item b,
.row-item small {
    display: block;
}
.row-item time {
    white-space: nowrap;
    color: var(--muted);
    font-size: 12px;
}
.notice {
    border: 1px solid #d8d9b4;
    border-radius: 10px;
    background: #f4f4de;
    padding: 12px 16px;
    font-size: 14px;
    margin-bottom: 15px;
}
.notice.good {
    background: #e6f0dc;
    border-color: #bfd5b5;
}
.notice.error {
    background: #ffede7;
    border-color: #eac3b4;
}
.notice p {
    margin: 0;
}
.panel p,
.panel small,
.preview-card,
.event,
.library h3,
.history-row {
    overflow-wrap: anywhere;
}
.panel form + form {
    margin-top: 12px;
}
label,
legend {
    font-size: 14px;
    font-weight: 600;
}
label {
    display: grid;
    gap: 6px;
}
input:not([type="checkbox"]),
select,
textarea {
    width: 100%;
    min-width: 0;
    padding: 10px 12px;
    border: 1px solid #c5cec4;
    background: white;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 400;
}
textarea {
    resize: vertical;
}
input[type="file"] {
    background: #f6f8f2;
    padding: 9px;
    font-size: 13px;
}
input::file-selector-button {
    border: 1px solid var(--line);
    background: white;
    padding: 6px;
    border-radius: 5px;
    margin-right: 6px;
}
form > label + label,
.panel label + details,
.panel details + label,
.panel fieldset + label {
    margin-top: 14px;
}
form > .btn,
.panel label + .btn {
    margin-top: 14px;
}
.scope,
.filters {
    display: flex;
    gap: 12px;
    align-items: flex-end;
    flex-wrap: wrap;
    padding: 13px 17px;
    margin-bottom: 18px;
}
.scope {
    display: inline-flex;
    background: transparent;
    border: none;
    padding: 0;
}
.scope label,
.filters label {
    font-size: 12px;
    color: var(--muted);
}
.filters select,
.scope select,
.filters input {
    padding: 7px 10px;
    font-size: 14px;
    min-height: 37px;
}
.scope label {
    display: flex;
    align-items: center;
    gap: 10px;
}
.scope select {
    width: auto;
}
.filters > .btn,
.scope > .btn {
    margin: 0;
}
.filters label + label {
    margin: 0;
}
.two {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin: 14px 0;
}
.check {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 450;
}
.check input {
    width: 17px;
    height: 17px;
    accent-color: var(--pine);
    flex: none;
}
.group,
fieldset {
    border: 1px solid var(--line);
    border-radius: 10px;
    margin: 15px 0;
    padding: 12px;
}
.group .check + .check {
    margin-top: 8px;
}
.target {
    flex-wrap: wrap;
}
.target .reason {
    font-size: 12px;
}
.chips,
.actions {
    flex-wrap: wrap;
}
.actions {
    margin: 15px 0 0;
}
.actions form,
.actions button {
    margin: 0;
}
.panel .actions form + form {
    margin: 0;
}
.actions > .btn {
    margin: 0;
}
.actions a {
    text-decoration: none;
}
details {
    margin: 16px 0 0;
}
summary {
    cursor: pointer;
    color: var(--pine);
    font-size: 14px;
    font-weight: 620;
}
details[open] > summary {
    margin-bottom: 12px;
}
.import {
    margin-bottom: 16px;
}
.entity {
    justify-content: flex-start;
    margin-bottom: 12px;
}
.entity h2 {
    font-size: 20px;
}
.thumb {
    width: 44px;
    height: 44px;
    object-fit: cover;
    border-radius: 10px;
}
.account + .account,
.history-row + .history-row {
    border-top: 1px solid var(--line);
    padding-top: 20px;
    margin-top: 20px;
}
.copy {
    white-space: pre-wrap;
}
.preview {
    position: sticky;
    top: 16px;
}
.preview .panel-head select {
    width: auto;
    font-size: 13px;
}
.preview-card {
    border: 1px solid var(--line);
    padding: 13px;
    border-radius: 12px;
    margin: 14px 0;
}
.preview-image {
    aspect-ratio: 1.25;
    background: #edf1e8;
    display: grid;
    place-items: center;
    border-radius: 8px;
    overflow: hidden;
    margin: 13px 0;
}
.preview-image > img,
.preview-image > video {
    width: 100%;
    height: 100%;
    object-fit: contain;
    max-height: 320px;
}
.preview-image img[src^="/assets/icons"] {
    width: 40px;
    opacity: 0.45;
}
.preview .copy {
    font-size: 14px;
}
.edit-main > .panel + .panel {
    margin-top: 14px;
}
#asset-list {
    padding: 0;
    list-style: none;
}
#asset-list li {
    display: flex;
    align-items: center;
    gap: 5px;
    margin: 6px 0;
}
#asset-list li span {
    flex: 1;
}
.reading {
    max-width: 760px;
}
.reading h3 {
    margin-top: 20px;
}
.dates {
    max-height: 300px;
    overflow: auto;
}
.gallery,
.library {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 13px;
}
.gallery img,
.gallery video,
.media-visual {
    width: 100%;
    max-height: 280px;
    object-fit: contain;
}
.gallery {
    margin: 15px 0;
}
.library .panel {
    margin: 0;
}
.media-visual {
    aspect-ratio: 1.4;
    object-fit: cover;
    background: #e6ebdf;
    border-radius: 9px;
    margin-bottom: 12px;
}
.badge {
    display: inline-flex;
    gap: 5px;
    align-items: center;
    padding: 3px 8px;
    font-size: 12px;
    border-radius: 6px;
    background: #e8eee5;
    color: #30523c;
}
.s-failed,
.s-uncertain {
    background: #fae1d8;
    color: #82382b;
}
.s-scheduled,
.s-queued {
    background: #e7e7f7;
    color: #48406d;
}
.s-working,
.s-waiting,
.s-paused,
.s-partial {
    background: #f8ead3;
    color: #7b542c;
}
.s-cancelled {
    background: #ededeb;
    color: #555;
}
.pager {
    justify-content: center;
    margin: 15px;
}
.cal {
    padding: 18px;
}
.calbar {
    flex-wrap: wrap;
    margin-bottom: 18px;
}
.calbar h2 {
    text-transform: capitalize;
}
.segments {
    display: flex;
    background: #eff2eb;
    padding: 3px;
    border-radius: 9px;
}
.segments a {
    padding: 6px 9px;
    font-size: 13px;
    color: var(--muted);
}
.segments .active {
    background: white;
    color: var(--ink);
    box-shadow: 0 1px 3px #1229151c;
}
.calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    border-left: 1px solid var(--line);
    border-top: 1px solid var(--line);
}
.calendar-grid.day {
    grid-template-columns: 1fr;
}
.weekday,
.day {
    border-right: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}
.weekday {
    font-size: 12px;
    background: var(--paper);
    font-weight: 600;
    padding: 7px;
    text-align: center;
    color: var(--muted);
}
.calendar-grid > .day {
    padding: 6px;
    min-height: 101px;
}
.week > .day {
    min-height: 270px;
}
.dayno {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    justify-content: center;
    padding: 2px 6px;
    border-radius: 6px;
    font-weight: 600;
    font-size: 13px;
    color: var(--ink);
    text-decoration: none;
}
.dayno small {
    display: none;
}
.outside {
    background: #f7f8f5;
}
.today .dayno {
    background: var(--pine);
    color: white;
}
.event {
    display: grid;
    gap: 3px;
    margin-top: 5px;
    text-decoration: none;
    font-size: 12px;
    border-radius: 6px;
    padding: 5px;
}
.event small {
    font-size: 10px;
    color: inherit;
}
.event img {
    width: 32px;
    height: 28px;
    border-radius: 4px;
    object-fit: cover;
}
.login {
    min-height: 100dvh;
    display: grid;
    align-items: center;
    padding: clamp(0px, 3vw, 50px);
    background: #efefe8;
}
.login-shell {
    max-width: 1370px;
    width: 100%;
    margin: auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: min(800px, 89dvh);
    background: #fafbf7;
    border: 1px solid #d7dfd4;
    border-radius: 22px;
    overflow: hidden;
    box-shadow: 0 16px 66px #243e2a0c;
}
.login-art {
    background: #123b30;
    color: white;
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: clamp(28px, 4vw, 67px);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.login-art::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    opacity: 0.26;
    background-image:
        linear-gradient(#72938144 1px, transparent 1px),
        linear-gradient(90deg, #72938144 1px, transparent 1px);
    background-size: 44px 44px;
}
.login-art .brand {
    font-size: 34px;
}
.art-caption {
    z-index: 2;
    margin-top: 285px;
}
.art-caption .overline {
    color: #d4e8bf;
}
.art-caption h1,
.quick h2 {
    font-family: Instrument, Georgia, serif;
}
.art-caption h1 {
    font-size: clamp(60px, 7.4vw, 112px);
    font-weight: 400;
    letter-spacing: -0.045em;
    line-height: 0.86;
    margin: 17px 0 22px;
}
.art-caption em {
    color: var(--lime);
    font-weight: 400;
}
.art-caption p {
    font-size: 13px;
    color: #d1dcd2;
}
.orbital {
    position: absolute;
    width: 78%;
    aspect-ratio: 1;
    top: 9%;
    left: 38%;
    transform: rotate(-25deg);
    z-index: -1;
}
.orbit {
    position: absolute;
    inset: 0;
    border: 1px solid #a5c0a0;
    border-radius: 50%;
    background: repeating-conic-gradient(
        from -8deg,
        transparent 0 0.75deg,
        #b1d58f80 0.75deg 1deg,
        transparent 1deg 4deg
    );
    mask: radial-gradient(circle, transparent 63%, #000 63%);
}
.o2 {
    inset: 7%;
    background: none;
    mask: none;
}
.o3 {
    inset: 20%;
    border: 12px solid #c1dd94;
    border-left-color: #669d74;
    border-bottom-color: #528569;
    mask: none;
    background: none;
}
.o4 {
    inset: 29%;
    mask: none;
    border-color: #98b68b;
    background: none;
}
.orb-dot {
    position: absolute;
    left: 1%;
    top: 33%;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: var(--lime);
    box-shadow: 0 0 0 5px #123b30;
}
.orb-date {
    position: absolute;
    inset: 32%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    transform: rotate(25deg);
    color: #dfedc9;
}
.orb-date small {
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.17em;
    color: #c5d9be;
}
.orb-date strong {
    line-height: 0.95;
    font:
        normal clamp(35px, 5vw, 78px)/1 Instrument,
        serif;
}
.login-form {
    display: grid;
    place-items: center;
    padding: clamp(24px, 4.7vw, 72px);
}
.login-inner {
    width: 100%;
    max-width: 386px;
}
.lock-tile {
    width: 47px;
    height: 47px;
    border-radius: 13px;
    margin-bottom: 24px;
    background: #e3ebdc;
}
.lock-tile img {
    width: 23px;
}
.login-form h2 {
    font-size: clamp(42px, 4.4vw, 66px);
}
.login-form .muted {
    margin: 11px 0 28px;
}
.login-form label {
    margin: 16px 0 0;
}
.login-form input {
    height: 47px;
}
.login-form .btn {
    margin-top: 22px;
}
.login-form details {
    margin-top: 24px;
}
.login-form details p {
    font-size: 13px;
}
.login-form summary {
    font-weight: 500;
    color: var(--muted);
}
[hidden] {
    display: none !important;
}
@media (max-height: 700px) and (min-width: 801px) {
    .sidebar {
        padding-top: 20px;
        overflow: auto;
    }
    .sidebar nav {
        margin-top: 15px;
        gap: 2px;
    }
    .sidebar nav a {
        padding: 8px 10px;
    }
    .sidebar hr {
        margin: 6px 0;
    }
    .sidefoot {
        padding-top: 10px;
    }
}
@media (max-width: 1050px) {
    .shell {
        grid-template-columns: 196px minmax(0, 1fr);
    }
    .sidebar {
        padding-left: 12px;
        padding-right: 12px;
    }
    .content {
        padding: 26px 20px;
    }
    .panel {
        padding: 18px;
    }
    .dashboard,
    .editor,
    .split {
        grid-template-columns: minmax(0, 1.5fr) minmax(220px, 1fr);
    }
    .metric {
        padding: 13px;
    }
    .metric strong {
        font-size: 31px;
    }
    .metric > img {
        width: 17px;
    }
}
@media (max-width: 800px) {
    .shell {
        display: block;
    }
    .sidebar {
        display: none;
        position: fixed;
        left: 0;
        top: 58px;
        bottom: 0;
        width: min(80vw, 280px);
        height: calc(100dvh - 58px);
        z-index: 10;
        box-shadow: 8px 10px 20px #123b3020;
        overflow: auto;
    }
    .sidebar.open {
        display: flex;
    }
    .topbar {
        height: 58px;
        justify-content: flex-start;
        padding: 0 14px;
    }
    .top-private {
        margin-left: auto;
    }
    .mobile-menu {
        display: inline-grid;
        place-items: center;
    }
    .mobile-menu img {
        width: 22px;
    }
    .dashboard,
    .editor,
    .split {
        grid-template-columns: 1fr;
    }
    .preview {
        position: static;
    }
    .lower {
        gap: 14px;
    }
    .metrics {
        gap: 8px;
    }
    .quick br {
        display: none;
    }
    .quick h2 {
        font-size: 34px;
    }
    .calendar-grid.week {
        grid-template-columns: 1fr;
    }
    .week .weekday {
        display: none;
    }
    .week > .day {
        min-height: 66px;
    }
    .week .dayno small,
    .calendar-grid.day .dayno small {
        display: inline;
    }
    .month .event small,
    .month .event img {
        display: none;
    }
    .cal {
        padding: 10px;
    }
    .calendar-grid > .day {
        min-height: 72px;
        padding: 3px;
    }
    .calbar h2 {
        font-size: 18px;
    }
    .event {
        font-size: 10px;
    }
    .split .panel + .panel {
        margin: 0;
    }
    .login-shell {
        min-height: 84dvh;
    }
    .orbital {
        width: 110%;
        left: 12%;
        top: 17%;
    }
}
@media (max-width: 580px) {
    .content {
        padding: 19px 14px 45px;
    }
    .topbar > span:first-of-type {
        font-size: 12px;
    }
    .top-private {
        font-size: 11px;
    }
    .metrics {
        grid-template-columns: 1fr 1fr;
    }
    .page-head {
        gap: 15px;
    }
    .page-head h1 {
        font-size: 39px;
    }
    .filters {
        gap: 8px;
        padding: 10px;
    }
    .filters label {
        flex: 1 1 40%;
    }
    .scope label {
        font-size: 12px;
    }
    .two {
        grid-template-columns: 1fr;
    }
    .panel {
        padding: 16px;
    }
    .chips {
        gap: 7px;
    }
    .login {
        padding: 0;
    }
    .login-shell {
        min-height: 100dvh;
        border: 0;
        border-radius: 0;
        display: flex;
        flex-direction: column;
    }
    .login-art {
        min-height: 180px;
        padding: 23px 24px;
    }
    .login-art .brand {
        font-size: 28px;
    }
    .art-caption {
        margin-top: 22px;
    }
    .art-caption .overline,
    .art-caption p,
    .art-caption br {
        display: none;
    }
    .art-caption h1 {
        font-size: 37px;
        margin: 0;
    }
    .art-caption h1 em::before {
        content: " ";
    }
    .orbital {
        width: 200px;
        left: auto;
        right: -30px;
        top: -25px;
    }
    .login-form {
        padding: 34px 24px;
    }
    .lock-tile {
        display: none;
    }
    .login-form h2 {
        font-size: 42px;
    }
    .row-item {
        align-items: flex-start;
        flex-wrap: wrap;
    }
    .cal {
        padding: 7px;
    }
    .calbar {
        gap: 8px;
    }
    .cal-nav {
        gap: 5px;
    }
    .calendar-grid > .day {
        min-height: 53px;
    }
    .dayno {
        font-size: 12px;
    }
    .segments a {
        padding: 5px 7px;
    }
    .calendar-grid.month .event {
        max-height: 40px;
        overflow: hidden;
    }
    .week-strip {
        gap: 1px;
    }
    .quick {
        padding: 19px;
    }
    .actions .btn {
        white-space: normal;
    }
    input:not([type="checkbox"]),
    select,
    textarea {
        font-size: 16px;
    }
}