/* [next]/internal/font/google/inter_dbdd7d5e.module.css [app-client] (css) */
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 100 900;
font-display: swap;
src: url("../media/2c55a0e60120577a-s.0-dom-5bn10r2.woff2") format("woff2");
unicode-range: U+460-52F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 100 900;
font-display: swap;
src: url("../media/9c72aa0f40e4eef8-s.1y4-pdgsjb-pw.woff2") format("woff2");
unicode-range: U+301, U+400-45F, U+490-491, U+4B0-4B1, U+2116;
}
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 100 900;
font-display: swap;
src: url("../media/ad66f9afd8947f86-s.3lvt2whj97whp.woff2") format("woff2");
unicode-range: U+1F??;
}
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 100 900;
font-display: swap;
src: url("../media/5476f68d60460930-s.2uwcyprjm3xu3.woff2") format("woff2");
unicode-range: U+370-377, U+37A-37F, U+384-38A, U+38C, U+38E-3A1, U+3A3-3FF;
}
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 100 900;
font-display: swap;
src: url("../media/2bbe8d2671613f1f-s.p.0k62hbripvv8p.woff2") format("woff2");
unicode-range: U+102-103, U+110-111, U+128-129, U+168-169, U+1A0-1A1, U+1AF-1B0, U+300-301, U+303-304, U+308-309, U+323, U+329, U+1EA0-1EF9, U+20AB;
}
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 100 900;
font-display: swap;
src: url("../media/1bffadaabf893a1e-s.3-6t-g6q0vh0a.woff2") format("woff2");
unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: Inter;
font-style: normal;
font-weight: 100 900;
font-display: swap;
src: url("../media/83afe278b6a6bb3c-s.p.2bn3s6zvc0dyp.woff2") format("woff2");
unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: Inter Fallback;
src: local(Arial);
ascent-override: 90.44%;
descent-override: 22.52%;
line-gap-override: 0.0%;
size-adjust: 107.12%;
}
.inter_dbdd7d5e-module__Jwifzq__className {
font-family: Inter, Inter Fallback;
font-style: normal;
}
.inter_dbdd7d5e-module__Jwifzq__variable {
--font-inter: "Inter", "Inter Fallback";
}
/* [next]/internal/font/google/jetbrains_mono_b623b980.module.css [app-client] (css) */
@font-face {
font-family: JetBrains Mono;
font-style: normal;
font-weight: 100 800;
font-display: swap;
src: url("../media/13bf9871fe164e7f-s.2f7nqdagzwx2-.woff2") format("woff2");
unicode-range: U+460-52F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
font-family: JetBrains Mono;
font-style: normal;
font-weight: 100 800;
font-display: swap;
src: url("../media/cc545e633e20c56d-s.176arc174-8zp.woff2") format("woff2");
unicode-range: U+301, U+400-45F, U+490-491, U+4B0-4B1, U+2116;
}
@font-face {
font-family: JetBrains Mono;
font-style: normal;
font-weight: 100 800;
font-display: swap;
src: url("../media/71b036adf157cdcf-s.0bp8oijd_gu96.woff2") format("woff2");
unicode-range: U+370-377, U+37A-37F, U+384-38A, U+38C, U+38E-3A1, U+3A3-3FF;
}
@font-face {
font-family: JetBrains Mono;
font-style: normal;
font-weight: 100 800;
font-display: swap;
src: url("../media/89b21bb081cb7469-s.1fby2rem9ngyr.woff2") format("woff2");
unicode-range: U+102-103, U+110-111, U+128-129, U+168-169, U+1A0-1A1, U+1AF-1B0, U+300-301, U+303-304, U+308-309, U+323, U+329, U+1EA0-1EF9, U+20AB;
}
@font-face {
font-family: JetBrains Mono;
font-style: normal;
font-weight: 100 800;
font-display: swap;
src: url("../media/3fe682a82f50d426-s.0vfdmo25voy_0.woff2") format("woff2");
unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: JetBrains Mono;
font-style: normal;
font-weight: 100 800;
font-display: swap;
src: url("../media/70bc3e132a0a741e-s.p.3t6q91iet4nsy.woff2") format("woff2");
unicode-range: U+??, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: JetBrains Mono Fallback;
src: local(Arial);
ascent-override: 75.79%;
descent-override: 22.29%;
line-gap-override: 0.0%;
size-adjust: 134.59%;
}
.jetbrains_mono_b623b980-module__35dYfa__className {
font-family: JetBrains Mono, JetBrains Mono Fallback;
font-style: normal;
}
.jetbrains_mono_b623b980-module__35dYfa__variable {
--font-jetbrains: "JetBrains Mono", "JetBrains Mono Fallback";
}
/* [project]/app/globals.css [app-client] (css) */
@layer properties {
@supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
*, :before, :after, ::backdrop {
--tw-rotate-x: initial;
--tw-rotate-y: initial;
--tw-rotate-z: initial;
--tw-skew-x: initial;
--tw-skew-y: initial;
--tw-space-y-reverse: 0;
--tw-divide-y-reverse: 0;
--tw-border-style: solid;
--tw-leading: initial;
--tw-font-weight: initial;
--tw-tracking: initial;
--tw-ordinal: initial;
--tw-slashed-zero: initial;
--tw-numeric-figure: initial;
--tw-numeric-spacing: initial;
--tw-numeric-fraction: initial;
--tw-shadow: 0 0 #0000;
--tw-shadow-color: initial;
--tw-shadow-alpha: 100%;
--tw-inset-shadow: 0 0 #0000;
--tw-inset-shadow-color: initial;
--tw-inset-shadow-alpha: 100%;
--tw-ring-color: initial;
--tw-ring-shadow: 0 0 #0000;
--tw-inset-ring-color: initial;
--tw-inset-ring-shadow: 0 0 #0000;
--tw-ring-inset: initial;
--tw-ring-offset-width: 0px;
--tw-ring-offset-color: #fff;
--tw-ring-offset-shadow: 0 0 #0000;
--tw-outline-style: solid;
--tw-blur: initial;
--tw-brightness: initial;
--tw-contrast: initial;
--tw-grayscale: initial;
--tw-hue-rotate: initial;
--tw-invert: initial;
--tw-opacity: initial;
--tw-saturate: initial;
--tw-sepia: initial;
--tw-drop-shadow: initial;
--tw-drop-shadow-color: initial;
--tw-drop-shadow-alpha: 100%;
--tw-drop-shadow-size: initial;
--tw-backdrop-blur: initial;
--tw-backdrop-brightness: initial;
--tw-backdrop-contrast: initial;
--tw-backdrop-grayscale: initial;
--tw-backdrop-hue-rotate: initial;
--tw-backdrop-invert: initial;
--tw-backdrop-opacity: initial;
--tw-backdrop-saturate: initial;
--tw-backdrop-sepia: initial;
--tw-ease: initial;
}
}
}
@layer theme {
:root, :host {
--font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
"Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
"Courier New", monospace;
--color-red-50: #fef2f2;
--color-red-100: #ffe2e2;
--color-red-200: #ffcaca;
--color-red-600: #e40014;
--color-orange-100: #ffedd5;
--color-orange-600: #f05100;
--color-green-100: #dcfce7;
--color-green-700: #008138;
--color-gray-100: #f3f4f6;
--color-gray-500: #6a7282;
--color-black: #000;
--color-white: #fff;
--spacing: .25rem;
--container-sm: 24rem;
--container-md: 28rem;
--container-lg: 32rem;
--container-2xl: 42rem;
--container-3xl: 48rem;
--container-4xl: 56rem;
--container-5xl: 64rem;
--text-xs: .75rem;
--text-xs--line-height: calc(1 / .75);
--text-sm: .875rem;
--text-sm--line-height: calc(1.25 / .875);
--text-base: 1rem;
--text-base--line-height: calc(1.5 / 1);
--text-lg: 1.125rem;
--text-lg--line-height: calc(1.75 / 1.125);
--text-xl: 1.25rem;
--text-xl--line-height: calc(1.75 / 1.25);
--text-2xl: 1.5rem;
--text-2xl--line-height: calc(2 / 1.5);
--text-3xl: 1.875rem;
--text-3xl--line-height: calc(2.25 / 1.875);
--text-4xl: 2.25rem;
--text-4xl--line-height: calc(2.5 / 2.25);
--font-weight-normal: 400;
--font-weight-medium: 500;
--font-weight-semibold: 600;
--font-weight-bold: 700;
--tracking-wide: .025em;
--leading-tight: 1.25;
--leading-snug: 1.375;
--leading-relaxed: 1.625;
--radius-sm: .25rem;
--radius-md: .375rem;
--radius-lg: .5rem;
--radius-xl: .75rem;
--shadow-sm: 0 1px 3px 0 #0000001a, 0 1px 2px -1px #0000001a;
--shadow-md: 0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;
--ease-out: cubic-bezier(0, 0, .2, 1);
--animate-spin: spin 1s linear infinite;
--animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;
--default-transition-duration: .15s;
--default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
--default-font-family: var(--font-sans);
--default-mono-font-family: var(--font-mono);
--color-co-hq: #1f2547;
--color-co-tm: #1d4ed8;
--color-co-rent: #b45309;
--color-co-svc: #047857;
--color-co-hq-soft: #eef0f6;
--color-co-tm-soft: #eaf0fc;
--color-co-rent-soft: #fbf1e2;
--color-co-svc-soft: #e3f3ec;
--color-bg: #f4f4ef;
--color-surface: #fff;
--color-surface-2: #fafaf7;
--color-ink: #0e1422;
--color-ink-2: #3f475a;
--color-muted: #8a92a3;
--color-line: #e7e6df;
--color-line-strong: #d6d4ca;
--color-brand: #2c2f7a;
--color-brand-2: #4046b5;
--color-accent: #c2410c;
--color-ok: #047857;
--color-warn: #b45309;
--color-err: #b91c1c;
--color-danger: #b91c1c;
--shadow-card-sm: 0 1px 0 #0f14220a, 0 1px 2px #0f14220a;
}
@supports (color: lab(0% 0 0)) {
:root, :host {
--color-red-50: lab(96.5005% 4.18511 1.52329);
--color-red-100: lab(92.243% 10.2865 3.83865);
--color-red-200: lab(86.017% 19.8815 7.75869);
--color-red-600: lab(48.4493% 77.4328 61.5452);
--color-orange-100: lab(94.7127% 3.58391 14.3151);
--color-orange-600: lab(57.1026% 64.2584 89.8886);
--color-green-100: lab(96.186% -13.8464 6.52362);
--color-green-700: lab(47.0329% -47.0239 31.4788);
--color-gray-100: lab(96.1596% -.082314 -1.13575);
--color-gray-500: lab(47.7841% -.393212 -10.0268);
}
}
}
@layer base {
*, :after, :before, ::backdrop {
box-sizing: border-box;
border: 0 solid;
margin: 0;
padding: 0;
}
::file-selector-button {
box-sizing: border-box;
border: 0 solid;
margin: 0;
padding: 0;
}
html, :host {
-webkit-text-size-adjust: 100%;
tab-size: 4;
line-height: 1.5;
font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
font-feature-settings: var(--default-font-feature-settings, normal);
font-variation-settings: var(--default-font-variation-settings, normal);
-webkit-tap-highlight-color: transparent;
}
hr {
height: 0;
color: inherit;
border-top-width: 1px;
}
abbr:where([title]) {
-webkit-text-decoration: underline dotted;
text-decoration: underline dotted;
}
h1, h2, h3, h4, h5, h6 {
font-size: inherit;
font-weight: inherit;
}
a {
color: inherit;
-webkit-text-decoration: inherit;
-webkit-text-decoration: inherit;
text-decoration: inherit;
}
b, strong {
font-weight: bolder;
}
code, kbd, samp, pre {
font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
font-feature-settings: var(--default-mono-font-feature-settings, normal);
font-variation-settings: var(--default-mono-font-variation-settings, normal);
font-size: 1em;
}
small {
font-size: 80%;
}
sub, sup {
vertical-align: baseline;
font-size: 75%;
line-height: 0;
position: relative;
}
sub {
bottom: -.25em;
}
sup {
top: -.5em;
}
table {
text-indent: 0;
border-color: inherit;
border-collapse: collapse;
}
:-moz-focusring {
outline: auto;
}
progress {
vertical-align: baseline;
}
summary {
display: list-item;
}
ol, ul, menu {
list-style: none;
}
img, svg, video, canvas, audio, iframe, embed, object {
vertical-align: middle;
display: block;
}
img, video {
max-width: 100%;
height: auto;
}
button, input, select, optgroup, textarea {
font: inherit;
font-feature-settings: inherit;
font-variation-settings: inherit;
letter-spacing: inherit;
color: inherit;
opacity: 1;
background-color: #0000;
border-radius: 0;
}
::file-selector-button {
font: inherit;
font-feature-settings: inherit;
font-variation-settings: inherit;
letter-spacing: inherit;
color: inherit;
opacity: 1;
background-color: #0000;
border-radius: 0;
}
:where(select:is([multiple], [size])) optgroup {
font-weight: bolder;
}
:where(select:is([multiple], [size])) optgroup option {
padding-inline-start: 20px;
}
::file-selector-button {
margin-inline-end: 4px;
}
::placeholder {
opacity: 1;
}
@supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size: 1px) {
::placeholder {
color: currentColor;
}
@supports (color: color-mix(in lab, red, red)) {
::placeholder {
color: color-mix(in oklab, currentcolor 50%, transparent);
}
}
}
textarea {
resize: vertical;
}
::-webkit-search-decoration {
-webkit-appearance: none;
}
::-webkit-date-and-time-value {
min-height: 1lh;
text-align: inherit;
}
::-webkit-datetime-edit {
display: inline-flex;
}
::-webkit-datetime-edit-fields-wrapper {
padding: 0;
}
::-webkit-datetime-edit {
padding-block: 0;
}
::-webkit-datetime-edit-year-field {
padding-block: 0;
}
::-webkit-datetime-edit-month-field {
padding-block: 0;
}
::-webkit-datetime-edit-day-field {
padding-block: 0;
}
::-webkit-datetime-edit-hour-field {
padding-block: 0;
}
::-webkit-datetime-edit-minute-field {
padding-block: 0;
}
::-webkit-datetime-edit-second-field {
padding-block: 0;
}
::-webkit-datetime-edit-millisecond-field {
padding-block: 0;
}
::-webkit-datetime-edit-meridiem-field {
padding-block: 0;
}
::-webkit-calendar-picker-indicator {
line-height: 1;
}
:-moz-ui-invalid {
box-shadow: none;
}
button, input:where([type="button"], [type="reset"], [type="submit"]) {
appearance: button;
}
::file-selector-button {
appearance: button;
}
::-webkit-inner-spin-button {
height: auto;
}
::-webkit-outer-spin-button {
height: auto;
}
[hidden]:where(:not([hidden="until-found"])) {
display: none !important;
}
button {
font: inherit;
color: inherit;
}
a {
color: inherit;
}
}
@layer components;
@layer utilities {
.pointer-events-auto {
pointer-events: auto;
}
.pointer-events-none {
pointer-events: none;
}
.collapse {
visibility: collapse;
}
.visible {
visibility: visible;
}
.absolute {
position: absolute;
}
.fixed {
position: fixed;
}
.relative {
position: relative;
}
.sticky {
position: sticky;
}
.inset-0 {
inset: calc(var(--spacing) * 0);
}
.inset-x-0 {
inset-inline: calc(var(--spacing) * 0);
}
.inset-y-0 {
inset-block: calc(var(--spacing) * 0);
}
.top-0 {
top: calc(var(--spacing) * 0);
}
.top-0\.5 {
top: calc(var(--spacing) * .5);
}
.right-0 {
right: calc(var(--spacing) * 0);
}
.right-4 {
right: calc(var(--spacing) * 4);
}
.bottom-3 {
bottom: calc(var(--spacing) * 3);
}
.bottom-4 {
bottom: calc(var(--spacing) * 4);
}
.left-0 {
left: calc(var(--spacing) * 0);
}
.left-0\.5 {
left: calc(var(--spacing) * .5);
}
.left-\[18px\] {
left: 18px;
}
.z-10 {
z-index: 10;
}
.z-40 {
z-index: 40;
}
.z-50 {
z-index: 50;
}
.z-\[60\] {
z-index: 60;
}
.z-\[100\] {
z-index: 100;
}
.z-\[120\] {
z-index: 120;
}
.col-span-1 {
grid-column: span 1 / span 1;
}
.col-span-2 {
grid-column: span 2 / span 2;
}
.container {
width: 100%;
}
@media (min-width: 40rem) {
.container {
max-width: 40rem;
}
}
@media (min-width: 48rem) {
.container {
max-width: 48rem;
}
}
@media (min-width: 64rem) {
.container {
max-width: 64rem;
}
}
@media (min-width: 80rem) {
.container {
max-width: 80rem;
}
}
@media (min-width: 96rem) {
.container {
max-width: 96rem;
}
}
.m-auto {
margin: auto;
}
.-mx-4 {
margin-inline: calc(var(--spacing) * -4);
}
.mx-1 {
margin-inline: calc(var(--spacing) * 1);
}
.mx-4 {
margin-inline: calc(var(--spacing) * 4);
}
.mx-auto {
margin-inline: auto;
}
.my-0\.5 {
margin-block: calc(var(--spacing) * .5);
}
.-mt-1 {
margin-top: calc(var(--spacing) * -1);
}
.mt-0\.5 {
margin-top: calc(var(--spacing) * .5);
}
.mt-1 {
margin-top: calc(var(--spacing) * 1);
}
.mt-1\.5 {
margin-top: calc(var(--spacing) * 1.5);
}
.mt-2 {
margin-top: calc(var(--spacing) * 2);
}
.mt-3 {
margin-top: calc(var(--spacing) * 3);
}
.mt-4 {
margin-top: calc(var(--spacing) * 4);
}
.mt-6 {
margin-top: calc(var(--spacing) * 6);
}
.mt-8 {
margin-top: calc(var(--spacing) * 8);
}
.-mr-1 {
margin-right: calc(var(--spacing) * -1);
}
.mr-1 {
margin-right: calc(var(--spacing) * 1);
}
.mr-2 {
margin-right: calc(var(--spacing) * 2);
}
.mr-3 {
margin-right: calc(var(--spacing) * 3);
}
.mr-4 {
margin-right: calc(var(--spacing) * 4);
}
.-mb-px {
margin-bottom: -1px;
}
.mb-0\.5 {
margin-bottom: calc(var(--spacing) * .5);
}
.mb-1 {
margin-bottom: calc(var(--spacing) * 1);
}
.mb-1\.5 {
margin-bottom: calc(var(--spacing) * 1.5);
}
.mb-2 {
margin-bottom: calc(var(--spacing) * 2);
}
.mb-3 {
margin-bottom: calc(var(--spacing) * 3);
}
.mb-4 {
margin-bottom: calc(var(--spacing) * 4);
}
.mb-5 {
margin-bottom: calc(var(--spacing) * 5);
}
.ml-0\.5 {
margin-left: calc(var(--spacing) * .5);
}
.ml-1 {
margin-left: calc(var(--spacing) * 1);
}
.ml-1\.5 {
margin-left: calc(var(--spacing) * 1.5);
}
.ml-2 {
margin-left: calc(var(--spacing) * 2);
}
.ml-4 {
margin-left: calc(var(--spacing) * 4);
}
.ml-auto {
margin-left: auto;
}
.line-clamp-1 {
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
display: -webkit-box;
overflow: hidden;
}
.line-clamp-2 {
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
display: -webkit-box;
overflow: hidden;
}
.block {
display: block;
}
.flex {
display: flex;
}
.grid {
display: grid;
}
.hidden {
display: none;
}
.inline {
display: inline;
}
.inline-block {
display: inline-block;
}
.inline-flex {
display: inline-flex;
}
.table {
display: table;
}
.size-1\.5 {
width: calc(var(--spacing) * 1.5);
height: calc(var(--spacing) * 1.5);
}
.size-2\.5 {
width: calc(var(--spacing) * 2.5);
height: calc(var(--spacing) * 2.5);
}
.size-7 {
width: calc(var(--spacing) * 7);
height: calc(var(--spacing) * 7);
}
.size-24 {
width: calc(var(--spacing) * 24);
height: calc(var(--spacing) * 24);
}
.size-32 {
width: calc(var(--spacing) * 32);
height: calc(var(--spacing) * 32);
}
.h-0\.5 {
height: calc(var(--spacing) * .5);
}
.h-1 {
height: calc(var(--spacing) * 1);
}
.h-1\.5 {
height: calc(var(--spacing) * 1.5);
}
.h-2 {
height: calc(var(--spacing) * 2);
}
.h-2\.5 {
height: calc(var(--spacing) * 2.5);
}
.h-3 {
height: calc(var(--spacing) * 3);
}
.h-3\.5 {
height: calc(var(--spacing) * 3.5);
}
.h-4 {
height: calc(var(--spacing) * 4);
}
.h-5 {
height: calc(var(--spacing) * 5);
}
.h-6 {
height: calc(var(--spacing) * 6);
}
.h-7 {
height: calc(var(--spacing) * 7);
}
.h-9 {
height: calc(var(--spacing) * 9);
}
.h-12 {
height: calc(var(--spacing) * 12);
}
.h-16 {
height: calc(var(--spacing) * 16);
}
.h-20 {
height: calc(var(--spacing) * 20);
}
.h-24 {
height: calc(var(--spacing) * 24);
}
.h-28 {
height: calc(var(--spacing) * 28);
}
.h-32 {
height: calc(var(--spacing) * 32);
}
.h-64 {
height: calc(var(--spacing) * 64);
}
.h-\[70vh\] {
height: 70vh;
}
.h-\[340px\] {
height: 340px;
}
.h-full {
height: 100%;
}
.h-px {
height: 1px;
}
.max-h-52 {
max-height: calc(var(--spacing) * 52);
}
.max-h-60 {
max-height: calc(var(--spacing) * 60);
}
.max-h-\[70vh\] {
max-height: 70vh;
}
.max-h-\[calc\(100vh-2rem\)\] {
max-height: calc(100vh - 2rem);
}
.max-h-screen {
max-height: 100vh;
}
.min-h-0 {
min-height: calc(var(--spacing) * 0);
}
.min-h-20 {
min-height: calc(var(--spacing) * 20);
}
.min-h-\[22px\] {
min-height: 22px;
}
.min-h-\[60vh\] {
min-height: 60vh;
}
.min-h-\[64px\] {
min-height: 64px;
}
.min-h-\[72px\] {
min-height: 72px;
}
.min-h-\[120px\] {
min-height: 120px;
}
.min-h-full {
min-height: 100%;
}
.min-h-screen {
min-height: 100vh;
}
.w-1\.5 {
width: calc(var(--spacing) * 1.5);
}
.w-2 {
width: calc(var(--spacing) * 2);
}
.w-2\.5 {
width: calc(var(--spacing) * 2.5);
}
.w-3 {
width: calc(var(--spacing) * 3);
}
.w-3\.5 {
width: calc(var(--spacing) * 3.5);
}
.w-4 {
width: calc(var(--spacing) * 4);
}
.w-5 {
width: calc(var(--spacing) * 5);
}
.w-6 {
width: calc(var(--spacing) * 6);
}
.w-7 {
width: calc(var(--spacing) * 7);
}
.w-8 {
width: calc(var(--spacing) * 8);
}
.w-9 {
width: calc(var(--spacing) * 9);
}
.w-10 {
width: calc(var(--spacing) * 10);
}
.w-14 {
width: calc(var(--spacing) * 14);
}
.w-16 {
width: calc(var(--spacing) * 16);
}
.w-20 {
width: calc(var(--spacing) * 20);
}
.w-24 {
width: calc(var(--spacing) * 24);
}
.w-28 {
width: calc(var(--spacing) * 28);
}
.w-32 {
width: calc(var(--spacing) * 32);
}
.w-36 {
width: calc(var(--spacing) * 36);
}
.w-40 {
width: calc(var(--spacing) * 40);
}
.w-44 {
width: calc(var(--spacing) * 44);
}
.w-48 {
width: calc(var(--spacing) * 48);
}
.w-56 {
width: calc(var(--spacing) * 56);
}
.w-64 {
width: calc(var(--spacing) * 64);
}
.w-72 {
width: calc(var(--spacing) * 72);
}
.w-80 {
width: calc(var(--spacing) * 80);
}
.w-96 {
width: calc(var(--spacing) * 96);
}
.w-\[260px\] {
width: 260px;
}
.w-\[720px\] {
width: 720px;
}
.w-\[900px\] {
width: 900px;
}
.w-fit {
width: fit-content;
}
.w-full {
width: 100%;
}
.w-px {
width: 1px;
}
.max-w-2xl {
max-width: var(--container-2xl);
}
.max-w-3xl {
max-width: var(--container-3xl);
}
.max-w-4xl {
max-width: var(--container-4xl);
}
.max-w-5xl {
max-width: var(--container-5xl);
}
.max-w-\[82\%\] {
max-width: 82%;
}
.max-w-\[96vw\] {
max-width: 96vw;
}
.max-w-\[120px\] {
max-width: 120px;
}
.max-w-\[160px\] {
max-width: 160px;
}
.max-w-\[220px\] {
max-width: 220px;
}
.max-w-\[280px\] {
max-width: 280px;
}
.max-w-\[420px\] {
max-width: 420px;
}
.max-w-\[560px\] {
max-width: 560px;
}
.max-w-lg {
max-width: var(--container-lg);
}
.max-w-md {
max-width: var(--container-md);
}
.max-w-sm {
max-width: var(--container-sm);
}
.min-w-0 {
min-width: calc(var(--spacing) * 0);
}
.min-w-\[22px\] {
min-width: 22px;
}
.min-w-\[26px\] {
min-width: 26px;
}
.min-w-\[80px\] {
min-width: 80px;
}
.min-w-\[96px\] {
min-width: 96px;
}
.min-w-\[110px\] {
min-width: 110px;
}
.min-w-\[120px\] {
min-width: 120px;
}
.min-w-\[130px\] {
min-width: 130px;
}
.min-w-\[140px\] {
min-width: 140px;
}
.min-w-\[168px\] {
min-width: 168px;
}
.min-w-\[170px\] {
min-width: 170px;
}
.min-w-\[180px\] {
min-width: 180px;
}
.min-w-\[190px\] {
min-width: 190px;
}
.min-w-\[200px\] {
min-width: 200px;
}
.min-w-\[220px\] {
min-width: 220px;
}
.min-w-\[260px\] {
min-width: 260px;
}
.min-w-\[270px\] {
min-width: 270px;
}
.min-w-\[700px\] {
min-width: 700px;
}
.min-w-\[1180px\] {
min-width: 1180px;
}
.flex-1 {
flex: 1;
}
.flex-shrink {
flex-shrink: 1;
}
.flex-shrink-0, .shrink-0 {
flex-shrink: 0;
}
.grow {
flex-grow: 1;
}
.border-collapse {
border-collapse: collapse;
}
.transform {
transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
}
.animate-pulse {
animation: var(--animate-pulse);
}
.animate-spin {
animation: var(--animate-spin);
}
.cursor-grab {
cursor: grab;
}
.cursor-not-allowed {
cursor: not-allowed;
}
.cursor-pointer {
cursor: pointer;
}
.resize {
resize: both;
}
.resize-none {
resize: none;
}
.resize-y {
resize: vertical;
}
.list-inside {
list-style-position: inside;
}
.list-disc {
list-style-type: disc;
}
.grid-cols-1 {
grid-template-columns: repeat(1, minmax(0, 1fr));
}
.grid-cols-2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.grid-cols-3 {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.grid-cols-4 {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.grid-cols-\[1\.2fr_1fr_1fr_auto\] {
grid-template-columns: 1.2fr 1fr 1fr auto;
}
.grid-cols-\[1fr_1\.2fr_1fr_1fr_auto\] {
grid-template-columns: 1fr 1.2fr 1fr 1fr auto;
}
.grid-cols-\[1fr_110px_1fr_24px\] {
grid-template-columns: 1fr 110px 1fr 24px;
}
.grid-cols-\[1fr_auto\] {
grid-template-columns: 1fr auto;
}
.grid-cols-\[28px_minmax\(0\,1\.6fr\)_84px_136px_84px_84px_minmax\(0\,1fr\)_24px\] {
grid-template-columns: 28px minmax(0, 1.6fr) 84px 136px 84px 84px minmax(0, 1fr) 24px;
}
.grid-cols-\[40px_1fr_70px_110px_24px\] {
grid-template-columns: 40px 1fr 70px 110px 24px;
}
.grid-cols-\[44px_130px_140px_minmax\(0\,1\.2fr\)_minmax\(0\,1\.4fr\)_24px\] {
grid-template-columns: 44px 130px 140px minmax(0, 1.2fr) minmax(0, 1.4fr) 24px;
}
.grid-cols-\[minmax\(0\,1\.4fr\)_118px_84px_84px_minmax\(0\,1\.3fr\)_24px\] {
grid-template-columns: minmax(0, 1.4fr) 118px 84px 84px minmax(0, 1.3fr) 24px;
}
.grid-cols-\[minmax\(0\,1\.4fr\)_140px_minmax\(0\,1\.4fr\)_24px\] {
grid-template-columns: minmax(0, 1.4fr) 140px minmax(0, 1.4fr) 24px;
}
.grid-cols-\[minmax\(0\,1\.6fr\)_110px_72px_64px_80px_110px_90px_24px\] {
grid-template-columns: minmax(0, 1.6fr) 110px 72px 64px 80px 110px 90px 24px;
}
.flex-col {
flex-direction: column;
}
.flex-col-reverse {
flex-direction: column-reverse;
}
.flex-wrap {
flex-wrap: wrap;
}
.place-items-center {
place-items: center;
}
.items-center {
align-items: center;
}
.items-end {
align-items: flex-end;
}
.items-start {
align-items: flex-start;
}
.justify-between {
justify-content: space-between;
}
.justify-center {
justify-content: center;
}
.justify-end {
justify-content: flex-end;
}
.justify-start {
justify-content: flex-start;
}
.gap-0 {
gap: calc(var(--spacing) * 0);
}
.gap-0\.5 {
gap: calc(var(--spacing) * .5);
}
.gap-1 {
gap: calc(var(--spacing) * 1);
}
.gap-1\.5 {
gap: calc(var(--spacing) * 1.5);
}
.gap-2 {
gap: calc(var(--spacing) * 2);
}
.gap-2\.5 {
gap: calc(var(--spacing) * 2.5);
}
.gap-3 {
gap: calc(var(--spacing) * 3);
}
.gap-4 {
gap: calc(var(--spacing) * 4);
}
.gap-5 {
gap: calc(var(--spacing) * 5);
}
.gap-6 {
gap: calc(var(--spacing) * 6);
}
:where(.space-y-0\.5 > :not(:last-child)) {
--tw-space-y-reverse: 0;
margin-block-start: calc(calc(var(--spacing) * .5) * var(--tw-space-y-reverse));
margin-block-end: calc(calc(var(--spacing) * .5) * calc(1 - var(--tw-space-y-reverse)));
}
:where(.space-y-1 > :not(:last-child)) {
--tw-space-y-reverse: 0;
margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));
margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));
}
:where(.space-y-3 > :not(:last-child)) {
--tw-space-y-reverse: 0;
margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
}
:where(.space-y-4 > :not(:last-child)) {
--tw-space-y-reverse: 0;
margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));
margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));
}
:where(.space-y-10 > :not(:last-child)) {
--tw-space-y-reverse: 0;
margin-block-start: calc(calc(var(--spacing) * 10) * var(--tw-space-y-reverse));
margin-block-end: calc(calc(var(--spacing) * 10) * calc(1 - var(--tw-space-y-reverse)));
}
.gap-x-4 {
column-gap: calc(var(--spacing) * 4);
}
.gap-x-6 {
column-gap: calc(var(--spacing) * 6);
}
.gap-y-1\.5 {
row-gap: calc(var(--spacing) * 1.5);
}
.gap-y-2 {
row-gap: calc(var(--spacing) * 2);
}
.gap-y-3 {
row-gap: calc(var(--spacing) * 3);
}
:where(.divide-y > :not(:last-child)) {
--tw-divide-y-reverse: 0;
border-bottom-style: var(--tw-border-style);
border-top-style: var(--tw-border-style);
border-top-width: calc(1px * var(--tw-divide-y-reverse));
border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
}
:where(.divide-line > :not(:last-child)) {
border-color: var(--color-line);
}
.self-end {
align-self: flex-end;
}
.self-start {
align-self: flex-start;
}
.truncate {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.overflow-hidden {
overflow: hidden;
}
.overflow-x-auto {
overflow-x: auto;
}
.overflow-y-auto {
overflow-y: auto;
}
.rounded {
border-radius: .25rem;
}
.rounded-full {
border-radius: 3.40282e38px;
}
.rounded-lg {
border-radius: var(--radius-lg);
}
.rounded-md {
border-radius: var(--radius-md);
}
.rounded-none {
border-radius: 0;
}
.rounded-sm {
border-radius: var(--radius-sm);
}
.rounded-xl {
border-radius: var(--radius-xl);
}
.border {
border-style: var(--tw-border-style);
border-width: 1px;
}
.border-0 {
border-style: var(--tw-border-style);
border-width: 0;
}
.border-2 {
border-style: var(--tw-border-style);
border-width: 2px;
}
.border-y {
border-block-style: var(--tw-border-style);
border-block-width: 1px;
}
.border-t {
border-top-style: var(--tw-border-style);
border-top-width: 1px;
}
.border-t-2 {
border-top-style: var(--tw-border-style);
border-top-width: 2px;
}
.border-b {
border-bottom-style: var(--tw-border-style);
border-bottom-width: 1px;
}
.border-b-2 {
border-bottom-style: var(--tw-border-style);
border-bottom-width: 2px;
}
.border-l {
border-left-style: var(--tw-border-style);
border-left-width: 1px;
}
.border-l-\[3px\] {
border-left-style: var(--tw-border-style);
border-left-width: 3px;
}
.border-dashed {
--tw-border-style: dashed;
border-style: dashed;
}
.border-accent\/25 {
border-color: #c2410c40;
}
@supports (color: color-mix(in lab, red, red)) {
.border-accent\/25 {
border-color: color-mix(in oklab, var(--color-accent) 25%, transparent);
}
}
.border-brand {
border-color: var(--color-brand);
}
.border-brand\/20 {
border-color: #2c2f7a33;
}
@supports (color: color-mix(in lab, red, red)) {
.border-brand\/20 {
border-color: color-mix(in oklab, var(--color-brand) 20%, transparent);
}
}
.border-brand\/30 {
border-color: #2c2f7a4d;
}
@supports (color: color-mix(in lab, red, red)) {
.border-brand\/30 {
border-color: color-mix(in oklab, var(--color-brand) 30%, transparent);
}
}
.border-co-hq\/20 {
border-color: #1f254733;
}
@supports (color: color-mix(in lab, red, red)) {
.border-co-hq\/20 {
border-color: color-mix(in oklab, var(--color-co-hq) 20%, transparent);
}
}
.border-co-rent\/20 {
border-color: #b4530933;
}
@supports (color: color-mix(in lab, red, red)) {
.border-co-rent\/20 {
border-color: color-mix(in oklab, var(--color-co-rent) 20%, transparent);
}
}
.border-co-rent\/25 {
border-color: #b4530940;
}
@supports (color: color-mix(in lab, red, red)) {
.border-co-rent\/25 {
border-color: color-mix(in oklab, var(--color-co-rent) 25%, transparent);
}
}
.border-co-rent\/30 {
border-color: #b453094d;
}
@supports (color: color-mix(in lab, red, red)) {
.border-co-rent\/30 {
border-color: color-mix(in oklab, var(--color-co-rent) 30%, transparent);
}
}
.border-co-svc\/20 {
border-color: #04785733;
}
@supports (color: color-mix(in lab, red, red)) {
.border-co-svc\/20 {
border-color: color-mix(in oklab, var(--color-co-svc) 20%, transparent);
}
}
.border-co-svc\/25 {
border-color: #04785740;
}
@supports (color: color-mix(in lab, red, red)) {
.border-co-svc\/25 {
border-color: color-mix(in oklab, var(--color-co-svc) 25%, transparent);
}
}
.border-co-svc\/30 {
border-color: #0478574d;
}
@supports (color: color-mix(in lab, red, red)) {
.border-co-svc\/30 {
border-color: color-mix(in oklab, var(--color-co-svc) 30%, transparent);
}
}
.border-co-tm\/20 {
border-color: #1d4ed833;
}
@supports (color: color-mix(in lab, red, red)) {
.border-co-tm\/20 {
border-color: color-mix(in oklab, var(--color-co-tm) 20%, transparent);
}
}
.border-co-tm\/25 {
border-color: #1d4ed840;
}
@supports (color: color-mix(in lab, red, red)) {
.border-co-tm\/25 {
border-color: color-mix(in oklab, var(--color-co-tm) 25%, transparent);
}
}
.border-danger {
border-color: var(--color-danger);
}
.border-danger\/20 {
border-color: #b91c1c33;
}
@supports (color: color-mix(in lab, red, red)) {
.border-danger\/20 {
border-color: color-mix(in oklab, var(--color-danger) 20%, transparent);
}
}
.border-danger\/30 {
border-color: #b91c1c4d;
}
@supports (color: color-mix(in lab, red, red)) {
.border-danger\/30 {
border-color: color-mix(in oklab, var(--color-danger) 30%, transparent);
}
}
.border-err {
border-color: var(--color-err);
}
.border-err\/30 {
border-color: #b91c1c4d;
}
@supports (color: color-mix(in lab, red, red)) {
.border-err\/30 {
border-color: color-mix(in oklab, var(--color-err) 30%, transparent);
}
}
.border-line {
border-color: var(--color-line);
}
.border-line-strong {
border-color: var(--color-line-strong);
}
.border-line\/60 {
border-color: #e7e6df99;
}
@supports (color: color-mix(in lab, red, red)) {
.border-line\/60 {
border-color: color-mix(in oklab, var(--color-line) 60%, transparent);
}
}
.border-ok\/30 {
border-color: #0478574d;
}
@supports (color: color-mix(in lab, red, red)) {
.border-ok\/30 {
border-color: color-mix(in oklab, var(--color-ok) 30%, transparent);
}
}
.border-red-200 {
border-color: var(--color-red-200);
}
.border-transparent {
border-color: #0000;
}
.border-warn {
border-color: var(--color-warn);
}
.border-warn\/30 {
border-color: #b453094d;
}
@supports (color: color-mix(in lab, red, red)) {
.border-warn\/30 {
border-color: color-mix(in oklab, var(--color-warn) 30%, transparent);
}
}
.border-l-brand {
border-left-color: var(--color-brand);
}
.border-l-co-hq {
border-left-color: var(--color-co-hq);
}
.border-l-co-rent {
border-left-color: var(--color-co-rent);
}
.border-l-co-svc {
border-left-color: var(--color-co-svc);
}
.border-l-co-tm {
border-left-color: var(--color-co-tm);
}
.\!bg-line {
background-color: var(--color-line) !important;
}
.bg-accent\/10 {
background-color: #c2410c1a;
}
@supports (color: color-mix(in lab, red, red)) {
.bg-accent\/10 {
background-color: color-mix(in oklab, var(--color-accent) 10%, transparent);
}
}
.bg-bg {
background-color: var(--color-bg);
}
.bg-black\/30 {
background-color: #0000004d;
}
@supports (color: color-mix(in lab, red, red)) {
.bg-black\/30 {
background-color: color-mix(in oklab, var(--color-black) 30%, transparent);
}
}
.bg-black\/40 {
background-color: #0006;
}
@supports (color: color-mix(in lab, red, red)) {
.bg-black\/40 {
background-color: color-mix(in oklab, var(--color-black) 40%, transparent);
}
}
.bg-brand {
background-color: var(--color-brand);
}
.bg-brand\/5 {
background-color: #2c2f7a0d;
}
@supports (color: color-mix(in lab, red, red)) {
.bg-brand\/5 {
background-color: color-mix(in oklab, var(--color-brand) 5%, transparent);
}
}
.bg-brand\/10 {
background-color: #2c2f7a1a;
}
@supports (color: color-mix(in lab, red, red)) {
.bg-brand\/10 {
background-color: color-mix(in oklab, var(--color-brand) 10%, transparent);
}
}
.bg-co-hq {
background-color: var(--color-co-hq);
}
.bg-co-hq-soft {
background-color: var(--color-co-hq-soft);
}
.bg-co-rent {
background-color: var(--color-co-rent);
}
.bg-co-rent-soft {
background-color: var(--color-co-rent-soft);
}
.bg-co-rent\/5 {
background-color: #b453090d;
}
@supports (color: color-mix(in lab, red, red)) {
.bg-co-rent\/5 {
background-color: color-mix(in oklab, var(--color-co-rent) 5%, transparent);
}
}
.bg-co-svc {
background-color: var(--color-co-svc);
}
.bg-co-svc-soft {
background-color: var(--color-co-svc-soft);
}
.bg-co-svc-soft\/40 {
background-color: #e3f3ec66;
}
@supports (color: color-mix(in lab, red, red)) {
.bg-co-svc-soft\/40 {
background-color: color-mix(in oklab, var(--color-co-svc-soft) 40%, transparent);
}
}
.bg-co-tm {
background-color: var(--color-co-tm);
}
.bg-co-tm-soft {
background-color: var(--color-co-tm-soft);
}
.bg-current {
background-color: currentColor;
}
.bg-danger {
background-color: var(--color-danger);
}
.bg-danger\/5 {
background-color: #b91c1c0d;
}
@supports (color: color-mix(in lab, red, red)) {
.bg-danger\/5 {
background-color: color-mix(in oklab, var(--color-danger) 5%, transparent);
}
}
.bg-danger\/10 {
background-color: #b91c1c1a;
}
@supports (color: color-mix(in lab, red, red)) {
.bg-danger\/10 {
background-color: color-mix(in oklab, var(--color-danger) 10%, transparent);
}
}
.bg-err {
background-color: var(--color-err);
}
.bg-err\/5 {
background-color: #b91c1c0d;
}
@supports (color: color-mix(in lab, red, red)) {
.bg-err\/5 {
background-color: color-mix(in oklab, var(--color-err) 5%, transparent);
}
}
.bg-err\/10 {
background-color: #b91c1c1a;
}
@supports (color: color-mix(in lab, red, red)) {
.bg-err\/10 {
background-color: color-mix(in oklab, var(--color-err) 10%, transparent);
}
}
.bg-gray-100 {
background-color: var(--color-gray-100);
}
.bg-green-100 {
background-color: var(--color-green-100);
}
.bg-ink {
background-color: var(--color-ink);
}
.bg-line {
background-color: var(--color-line);
}
.bg-muted {
background-color: var(--color-muted);
}
.bg-muted\/10 {
background-color: #8a92a31a;
}
@supports (color: color-mix(in lab, red, red)) {
.bg-muted\/10 {
background-color: color-mix(in oklab, var(--color-muted) 10%, transparent);
}
}
.bg-ok {
background-color: var(--color-ok);
}
.bg-ok\/5 {
background-color: #0478570d;
}
@supports (color: color-mix(in lab, red, red)) {
.bg-ok\/5 {
background-color: color-mix(in oklab, var(--color-ok) 5%, transparent);
}
}
.bg-ok\/10 {
background-color: #0478571a;
}
@supports (color: color-mix(in lab, red, red)) {
.bg-ok\/10 {
background-color: color-mix(in oklab, var(--color-ok) 10%, transparent);
}
}
.bg-orange-100 {
background-color: var(--color-orange-100);
}
.bg-red-50 {
background-color: var(--color-red-50);
}
.bg-red-100 {
background-color: var(--color-red-100);
}
.bg-surface {
background-color: var(--color-surface);
}
.bg-surface-2 {
background-color: var(--color-surface-2);
}
.bg-surface-2\/60 {
background-color: #fafaf799;
}
@supports (color: color-mix(in lab, red, red)) {
.bg-surface-2\/60 {
background-color: color-mix(in oklab, var(--color-surface-2) 60%, transparent);
}
}
.bg-transparent {
background-color: #0000;
}
.bg-warn {
background-color: var(--color-warn);
}
.bg-warn\/5 {
background-color: #b453090d;
}
@supports (color: color-mix(in lab, red, red)) {
.bg-warn\/5 {
background-color: color-mix(in oklab, var(--color-warn) 5%, transparent);
}
}
.bg-warn\/10 {
background-color: #b453091a;
}
@supports (color: color-mix(in lab, red, red)) {
.bg-warn\/10 {
background-color: color-mix(in oklab, var(--color-warn) 10%, transparent);
}
}
.bg-warn\/15 {
background-color: #b4530926;
}
@supports (color: color-mix(in lab, red, red)) {
.bg-warn\/15 {
background-color: color-mix(in oklab, var(--color-warn) 15%, transparent);
}
}
.bg-warn\/20 {
background-color: #b4530933;
}
@supports (color: color-mix(in lab, red, red)) {
.bg-warn\/20 {
background-color: color-mix(in oklab, var(--color-warn) 20%, transparent);
}
}
.bg-white {
background-color: var(--color-white);
}
.bg-white\/10 {
background-color: #ffffff1a;
}
@supports (color: color-mix(in lab, red, red)) {
.bg-white\/10 {
background-color: color-mix(in oklab, var(--color-white) 10%, transparent);
}
}
.object-contain {
object-fit: contain;
}
.object-cover {
object-fit: cover;
}
.p-0\.5 {
padding: calc(var(--spacing) * .5);
}
.p-1 {
padding: calc(var(--spacing) * 1);
}
.p-1\.5 {
padding: calc(var(--spacing) * 1.5);
}
.p-2 {
padding: calc(var(--spacing) * 2);
}
.p-2\.5 {
padding: calc(var(--spacing) * 2.5);
}
.p-3 {
padding: calc(var(--spacing) * 3);
}
.p-3\.5 {
padding: calc(var(--spacing) * 3.5);
}
.p-4 {
padding: calc(var(--spacing) * 4);
}
.p-5 {
padding: calc(var(--spacing) * 5);
}
.p-6 {
padding: calc(var(--spacing) * 6);
}
.p-8 {
padding: calc(var(--spacing) * 8);
}
.p-10 {
padding: calc(var(--spacing) * 10);
}
.p-\[3px\] {
padding: 3px;
}
.px-1 {
padding-inline: calc(var(--spacing) * 1);
}
.px-1\.5 {
padding-inline: calc(var(--spacing) * 1.5);
}
.px-2 {
padding-inline: calc(var(--spacing) * 2);
}
.px-2\.5 {
padding-inline: calc(var(--spacing) * 2.5);
}
.px-3 {
padding-inline: calc(var(--spacing) * 3);
}
.px-3\.5 {
padding-inline: calc(var(--spacing) * 3.5);
}
.px-4 {
padding-inline: calc(var(--spacing) * 4);
}
.px-5 {
padding-inline: calc(var(--spacing) * 5);
}
.px-6 {
padding-inline: calc(var(--spacing) * 6);
}
.py-0\.5 {
padding-block: calc(var(--spacing) * .5);
}
.py-1 {
padding-block: calc(var(--spacing) * 1);
}
.py-1\.5 {
padding-block: calc(var(--spacing) * 1.5);
}
.py-2 {
padding-block: calc(var(--spacing) * 2);
}
.py-2\.5 {
padding-block: calc(var(--spacing) * 2.5);
}
.py-3 {
padding-block: calc(var(--spacing) * 3);
}
.py-3\.5 {
padding-block: calc(var(--spacing) * 3.5);
}
.py-4 {
padding-block: calc(var(--spacing) * 4);
}
.py-5 {
padding-block: calc(var(--spacing) * 5);
}
.py-6 {
padding-block: calc(var(--spacing) * 6);
}
.py-8 {
padding-block: calc(var(--spacing) * 8);
}
.py-10 {
padding-block: calc(var(--spacing) * 10);
}
.py-12 {
padding-block: calc(var(--spacing) * 12);
}
.py-16 {
padding-block: calc(var(--spacing) * 16);
}
.pt-0\.5 {
padding-top: calc(var(--spacing) * .5);
}
.pt-1 {
padding-top: calc(var(--spacing) * 1);
}
.pt-1\.5 {
padding-top: calc(var(--spacing) * 1.5);
}
.pt-2 {
padding-top: calc(var(--spacing) * 2);
}
.pt-3 {
padding-top: calc(var(--spacing) * 3);
}
.pt-5 {
padding-top: calc(var(--spacing) * 5);
}
.pr-1 {
padding-right: calc(var(--spacing) * 1);
}
.pb-2 {
padding-bottom: calc(var(--spacing) * 2);
}
.pb-3 {
padding-bottom: calc(var(--spacing) * 3);
}
.pb-4 {
padding-bottom: calc(var(--spacing) * 4);
}
.pb-6 {
padding-bottom: calc(var(--spacing) * 6);
}
.pl-4 {
padding-left: calc(var(--spacing) * 4);
}
.pl-5 {
padding-left: calc(var(--spacing) * 5);
}
.pl-5\.5 {
padding-left: calc(var(--spacing) * 5.5);
}
.pl-6 {
padding-left: calc(var(--spacing) * 6);
}
.text-center {
text-align: center;
}
.text-left {
text-align: left;
}
.text-right {
text-align: right;
}
.align-middle {
vertical-align: middle;
}
.font-mono {
font-family: var(--font-mono);
}
.text-2xl {
font-size: var(--text-2xl);
line-height: var(--tw-leading, var(--text-2xl--line-height));
}
.text-3xl {
font-size: var(--text-3xl);
line-height: var(--tw-leading, var(--text-3xl--line-height));
}
.text-4xl {
font-size: var(--text-4xl);
line-height: var(--tw-leading, var(--text-4xl--line-height));
}
.text-base {
font-size: var(--text-base);
line-height: var(--tw-leading, var(--text-base--line-height));
}
.text-lg {
font-size: var(--text-lg);
line-height: var(--tw-leading, var(--text-lg--line-height));
}
.text-sm {
font-size: var(--text-sm);
line-height: var(--tw-leading, var(--text-sm--line-height));
}
.text-xl {
font-size: var(--text-xl);
line-height: var(--tw-leading, var(--text-xl--line-height));
}
.text-xs {
font-size: var(--text-xs);
line-height: var(--tw-leading, var(--text-xs--line-height));
}
.text-\[9px\] {
font-size: 9px;
}
.text-\[10px\] {
font-size: 10px;
}
.text-\[11px\] {
font-size: 11px;
}
.text-\[15px\] {
font-size: 15px;
}
.leading-none {
--tw-leading: 1;
line-height: 1;
}
.leading-relaxed {
--tw-leading: var(--leading-relaxed);
line-height: var(--leading-relaxed);
}
.leading-snug {
--tw-leading: var(--leading-snug);
line-height: var(--leading-snug);
}
.leading-tight {
--tw-leading: var(--leading-tight);
line-height: var(--leading-tight);
}
.font-bold {
--tw-font-weight: var(--font-weight-bold);
font-weight: var(--font-weight-bold);
}
.font-medium {
--tw-font-weight: var(--font-weight-medium);
font-weight: var(--font-weight-medium);
}
.font-normal {
--tw-font-weight: var(--font-weight-normal);
font-weight: var(--font-weight-normal);
}
.font-semibold {
--tw-font-weight: var(--font-weight-semibold);
font-weight: var(--font-weight-semibold);
}
.tracking-wide {
--tw-tracking: var(--tracking-wide);
letter-spacing: var(--tracking-wide);
}
.break-words {
overflow-wrap: break-word;
}
.whitespace-nowrap {
white-space: nowrap;
}
.whitespace-pre-wrap {
white-space: pre-wrap;
}
.text-accent {
color: var(--color-accent);
}
.text-brand {
color: var(--color-brand);
}
.text-brand-2 {
color: var(--color-brand-2);
}
.text-co-hq {
color: var(--color-co-hq);
}
.text-co-rent {
color: var(--color-co-rent);
}
.text-co-svc {
color: var(--color-co-svc);
}
.text-co-tm {
color: var(--color-co-tm);
}
.text-danger {
color: var(--color-danger);
}
.text-err {
color: var(--color-err);
}
.text-gray-500 {
color: var(--color-gray-500);
}
.text-green-700 {
color: var(--color-green-700);
}
.text-ink {
color: var(--color-ink);
}
.text-ink-2 {
color: var(--color-ink-2);
}
.text-line {
color: var(--color-line);
}
.text-muted {
color: var(--color-muted);
}
.text-ok {
color: var(--color-ok);
}
.text-orange-600 {
color: var(--color-orange-600);
}
.text-red-600 {
color: var(--color-red-600);
}
.text-transparent {
color: #0000;
}
.text-warn {
color: var(--color-warn);
}
.text-white {
color: var(--color-white);
}
.text-white\/60 {
color: #fff9;
}
@supports (color: color-mix(in lab, red, red)) {
.text-white\/60 {
color: color-mix(in oklab, var(--color-white) 60%, transparent);
}
}
.text-white\/70 {
color: #ffffffb3;
}
@supports (color: color-mix(in lab, red, red)) {
.text-white\/70 {
color: color-mix(in oklab, var(--color-white) 70%, transparent);
}
}
.lowercase {
text-transform: lowercase;
}
.uppercase {
text-transform: uppercase;
}
.italic {
font-style: italic;
}
.tabular-nums {
--tw-numeric-spacing: tabular-nums;
font-variant-numeric: var(--tw-ordinal, ) var(--tw-slashed-zero, ) var(--tw-numeric-figure, ) var(--tw-numeric-spacing, ) var(--tw-numeric-fraction, );
}
.antialiased {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.accent-brand {
accent-color: var(--color-brand);
}
.opacity-0 {
opacity: 0;
}
.opacity-60 {
opacity: .6;
}
.opacity-70 {
opacity: .7;
}
.opacity-80 {
opacity: .8;
}
.opacity-100 {
opacity: 1;
}
.shadow {
--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
.shadow-2xl {
--tw-shadow: 0 25px 50px -12px var(--tw-shadow-color, #00000040);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
.shadow-card-md {
--tw-shadow: 0 1px 0 var(--tw-shadow-color, #0f14220a), 0 6px 18px var(--tw-shadow-color, #0f14220f);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
.shadow-card-sm {
--tw-shadow: 0 1px 0 var(--tw-shadow-color, #0f14220a), 0 1px 2px var(--tw-shadow-color, #0f14220a);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
.shadow-lg {
--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, #0000001a), 0 4px 6px -4px var(--tw-shadow-color, #0000001a);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
.shadow-sm {
--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
.shadow-xl {
--tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, #0000001a), 0 8px 10px -6px var(--tw-shadow-color, #0000001a);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
.ring-1 {
--tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
.\[box-shadow\:var\(--shadow-card-sm\)\] {
box-shadow: var(--shadow-card-sm);
}
.ring-brand {
--tw-ring-color: var(--color-brand);
}
.outline {
outline-style: var(--tw-outline-style);
outline-width: 1px;
}
.blur {
--tw-blur: blur(8px);
filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
}
.filter {
filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
}
.backdrop-blur-\[1px\] {
--tw-backdrop-blur: blur(1px);
-webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
}
.backdrop-filter {
-webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
}
.transition {
transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration));
}
.transition-all {
transition-property: all;
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration));
}
.transition-colors {
transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration));
}
.transition-opacity {
transition-property: opacity;
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration));
}
.transition-shadow {
transition-property: box-shadow;
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
transition-duration: var(--tw-duration, var(--default-transition-duration));
}
.ease-out {
--tw-ease: var(--ease-out);
transition-timing-function: var(--ease-out);
}
.outline-none {
--tw-outline-style: none;
outline-style: none;
}
.select-none {
-webkit-user-select: none;
user-select: none;
}
@media (hover: hover) {
.group-hover\:bg-surface-2:is(:where(.group):hover *) {
background-color: var(--color-surface-2);
}
}
@media (hover: hover) {
.group-hover\:opacity-100:is(:where(.group):hover *) {
opacity: 1;
}
}
.placeholder\:text-muted::placeholder {
color: var(--color-muted);
}
.last\:mb-0:last-child {
margin-bottom: calc(var(--spacing) * 0);
}
.last\:flex-none:last-child {
flex: none;
}
.last\:border-0:last-child {
border-style: var(--tw-border-style);
border-width: 0;
}
.last\:border-b-0:last-child {
border-bottom-style: var(--tw-border-style);
border-bottom-width: 0;
}
@media (hover: hover) {
.hover\:border-brand:hover {
border-color: var(--color-brand);
}
}
@media (hover: hover) {
.hover\:border-brand\/40:hover {
border-color: #2c2f7a66;
}
@supports (color: color-mix(in lab, red, red)) {
.hover\:border-brand\/40:hover {
border-color: color-mix(in oklab, var(--color-brand) 40%, transparent);
}
}
}
@media (hover: hover) {
.hover\:border-line-strong:hover {
border-color: var(--color-line-strong);
}
}
@media (hover: hover) {
.hover\:bg-brand-2:hover {
background-color: var(--color-brand-2);
}
}
@media (hover: hover) {
.hover\:bg-brand\/5:hover {
background-color: #2c2f7a0d;
}
@supports (color: color-mix(in lab, red, red)) {
.hover\:bg-brand\/5:hover {
background-color: color-mix(in oklab, var(--color-brand) 5%, transparent);
}
}
}
@media (hover: hover) {
.hover\:bg-brand\/10:hover {
background-color: #2c2f7a1a;
}
@supports (color: color-mix(in lab, red, red)) {
.hover\:bg-brand\/10:hover {
background-color: color-mix(in oklab, var(--color-brand) 10%, transparent);
}
}
}
@media (hover: hover) {
.hover\:bg-danger\/90:hover {
background-color: #b91c1ce6;
}
@supports (color: color-mix(in lab, red, red)) {
.hover\:bg-danger\/90:hover {
background-color: color-mix(in oklab, var(--color-danger) 90%, transparent);
}
}
}
@media (hover: hover) {
.hover\:bg-ink\/80:hover {
background-color: #0e1422cc;
}
@supports (color: color-mix(in lab, red, red)) {
.hover\:bg-ink\/80:hover {
background-color: color-mix(in oklab, var(--color-ink) 80%, transparent);
}
}
}
@media (hover: hover) {
.hover\:bg-surface:hover {
background-color: var(--color-surface);
}
}
@media (hover: hover) {
.hover\:bg-surface-2:hover {
background-color: var(--color-surface-2);
}
}
@media (hover: hover) {
.hover\:text-brand:hover {
color: var(--color-brand);
}
}
@media (hover: hover) {
.hover\:text-brand-2:hover {
color: var(--color-brand-2);
}
}
@media (hover: hover) {
.hover\:text-danger:hover {
color: var(--color-danger);
}
}
@media (hover: hover) {
.hover\:text-err:hover {
color: var(--color-err);
}
}
@media (hover: hover) {
.hover\:text-ink:hover {
color: var(--color-ink);
}
}
@media (hover: hover) {
.hover\:underline:hover {
text-decoration-line: underline;
}
}
@media (hover: hover) {
.hover\:opacity-90:hover {
opacity: .9;
}
}
@media (hover: hover) {
.hover\:shadow-card-md:hover {
--tw-shadow: 0 1px 0 var(--tw-shadow-color, #0f14220a), 0 6px 18px var(--tw-shadow-color, #0f14220f);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
}
@media (hover: hover) {
.hover\:shadow-md:hover {
--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, #0000001a), 0 2px 4px -2px var(--tw-shadow-color, #0000001a);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
}
@media (hover: hover) {
.hover\:shadow-sm:hover {
--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
}
.focus\:border-brand:focus {
border-color: var(--color-brand);
}
.focus\:ring-1:focus {
--tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
.focus\:ring-2:focus {
--tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
.focus\:ring-brand:focus {
--tw-ring-color: var(--color-brand);
}
.focus\:ring-brand\/30:focus {
--tw-ring-color: #2c2f7a4d;
}
@supports (color: color-mix(in lab, red, red)) {
.focus\:ring-brand\/30:focus {
--tw-ring-color: color-mix(in oklab, var(--color-brand) 30%, transparent);
}
}
.focus\:ring-brand\/40:focus {
--tw-ring-color: #2c2f7a66;
}
@supports (color: color-mix(in lab, red, red)) {
.focus\:ring-brand\/40:focus {
--tw-ring-color: color-mix(in oklab, var(--color-brand) 40%, transparent);
}
}
.focus\:ring-err:focus {
--tw-ring-color: var(--color-err);
}
.focus\:outline-none:focus {
--tw-outline-style: none;
outline-style: none;
}
.focus-visible\:ring-2:focus-visible {
--tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}
.focus-visible\:ring-brand:focus-visible {
--tw-ring-color: var(--color-brand);
}
.focus-visible\:ring-offset-1:focus-visible {
--tw-ring-offset-width: 1px;
--tw-ring-offset-shadow: var(--tw-ring-inset, ) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
}
.focus-visible\:outline-none:focus-visible {
--tw-outline-style: none;
outline-style: none;
}
.active\:cursor-grabbing:active {
cursor: grabbing;
}
.active\:bg-brand-2:active {
background-color: var(--color-brand-2);
}
.active\:bg-line:active {
background-color: var(--color-line);
}
.active\:opacity-80:active {
opacity: .8;
}
@media (hover: hover) {
.enabled\:hover\:bg-surface-2:enabled:hover {
background-color: var(--color-surface-2);
}
}
.disabled\:pointer-events-none:disabled {
pointer-events: none;
}
.disabled\:cursor-not-allowed:disabled {
cursor: not-allowed;
}
.disabled\:bg-surface-2:disabled {
background-color: var(--color-surface-2);
}
.disabled\:opacity-40:disabled {
opacity: .4;
}
.disabled\:opacity-50:disabled {
opacity: .5;
}
@media (min-width: 40rem) {
.sm\:col-span-2 {
grid-column: span 2 / span 2;
}
}
@media (min-width: 40rem) {
.sm\:grid-cols-2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (min-width: 40rem) {
.sm\:grid-cols-3 {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
}
@media (min-width: 40rem) {
.sm\:grid-cols-4 {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
}
@media (min-width: 40rem) {
.sm\:grid-cols-\[1fr_1fr_1fr_1fr_auto\] {
grid-template-columns: 1fr 1fr 1fr 1fr auto;
}
}
@media (min-width: 40rem) {
.sm\:grid-cols-\[auto_1fr\] {
grid-template-columns: auto 1fr;
}
}
@media (min-width: 40rem) {
.sm\:flex-nowrap {
flex-wrap: nowrap;
}
}
@media (min-width: 40rem) {
.sm\:items-center {
align-items: center;
}
}
@media (min-width: 48rem) {
.md\:grid-cols-2 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (min-width: 48rem) {
.md\:grid-cols-3 {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
}
@media (min-width: 48rem) {
.md\:grid-cols-4 {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
}
@media (min-width: 64rem) {
.lg\:w-64 {
width: calc(var(--spacing) * 64);
}
}
@media (min-width: 64rem) {
.lg\:grid-cols-3 {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
}
@media (min-width: 64rem) {
.lg\:grid-cols-4 {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
}
@media (min-width: 64rem) {
.lg\:grid-cols-6 {
grid-template-columns: repeat(6, minmax(0, 1fr));
}
}
@media (min-width: 64rem) {
.lg\:flex-row {
flex-direction: row;
}
}
@media (min-width: 64rem) {
.lg\:items-start {
align-items: flex-start;
}
}
@media (min-width: 64rem) {
.lg\:justify-center {
justify-content: center;
}
}
}
:root {
--bg: #f4f4ef;
--surface: #fff;
--surface-2: #fafaf7;
--ink: #0e1422;
--ink-2: #3f475a;
--muted: #8a92a3;
--line: #e7e6df;
--line-strong: #d6d4ca;
--brand: #2c2f7a;
--brand-2: #4046b5;
--accent: #c2410c;
--co-hq: #1f2547;
--co-tm: #1d4ed8;
--co-rent: #b45309;
--co-svc: #047857;
--co-hq-soft: #eef0f6;
--co-tm-soft: #eaf0fc;
--co-rent-soft: #fbf1e2;
--co-svc-soft: #e3f3ec;
--ok: #047857;
--warn: #b45309;
--err: #b91c1c;
--shadow-sm: 0 1px 0 #0f14220a, 0 1px 2px #0f14220a;
--shadow-md: 0 1px 0 #0f14220a, 0 6px 18px #0f14220f;
}
* {
box-sizing: border-box;
}
html, body {
margin: 0;
padding: 0;
}
body {
font-family: var(--font-inter), -apple-system, system-ui, sans-serif;
color: var(--ink);
background: var(--bg);
-webkit-font-smoothing: antialiased;
font-size: 14px;
line-height: 1.45;
}
.mono {
font-family: var(--font-jetbrains), ui-monospace, monospace;
}
.nowrap {
white-space: nowrap;
}
.tabnum {
font-variant-numeric: tabular-nums;
}
::-webkit-scrollbar {
width: 10px;
height: 10px;
}
::-webkit-scrollbar-thumb {
background: #d3d2c8;
border-radius: 10px;
}
::-webkit-scrollbar-track {
background: none;
}
#root {
min-height: 100vh;
}
.login-wrap {
background: var(--bg);
grid-template-columns: 1fr 1fr;
min-height: 100vh;
display: grid;
}
.login-art {
color: #e8e8ee;
background: radial-gradient(1200px 600px at 20% 100%, #4046b52e, #0000 60%), radial-gradient(900px 600px at 90% 10%, #c2410c1f, #0000 55%), linear-gradient(#0b1029 0%, #1a1f4a 100%);
flex-direction: column;
justify-content: space-between;
padding: 56px 64px;
display: flex;
position: relative;
overflow: hidden;
}
.login-art:after {
content: "";
pointer-events: none;
background-image: linear-gradient(#ffffff0a 1px, #0000 1px), linear-gradient(90deg, #ffffff0a 1px, #0000 1px);
background-size: 56px 56px;
position: absolute;
inset: 0;
}
.login-art > * {
z-index: 1;
position: relative;
}
.brand-mark {
letter-spacing: -.01em;
align-items: center;
gap: 12px;
font-size: 18px;
font-weight: 600;
display: inline-flex;
}
.brand-glyph {
color: #fff;
width: 32px;
height: 32px;
font-weight: 700;
font-family: var(--font-jetbrains), monospace;
background: linear-gradient(135deg, #4046b5, #c2410c);
border-radius: 8px;
place-items: center;
font-size: 14px;
display: grid;
}
.login-tagline {
max-width: 460px;
}
.login-tagline h1 {
letter-spacing: -.02em;
margin: 0 0 16px;
font-size: 42px;
font-weight: 600;
line-height: 1.05;
}
.login-tagline p {
color: #b9bcd2;
margin: 0;
font-size: 15px;
}
.login-stats {
gap: 48px;
margin-top: 40px;
display: flex;
}
.login-stats div {
color: #8b91b4;
text-transform: uppercase;
letter-spacing: .08em;
font-size: 12px;
}
.login-stats strong {
color: #fff;
letter-spacing: -.01em;
margin-bottom: 4px;
font-size: 28px;
font-weight: 500;
display: block;
}
.login-form {
flex-direction: column;
justify-content: center;
max-width: 560px;
padding: 56px 64px;
display: flex;
}
.login-form h2 {
letter-spacing: -.01em;
margin: 0 0 4px;
font-size: 24px;
font-weight: 600;
}
.login-form .sub {
color: var(--muted);
margin: 0 0 28px;
}
.field {
flex-direction: column;
gap: 6px;
margin-bottom: 14px;
display: flex;
}
.field label {
color: var(--ink-2);
font-size: 12px;
font-weight: 500;
}
.field input[type="text"], .field input[type="password"] {
border: 1px solid var(--line-strong);
background: var(--surface);
height: 40px;
font: inherit;
color: var(--ink);
border-radius: 8px;
outline: none;
padding: 0 12px;
transition: border-color .15s, box-shadow .15s;
}
.field input:focus {
border-color: var(--brand);
box-shadow: 0 0 0 3px #4046b51f;
}
.co-grid {
grid-template-columns: 1fr 1fr;
gap: 10px;
margin-top: 6px;
display: grid;
}
.co-card {
border: 1px solid var(--line);
background: var(--surface);
cursor: pointer;
text-align: left;
border-radius: 10px;
flex-direction: column;
gap: 6px;
padding: 12px 14px;
transition: border-color .15s, box-shadow .15s, transform .1s;
display: flex;
position: relative;
}
.co-card:hover {
border-color: var(--line-strong);
box-shadow: var(--shadow-sm);
}
.co-card.selected {
border-color: var(--co);
box-shadow: 0 0 0 3px var(--co-soft);
}
.co-card .top {
justify-content: space-between;
align-items: center;
display: flex;
}
.co-card .dot {
background: var(--co);
border-radius: 3px;
width: 10px;
height: 10px;
}
.co-card .code {
color: var(--muted);
font-size: 11px;
font-family: var(--font-jetbrains), monospace;
}
.co-card .name {
color: var(--ink);
font-size: 14px;
font-weight: 600;
}
.co-card .desc {
color: var(--muted);
font-size: 12px;
}
.co-card.hq {
background: linear-gradient(0deg, #f7f7fb, #fff);
grid-column: span 2;
}
.btn {
background: var(--ink);
color: #fff;
cursor: pointer;
border: 1px solid #0000;
border-radius: 8px;
justify-content: center;
align-items: center;
gap: 8px;
height: 40px;
padding: 0 16px;
font-weight: 500;
transition: background .15s, transform 50ms;
display: inline-flex;
}
.btn:hover {
background: #1f2641;
}
.btn:active {
transform: translateY(1px);
}
.btn.primary {
background: var(--brand);
}
.btn.primary:hover {
background: var(--brand-2);
}
.btn.ghost {
color: var(--ink-2);
border-color: var(--line-strong);
background: none;
}
.btn.ghost:hover {
background: var(--surface-2);
}
.btn.sm {
border-radius: 6px;
height: 32px;
padding: 0 12px;
font-size: 13px;
}
.btn[disabled] {
opacity: .5;
cursor: not-allowed;
}
.shell {
grid-template-columns: 232px 1fr;
min-height: 100vh;
display: grid;
}
.sidebar {
color: #c5c8d8;
background: #0e1326;
flex-direction: column;
gap: 8px;
height: 100vh;
padding: 16px 0 24px;
display: flex;
position: sticky;
top: 0;
overflow-y: auto;
}
.sidebar .brand {
color: #fff;
border-bottom: 1px solid #ffffff0f;
align-items: center;
gap: 10px;
padding: 4px 16px 16px;
display: flex;
}
.sidebar .brand .brand-glyph {
border-radius: 6px;
width: 28px;
height: 28px;
font-size: 12px;
}
.sidebar .brand-text {
letter-spacing: -.005em;
font-weight: 600;
}
.sidebar .brand-text small {
color: #8b91b4;
font-size: 11px;
font-weight: 400;
display: block;
}
.co-banner {
border-left: 3px solid var(--co);
border-radius: 8px;
align-items: center;
gap: 10px;
margin: 8px 12px 4px;
padding: 10px 12px;
display: flex;
}
.co-banner .pill {
color: #fff;
width: 28px;
height: 28px;
font-size: 11px;
font-weight: 700;
font-family: var(--font-jetbrains), monospace;
border-radius: 6px;
flex-shrink: 0;
place-items: center;
display: grid;
}
.co-banner b {
color: #fff;
font-size: 13px;
font-weight: 600;
display: block;
}
.co-banner small {
color: #8b91b4;
font-size: 11px;
}
.nav-section {
padding: 8px 0;
}
.nav-label {
letter-spacing: .08em;
color: #6c728c;
text-transform: uppercase;
padding: 4px 16px;
font-size: 11px;
font-weight: 500;
}
.nav-item {
cursor: pointer;
color: #c5c8d8;
border-radius: 6px;
align-items: center;
gap: 10px;
margin: 1px 8px;
padding: 8px 16px;
font-size: 13.5px;
transition: background .12s, color .12s;
display: flex;
}
.nav-item:hover {
color: #fff;
background: #ffffff0a;
}
.nav-item.active {
color: #fff;
background: #ffffff14;
font-weight: 500;
}
.nav-item .ic {
color: #8b91b4;
place-items: center;
width: 18px;
height: 18px;
display: grid;
}
.nav-item.active .ic {
color: #fff;
}
.nav-item .badge {
color: #c5c8d8;
background: #ffffff14;
border-radius: 999px;
margin-left: auto;
padding: 1px 6px;
font-size: 11px;
}
.nav-item.active .badge {
color: #fff;
background: #ffffff2e;
}
.nav-item .badge-count {
text-align: center;
color: #fff;
background: #ef4444;
border-radius: 999px;
min-width: 18px;
margin-left: auto;
padding: 1px 5px;
font-size: 10px;
font-weight: 600;
line-height: 16px;
}
@media print {
body * {
visibility: hidden;
}
.payslip-print, .payslip-print *, .report-print, .report-print * {
visibility: visible;
}
.payslip-print, .report-print {
box-shadow: none;
border: none;
margin: 0;
padding: 24px;
position: absolute;
inset: 0;
width: 100% !important;
max-width: 100% !important;
height: auto !important;
overflow: visible !important;
}
.no-print {
display: none !important;
}
}
.nav-sub {
border-left: 1px solid #ffffff1a;
flex-direction: column;
gap: 1px;
margin: 2px 8px 6px 22px;
padding-left: 10px;
display: flex;
}
.nav-sub-group {
flex-direction: column;
display: flex;
}
.nav-sub-grp-head {
cursor: pointer;
color: #9aa0bd;
letter-spacing: .01em;
-webkit-user-select: none;
user-select: none;
border-radius: 6px;
align-items: center;
gap: 6px;
padding: 6px 10px;
font-size: 12px;
font-weight: 600;
transition: background .12s, color .12s;
display: flex;
}
.nav-sub-grp-head:hover {
color: #e3e5ef;
background: #ffffff0a;
}
.nav-sub-leaves {
flex-direction: column;
gap: 1px;
padding: 2px 0 4px;
display: flex;
}
.nav-sub-leaf {
cursor: pointer;
color: #aab0cc;
border-radius: 6px;
padding: 6px 10px 6px 22px;
font-size: 12.5px;
line-height: 1.3;
transition: background .12s, color .12s;
}
.nav-sub-leaf:hover {
color: #fff;
background: #ffffff0a;
}
.nav-sub-leaf.active {
color: #fff;
box-shadow: inset 2px 0 0 var(--brand, #6b73e8);
background: #ffffff17;
font-weight: 500;
}
.topbar {
background: var(--surface);
border-bottom: 1px solid var(--line);
z-index: 20;
align-items: center;
gap: 12px;
height: 56px;
padding: 0 24px;
display: flex;
position: sticky;
top: 0;
}
.topbar .crumb {
color: var(--muted);
white-space: nowrap;
flex-shrink: 0;
align-items: center;
gap: 8px;
font-size: 13px;
display: flex;
}
.topbar .crumb b {
color: var(--ink);
font-weight: 600;
}
.topbar .spacer {
flex: 1;
min-width: 8px;
}
.topbar .search {
border: 1px solid var(--line);
background: var(--surface-2);
min-width: 0;
height: 32px;
font: inherit;
color: var(--ink);
background-image: url("data:image/svg+xml;utf8,");
background-position: 10px;
background-repeat: no-repeat;
border-radius: 6px;
outline: none;
flex: 0 280px;
padding: 0 10px 0 30px;
}
.topbar .search:focus {
border-color: var(--brand);
}
.co-switch {
border: 1px solid var(--line);
background: var(--surface);
cursor: pointer;
white-space: nowrap;
border-radius: 8px;
flex-shrink: 0;
align-items: center;
gap: 10px;
height: 36px;
padding: 0 10px 0 12px;
transition: border-color .12s, background .12s;
display: flex;
position: relative;
}
.co-switch:hover {
border-color: var(--line-strong);
}
.co-switch .pill {
background: var(--co);
color: #fff;
width: 22px;
height: 22px;
font-size: 11px;
font-weight: 700;
font-family: var(--font-jetbrains), monospace;
border-radius: 5px;
flex-shrink: 0;
place-items: center;
display: grid;
}
.co-switch .label {
white-space: nowrap;
font-size: 13px;
}
.co-switch .label small {
color: var(--muted);
white-space: nowrap;
font-size: 11px;
display: block;
}
.co-switch .chev {
color: var(--muted);
}
.co-menu {
background: var(--surface);
border: 1px solid var(--line);
width: 320px;
box-shadow: var(--shadow-md);
z-index: 30;
border-radius: 10px;
padding: 6px;
position: absolute;
top: calc(100% + 6px);
right: 0;
}
.co-menu .head {
color: var(--muted);
letter-spacing: .06em;
text-transform: uppercase;
padding: 8px 10px;
font-size: 11px;
}
.co-opt {
cursor: pointer;
border-radius: 6px;
align-items: center;
gap: 10px;
padding: 8px 10px;
display: flex;
}
.co-opt:hover {
background: var(--surface-2);
}
.co-opt.current {
background: var(--co-soft);
}
.co-opt .pill {
background: var(--co);
color: #fff;
width: 24px;
height: 24px;
font-size: 11px;
font-weight: 700;
font-family: var(--font-jetbrains), monospace;
border-radius: 6px;
place-items: center;
display: grid;
}
.co-opt .meta {
flex: 1;
}
.co-opt .meta b {
font-size: 13.5px;
font-weight: 500;
display: block;
}
.co-opt .meta small {
color: var(--muted);
font-size: 11.5px;
}
.co-opt .check {
color: var(--ok);
}
.user-chip {
background: var(--surface-2);
border: 1px solid var(--line);
white-space: nowrap;
border-radius: 999px;
flex-shrink: 0;
align-items: center;
gap: 8px;
height: 36px;
padding: 0 8px 0 4px;
display: flex;
}
.avatar {
color: #fff;
background: linear-gradient(135deg, #4046b5, #c2410c);
border-radius: 999px;
place-items: center;
width: 28px;
height: 28px;
font-size: 12px;
font-weight: 600;
display: grid;
}
.main {
min-width: 0;
padding: 24px 28px 64px;
}
.page-head {
justify-content: space-between;
align-items: flex-end;
gap: 16px;
margin-bottom: 20px;
display: flex;
}
.page-head h1 {
letter-spacing: -.01em;
margin: 0;
font-size: 22px;
font-weight: 600;
}
.page-head .desc {
color: var(--muted);
margin: 4px 0 0;
font-size: 13.5px;
}
.page-actions {
align-items: center;
gap: 8px;
display: flex;
}
.ribbon {
background: var(--co-soft);
color: var(--co);
border: 1px solid var(--co);
border-radius: 8px;
align-items: center;
gap: 10px;
margin: 0 0 16px;
padding: 10px 14px;
font-size: 13px;
font-weight: 500;
display: flex;
}
@supports (color: color-mix(in lab, red, red)) {
.ribbon {
border: 1px solid color-mix(in srgb, var(--co) 20%, transparent);
}
}
.ribbon .dot {
background: var(--co);
border-radius: 999px;
width: 8px;
height: 8px;
}
.ribbon.readonly {
color: #9a3412;
background: #fff7ed;
border-color: #fed7aa;
}
.card {
background: var(--surface);
border: 1px solid var(--line);
box-shadow: var(--shadow-sm);
border-radius: 10px;
overflow: hidden;
}
.card-head {
border-bottom: 1px solid var(--line);
justify-content: space-between;
align-items: center;
gap: 12px;
padding: 14px 16px;
display: flex;
}
.card-head h3 {
letter-spacing: -.005em;
margin: 0;
font-size: 14px;
font-weight: 600;
}
.card-head .sub {
color: var(--muted);
margin-top: 2px;
font-size: 12px;
}
.card-body {
padding: 16px;
}
.grid-2 {
grid-template-columns: 1fr 1fr;
gap: 16px;
display: grid;
}
.grid-3 {
grid-template-columns: repeat(3, 1fr);
gap: 16px;
display: grid;
}
.grid-4 {
grid-template-columns: repeat(4, 1fr);
gap: 16px;
display: grid;
}
.kpi {
padding: 14px 16px;
}
.kpi .label {
color: var(--muted);
text-transform: uppercase;
letter-spacing: .06em;
font-size: 12px;
font-weight: 500;
}
.kpi .value {
letter-spacing: -.01em;
font-variant-numeric: tabular-nums;
margin-top: 6px;
font-size: 26px;
font-weight: 600;
}
.kpi .delta {
align-items: center;
gap: 6px;
margin-top: 4px;
font-size: 12px;
display: flex;
}
.kpi .delta.up {
color: var(--ok);
}
.kpi .delta.down {
color: var(--err);
}
table.dt {
border-collapse: separate;
border-spacing: 0;
width: 100%;
font-size: 13px;
}
table.dt th, table.dt td {
text-align: left;
border-bottom: 1px solid var(--line);
vertical-align: middle;
padding: 10px 14px;
}
table.dt th {
color: var(--muted);
text-transform: uppercase;
letter-spacing: .06em;
background: var(--surface-2);
font-size: 11px;
font-weight: 500;
position: sticky;
top: 0;
}
table.dt tbody tr:hover {
background: var(--surface-2);
}
table.dt td.num, table.dt th.num {
text-align: right;
font-variant-numeric: tabular-nums;
}
table.dt tbody tr:last-child td {
border-bottom: 0;
}
.chip {
background: var(--surface-2);
color: var(--ink-2);
border: 1px solid var(--line);
border-radius: 999px;
align-items: center;
gap: 6px;
padding: 2px 8px;
font-size: 11.5px;
font-weight: 500;
display: inline-flex;
}
.chip .d {
opacity: .9;
background: currentColor;
border-radius: 999px;
width: 6px;
height: 6px;
}
.chip.tm {
color: var(--co-tm);
background: var(--co-tm-soft);
border-color: var(--co-tm);
}
@supports (color: color-mix(in lab, red, red)) {
.chip.tm {
border-color: color-mix(in srgb, var(--co-tm) 20%, transparent);
}
}
.chip.rent {
color: var(--co-rent);
background: var(--co-rent-soft);
border-color: var(--co-rent);
}
@supports (color: color-mix(in lab, red, red)) {
.chip.rent {
border-color: color-mix(in srgb, var(--co-rent) 25%, transparent);
}
}
.chip.svc {
color: var(--co-svc);
background: var(--co-svc-soft);
border-color: var(--co-svc);
}
@supports (color: color-mix(in lab, red, red)) {
.chip.svc {
border-color: color-mix(in srgb, var(--co-svc) 25%, transparent);
}
}
.chip.hq {
color: var(--co-hq);
background: var(--co-hq-soft);
border-color: var(--co-hq);
}
@supports (color: color-mix(in lab, red, red)) {
.chip.hq {
border-color: color-mix(in srgb, var(--co-hq) 25%, transparent);
}
}
.chip.ok {
color: var(--ok);
background: #e3f3ec;
border-color: #b6e0ca;
}
.chip.warn {
color: var(--warn);
background: #fbf1e2;
border-color: #f1cf94;
}
.chip.err {
color: var(--err);
background: #fde8e8;
border-color: #f3bcbc;
}
.chip.mute {
color: var(--muted);
}
.filter-bar {
border-bottom: 1px solid var(--line);
background: var(--surface);
flex-wrap: wrap;
align-items: center;
gap: 8px;
padding: 12px 16px;
display: flex;
}
.filter-bar select, .filter-bar input[type="search"], .filter-bar input[type="text"] {
height: 32px;
font: inherit;
color: var(--ink);
border: 1px solid var(--line);
background: var(--surface-2);
border-radius: 6px;
outline: none;
min-width: 140px;
padding: 0 10px;
}
.filter-bar input[type="search"] {
background-image: url("data:image/svg+xml;utf8,");
background-position: 10px;
background-repeat: no-repeat;
padding-left: 30px;
}
.seg {
border: 1px solid var(--line);
background: var(--surface-2);
border-radius: 8px;
padding: 3px;
display: inline-flex;
}
.seg button {
height: 26px;
color: var(--ink-2);
cursor: pointer;
background: none;
border: 0;
border-radius: 6px;
padding: 0 10px;
font-size: 12.5px;
font-weight: 500;
}
.seg button.on {
background: var(--surface);
color: var(--ink);
box-shadow: var(--shadow-sm);
}
.bar {
background: var(--surface-2);
border-radius: 999px;
height: 6px;
overflow: hidden;
}
.bar > i {
background: var(--co, var(--brand));
border-radius: 999px;
height: 100%;
display: block;
}
.spark {
width: 100%;
height: 48px;
}
.modal-back {
z-index: 50;
-webkit-backdrop-filter: blur(2px);
backdrop-filter: blur(2px);
background: #0b102959;
place-items: center;
display: grid;
position: fixed;
inset: 0;
}
.modal {
background: var(--surface);
border: 1px solid var(--line);
border-radius: 12px;
width: 560px;
max-width: calc(100vw - 40px);
overflow: hidden;
box-shadow: 0 24px 64px #0b102940;
}
.modal .head {
border-bottom: 1px solid var(--line);
justify-content: space-between;
align-items: center;
padding: 14px 18px;
display: flex;
}
.modal .head h3 {
margin: 0;
font-size: 15px;
font-weight: 600;
}
.modal .body {
padding: 16px 18px;
}
.modal .foot {
border-top: 1px solid var(--line);
background: var(--surface-2);
justify-content: flex-end;
gap: 8px;
padding: 12px 18px;
display: flex;
}
.co-tile {
background: var(--surface);
border: 1px solid var(--line);
cursor: pointer;
border-top: 3px solid var(--co);
border-radius: 10px;
flex-direction: column;
gap: 14px;
padding: 16px;
transition: border-color .15s, box-shadow .15s, transform .1s;
display: flex;
}
.co-tile:hover {
box-shadow: var(--shadow-md);
border-color: var(--line-strong);
transform: translateY(-1px);
}
.co-tile .head {
align-items: center;
gap: 10px;
display: flex;
}
.co-tile .pill {
background: var(--co);
color: #fff;
width: 28px;
height: 28px;
font-size: 12px;
font-weight: 700;
font-family: var(--font-jetbrains), monospace;
border-radius: 7px;
place-items: center;
display: grid;
}
.co-tile .pill.outline {
color: var(--co);
background: none;
border: 1px solid;
}
.co-tile h3 {
margin: 0;
font-size: 15px;
}
.co-tile small {
color: var(--muted);
font-size: 11.5px;
}
.co-tile .stats {
grid-template-columns: 1fr 1fr;
gap: 8px;
display: grid;
}
.co-tile .st {
background: var(--surface-2);
border-radius: 6px;
padding: 8px 10px;
}
.co-tile .st .l {
color: var(--muted);
font-size: 11px;
}
.co-tile .st .v {
font-variant-numeric: tabular-nums;
font-size: 16px;
font-weight: 600;
}
.flow {
grid-template-columns: 1fr 200px 1fr;
align-items: center;
gap: 16px;
display: grid;
}
.flow .node {
border: 1px solid var(--line);
background: var(--surface);
border-left: 4px solid var(--co);
border-radius: 10px;
padding: 12px 14px;
}
.flow .node h4 {
margin: 0;
font-size: 14px;
}
.flow .node small {
color: var(--muted);
}
.flow .arrow {
color: var(--muted);
flex-direction: column;
align-items: center;
gap: 4px;
display: flex;
}
.flow .arrow .line {
background: var(--line-strong);
width: 100%;
height: 2px;
position: relative;
}
.flow .arrow .line:after {
content: "";
border-left: 8px solid var(--line-strong);
border-top: 5px solid #0000;
border-bottom: 5px solid #0000;
position: absolute;
top: -4px;
right: -2px;
}
.tabs {
border-bottom: 1px solid var(--line);
gap: 4px;
padding: 0 4px;
display: flex;
}
.tabs button {
color: var(--ink-2);
cursor: pointer;
background: none;
border: 0;
border-bottom: 2px solid #0000;
margin-bottom: -1px;
padding: 10px 14px;
font-size: 13px;
font-weight: 500;
}
.tabs button.on {
color: var(--ink);
border-bottom-color: var(--brand);
}
.divider {
background: var(--line);
height: 1px;
margin: 12px 0;
}
.row-actions {
gap: 6px;
display: flex;
}
.icon-btn {
color: var(--muted);
cursor: pointer;
background: none;
border: 0;
border-radius: 4px;
padding: 4px;
}
.icon-btn:hover {
background: var(--surface-2);
color: var(--ink);
}
.empty-illustration {
background: repeating-linear-gradient(45deg, transparent 0 8px, #0f14220a 8px 10px),
var(--surface-2);
height: 120px;
font-family: var(--font-jetbrains), monospace;
color: var(--muted);
border-radius: 8px;
place-items: center;
font-size: 11px;
display: grid;
}
.drawer-back {
z-index: 50;
-webkit-backdrop-filter: blur(2px);
backdrop-filter: blur(2px);
background: #0b102959;
justify-content: flex-end;
animation: .15s ease-out fadeIn;
display: flex;
position: fixed;
inset: 0;
}
.drawer {
background: var(--bg);
flex-direction: column;
width: 920px;
max-width: 100vw;
height: 100vh;
animation: .22s ease-out slideIn;
display: flex;
overflow: hidden;
box-shadow: -24px 0 60px #0b102940;
}
@keyframes fadeIn {
from {
opacity: 0;
}
}
@keyframes slideIn {
from {
opacity: 0;
transform: translateX(60px);
}
}
.drawer-head {
border-bottom: 1px solid var(--line);
background: var(--surface);
justify-content: space-between;
align-items: flex-start;
gap: 16px;
padding: 20px 24px;
display: flex;
}
.drawer-head h2 {
letter-spacing: -.01em;
margin: 6px 0 0;
font-size: 20px;
font-weight: 600;
}
.drawer-close {
padding: 6px 8px;
font-size: 16px;
line-height: 1;
}
.drawer-tabs {
background: var(--surface);
border-bottom: 1px solid var(--line);
gap: 4px;
padding: 0 24px;
display: flex;
}
.drawer-tabs button {
color: var(--ink-2);
cursor: pointer;
background: none;
border: 0;
border-bottom: 2px solid #0000;
margin-bottom: -1px;
padding: 12px 14px;
font-size: 13px;
font-weight: 500;
}
.drawer-tabs button.on {
color: var(--ink);
border-bottom-color: var(--co-rent);
}
.drawer-body {
background: var(--bg);
overscroll-behavior: contain;
flex: 1;
overflow-y: auto;
}
.policy-pill {
background: var(--co-rent-soft);
color: var(--co-rent);
border: 1px solid var(--co-rent);
border-radius: 999px;
align-items: center;
gap: 6px;
padding: 4px 10px;
display: inline-flex;
}
@supports (color: color-mix(in lab, red, red)) {
.policy-pill {
border: 1px solid color-mix(in srgb, var(--co-rent) 25%, transparent);
}
}
.policy-pill {
font-size: 12px;
}
.dep-rule-banner {
background: var(--co-rent-soft);
color: var(--co-rent);
border: 1px solid var(--co-rent);
border-radius: 8px;
align-items: center;
gap: 8px;
padding: 10px 14px;
display: flex;
}
@supports (color: color-mix(in lab, red, red)) {
.dep-rule-banner {
border: 1px solid color-mix(in srgb, var(--co-rent) 25%, transparent);
}
}
.dep-rule-banner {
font-size: 13px;
}
.date-edit-row {
background: var(--surface-2);
border: 1px dashed var(--line-strong);
border-radius: 8px;
flex-wrap: wrap;
align-items: center;
gap: 12px;
padding: 10px 14px;
display: flex;
}
.date-edit-row.compact {
background: none;
margin-top: 12px;
}
.date-edit-row.editing {
background: #fff7ed;
border-style: solid;
border-color: #fed7aa;
}
.date-edit-row .label {
color: var(--muted);
min-width: 110px;
font-size: 12px;
font-weight: 500;
}
.date-edit-row .value {
flex-wrap: wrap;
flex: 1;
align-items: center;
gap: 8px;
display: flex;
}
.date-edit-row input[type="date"] {
border: 1px solid var(--line-strong);
height: 32px;
font: inherit;
background: var(--surface);
color: var(--ink);
border-radius: 6px;
outline: none;
padding: 0 10px;
}
.date-edit-row input[type="date"]:focus {
border-color: var(--brand);
box-shadow: 0 0 0 3px #4046b51f;
}
.dep-warn-inline {
color: #b45309;
align-items: center;
gap: 4px;
font-size: 12px;
font-weight: 500;
display: inline-flex;
}
.date-pill {
background: var(--surface-2);
border: 1px solid var(--line);
font-family: var(--font-jetbrains), monospace;
color: var(--ink);
border-radius: 4px;
align-items: center;
padding: 2px 8px;
font-size: 12.5px;
display: inline-flex;
}
.date-pill.new {
color: #92400e;
background: #fef3c7;
border-color: #fde68a;
}
.dep-table tbody tr.dep-year-row {
cursor: pointer;
}
.dep-table tbody tr.dep-year-row:hover {
background: var(--surface-2);
}
.dep-table tbody tr.dep-year-row.open {
background: var(--co-rent-soft);
}
.dep-table tbody tr.dep-year-row.open td {
border-bottom-color: var(--co-rent);
}
@supports (color: color-mix(in lab, red, red)) {
.dep-table tbody tr.dep-year-row.open td {
border-bottom-color: color-mix(in srgb, var(--co-rent) 30%, var(--line));
}
}
.dep-table tbody tr.dep-year-row.curr td:first-child {
box-shadow: inset 3px 0 0 var(--co-rent);
}
.dep-chev {
color: var(--muted);
margin-right: 8px;
font-size: 10px;
transition: transform .15s;
display: inline-block;
}
.dep-month-row td {
background: #fbfaf6;
font-size: 12.5px;
}
.dep-month-row td:first-child {
color: var(--ink-2);
}
tr.dep-total td {
background: var(--surface-2);
border-top: 2px solid var(--line-strong);
font-size: 13px;
font-weight: 600;
}
.dep-warn {
color: #9a3412;
background: #fff7ed;
border: 1px solid #fed7aa;
border-radius: 8px;
align-items: flex-start;
gap: 10px;
margin: 12px 0;
padding: 12px 14px;
font-size: 13px;
display: flex;
}
.dep-warn ul {
margin: 4px 0 0;
padding-left: 20px;
}
.dep-warn ul li {
margin: 2px 0;
}
.type-card {
background: var(--surface);
border: 1.5px solid var(--line);
cursor: pointer;
text-align: left;
font: inherit;
color: inherit;
border-radius: 10px;
flex-direction: column;
gap: 6px;
padding: 12px 14px;
transition: border-color .12s, box-shadow .12s;
display: flex;
}
.type-card:hover {
border-color: var(--line-strong);
}
.type-card.selected {
border-color: var(--co-rent);
box-shadow: 0 0 0 3px var(--co-rent);
}
@supports (color: color-mix(in lab, red, red)) {
.type-card.selected {
box-shadow: 0 0 0 3px color-mix(in srgb, var(--co-rent) 18%, transparent);
}
}
.type-card.selected {
background: var(--co-rent-soft);
}
.type-card .type-card-top {
align-items: center;
gap: 8px;
display: flex;
}
.type-card b {
font-size: 14px;
font-weight: 600;
}
.type-card small {
color: var(--muted);
padding-left: 24px;
font-size: 12px;
}
.type-radio {
border: 1.5px solid var(--line-strong);
border-radius: 999px;
flex-shrink: 0;
place-items: center;
width: 16px;
height: 16px;
display: grid;
}
.type-card.selected .type-radio {
border-color: var(--co-rent);
}
.type-radio .dot {
background: var(--co-rent);
border-radius: 999px;
width: 8px;
height: 8px;
}
.kanban {
grid-template-columns: repeat(5, minmax(0, 1fr));
gap: 12px;
display: grid;
}
.kanban-col {
background: var(--surface-2);
border: 1px solid var(--line);
border-radius: 10px;
flex-direction: column;
min-height: 240px;
display: flex;
}
.kanban-head {
border-bottom: 1px solid var(--line);
border-top: 2px solid var(--co);
background: var(--surface);
border-radius: 10px 10px 0 0;
align-items: center;
gap: 8px;
padding: 10px 12px;
display: flex;
}
.kanban-head .dot {
background: var(--co);
border-radius: 999px;
width: 8px;
height: 8px;
}
.kanban-head b {
flex: 1;
font-size: 13px;
font-weight: 600;
}
.kanban-body {
flex-direction: column;
flex: 1;
gap: 10px;
padding: 10px;
display: flex;
}
.kanban-empty {
color: var(--muted);
font-family: var(--font-jetbrains), monospace;
text-align: center;
padding: 12px 6px;
font-size: 11px;
}
.kanban-card {
background: var(--surface);
border: 1px solid var(--line);
cursor: pointer;
border-radius: 8px;
flex-direction: column;
gap: 6px;
padding: 10px 12px;
transition: box-shadow .12s, transform 80ms, border-color .12s;
display: flex;
}
.kanban-card:hover {
box-shadow: var(--shadow-md);
border-color: var(--line-strong);
transform: translateY(-1px);
}
.kanban-card.internal {
border-color: var(--co-rent);
}
@supports (color: color-mix(in lab, red, red)) {
.kanban-card.internal {
border-color: color-mix(in srgb, var(--co-rent) 30%, var(--line));
}
}
.kanban-card.internal {
background: linear-gradient(180deg, var(--co-rent-soft) 0%, var(--surface) 30%);
}
.kanban-card .card-tag {
color: var(--co-rent);
text-transform: uppercase;
letter-spacing: .04em;
font-size: 10.5px;
font-weight: 600;
}
.kanban-card-top {
justify-content: space-between;
align-items: center;
gap: 6px;
display: flex;
}
.kanban-card .so-id {
color: var(--muted);
font-size: 11px;
}
.kanban-amt {
font-size: 13px;
font-weight: 600;
}
.kanban-card-title {
letter-spacing: -.005em;
font-size: 13.5px;
font-weight: 600;
}
.kanban-card-meta {
color: var(--ink-2);
flex-wrap: wrap;
align-items: center;
gap: 4px;
font-size: 12px;
display: flex;
}
.kanban-card-foot {
border-top: 1px dashed var(--line);
justify-content: space-between;
align-items: center;
gap: 6px;
padding-top: 6px;
display: flex;
}
.pipeline-strip {
grid-template-columns: repeat(6, 1fr);
gap: 10px;
display: grid;
}
.pipeline-cell {
background: var(--surface);
border: 1px solid var(--line);
border-radius: 8px;
padding: 12px 14px;
position: relative;
overflow: hidden;
}
.pipeline-cell .bar-top {
background: var(--co);
height: 3px;
position: absolute;
top: 0;
left: 0;
right: 0;
}
.pipeline-cell.summary {
background: var(--surface-2);
border-style: dashed;
}
.pipeline-cell .meta {
justify-content: space-between;
align-items: baseline;
gap: 8px;
display: flex;
}
.pipeline-cell .lbl {
color: var(--muted);
font-size: 11.5px;
font-weight: 500;
}
.pipeline-cell .cnt {
font-variant-numeric: tabular-nums;
font-size: 20px;
font-weight: 600;
}
.pipeline-cell .val {
color: var(--ink-2);
margin-top: 4px;
font-size: 13px;
}
.ctl-wrap {
padding: 14px 16px 18px;
}
.ctl-axis {
border-bottom: 1px solid var(--line);
grid-template-columns: repeat(31, 1fr);
gap: 0;
margin-bottom: 6px;
display: grid;
}
.ctl-day {
text-align: center;
color: var(--muted);
font-size: 10px;
font-family: var(--font-jetbrains), monospace;
border-left: 1px dashed #0000;
padding: 4px 0;
}
.ctl-day:nth-child(7n+1) {
border-left-color: var(--line);
}
.ctl-day.today {
color: var(--brand);
box-shadow: inset 0 -2px 0 var(--brand);
font-weight: 700;
}
.ctl-rows {
flex-direction: column;
gap: 6px;
display: flex;
}
.ctl-row {
grid-template-columns: 240px 1fr;
align-items: center;
gap: 12px;
display: grid;
}
.ctl-label {
color: var(--ink);
font-size: 12.5px;
}
.ctl-track {
background: repeating-linear-gradient(90deg, transparent 0 calc(100%/31 - 1px), var(--line) calc(100%/31 - 1px) calc(100%/31));
border-radius: 4px;
height: 24px;
position: relative;
}
.ctl-bar {
background: var(--co-rent);
color: #fff;
white-space: nowrap;
border-radius: 3px;
align-items: center;
padding: 0 8px;
font-size: 11px;
font-weight: 500;
display: flex;
position: absolute;
top: 3px;
bottom: 3px;
overflow: hidden;
box-shadow: 0 1px #0000001a;
}
.ctl-bar.expiring {
background: var(--err);
}
.tabs.sub-tabs {
background: var(--surface-2);
border-bottom: 1px solid var(--line);
padding: 6px 4px;
}
.tabs.sub-tabs button {
padding: 7px 12px;
font-size: 12.5px;
}
.att-grid td.att-cell {
text-align: center;
min-width: 70px;
}
.att-grid td.att-cell[data-status="late"] {
background: #fff7ed;
}
.att-grid td.att-cell[data-status="absent"] {
background: #fde8e8;
}
.att-grid td.att-cell[data-status="leave"] {
background: #fbf1e2;
}
.pl-table tr.pl-section td {
background: var(--surface-2);
color: var(--muted);
text-transform: uppercase;
letter-spacing: .05em;
padding: 8px 14px;
font-size: 11.5px;
font-weight: 600;
}
.pl-table tr.pl-bold td {
font-weight: 600;
}
.pl-table tr.pl-hl td {
background: #fafaf7;
}
.pl-table tr.pl-big td {
background: var(--co-hq-soft);
border-top: 2px solid var(--co-hq);
border-bottom: 2px solid var(--co-hq);
font-size: 14.5px;
}
.pl-table tr.pl-sub td {
color: var(--muted);
font-size: 12.5px;
font-style: italic;
}
.cat-tree-item {
cursor: pointer;
border-bottom: 1px solid var(--line);
justify-content: space-between;
align-items: center;
gap: 8px;
padding: 10px 16px;
transition: background .1s;
display: flex;
}
.cat-tree-item:hover {
background: var(--surface-2);
}
.cat-tree-item[data-active="true"] {
background: var(--co-rent-soft);
}
.cat-tree-item[data-active="true"] .cti-dot {
background: var(--co-rent);
}
.cti-main {
align-items: center;
gap: 10px;
min-width: 0;
display: flex;
}
.cti-dot {
border-radius: 999px;
flex-shrink: 0;
width: 8px;
height: 8px;
}
.cat-strip {
flex-wrap: wrap;
align-items: center;
gap: 8px;
display: flex;
}
.cat-pill {
background: var(--surface);
border: 1px solid var(--line);
color: var(--ink-2);
cursor: pointer;
border-radius: 999px;
align-items: center;
gap: 8px;
padding: 6px 12px 6px 14px;
font-size: 13px;
font-weight: 500;
transition: border-color .12s, background .12s, color .12s;
display: inline-flex;
}
.cat-pill:hover {
border-color: var(--line-strong);
}
.cat-pill.on {
background: var(--ink);
color: #fff;
border-color: var(--ink);
}
.cat-pill .cnt {
background: var(--surface-2);
color: var(--muted);
font-variant-numeric: tabular-nums;
border-radius: 999px;
padding: 0 6px;
font-size: 11.5px;
}
.cat-pill.on .cnt {
color: #fff;
background: #ffffff2e;
}
.order-pipeline {
background: var(--surface);
border: 1px solid var(--line);
border-radius: 10px;
align-items: center;
gap: 6px;
padding: 14px 16px;
display: flex;
}
.op-step {
flex-direction: column;
flex-shrink: 0;
align-items: center;
gap: 6px;
min-width: 90px;
display: flex;
}
.op-dot {
background: var(--surface-2);
width: 28px;
height: 28px;
color: var(--muted);
border: 1.5px solid var(--line-strong);
font-variant-numeric: tabular-nums;
border-radius: 999px;
place-items: center;
font-size: 12px;
font-weight: 600;
display: grid;
}
.op-step.done .op-dot {
background: var(--co);
border-color: var(--co);
color: #fff;
}
.op-step.current .op-dot {
border-color: var(--co);
color: var(--co);
box-shadow: 0 0 0 4px var(--co);
background: #fff;
}
@supports (color: color-mix(in lab, red, red)) {
.op-step.current .op-dot {
box-shadow: 0 0 0 4px color-mix(in srgb, var(--co) 20%, transparent);
}
}
.op-lbl {
color: var(--muted);
text-align: center;
white-space: nowrap;
font-size: 11px;
}
.op-step.current .op-lbl, .op-step.done .op-lbl {
color: var(--ink);
font-weight: 500;
}
.op-line {
background: var(--line);
flex: 1;
height: 2px;
margin-bottom: 22px;
}
.op-line.done {
background: var(--co-tm);
}
.chip.svc {
color: var(--co-svc);
background: var(--co-svc-soft);
border-color: var(--co-svc);
}
@supports (color: color-mix(in lab, red, red)) {
.chip.svc {
border-color: color-mix(in srgb, var(--co-svc) 25%, transparent);
}
}
.status-select {
display: inline-block;
position: relative;
}
.status-trigger {
cursor: pointer;
background: none;
border: 1px solid #0000;
border-radius: 8px;
align-items: center;
gap: 6px;
padding: 2px 6px 2px 2px;
transition: border-color .12s, background .12s;
display: inline-flex;
}
.status-trigger:hover {
border-color: var(--line);
background: var(--surface-2);
}
.status-trigger .chev-ic {
color: var(--muted);
display: grid;
}
.status-menu {
z-index: 40;
background: var(--surface);
border: 1px solid var(--line);
width: 284px;
box-shadow: var(--shadow-md);
border-radius: 10px;
padding: 6px;
position: absolute;
top: calc(100% + 6px);
right: 0;
}
.status-menu-head {
color: var(--muted);
letter-spacing: .04em;
text-transform: uppercase;
padding: 8px 10px 6px;
font-size: 11px;
font-weight: 600;
}
.status-opt {
cursor: pointer;
text-align: left;
background: none;
border: 0;
border-radius: 7px;
align-items: center;
gap: 8px;
width: 100%;
padding: 7px 10px;
display: flex;
}
.status-opt:hover, .status-opt.on {
background: var(--surface-2);
}
.status-opt .check-ic {
color: var(--ok);
flex-shrink: 0;
margin-left: auto;
display: grid;
}
.status-tag {
color: var(--brand-2);
background: var(--brand-2);
margin-left: auto;
font-size: 9.5px;
font-weight: 700;
}
@supports (color: color-mix(in lab, red, red)) {
.status-tag {
background: color-mix(in srgb, var(--brand-2) 12%, #fff);
}
}
.status-tag {
border: 1px solid var(--brand-2);
}
@supports (color: color-mix(in lab, red, red)) {
.status-tag {
border: 1px solid color-mix(in srgb, var(--brand-2) 25%, transparent);
}
}
.status-tag {
text-transform: uppercase;
letter-spacing: .03em;
border-radius: 999px;
flex-shrink: 0;
padding: 1px 6px;
}
.status-opt.on .status-tag {
margin-left: 8px;
}
.status-menu-foot {
border-top: 1px solid var(--line);
color: var(--brand-2);
cursor: pointer;
align-items: center;
gap: 6px;
margin: 4px 2px 0;
padding: 9px 8px 5px;
font-size: 12.5px;
font-weight: 500;
display: flex;
}
.status-menu-foot:hover {
color: var(--brand);
}
.note-area {
resize: vertical;
border: 1px solid var(--line-strong);
width: 100%;
min-height: 104px;
font: inherit;
color: var(--ink);
background: var(--surface);
border-radius: 8px;
outline: none;
padding: 10px 12px;
line-height: 1.5;
}
.note-area:focus {
border-color: var(--brand);
box-shadow: 0 0 0 3px #4046b51f;
}
.note-area:disabled {
background: var(--surface-2);
color: var(--ink-2);
cursor: default;
}
.att-list {
flex-direction: column;
gap: 8px;
display: flex;
}
.att-file {
border: 1px solid var(--line);
background: var(--surface);
border-radius: 8px;
align-items: center;
gap: 10px;
padding: 9px 10px;
transition: border-color .12s;
display: flex;
}
.att-file:hover {
border-color: var(--line-strong);
}
.att-badge {
color: #fff;
letter-spacing: .02em;
width: 36px;
height: 36px;
font-size: 10px;
font-weight: 700;
font-family: var(--font-jetbrains), monospace;
border-radius: 7px;
flex-shrink: 0;
place-items: center;
display: grid;
}
.att-badge[data-kind="doc"] {
background: #1d4ed8;
}
.att-badge[data-kind="xls"] {
background: #047857;
}
.att-badge[data-kind="img"] {
background: #b45309;
}
.att-badge[data-kind="vid"] {
background: #7c3aed;
}
.att-badge[data-kind="pdf"] {
background: #b91c1c;
}
.att-badge[data-kind="file"] {
background: #8a92a3;
}
.att-meta {
flex: 1;
min-width: 0;
}
.att-meta b {
white-space: nowrap;
text-overflow: ellipsis;
font-size: 13px;
font-weight: 500;
display: block;
overflow: hidden;
}
.att-meta small {
color: var(--muted);
font-size: 11.5px;
}
.att-add {
border: 1px dashed var(--line-strong);
background: var(--surface-2);
height: 34px;
color: var(--ink-2);
cursor: pointer;
border-radius: 8px;
align-self: flex-start;
align-items: center;
gap: 6px;
padding: 0 12px;
font-size: 13px;
font-weight: 500;
transition: border-color .12s, color .12s;
display: inline-flex;
}
.att-add:hover {
border-color: var(--brand);
color: var(--brand);
}
.att-hint {
color: var(--muted);
font-size: 11.5px;
}
.att-empty {
border: 1px dashed var(--line-strong);
text-align: center;
color: var(--muted);
background: var(--surface-2);
border-radius: 8px;
padding: 18px;
font-size: 12.5px;
}
.scat-list {
flex-direction: column;
display: flex;
}
.scat-row {
border-bottom: 1px solid var(--line);
align-items: center;
gap: 12px;
padding: 10px 0;
display: flex;
}
.scat-row:last-child {
border-bottom: 0;
}
.scat-prev {
flex-shrink: 0;
width: 168px;
display: flex;
}
.scat-name-input {
min-width: 0;
height: 34px;
font: inherit;
color: var(--ink);
border: 1px solid var(--line-strong);
background: var(--surface);
border-radius: 7px;
outline: none;
flex: 1;
padding: 0 10px;
}
.scat-name-input:focus {
border-color: var(--brand);
box-shadow: 0 0 0 3px #4046b51f;
}
.scat-name-input:disabled {
background: var(--surface-2);
color: var(--ink-2);
cursor: default;
border-style: dashed;
}
.scat-colors {
flex-shrink: 0;
gap: 6px;
display: flex;
}
.scat-sw {
cursor: pointer;
width: 22px;
height: 22px;
box-shadow: 0 0 0 1px var(--line-strong);
border: 2px solid #fff;
border-radius: 6px;
padding: 0;
}
.scat-sw.on {
box-shadow: 0 0 0 2px var(--ink);
}
.scat-act {
flex-shrink: 0;
justify-content: flex-end;
align-items: center;
width: 76px;
display: flex;
}
.scat-sys-tag {
color: var(--muted);
text-transform: uppercase;
letter-spacing: .04em;
font-size: 9.5px;
font-weight: 700;
}
.scat-add {
border: 1px dashed var(--line-strong);
background: var(--surface-2);
border-radius: 8px;
align-items: center;
gap: 12px;
margin-top: 14px;
padding: 12px;
display: flex;
}
.app-shell {
grid-template-columns: 232px 1fr;
min-height: 100vh;
display: grid;
}
.app-shell__main {
flex-direction: column;
min-width: 0;
display: flex;
}
.app-shell__content {
flex: 1;
min-width: 0;
padding: 24px 28px 64px;
}
.co-banner--hq, .co-switch--hq, .co-opt--hq, .co-card--hq {
--co: var(--co-hq);
--co-soft: var(--co-hq-soft);
}
.co-banner--tm, .co-switch--tm, .co-opt--tm, .co-card--tm {
--co: var(--co-tm);
--co-soft: var(--co-tm-soft);
}
.co-banner--rent, .co-switch--rent, .co-opt--rent, .co-card--rent {
--co: var(--co-rent);
--co-soft: var(--co-rent-soft);
}
.co-banner--svc, .co-switch--svc, .co-opt--svc, .co-card--svc {
--co: var(--co-svc);
--co-soft: var(--co-svc-soft);
}
.co-banner {
background: linear-gradient(180deg, var(--co), transparent);
}
@supports (color: color-mix(in lab, red, red)) {
.co-banner {
background: linear-gradient(180deg, color-mix(in srgb, var(--co) 22%, transparent), transparent);
}
}
.co-banner .pill {
background: var(--co);
}
.sidebar-footer {
color: #8b91b4;
border-top: 1px solid #ffffff0f;
padding: 12px 16px;
font-size: 11px;
}
.readonly-banner {
color: #9a3412;
background: #fff7ed;
border-bottom: 1px solid #fed7aa;
margin: 0;
padding: 10px 24px;
font-size: 13px;
font-weight: 500;
}
.search-wrap {
flex: 0 280px;
align-items: center;
min-width: 0;
display: flex;
position: relative;
}
.search-wrap .search-ic {
color: var(--muted);
pointer-events: none;
position: absolute;
left: 10px;
}
.search-wrap .search {
background-image: none;
flex: 1;
width: 100%;
}
.user-info {
font-size: 12px;
line-height: 1.2;
}
.user-info b {
font-weight: 600;
display: block;
}
.user-info span {
color: var(--muted);
display: block;
}
.company-gate {
background: var(--bg);
place-items: center;
min-height: 100vh;
padding: 32px;
display: grid;
}
.company-gate__card {
background: var(--surface);
border: 1px solid var(--line);
width: 100%;
max-width: 560px;
box-shadow: var(--shadow-md);
border-radius: 14px;
padding: 32px;
}
.company-gate__brand {
align-items: center;
gap: 12px;
margin-bottom: 10px;
display: flex;
}
.company-gate__brand h1 {
letter-spacing: -.01em;
margin: 0;
font-size: 20px;
font-weight: 600;
}
.company-gate__brand .brand-glyph {
width: 40px;
height: 40px;
font-size: 15px;
}
.company-gate__desc {
color: var(--muted);
margin: 0 0 20px;
font-size: 13.5px;
}
.company-gate__grid {
grid-template-columns: 1fr 1fr;
gap: 10px;
display: grid;
}
.co-card__label {
color: var(--ink);
font-size: 14px;
font-weight: 600;
}
.co-card__hint {
color: var(--muted);
font-size: 12px;
}
.co-card--hq {
background: linear-gradient(0deg, #f7f7fb, #fff);
grid-column: span 2;
}
@keyframes ht-toast-in {
from {
opacity: 0;
transform: translateX(12px)scale(.98);
}
to {
opacity: 1;
transform: translateX(0)scale(1);
}
}
.ht-toast-in {
animation: .18s ease-out ht-toast-in;
}
@media (prefers-reduced-motion: reduce) {
.ht-toast-in {
animation: none;
}
}
@property --tw-rotate-x {
syntax: "*";
inherits: false
}
@property --tw-rotate-y {
syntax: "*";
inherits: false
}
@property --tw-rotate-z {
syntax: "*";
inherits: false
}
@property --tw-skew-x {
syntax: "*";
inherits: false
}
@property --tw-skew-y {
syntax: "*";
inherits: false
}
@property --tw-space-y-reverse {
syntax: "*";
inherits: false;
initial-value: 0;
}
@property --tw-divide-y-reverse {
syntax: "*";
inherits: false;
initial-value: 0;
}
@property --tw-border-style {
syntax: "*";
inherits: false;
initial-value: solid;
}
@property --tw-leading {
syntax: "*";
inherits: false
}
@property --tw-font-weight {
syntax: "*";
inherits: false
}
@property --tw-tracking {
syntax: "*";
inherits: false
}
@property --tw-ordinal {
syntax: "*";
inherits: false
}
@property --tw-slashed-zero {
syntax: "*";
inherits: false
}
@property --tw-numeric-figure {
syntax: "*";
inherits: false
}
@property --tw-numeric-spacing {
syntax: "*";
inherits: false
}
@property --tw-numeric-fraction {
syntax: "*";
inherits: false
}
@property --tw-shadow {
syntax: "*";
inherits: false;
initial-value: 0 0 #0000;
}
@property --tw-shadow-color {
syntax: "*";
inherits: false
}
@property --tw-shadow-alpha {
syntax: "";
inherits: false;
initial-value: 100%;
}
@property --tw-inset-shadow {
syntax: "*";
inherits: false;
initial-value: 0 0 #0000;
}
@property --tw-inset-shadow-color {
syntax: "*";
inherits: false
}
@property --tw-inset-shadow-alpha {
syntax: "";
inherits: false;
initial-value: 100%;
}
@property --tw-ring-color {
syntax: "*";
inherits: false
}
@property --tw-ring-shadow {
syntax: "*";
inherits: false;
initial-value: 0 0 #0000;
}
@property --tw-inset-ring-color {
syntax: "*";
inherits: false
}
@property --tw-inset-ring-shadow {
syntax: "*";
inherits: false;
initial-value: 0 0 #0000;
}
@property --tw-ring-inset {
syntax: "*";
inherits: false
}
@property --tw-ring-offset-width {
syntax: "";
inherits: false;
initial-value: 0;
}
@property --tw-ring-offset-color {
syntax: "*";
inherits: false;
initial-value: #fff;
}
@property --tw-ring-offset-shadow {
syntax: "*";
inherits: false;
initial-value: 0 0 #0000;
}
@property --tw-outline-style {
syntax: "*";
inherits: false;
initial-value: solid;
}
@property --tw-blur {
syntax: "*";
inherits: false
}
@property --tw-brightness {
syntax: "*";
inherits: false
}
@property --tw-contrast {
syntax: "*";
inherits: false
}
@property --tw-grayscale {
syntax: "*";
inherits: false
}
@property --tw-hue-rotate {
syntax: "*";
inherits: false
}
@property --tw-invert {
syntax: "*";
inherits: false
}
@property --tw-opacity {
syntax: "*";
inherits: false
}
@property --tw-saturate {
syntax: "*";
inherits: false
}
@property --tw-sepia {
syntax: "*";
inherits: false
}
@property --tw-drop-shadow {
syntax: "*";
inherits: false
}
@property --tw-drop-shadow-color {
syntax: "*";
inherits: false
}
@property --tw-drop-shadow-alpha {
syntax: "";
inherits: false;
initial-value: 100%;
}
@property --tw-drop-shadow-size {
syntax: "*";
inherits: false
}
@property --tw-backdrop-blur {
syntax: "*";
inherits: false
}
@property --tw-backdrop-brightness {
syntax: "*";
inherits: false
}
@property --tw-backdrop-contrast {
syntax: "*";
inherits: false
}
@property --tw-backdrop-grayscale {
syntax: "*";
inherits: false
}
@property --tw-backdrop-hue-rotate {
syntax: "*";
inherits: false
}
@property --tw-backdrop-invert {
syntax: "*";
inherits: false
}
@property --tw-backdrop-opacity {
syntax: "*";
inherits: false
}
@property --tw-backdrop-saturate {
syntax: "*";
inherits: false
}
@property --tw-backdrop-sepia {
syntax: "*";
inherits: false
}
@property --tw-ease {
syntax: "*";
inherits: false
}
@keyframes spin {
to {
transform: rotate(360deg);
}
}
@keyframes pulse {
50% {
opacity: .5;
}
}
/*# sourceMappingURL=%5Broot-of-the-server%5D__0owfyoo._.css.map*/