@layer force, vendor, tokens, base, components, utilities; @layer vendor { /*! * Bootstrap v5.3.0 (https://getbootstrap.com/) * Copyright 2011-2023 The Bootstrap Authors * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE) */ :root,[data-bs-theme=light]{--bs-blue:#0d6efd;--bs-indigo:#6610f2;--bs-purple:#6f42c1;--bs-pink:#d63384;--bs-red:#dc3545;--bs-orange:#fd7e14;--bs-yellow:#ffc107;--bs-green:#198754;--bs-teal:#20c997;--bs-cyan:#0dcaf0;--bs-black:#000;--bs-white:#fff;--bs-gray:#6c757d;--bs-gray-dark:#343a40;--bs-gray-100:#f8f9fa;--bs-gray-200:#e9ecef;--bs-gray-300:#dee2e6;--bs-gray-400:#ced4da;--bs-gray-500:#adb5bd;--bs-gray-600:#6c757d;--bs-gray-700:#495057;--bs-gray-800:#343a40;--bs-gray-900:#212529;--bs-primary:#0d6efd;--bs-secondary:#6c757d;--bs-success:#198754;--bs-info:#0dcaf0;--bs-warning:#ffc107;--bs-danger:#dc3545;--bs-light:#f8f9fa;--bs-dark:#212529;--bs-primary-rgb:13,110,253;--bs-secondary-rgb:108,117,125;--bs-success-rgb:25,135,84;--bs-info-rgb:13,202,240;--bs-warning-rgb:255,193,7;--bs-danger-rgb:220,53,69;--bs-light-rgb:248,249,250;--bs-dark-rgb:33,37,41;--bs-primary-text-emphasis:#052c65;--bs-secondary-text-emphasis:#2b2f32;--bs-success-text-emphasis:#0a3622;--bs-info-text-emphasis:#055160;--bs-warning-text-emphasis:#664d03;--bs-danger-text-emphasis:#58151c;--bs-light-text-emphasis:#495057;--bs-dark-text-emphasis:#495057;--bs-primary-bg-subtle:#cfe2ff;--bs-secondary-bg-subtle:#e2e3e5;--bs-success-bg-subtle:#d1e7dd;--bs-info-bg-subtle:#cff4fc;--bs-warning-bg-subtle:#fff3cd;--bs-danger-bg-subtle:#f8d7da;--bs-light-bg-subtle:#fcfcfd;--bs-dark-bg-subtle:#ced4da;--bs-primary-border-subtle:#9ec5fe;--bs-secondary-border-subtle:#c4c8cb;--bs-success-border-subtle:#a3cfbb;--bs-info-border-subtle:#9eeaf9;--bs-warning-border-subtle:#ffe69c;--bs-danger-border-subtle:#f1aeb5;--bs-light-border-subtle:#e9ecef;--bs-dark-border-subtle:#adb5bd;--bs-white-rgb:255,255,255;--bs-black-rgb:0,0,0;--bs-font-sans-serif:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--bs-font-monospace:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--bs-gradient:linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));--bs-body-font-family:var(--bs-font-sans-serif);--bs-body-font-size:1rem;--bs-body-font-weight:400;--bs-body-line-height:1.5;--bs-body-color:#212529;--bs-body-color-rgb:33,37,41;--bs-body-bg:#fff;--bs-body-bg-rgb:255,255,255;--bs-emphasis-color:#000;--bs-emphasis-color-rgb:0,0,0;--bs-secondary-color:rgba(33, 37, 41, 0.75);--bs-secondary-color-rgb:33,37,41;--bs-secondary-bg:#e9ecef;--bs-secondary-bg-rgb:233,236,239;--bs-tertiary-color:rgba(33, 37, 41, 0.5);--bs-tertiary-color-rgb:33,37,41;--bs-tertiary-bg:#f8f9fa;--bs-tertiary-bg-rgb:248,249,250;--bs-heading-color:inherit;--bs-link-color:#0d6efd;--bs-link-color-rgb:13,110,253;--bs-link-decoration:underline;--bs-link-hover-color:#0a58ca;--bs-link-hover-color-rgb:10,88,202;--bs-code-color:#d63384;--bs-highlight-bg:#fff3cd;--bs-border-width:1px;--bs-border-style:solid;--bs-border-color:#dee2e6;--bs-border-color-translucent:rgba(0, 0, 0, 0.175);--bs-border-radius:0.375rem;--bs-border-radius-sm:0.25rem;--bs-border-radius-lg:0.5rem;--bs-border-radius-xl:1rem;--bs-border-radius-xxl:2rem;--bs-border-radius-2xl:var(--bs-border-radius-xxl);--bs-border-radius-pill:50rem;--bs-box-shadow:0 0.5rem 1rem rgba(0, 0, 0, 0.15);--bs-box-shadow-sm:0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);--bs-box-shadow-lg:0 1rem 3rem rgba(0, 0, 0, 0.175);--bs-box-shadow-inset:inset 0 1px 2px rgba(0, 0, 0, 0.075);--bs-focus-ring-width:0.25rem;--bs-focus-ring-opacity:0.25;--bs-focus-ring-color:rgba(13, 110, 253, 0.25);--bs-form-valid-color:#198754;--bs-form-valid-border-color:#198754;--bs-form-invalid-color:#dc3545;--bs-form-invalid-border-color:#dc3545} [data-bs-theme=dark]{color-scheme:dark;--bs-body-color:#adb5bd;--bs-body-color-rgb:173,181,189;--bs-body-bg:#212529;--bs-body-bg-rgb:33,37,41;--bs-emphasis-color:#fff;--bs-emphasis-color-rgb:255,255,255;--bs-secondary-color:rgba(173, 181, 189, 0.75);--bs-secondary-color-rgb:173,181,189;--bs-secondary-bg:#343a40;--bs-secondary-bg-rgb:52,58,64;--bs-tertiary-color:rgba(173, 181, 189, 0.5);--bs-tertiary-color-rgb:173,181,189;--bs-tertiary-bg:#2b3035;--bs-tertiary-bg-rgb:43,48,53;--bs-primary-text-emphasis:#6ea8fe;--bs-secondary-text-emphasis:#a7acb1;--bs-success-text-emphasis:#75b798;--bs-info-text-emphasis:#6edff6;--bs-warning-text-emphasis:#ffda6a;--bs-danger-text-emphasis:#ea868f;--bs-light-text-emphasis:#f8f9fa;--bs-dark-text-emphasis:#dee2e6;--bs-primary-bg-subtle:#031633;--bs-secondary-bg-subtle:#161719;--bs-success-bg-subtle:#051b11;--bs-info-bg-subtle:#032830;--bs-warning-bg-subtle:#332701;--bs-danger-bg-subtle:#2c0b0e;--bs-light-bg-subtle:#343a40;--bs-dark-bg-subtle:#1a1d20;--bs-primary-border-subtle:#084298;--bs-secondary-border-subtle:#41464b;--bs-success-border-subtle:#0f5132;--bs-info-border-subtle:#087990;--bs-warning-border-subtle:#997404;--bs-danger-border-subtle:#842029;--bs-light-border-subtle:#495057;--bs-dark-border-subtle:#343a40;--bs-heading-color:inherit;--bs-link-color:#6ea8fe;--bs-link-hover-color:#8bb9fe;--bs-link-color-rgb:110,168,254;--bs-link-hover-color-rgb:139,185,254;--bs-code-color:#e685b5;--bs-border-color:#495057;--bs-border-color-translucent:rgba(255, 255, 255, 0.15);--bs-form-valid-color:#75b798;--bs-form-valid-border-color:#75b798;--bs-form-invalid-color:#ea868f;--bs-form-invalid-border-color:#ea868f} *,::after,::before{box-sizing:border-box} @media (prefers-reduced-motion:no-preference) { :root{scroll-behavior:smooth} } body{margin:0;font-family:var(--bs-body-font-family);font-size:var(--bs-body-font-size);font-weight:var(--bs-body-font-weight);line-height:var(--bs-body-line-height);color:var(--bs-body-color);text-align:var(--bs-body-text-align);background-color:var(--bs-body-bg);-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent} hr{margin:1rem 0;color:inherit;border:0;border-top:var(--bs-border-width) solid;opacity:.25} .h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:.5rem;font-weight:500;line-height:1.2;color:var(--bs-heading-color)} .h1,h1{font-size:calc(1.375rem + 1.5vw)} @media (min-width:1200px) { .h1,h1{font-size:2.5rem} } .h2,h2{font-size:calc(1.325rem + .9vw)} @media (min-width:1200px) { .h2,h2{font-size:2rem} } .h3,h3{font-size:calc(1.3rem + .6vw)} @media (min-width:1200px) { .h3,h3{font-size:1.75rem} } .h4,h4{font-size:calc(1.275rem + .3vw)} @media (min-width:1200px) { .h4,h4{font-size:1.5rem} } .h5,h5{font-size:1.25rem} .h6,h6{font-size:1rem} p{margin-top:0;margin-bottom:1rem} abbr[title]{-webkit-text-decoration:underline dotted;text-decoration:underline dotted;cursor:help;-webkit-text-decoration-skip-ink:none;text-decoration-skip-ink:none} address{margin-bottom:1rem;font-style:normal;line-height:inherit} ol,ul{padding-left:2rem} dl,ol,ul{margin-top:0;margin-bottom:1rem} ol ol,ol ul,ul ol,ul ul{margin-bottom:0} dt{font-weight:700} dd{margin-bottom:.5rem;margin-left:0} blockquote{margin:0 0 1rem} b,strong{font-weight:bolder} .small,small{font-size:.875em} .mark,mark{padding:.1875em;background-color:var(--bs-highlight-bg)} sub,sup{position:relative;font-size:.75em;line-height:0;vertical-align:baseline} sub{bottom:-.25em} sup{top:-.5em} a{color:rgba(var(--bs-link-color-rgb),var(--bs-link-opacity,1));text-decoration:underline} a:hover{--bs-link-color-rgb:var(--bs-link-hover-color-rgb)} a:not([href]):not([class]),a:not([href]):not([class]):hover{color:inherit;text-decoration:none} code,kbd,pre,samp{font-family:var(--bs-font-monospace);font-size:1em} pre{display:block;margin-top:0;margin-bottom:1rem;overflow:auto;font-size:.875em} pre code{font-size:inherit;color:inherit;word-break:normal} code{font-size:.875em;color:var(--bs-code-color);word-wrap:break-word} a>code{color:inherit} kbd{padding:.1875rem .375rem;font-size:.875em;color:var(--bs-body-bg);background-color:var(--bs-body-color);border-radius:.25rem} kbd kbd{padding:0;font-size:1em} figure{margin:0 0 1rem} img,svg{vertical-align:middle} table{caption-side:bottom;border-collapse:collapse} caption{padding-top:.5rem;padding-bottom:.5rem;color:var(--bs-secondary-color);text-align:left} th{text-align:inherit;text-align:-webkit-match-parent} tbody,td,tfoot,th,thead,tr{border-color:inherit;border-style:solid;border-width:0} label{display:inline-block} button{border-radius:0} button:focus:not(:focus-visible){outline:0} button,input,optgroup,select,textarea{margin:0;font-family:inherit;font-size:inherit;line-height:inherit} button,select{text-transform:none} [role=button]{cursor:pointer} select{word-wrap:normal} select:disabled{opacity:1} [list]:not([type=date]):not([type=datetime-local]):not([type=month]):not([type=week]):not([type=time])::-webkit-calendar-picker-indicator{display:none!important} [type=button],[type=reset],[type=submit],button{-webkit-appearance:button} [type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor:pointer} ::-moz-focus-inner{padding:0;border-style:none} textarea{resize:vertical} fieldset{min-width:0;padding:0;margin:0;border:0} legend{float:left;width:100%;padding:0;margin-bottom:.5rem;font-size:calc(1.275rem + .3vw);line-height:inherit} @media (min-width:1200px) { legend{font-size:1.5rem} } legend+*{clear:left} ::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-fields-wrapper,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-text,::-webkit-datetime-edit-year-field{padding:0} ::-webkit-inner-spin-button{height:auto} [type=search]{outline-offset:-2px;-webkit-appearance:textfield} ::-webkit-search-decoration{-webkit-appearance:none} ::-webkit-color-swatch-wrapper{padding:0} ::-webkit-file-upload-button{font:inherit;-webkit-appearance:button} ::file-selector-button{font:inherit;-webkit-appearance:button} output{display:inline-block} iframe{border:0} summary{display:list-item;cursor:pointer} progress{vertical-align:baseline} [hidden]{display:none!important} .lead{font-size:1.25rem;font-weight:300} .display-6{font-size:calc(1.375rem + 1.5vw);font-weight:300;line-height:1.2} @media (min-width:1200px) { .display-6{font-size:2.5rem} } :root{--bs-breakpoint-xs:0;--bs-breakpoint-sm:576px;--bs-breakpoint-md:768px;--bs-breakpoint-lg:992px;--bs-breakpoint-xl:1200px;--bs-breakpoint-xxl:1400px} .form-label{margin-bottom:.5rem} .form-text{margin-top:.25rem;font-size:.875em;color:var(--bs-secondary-color)} .form-control{display:block;width:100%;padding:.375rem .75rem;font-size:1rem;font-weight:400;line-height:1.5;color:var(--bs-body-color);background-color:var(--bs-body-bg);background-clip:padding-box;border:var(--bs-border-width) solid var(--bs-border-color);-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:var(--bs-border-radius);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out} @media (prefers-reduced-motion:reduce) { .form-control{transition:none} } .form-control[type=file]{overflow:hidden} .form-control[type=file]:not(:disabled):not([readonly]){cursor:pointer} .form-control:focus{color:var(--bs-body-color);background-color:var(--bs-body-bg);border-color:#86b7fe;outline:0;box-shadow:0 0 0 .25rem rgba(13,110,253,.25)} .form-control::-webkit-date-and-time-value{min-width:85px;height:1.5em;margin:0} .form-control::-webkit-datetime-edit{display:block;padding:0} .form-control::-moz-placeholder{color:var(--bs-secondary-color);opacity:1} .form-control::placeholder{color:var(--bs-secondary-color);opacity:1} .form-control:disabled{background-color:var(--bs-secondary-bg);opacity:1} .form-control::-webkit-file-upload-button{padding:.375rem .75rem;margin:-.375rem -.75rem;-webkit-margin-end:.75rem;margin-inline-end:.75rem;color:var(--bs-body-color);background-color:var(--bs-tertiary-bg);pointer-events:none;border-color:inherit;border-style:solid;border-width:0;border-inline-end-width:var(--bs-border-width);border-radius:0;-webkit-transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out} .form-control::file-selector-button{padding:.375rem .75rem;margin:-.375rem -.75rem;-webkit-margin-end:.75rem;margin-inline-end:.75rem;color:var(--bs-body-color);background-color:var(--bs-tertiary-bg);pointer-events:none;border-color:inherit;border-style:solid;border-width:0;border-inline-end-width:var(--bs-border-width);border-radius:0;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out} @media (prefers-reduced-motion:reduce) { .form-control::-webkit-file-upload-button{-webkit-transition:none;transition:none} .form-control::file-selector-button{transition:none} } .form-control:hover:not(:disabled):not([readonly])::-webkit-file-upload-button{background-color:var(--bs-secondary-bg)} .form-control:hover:not(:disabled):not([readonly])::file-selector-button{background-color:var(--bs-secondary-bg)} .form-control-lg{min-height:calc(1.5em + 1rem + calc(var(--bs-border-width) * 2));padding:.5rem 1rem;font-size:1.25rem;border-radius:var(--bs-border-radius-lg)} .form-control-lg::-webkit-file-upload-button{padding:.5rem 1rem;margin:-.5rem -1rem;-webkit-margin-end:1rem;margin-inline-end:1rem} .form-control-lg::file-selector-button{padding:.5rem 1rem;margin:-.5rem -1rem;-webkit-margin-end:1rem;margin-inline-end:1rem} textarea.form-control{min-height:calc(1.5em + .75rem + calc(var(--bs-border-width) * 2))} textarea.form-control-lg{min-height:calc(1.5em + 1rem + calc(var(--bs-border-width) * 2))} .form-control.is-valid,.was-validated .form-control:valid{border-color:var(--bs-form-valid-border-color);padding-right:calc(1.5em + .75rem);background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right calc(.375em + .1875rem) center;background-size:calc(.75em + .375rem) calc(.75em + .375rem)} .form-control.is-valid:focus,.was-validated .form-control:valid:focus{border-color:var(--bs-form-valid-border-color);box-shadow:0 0 0 .25rem rgba(var(--bs-success-rgb),.25)} .was-validated textarea.form-control:valid,textarea.form-control.is-valid{padding-right:calc(1.5em + .75rem);background-position:top calc(.375em + .1875rem) right calc(.375em + .1875rem)} .form-control.is-invalid,.was-validated .form-control:invalid{border-color:var(--bs-form-invalid-border-color);padding-right:calc(1.5em + .75rem);background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right calc(.375em + .1875rem) center;background-size:calc(.75em + .375rem) calc(.75em + .375rem)} .form-control.is-invalid:focus,.was-validated .form-control:invalid:focus{border-color:var(--bs-form-invalid-border-color);box-shadow:0 0 0 .25rem rgba(var(--bs-danger-rgb),.25)} .was-validated textarea.form-control:invalid,textarea.form-control.is-invalid{padding-right:calc(1.5em + .75rem);background-position:top calc(.375em + .1875rem) right calc(.375em + .1875rem)} .btn{--bs-btn-padding-x:0.75rem;--bs-btn-padding-y:0.375rem;--bs-btn-font-family: ;--bs-btn-font-size:1rem;--bs-btn-font-weight:400;--bs-btn-line-height:1.5;--bs-btn-color:var(--bs-body-color);--bs-btn-bg:transparent;--bs-btn-border-width:var(--bs-border-width);--bs-btn-border-color:transparent;--bs-btn-border-radius:var(--bs-border-radius);--bs-btn-hover-border-color:transparent;--bs-btn-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.15),0 1px 1px rgba(0, 0, 0, 0.075);--bs-btn-disabled-opacity:0.65;--bs-btn-focus-box-shadow:0 0 0 0.25rem rgba(var(--bs-btn-focus-shadow-rgb), .5);display:inline-block;padding:var(--bs-btn-padding-y) var(--bs-btn-padding-x);font-family:var(--bs-btn-font-family);font-size:var(--bs-btn-font-size);font-weight:var(--bs-btn-font-weight);line-height:var(--bs-btn-line-height);color:var(--bs-btn-color);text-align:center;text-decoration:none;vertical-align:middle;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;border:var(--bs-btn-border-width) solid var(--bs-btn-border-color);border-radius:var(--bs-btn-border-radius);background-color:var(--bs-btn-bg);transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out} @media (prefers-reduced-motion:reduce) { .btn{transition:none} } .btn:hover{color:var(--bs-btn-hover-color);background-color:var(--bs-btn-hover-bg);border-color:var(--bs-btn-hover-border-color)} .btn:focus-visible{color:var(--bs-btn-hover-color);background-color:var(--bs-btn-hover-bg);border-color:var(--bs-btn-hover-border-color);outline:0;box-shadow:var(--bs-btn-focus-box-shadow)} .btn-check:checked+.btn,.btn.active,.btn.show,.btn:first-child:active,:not(.btn-check)+.btn:active{color:var(--bs-btn-active-color);background-color:var(--bs-btn-active-bg);border-color:var(--bs-btn-active-border-color)} .btn-check:checked+.btn:focus-visible,.btn.active:focus-visible,.btn.show:focus-visible,.btn:first-child:active:focus-visible,:not(.btn-check)+.btn:active:focus-visible{box-shadow:var(--bs-btn-focus-box-shadow)} .btn.disabled,.btn:disabled,fieldset:disabled .btn{color:var(--bs-btn-disabled-color);pointer-events:none;background-color:var(--bs-btn-disabled-bg);border-color:var(--bs-btn-disabled-border-color);opacity:var(--bs-btn-disabled-opacity)} .btn-primary{--bs-btn-color:#fff;--bs-btn-bg:#0d6efd;--bs-btn-border-color:#0d6efd;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#0b5ed7;--bs-btn-hover-border-color:#0a58ca;--bs-btn-focus-shadow-rgb:49,132,253;--bs-btn-active-color:#fff;--bs-btn-active-bg:#0a58ca;--bs-btn-active-border-color:#0a53be;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#0d6efd;--bs-btn-disabled-border-color:#0d6efd} .btn-outline-primary{--bs-btn-color:#0d6efd;--bs-btn-border-color:#0d6efd;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#0d6efd;--bs-btn-hover-border-color:#0d6efd;--bs-btn-focus-shadow-rgb:13,110,253;--bs-btn-active-color:#fff;--bs-btn-active-bg:#0d6efd;--bs-btn-active-border-color:#0d6efd;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#0d6efd;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#0d6efd;--bs-gradient:none} .btn-outline-secondary{--bs-btn-color:#6c757d;--bs-btn-border-color:#6c757d;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#6c757d;--bs-btn-hover-border-color:#6c757d;--bs-btn-focus-shadow-rgb:108,117,125;--bs-btn-active-color:#fff;--bs-btn-active-bg:#6c757d;--bs-btn-active-border-color:#6c757d;--bs-btn-active-shadow:inset 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color:#6c757d;--bs-btn-disabled-bg:transparent;--bs-btn-disabled-border-color:#6c757d;--bs-gradient:none} .btn-group-lg>.btn,.btn-lg{--bs-btn-padding-y:0.5rem;--bs-btn-padding-x:1rem;--bs-btn-font-size:1.25rem;--bs-btn-border-radius:var(--bs-border-radius-lg)} .btn-group-sm>.btn,.btn-sm{--bs-btn-padding-y:0.25rem;--bs-btn-padding-x:0.5rem;--bs-btn-font-size:0.875rem;--bs-btn-border-radius:var(--bs-border-radius-sm)} .fade{transition:opacity .15s linear} @media (prefers-reduced-motion:reduce) { .fade{transition:none} } .fade:not(.show){opacity:0} .collapsing{height:0;overflow:hidden;transition:height .35s ease} @media (prefers-reduced-motion:reduce) { .collapsing{transition:none} } .nav{--bs-nav-link-padding-x:1rem;--bs-nav-link-padding-y:0.5rem;--bs-nav-link-font-weight: ;--bs-nav-link-color:var(--bs-link-color);--bs-nav-link-hover-color:var(--bs-link-hover-color);--bs-nav-link-disabled-color:var(--bs-secondary-color);display:flex;flex-wrap:wrap;padding-left:0;margin-bottom:0;list-style:none} .card{--bs-card-spacer-y:1rem;--bs-card-spacer-x:1rem;--bs-card-title-spacer-y:0.5rem;--bs-card-title-color: ;--bs-card-subtitle-color: ;--bs-card-border-width:var(--bs-border-width);--bs-card-border-color:var(--bs-border-color-translucent);--bs-card-border-radius:var(--bs-border-radius);--bs-card-box-shadow: ;--bs-card-inner-border-radius:calc(var(--bs-border-radius) - (var(--bs-border-width)));--bs-card-cap-padding-y:0.5rem;--bs-card-cap-padding-x:1rem;--bs-card-cap-bg:rgba(var(--bs-body-color-rgb), 0.03);--bs-card-cap-color: ;--bs-card-height: ;--bs-card-color: ;--bs-card-bg:var(--bs-body-bg);--bs-card-img-overlay-padding:1rem;--bs-card-group-margin:0.75rem;position:relative;display:flex;flex-direction:column;min-width:0;height:var(--bs-card-height);color:var(--bs-body-color);word-wrap:break-word;background-color:var(--bs-card-bg);background-clip:border-box;border:var(--bs-card-border-width) solid var(--bs-card-border-color);border-radius:var(--bs-card-border-radius)} .card>hr{margin-right:0;margin-left:0} .card-body{flex:1 1 auto;padding:var(--bs-card-spacer-y) var(--bs-card-spacer-x);color:var(--bs-card-color)} .card-title{margin-bottom:var(--bs-card-title-spacer-y);color:var(--bs-card-title-color)} .alert{--bs-alert-bg:transparent;--bs-alert-padding-x:1rem;--bs-alert-padding-y:1rem;--bs-alert-margin-bottom:1rem;--bs-alert-color:inherit;--bs-alert-border-color:transparent;--bs-alert-border:var(--bs-border-width) solid var(--bs-alert-border-color);--bs-alert-border-radius:var(--bs-border-radius);--bs-alert-link-color:inherit;position:relative;padding:var(--bs-alert-padding-y) var(--bs-alert-padding-x);margin-bottom:var(--bs-alert-margin-bottom);color:var(--bs-alert-color);background-color:var(--bs-alert-bg);border:var(--bs-alert-border);border-radius:var(--bs-alert-border-radius)} .alert-info{--bs-alert-color:var(--bs-info-text-emphasis);--bs-alert-bg:var(--bs-info-bg-subtle);--bs-alert-border-color:var(--bs-info-border-subtle);--bs-alert-link-color:var(--bs-info-text-emphasis)} .alert-danger{--bs-alert-color:var(--bs-danger-text-emphasis);--bs-alert-bg:var(--bs-danger-bg-subtle);--bs-alert-border-color:var(--bs-danger-border-subtle);--bs-alert-link-color:var(--bs-danger-text-emphasis)} .progress,.progress-stacked{--bs-progress-height:1rem;--bs-progress-font-size:0.75rem;--bs-progress-bg:var(--bs-secondary-bg);--bs-progress-border-radius:var(--bs-border-radius);--bs-progress-box-shadow:var(--bs-box-shadow-inset);--bs-progress-bar-color:#fff;--bs-progress-bar-bg:#0d6efd;--bs-progress-bar-transition:width 0.6s ease;display:flex;height:var(--bs-progress-height);overflow:hidden;font-size:var(--bs-progress-font-size);background-color:var(--bs-progress-bg);border-radius:var(--bs-progress-border-radius)} .btn-close{--bs-btn-close-color:#000;--bs-btn-close-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e");--bs-btn-close-opacity:0.5;--bs-btn-close-hover-opacity:0.75;--bs-btn-close-focus-shadow:0 0 0 0.25rem rgba(13, 110, 253, 0.25);--bs-btn-close-focus-opacity:1;--bs-btn-close-disabled-opacity:0.25;--bs-btn-close-white-filter:invert(1) grayscale(100%) brightness(200%);box-sizing:content-box;width:1em;height:1em;padding:.25em .25em;color:var(--bs-btn-close-color);background:transparent var(--bs-btn-close-bg) center/1em auto no-repeat;border:0;border-radius:.375rem;opacity:var(--bs-btn-close-opacity)} .btn-close:hover{color:var(--bs-btn-close-color);text-decoration:none;opacity:var(--bs-btn-close-hover-opacity)} .btn-close:focus{outline:0;box-shadow:var(--bs-btn-close-focus-shadow);opacity:var(--bs-btn-close-focus-opacity)} .btn-close.disabled,.btn-close:disabled{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--bs-btn-close-disabled-opacity)} .btn-close-white{filter:var(--bs-btn-close-white-filter)} [data-bs-theme=dark] .btn-close{filter:var(--bs-btn-close-white-filter)} .toast{--bs-toast-zindex:1090;--bs-toast-padding-x:0.75rem;--bs-toast-padding-y:0.5rem;--bs-toast-spacing:1.5rem;--bs-toast-max-width:350px;--bs-toast-font-size:0.875rem;--bs-toast-color: ;--bs-toast-bg:rgba(var(--bs-body-bg-rgb), 0.85);--bs-toast-border-width:var(--bs-border-width);--bs-toast-border-color:var(--bs-border-color-translucent);--bs-toast-border-radius:var(--bs-border-radius);--bs-toast-box-shadow:var(--bs-box-shadow);--bs-toast-header-color:var(--bs-secondary-color);--bs-toast-header-bg:rgba(var(--bs-body-bg-rgb), 0.85);--bs-toast-header-border-color:var(--bs-border-color-translucent);width:var(--bs-toast-max-width);max-width:100%;font-size:var(--bs-toast-font-size);color:var(--bs-toast-color);pointer-events:auto;background-color:var(--bs-toast-bg);background-clip:padding-box;border:var(--bs-toast-border-width) solid var(--bs-toast-border-color);box-shadow:var(--bs-toast-box-shadow);border-radius:var(--bs-toast-border-radius)} .toast.showing{opacity:0} .toast:not(.show){display:none} .toast-body{padding:var(--bs-toast-padding-x);word-wrap:break-word} .placeholder{display:inline-block;min-height:1em;vertical-align:middle;cursor:wait;background-color:currentcolor;opacity:.5} .placeholder.btn::before{display:inline-block;content:""} .text-bg-primary{color:#fff!important;background-color:RGBA(13,110,253,var(--bs-bg-opacity,1))!important} .text-bg-success{color:#fff!important;background-color:RGBA(25,135,84,var(--bs-bg-opacity,1))!important} .text-bg-warning{color:#000!important;background-color:RGBA(255,193,7,var(--bs-bg-opacity,1))!important} .text-bg-danger{color:#fff!important;background-color:RGBA(220,53,69,var(--bs-bg-opacity,1))!important} .visually-hidden,.visually-hidden-focusable:not(:focus):not(:focus-within){width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important} .visually-hidden-focusable:not(:focus):not(:focus-within):not(caption),.visually-hidden:not(caption){position:absolute!important} .text-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .d-flex{display:flex!important} .border-0{border:0!important} .w-100{width:100%!important} .align-items-start{align-items:flex-start!important} .align-items-center{align-items:center!important} .m-auto{margin:auto!important} .my-3{margin-top:1rem!important;margin-bottom:1rem!important} .mt-2{margin-top:.5rem!important} .mt-3{margin-top:1rem!important} .me-1{margin-right:.25rem!important} .me-2{margin-right:.5rem!important} .mb-0{margin-bottom:0!important} .mb-2{margin-bottom:.5rem!important} .mb-3{margin-bottom:1rem!important} .mb-4{margin-bottom:1.5rem!important} .ms-auto{margin-left:auto!important} .py-2{padding-top:.5rem!important;padding-bottom:.5rem!important} .gap-2{gap:.5rem!important} .fs-4{font-size:calc(1.275rem + .3vw)!important} .fs-5{font-size:1.25rem!important} .fw-normal{font-weight:400!important} .fw-semibold{font-weight:600!important} .fw-bold{font-weight:700!important} .text-center{text-align:center!important} .text-muted{--bs-text-opacity:1;color:var(--bs-secondary-color)!important} @media (min-width:1200px) { .fs-4{font-size:1.5rem!important} } } @layer force { .app-content > .text-muted, .app-content > .bi-report > .text-muted, .auth-foot .text-muted { color: var(--ground-ink-muted) !important; } } @layer tokens { :root { color-scheme: only light; --bg: #2c509b; --surface: #ffffff; --surface-muted: #f4f6fa; --surface-sunken: #dfe5f0; --surface-hover: rgba(44,80,155,.055); --ground-shade: rgba(6,14,34,.22); --glass: rgba(223,229,240,.82); --glass-strong: rgba(223,229,240,.94); --glass-blur: 18px; --surface-raised: rgba(255,255,255,.92); --glass-solid: #e1e6f1; --ground-ink: #ffffff; --ground-ink-muted: rgba(255,255,255,.80); --ground-accent: #e3c894; --ground-success: #6ee7b7; --ground-warning: #fcd34d; --ground-danger: #fdbcbc; --ground-info: #67e8f9; --ground-wash: rgba(255,255,255,.14); --ground-line: rgba(255,255,255,.22); --night: color-mix(in srgb, var(--primary) 24%, #000); --night-2: color-mix(in srgb, var(--primary) 46%, #000); --night-deep: color-mix(in srgb, var(--primary) 13%, #000); --shell: #d2ab67; --shell-strong: #d2ab67; --shell-solid: #d2ab67; --shell-ink: #16222a; --shell-ink-muted: #1b2a33; --shell-ink-faint: #2e424c; --shell-line: rgba(36,54,63,.22); --shell-hover: rgba(36,54,63,.10); --shell-well: rgba(36,54,63,.07); --shell-well-strong: rgba(36,54,63,.14); --shell-danger: #7a1212; --shell-active-ink: #ffffff; --border: rgba(44,80,155,.14); --border-strong: rgba(44,80,155,.22); --surface-border: var(--border); --text: #101728; --muted: #515f7a; --faint: #57647c; --primary: #2c509b; --primary-dark: #24457f; --primary-2: #3a6ab0; --primary-contrast: #ffffff; --primary-soft: color-mix(in srgb, var(--primary) 10%, transparent); --primary-text: #24457f; --primary-line: color-mix(in srgb, var(--primary) 24%, transparent); --grad-from: #2c509b; --grad-to: #24363f; --grad-from-hover: #24457f; --grad-to-hover: #1a2a33; --grad-primary: linear-gradient(135deg, #2c509b, #24363f); --grad-primary-hover: linear-gradient(135deg, #24457f, #1a2a33); --grad-primary-text: var(--grad-primary); --accent: #8f6c30; --accent-soft: color-mix(in srgb, var(--accent) 10%, transparent); --accent-ink: #80622f; --success: #0e7a4a; --success-soft: rgba(16,185,129,.13); --warning: #9a5b08; --warning-soft: rgba(245,158,11,.15); --danger: #c02626; --danger-soft: rgba(220,38,38,.10); --info: #0369a1; --info-soft: rgba(14,165,233,.12); --success-fill: #10b981; --success-fill-strong: #059669; --warning-fill: #f59e0b; --warning-fill-strong: #d97706; --warning-fill-deep: #f97316; --urgent: #ea580c; --urgent-soft: rgba(234, 88, 12, .04); --danger-fill: #ef4444; --danger-fill-strong: #dc2626; --accent-fill: #d2ab67; --accent-fill-strong: #b8904a; --live: #34d399; --excel: #16a765; --excel-strong: #0f9d58; --chart-revenue: #2c509b; --chart-expense: #b8904a; --bi-cat-1: #118dff; --bi-cat-2: #e66c37; --bi-cat-3: #12239e; --bi-cat-4: #6b007b; --bi-cat-5: #e044a7; --bi-cat-6: #744ec2; --bi-cat-7: #d9b300; --bi-cat-8: #d64550; --bi-good: #1aab40; --bi-warn: #d9b300; --bi-bad: #d64550; --bi-canvas: #f1f1f1; --bi-visual: #ffffff; --bi-line: #e1dfdd; --bi-line-soft: #edebe9; --bi-ink: #252423; --bi-ink-2: #605e5c; --bi-chrome: #f3f2f1; --bi-chrome-hover: #edebe9; --bi-accent: #0078d4; --bi-accent-dark: #106ebe; --bi-font: 'Segoe UI', 'Segoe UI Variable Text', system-ui, -apple-system, 'Inter Variable', Inter, sans-serif; --bi-radius: 4px; --bi-shadow: 0 1.6px 3.6px rgba(0,0,0,.09), 0 .3px .9px rgba(0,0,0,.06); --bi-shadow-hover: 0 3.2px 7.2px rgba(0,0,0,.11), 0 .6px 1.8px rgba(0,0,0,.08); --bi-shadow-focus: 0 25.6px 57.6px rgba(0,0,0,.22), 0 4.8px 14.4px rgba(0,0,0,.18); --shadow-sm: 0 1px 2px rgba(6,14,34,.16), 0 1px 3px rgba(6,14,34,.14); --shadow-md: 0 2px 6px rgba(6,14,34,.16), 0 10px 26px rgba(6,14,34,.20); --shadow-lg: 0 14px 34px rgba(6,14,34,.30), 0 3px 8px rgba(6,14,34,.18); --shadow-up: 0 -2px 14px rgba(6,14,34,.22); --shadow-glow: 0 6px 20px color-mix(in srgb, var(--primary) 28%, transparent); --shadow-glow-strong: 0 8px 24px color-mix(in srgb, var(--primary) 34%, transparent); --card-shadow: var(--shadow-md); --glow-accent: 0 6px 20px color-mix(in srgb, var(--accent-fill-strong) 26%, transparent); --glow-success: 0 6px 20px color-mix(in srgb, var(--success-fill) 32%, transparent); --glow-warning: 0 6px 20px color-mix(in srgb, var(--warning-fill) 32%, transparent); --glow-danger: 0 6px 20px color-mix(in srgb, var(--danger-fill-strong) 32%, transparent); --radius-xs: .25rem; --radius-sm: .55rem; --radius: .8rem; --radius-lg: 1.1rem; --radius-xl: 1.5rem; --radius-pill: 999px; --radius-round: 50%; --bs-border-radius-sm: var(--radius-xs); --bs-border-radius: var(--radius-sm); --bs-border-radius-lg: var(--radius); --bs-border-radius-xl: var(--radius-lg); --bs-border-radius-xxl: var(--radius-xl); --bs-border-radius-pill: var(--radius-pill); --bs-body-font-size: var(--text-base); --rail: 3px; --hairline: 1px; --ring-w: 2px; --ring-w-lg: 3px; --ring: 0 0 0 var(--ring-w-lg) color-mix(in srgb, var(--primary) 32%, transparent); --ring-cut: 0 0 0 var(--ring-w) var(--surface); --edge-light: inset 0 1px 0 rgba(255,255,255,.65); --edge-light-soft: inset 0 1px 0 rgba(255,255,255,.4); --dur-1: .12s; --dur-2: .18s; --dur-3: .32s; --dur-4: .7s; --ease-out: cubic-bezier(.22,.61,.36,1); --ease-in-out: cubic-bezier(.65,0,.35,1); --ease-spring: cubic-bezier(.34,1.4,.64,1); --spin: .65s; --beat-fast: 1.1s; --beat: 1.4s; --beat-slow: 2s; --drift-a: 19s; --drift-b: 25s; --drift-c: 31s; --drift-slow: 52s; --drift-tick: 37s; --space-0: .125rem; --space-1: .25rem; --space-1-5: .375rem; --space-2: .5rem; --space-3: .75rem; --space-4: 1rem; --space-5: 1.5rem; --space-6: 2rem; --space-6-5: 2.5rem; --space-7: 3rem; --text-2xs: .66rem; --text-xs: .74rem; --text-sm: .84rem; --text-md: .92rem; --text-base: 1rem; --text-lg: 1.15rem; --text-xl: 1.32rem; --text-2xl: 1.6rem; --text-3xl: 2rem; --display-sm: clamp(1.35rem, 1.22rem + .5vw, 1.72rem); --display-md: clamp(1.9rem, 3.2vw, 2.7rem); --display-lg: clamp(3.5rem, 12vw, 5.5rem); --display-hero: clamp(2rem, 1.1rem + 3.3vw, 3.6rem); --display-section: clamp(1.6rem, 1.05rem + 1.55vw, 2.4rem); --sidebar-w: 268px; --topbar-h: 62px; --land-col: 78rem; --land-gutter: var(--space-5); --pub-bar-h: 3.875rem; --entry-chart: url('../img/grafiku.svg'); --entry-chart-line: url('../img/grafiku-vija.svg'); --entry-chart-past: url('../img/grafiku-vjet.svg'); --entry-chart-dots-a: url('../img/grafiku-pikat-a.svg'); --entry-chart-dots-b: url('../img/grafiku-pikat-b.svg'); --entry-photo: url('../img/hyrja-tavolina.webp'); --app-scene: url('../img/tavolina.svg'); --grain: url('../img/grain.svg'); --land-shot-1: url('../img/kryefaqja-libri.svg'); --land-shot-2: url('../img/kryefaqja-analitika.jpg'); --land-shot-3: url('../img/kryefaqja-dokumentet.jpg'); --land-phone-2: url('../img/kryefaqja-analitika-telefon.jpg'); --land-phone-3: url('../img/kryefaqja-dokumentet-telefon.jpg'); --tur-kopertina: url('../video/tur-sq.webp'); --tur-kopertina-telefon: url('../video/tur-sq-telefon.webp'); --tm-accent: #6264a7; --tm-accent-soft: rgba(98,100,167,.14); --tm-accent-faint: rgba(98,100,167,.06); --tm-accent-line: rgba(98,100,167,.30); --grad-tm-from: #6264a7; --grad-tm-to: #6668bb; --grad-tm: linear-gradient(135deg, var(--grad-tm-from), var(--grad-tm-to)); --tm-contrast: #ffffff; } @property --grad-angle { syntax: ''; inherits: false; initial-value: 135deg; } @property --spot-x { syntax: ''; inherits: true; initial-value: 50%; } @property --spot-y { syntax: ''; inherits: true; initial-value: 0%; } @property --spot-o { syntax: ''; inherits: true; initial-value: 0; } @supports (transition-timing-function: linear(0, 1)) { :root { --ease-spring: linear( 0, 0.218 5%, 0.68 12%, 0.898 17%, 1.02 22%, 1.075 27%, 1.073 33%, 1.03 40%, 0.994 50%, 0.986 60%, 1.002 78%, 1 ); } } :root:lang(en) { --land-shot-2: url('../img/kryefaqja-analitika-en.jpg'); --land-shot-3: url('../img/kryefaqja-dokumentet-en.jpg'); --land-phone-2: url('../img/kryefaqja-analitika-telefon-en.jpg'); --land-phone-3: url('../img/kryefaqja-dokumentet-telefon-en.jpg'); --tur-kopertina: url('../video/tur-en.webp'); --tur-kopertina-telefon: url('../video/tur-en-telefon.webp'); } @supports (background-image: image-set(url('../img/kryefaqja-analitika.avif') type('image/avif'))) { :root { --land-shot-2: image-set(url('../img/kryefaqja-analitika.avif') type('image/avif'), url('../img/kryefaqja-analitika.webp') type('image/webp')); --land-shot-3: image-set(url('../img/kryefaqja-dokumentet.avif') type('image/avif'), url('../img/kryefaqja-dokumentet.webp') type('image/webp')); --land-phone-2: image-set(url('../img/kryefaqja-analitika-telefon.avif') type('image/avif'), url('../img/kryefaqja-analitika-telefon.webp') type('image/webp')); --land-phone-3: image-set(url('../img/kryefaqja-dokumentet-telefon.avif') type('image/avif'), url('../img/kryefaqja-dokumentet-telefon.webp') type('image/webp')); --tur-kopertina: image-set(url('../video/tur-sq.avif') type('image/avif'), url('../video/tur-sq.webp') type('image/webp')); --tur-kopertina-telefon: image-set(url('../video/tur-sq-telefon.avif') type('image/avif'), url('../video/tur-sq-telefon.webp') type('image/webp')); } :root:lang(en) { --land-shot-2: image-set(url('../img/kryefaqja-analitika-en.avif') type('image/avif'), url('../img/kryefaqja-analitika-en.webp') type('image/webp')); --land-shot-3: image-set(url('../img/kryefaqja-dokumentet-en.avif') type('image/avif'), url('../img/kryefaqja-dokumentet-en.webp') type('image/webp')); --land-phone-2: image-set(url('../img/kryefaqja-analitika-telefon-en.avif') type('image/avif'), url('../img/kryefaqja-analitika-telefon-en.webp') type('image/webp')); --land-phone-3: image-set(url('../img/kryefaqja-dokumentet-telefon-en.avif') type('image/avif'), url('../img/kryefaqja-dokumentet-telefon-en.webp') type('image/webp')); --tur-kopertina: image-set(url('../video/tur-en.avif') type('image/avif'), url('../video/tur-en.webp') type('image/webp')); --tur-kopertina-telefon: image-set(url('../video/tur-en-telefon.avif') type('image/avif'), url('../video/tur-en-telefon.webp') type('image/webp')); } } } @layer base { body { font-family: 'Inter Variable', Inter, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; background: var(--bg); color: var(--text); min-height: 100vh; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: hidden; accent-color: var(--primary); caret-color: var(--primary); font-optical-sizing: auto; } body::before { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(900px 480px at 8% -10%, color-mix(in srgb, var(--grad-to) 10%, transparent) 0%, color-mix(in srgb, var(--grad-to) 6.2%, transparent) 20%, color-mix(in srgb, var(--grad-to) 3.4%, transparent) 38%, color-mix(in srgb, var(--grad-to) 1.5%, transparent) 55%, color-mix(in srgb, var(--grad-to) 0.5%, transparent) 72%, transparent 90%), radial-gradient(760px 420px at 96% -6%, color-mix(in srgb, var(--grad-to) 9%, transparent) 0%, color-mix(in srgb, var(--grad-to) 5.58%, transparent) 20%, color-mix(in srgb, var(--grad-to) 3.06%, transparent) 38%, color-mix(in srgb, var(--grad-to) 1.35%, transparent) 55%, color-mix(in srgb, var(--grad-to) 0.45%, transparent) 72%, transparent 90%), radial-gradient(680px 460px at 78% 108%, color-mix(in srgb, var(--grad-to) 8%, transparent) 0%, color-mix(in srgb, var(--grad-to) 4.96%, transparent) 20%, color-mix(in srgb, var(--grad-to) 2.72%, transparent) 38%, color-mix(in srgb, var(--grad-to) 1.2%, transparent) 55%, color-mix(in srgb, var(--grad-to) 0.4%, transparent) 72%, transparent 90%), linear-gradient(155deg, color-mix(in srgb, var(--grad-to) 4%, transparent) 0%, color-mix(in srgb, var(--grad-to) 3%, transparent) 46%, transparent 74%), linear-gradient(180deg, transparent 38%, var(--ground-shade) 100%); } @supports ((-webkit-mask-image: url('')) or (mask-image: url(''))) { body::after { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; background: radial-gradient(46% 46% at 74% 106%, var(--accent) 0%, transparent 58%), radial-gradient(62% 62% at 104% 66%, var(--primary-2) 0%, transparent 60%), radial-gradient(86% 86% at 88% 92%, var(--primary) 0%, transparent 66%); -webkit-mask: var(--app-scene) center / contain no-repeat; mask: var(--app-scene) center / contain no-repeat; opacity: .22; animation: sceneDrift var(--drift-slow) var(--ease-in-out) infinite alternate; } } @keyframes sceneDrift { from { transform: translate3d(-.6%, -.4%, 0) scale(1); } to { transform: translate3d(.6%, .4%, 0) scale(1.035); } } body:has(.entry)::after { display: none; } @media (max-width: 900px) { body::after { display: none; } } @media (prefers-contrast: more) { body::after { display: none; } } @supports ((-webkit-mask-image: url('')) or (mask-image: url(''))) { .app-shell::after { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; background: var(--text); -webkit-mask: var(--grain) 0 0 / 180px 180px repeat; mask: var(--grain) 0 0 / 180px 180px repeat; opacity: .014; } body:has(.entry) .app-shell::after { display: none; } } @media (forced-colors: active) { .app-shell::after { display: none; } } @media (prefers-contrast: more) { .app-shell::after { display: none; } } @supports (font-variation-settings: normal) { body { font-feature-settings: 'cv02','cv03','cv04','cv11'; } } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: 'Inter Variable', Inter, system-ui, sans-serif; letter-spacing: -.02em; font-weight: 700; text-wrap: balance; } p, .page-sub, .empty-text, .stat-note, .form-text { text-wrap: pretty; } ::selection { background: var(--shell); color: var(--shell-ink); } :is(.app-topbar, .app-sidebar, .bottom-nav) ::selection { background: var(--shell-ink); color: var(--shell); } * { scrollbar-width: thin; scrollbar-color: var(--border-strong) transparent; } *::-webkit-scrollbar { width: 10px; height: 10px; } *::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: var(--radius-pill); border: 3px solid transparent; background-clip: padding-box; } *::-webkit-scrollbar-track { background: transparent; } .table td, .table th, .money, .task-col-count, .badge, .chip, input[type="number"], .stat-value { font-variant-numeric: tabular-nums; font-feature-settings: 'tnum' 1; } a:not(.btn) { color: var(--primary-text); text-underline-offset: .18em; } a:not(.btn):hover { color: var(--primary); } hr { border-color: var(--border); opacity: 1; } code, kbd, pre, samp { font-family: 'JetBrains Mono Variable', 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; } code { color: var(--primary-text); background: var(--primary-soft); padding: var(--space-0) var(--space-1-5); border-radius: var(--radius-xs); font-size: .875em; } kbd, .kbd { display: inline-flex; align-items: center; gap: var(--space-0); background: var(--surface-muted); color: var(--muted); border: 1px solid var(--border-strong); border-bottom-width: 2px; border-radius: var(--radius-xs); padding: var(--space-0) var(--space-1-5); font-size: var(--text-xs); font-weight: 600; line-height: 1.5; } .text-muted { color: var(--muted) !important; } } @layer components { .app-shell { display: flex; min-height: 100vh; } .app-topbar :is(.btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-dark, .btn-outline-light, .btn-link), .app-sidebar :is(.btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-dark, .btn-outline-light, .btn-link) { --bs-btn-color: var(--shell-ink); --bs-btn-border-color: var(--shell-line); --bs-btn-hover-color: var(--shell); --bs-btn-hover-bg: var(--shell-ink); --bs-btn-hover-border-color: var(--shell-ink); --bs-btn-active-color: var(--shell); --bs-btn-active-bg: var(--shell-ink); --bs-btn-active-border-color: var(--shell-ink); --bs-btn-disabled-color: var(--shell-ink-faint); --bs-btn-disabled-border-color: var(--shell-line); } .app-main { flex: 1; min-width: 0; display: flex; flex-direction: column; } .app-topbar { position: sticky; top: 0; z-index: 1030; display: flex; align-items: center; gap: var(--space-3); min-height: var(--topbar-h); padding: var(--space-2) var(--space-4); background: var(--shell); border-bottom: 1px solid var(--shell-line); } @supports (animation-timeline: scroll()) { @media (prefers-reduced-motion: no-preference) { .app-topbar { animation-name: topbarLift; animation-fill-mode: both; animation-timing-function: linear; animation-timeline: scroll(root block); animation-range: 0 96px; } } } @keyframes topbarLift { from { box-shadow: 0 0 0 rgba(0,0,0,0); } to { box-shadow: var(--shadow-md); } } @supports (animation-timeline: scroll()) { @media (prefers-reduced-motion: no-preference) { .app-topbar::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--grad-primary); transform: scaleX(0); transform-origin: left center; pointer-events: none; animation-name: readProgress; animation-fill-mode: both; animation-timing-function: linear; animation-timeline: scroll(root block); } } } @keyframes readProgress { from { transform: scaleX(0); } to { transform: scaleX(1); } } .app-content { flex: 1; padding: var(--space-5) var(--space-5) var(--space-6-5); animation: pageFade var(--dur-3) var(--ease-out) backwards; } @keyframes pageFade { from { opacity: 0; } to { opacity: 1; } } .app-foot { margin-top: var(--space-6); text-align: center; font-size: var(--text-xs); letter-spacing: .02em; color: var(--ground-ink-muted); } .app-foot-mark { color: var(--ground-ink); font-weight: 700; } @media (max-width: 576px) { .app-content { padding: var(--space-4) var(--space-3) var(--space-6); } .app-topbar { padding: var(--space-2) var(--space-3); } } @keyframes pageIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } } :root { --bottomnav-h: 0px; } @media (max-width: 991.98px) { :root { --bottomnav-h: calc(3.55rem + env(safe-area-inset-bottom)); } .app-content { padding-bottom: calc(var(--space-5) + var(--bottomnav-h)); } } @media (min-width: 75em) { .app-topbar:has(> .pub-nav) { padding-inline: max(var(--space-4), calc((100% - var(--land-col)) / 2)); } } .pub-nav { display: flex; align-items: center; gap: var(--space-1); margin-inline-start: var(--space-2); } .pub-nav-link { padding: var(--space-2) var(--space-3); border-radius: var(--radius-sm); border-bottom: 2px solid transparent; color: var(--shell-ink-muted); font-size: var(--text-base); font-weight: 500; text-decoration: none; white-space: nowrap; transition: color var(--dur-2) var(--ease-out), background-color var(--dur-2) var(--ease-out); } .pub-nav-link:hover, .pub-nav-link:focus-visible { color: var(--shell-ink); background: var(--shell-hover); } .pub-nav-link.active { color: var(--shell-ink); border-bottom-color: var(--shell-ink); } .pub-nav-drop { position: relative; display: flex; } .pub-nav-caret { margin-inline-start: var(--space-1); font-size: var(--text-xs); transition: transform var(--dur-2) var(--ease-out); } .pub-nav-panel { position: absolute; top: calc(100% + var(--space-2)); inset-inline-start: 0; z-index: 1; width: 34rem; padding: var(--space-2); border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); box-shadow: var(--shadow-lg); visibility: hidden; opacity: 0; transform: translateY(calc(-1 * var(--space-1))); transition: opacity var(--dur-2) var(--ease-out), transform var(--dur-2) var(--ease-out), visibility var(--dur-2) var(--ease-out); } .pub-nav-panel::before { content: ''; position: absolute; inset-inline: 0; bottom: 100%; height: var(--space-3); } .pub-nav-drop:hover .pub-nav-panel, .pub-nav-drop:has(:focus-visible) .pub-nav-panel { visibility: visible; opacity: 1; transform: none; } .pub-nav-drop:hover .pub-nav-caret, .pub-nav-drop:has(:focus-visible) .pub-nav-caret { transform: rotate(180deg); } .pub-nav-subs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-1); margin: 0; padding: 0; list-style: none; } .pub-nav-subs > li:last-child:nth-child(odd) { grid-column: 1 / -1; } .pub-nav-sub { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-2) var(--space-3); border-radius: var(--radius); color: var(--text); font-size: var(--text-md); font-weight: 600; line-height: 1.3; text-decoration: none; transition: background-color var(--dur-2) var(--ease-out), color var(--dur-2) var(--ease-out); } .pub-nav-sub i { flex: none; width: 2.25rem; height: 2.25rem; display: grid; place-items: center; border-radius: var(--radius-round); border: 1px solid color-mix(in srgb, var(--accent-fill) 55%, transparent); background: color-mix(in srgb, var(--accent-fill) 14%, var(--surface)); color: var(--accent-ink); font-size: var(--text-base); } .pub-nav-sub:hover, .pub-nav-sub:focus-visible { background: var(--surface-muted); color: var(--primary-text); } .pub-nav-sub:focus-visible { outline: 2px solid var(--primary); outline-offset: -2px; } .pub-nav-sub.active { background: var(--primary-soft); color: var(--primary-text); } .pub-menu { display: none; } @media (max-width: 767.98px) { .app-topbar:has(.pub-nav) { flex-wrap: wrap; row-gap: 0; column-gap: var(--space-2); } .app-topbar:has(.pub-nav) .btn-sm { --bs-btn-padding-x: var(--space-1-5); } } @media (max-width: 74.99875em) { .pub-nav, .app-topbar:has(.pub-nav) .lang-switch-shell { display: none; } .pub-menu { display: block; } .pub-menu-btn { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: var(--radius-sm); border: 1px solid var(--shell-line); background: var(--shell-well); color: var(--shell-ink); font-size: var(--text-xl); list-style: none; cursor: pointer; } .pub-menu-btn::-webkit-details-marker { display: none; } .pub-menu-btn:focus-visible { outline: 2px solid var(--shell-ink); outline-offset: 2px; } .pub-menu[open] .pub-menu-btn { background: var(--shell-well-strong); } .pub-menu-mbyll, .pub-menu[open] .pub-menu-hap { display: none; } .pub-menu[open] .pub-menu-mbyll { display: block; } .pub-menu-panel { position: absolute; inset-inline: 0; top: 100%; display: grid; gap: var(--space-3); padding: var(--space-1) var(--space-4) var(--space-4); background: var(--surface); border-bottom: 1px solid var(--border); box-shadow: var(--shadow-lg); } .pub-menu-nav { display: grid; } .pub-menu-link { display: flex; align-items: center; justify-content: space-between; min-height: 3rem; padding: var(--space-2) var(--space-1); border-bottom: 1px solid var(--border); color: var(--text); font-weight: 600; text-decoration: none; } .pub-menu-link.active { color: var(--primary-text); } .pub-menu-link i { color: var(--faint); } .pub-menu-lang { display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: var(--text-sm); } .pub-menu-subs { display: grid; margin: 0; padding: var(--space-1) 0 var(--space-2); border-bottom: 1px solid var(--border); list-style: none; } .pub-menu-sub { display: flex; align-items: center; gap: var(--space-3); min-height: 2.75rem; padding: var(--space-1) var(--space-1) var(--space-1) var(--space-3); border-radius: var(--radius-sm); color: var(--text); font-size: var(--text-md); font-weight: 500; line-height: 1.3; text-decoration: none; } .pub-menu-sub i { flex: none; width: 1.5rem; color: var(--accent-ink); font-size: var(--text-lg); text-align: center; } .pub-menu-sub.active { color: var(--primary-text); font-weight: 600; } .pub-menu-sub:focus-visible { outline: 2px solid var(--primary); outline-offset: -2px; } .pub-menu-reach { display: grid; margin: 0; padding: 0; list-style: none; } .pub-menu-reach a { display: flex; align-items: center; gap: var(--space-3); min-height: 2.75rem; padding: var(--space-1); color: var(--text); font-weight: 600; text-decoration: none; font-variant-numeric: tabular-nums; } .pub-menu-reach i { color: var(--primary-text); font-size: var(--text-lg); } .pub-menu-login { width: 100%; } } @media (max-width: 575.98px) { .pub-menu-panel { align-content: start; height: calc(100vh - var(--topbar-h)); height: calc(100dvh - var(--topbar-h)); overflow-y: auto; overscroll-behavior: contain; } } @media (min-width: 576px) and (max-width: 74.99875em) { .pub-menu-panel { inset-inline: auto var(--space-3); top: calc(100% + var(--space-1)); width: 20rem; border: 1px solid var(--border); border-radius: var(--radius-lg); max-height: calc(100vh - var(--topbar-h) - var(--space-5)); max-height: calc(100dvh - var(--topbar-h) - var(--space-5)); overflow-y: auto; overscroll-behavior: contain; } } .pub-head-tel { display: none; } @media (min-width: 768px) { .pub-head-tel { display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-3); border-radius: var(--radius-sm); color: var(--shell-ink); font-weight: 700; font-variant-numeric: tabular-nums; text-decoration: none; white-space: nowrap; } .pub-head-tel:hover, .pub-head-tel:focus-visible { background: var(--shell-hover); color: var(--shell-ink); } .pub-head-tel:focus-visible { outline: 2px solid var(--shell-ink); outline-offset: 2px; } } @media (min-width: 768px) and (max-width: 79.99875em) { .pub-head-tel { justify-content: center; width: 2.75rem; height: 2.75rem; padding: 0; border: 1px solid var(--shell-line); background: var(--shell-well); font-size: var(--text-lg); } .pub-head-tel-num { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; } } @media (max-width: 575.98px) { .brand-word-pub { display: none; } } .pub-head-cta[aria-current="page"] { display: none; } .app-topbar:has(.pub-head-cta[aria-current="page"]) .brand-word-pub { display: inline; } .app-topbar:has(.pub-nav):not(:has(.pub-head-cta)) .brand-word-pub { display: inline; } @media print { .pub-bar, .pub-head-tel { display: none !important; } } .lang-switch { display: inline-flex; align-items: center; padding: var(--space-0); gap: var(--space-0); border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface-muted); } .lang-opt { padding: var(--space-1) var(--space-2); border-radius: var(--radius-sm); font-size: var(--text-xs); font-weight: 700; letter-spacing: .04em; color: var(--faint); text-decoration: none; transition: background var(--dur-2) var(--ease-out), color var(--dur-2) var(--ease-out); } .lang-opt:hover { color: var(--text); } .lang-opt.active { background: var(--surface); color: var(--primary-text); box-shadow: var(--shadow-sm); } .lang-switch-shell { background: var(--shell-well); border-color: var(--shell-line); } .lang-switch-shell .lang-opt { color: var(--shell-ink-muted); } .lang-switch-shell .lang-opt:hover { color: var(--shell-ink); } .lang-switch-shell .lang-opt.active { background: var(--shell-well-strong); color: var(--shell-ink); box-shadow: none; } @media (pointer: coarse) { .app-topbar:has(.pub-nav) :is(.brand, .lang-opt, .btn) { position: relative; } .app-topbar:has(.pub-nav) :is(.brand, .lang-opt, .btn)::after { content: ""; position: absolute; inset-inline: 0; inset-block: min(0px, calc((100% - 44px) / 2)); } } .cpc-logo { width: 100%; height: 100%; display: block; } .navbar-brand, .brand { display: flex; align-items: center; gap: var(--space-2); text-decoration: none; font-weight: 700; letter-spacing: .04em; } .brand-mark-lg { display: inline-flex; width: 36px; height: 36px; border-radius: var(--radius); box-shadow: var(--shadow-glow); } .brand-word { font-family: 'Sora Marka', 'Inter Variable', Inter, sans-serif; font-weight: 700; font-size: var(--text-base); letter-spacing: .04em; white-space: nowrap; color: var(--shell-ink); } .btn { border-radius: var(--radius-sm); font-weight: 500; transition: background var(--dur-1) var(--ease-out), border-color var(--dur-1) var(--ease-out), color var(--dur-1) var(--ease-out), box-shadow var(--dur-2) var(--ease-out), transform var(--dur-2) var(--ease-spring), filter var(--dur-1) var(--ease-out), --grad-angle var(--dur-3) var(--ease-out); } .btn:active { transform: translateY(1px); } .btn.is-busy, .icon-btn.is-busy { pointer-events: none; opacity: .78; } .is-busy::before { content: ""; display: inline-block; width: 1em; height: 1em; vertical-align: -.125em; margin-inline-end: .45em; border: 2px solid currentColor; border-inline-end-color: transparent; border-radius: var(--radius-round); animation: ka-spin var(--spin) linear infinite; } .is-busy-bare::before { margin-inline-end: 0; } .is-busy > i.bi, .is-busy > svg { display: none; } @keyframes ka-spin { to { transform: rotate(360deg); } } .btn-primary { background: linear-gradient(var(--grad-angle), var(--grad-from), var(--grad-to)); border: 0; color: #fff; box-shadow: var(--shadow-glow); padding-top: calc(var(--space-1-5) + 1px); padding-bottom: calc(var(--space-1-5) + 1px); } .btn-primary:hover, .btn-primary:focus { --grad-from: var(--grad-from-hover); --grad-to: var(--grad-to-hover); --grad-angle: 100deg; color: #fff; transform: translateY(-1px); box-shadow: var(--shadow-glow-strong); } .btn-primary:active { transform: none; filter: brightness(.92); } .btn-primary.btn-sm { padding-top: calc(var(--space-1) + 1px); padding-bottom: calc(var(--space-1) + 1px); } .btn-outline-primary { --bs-btn-color: var(--primary-text); --bs-btn-border-color: var(--primary-line); --bs-btn-hover-color: var(--primary-contrast); --bs-btn-hover-bg: var(--primary); --bs-btn-hover-border-color: var(--primary); --bs-btn-active-color: var(--primary-contrast); --bs-btn-active-bg: var(--primary); --bs-btn-active-border-color: var(--primary); --bs-btn-disabled-color: var(--faint); --bs-btn-disabled-border-color: var(--border); } .btn-outline-secondary { --bs-btn-color: var(--text); --bs-btn-border-color: var(--border-strong); --bs-btn-hover-color: var(--text); --bs-btn-hover-bg: var(--surface-hover); --bs-btn-hover-border-color: var(--border-strong); --bs-btn-active-color: var(--text); --bs-btn-active-bg: var(--surface-muted); --bs-btn-active-border-color: var(--border-strong); --bs-btn-disabled-color: var(--faint); --bs-btn-disabled-border-color: var(--border); } .form-control, .form-select { border-radius: var(--radius-sm); border: 1px solid var(--border-strong); color: var(--text); background-color: var(--surface-muted); transition: border-color var(--dur-2) var(--ease-out), box-shadow var(--dur-2) var(--ease-out), background-color var(--dur-2) var(--ease-out); } .form-control::placeholder { color: var(--faint); } .form-control:focus, .form-select:focus { background-color: var(--surface); border-color: var(--primary); box-shadow: var(--ring); color: var(--text); } .form-control:user-invalid, .form-select:user-invalid { border-color: var(--danger); } .form-control:user-invalid:focus, .form-select:user-invalid:focus { box-shadow: 0 0 0 var(--ring-w-lg) color-mix(in srgb, var(--danger) 28%, transparent); } .card:has(.form-control:user-invalid, .form-select:user-invalid) { border-color: color-mix(in srgb, var(--danger) 45%, var(--border)); } @supports (field-sizing: content) and (height: 1lh) { textarea.form-control { field-sizing: content; max-height: 40vh; } textarea.form-control[rows="1"] { min-height: calc(1lh + .75rem + 2px); } textarea.form-control[rows="2"] { min-height: calc(2lh + .75rem + 2px); } textarea.form-control[rows="3"] { min-height: calc(3lh + .75rem + 2px); } textarea.form-control[rows="4"] { min-height: calc(4lh + .75rem + 2px); } textarea.form-control[rows="5"] { min-height: calc(5lh + .75rem + 2px); } textarea.form-control[rows="6"] { min-height: calc(6lh + .75rem + 2px); } } .form-label { font-weight: 500; font-size: var(--text-sm); color: var(--muted); } .form-text { color: var(--faint); } .btn-close { border-radius: var(--radius-sm); } .toast { border-radius: var(--radius); border: 1px solid var(--border); box-shadow: var(--shadow-lg); backdrop-filter: blur(10px); } .toast.text-bg-primary { background: var(--grad-primary) !important; border: 0; } .toast.text-bg-success, .toast.text-bg-danger, .toast.text-bg-warning { border: 0; } .ka-toast-secret { background: var(--surface); color: var(--text); box-shadow: inset 0 0 0 var(--hairline) var(--border-strong), var(--shadow-lg); } .ka-toast-secret .ka-toast-icon { color: var(--primary); opacity: 1; } .toast-stack { position: fixed; top: 0; right: 0; z-index: 1090; display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-4); max-width: min(26rem, calc(100vw - 2rem)); pointer-events: none; } .toast-stack > * { pointer-events: auto; } @media (max-width: 576px) { .toast-stack { top: auto; bottom: var(--bottomnav-h); left: 0; right: 0; max-width: none; padding: var(--space-3); flex-direction: column-reverse; } } .ka-toast-icon { flex: 0 0 auto; font-size: var(--text-lg); line-height: 1.35; opacity: .92; } .ka-toast .toast-body { line-height: 1.35; } .chip { display: inline-flex; align-items: center; gap: var(--space-1); padding: var(--space-0) var(--space-2); border-radius: var(--radius-pill); font-size: var(--text-xs); font-weight: 600; line-height: 1.4; background: var(--surface-muted); color: var(--muted); border: 1px solid var(--border); white-space: nowrap; } .chip i { font-size: .8em; } .card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--edge-light-soft), var(--shadow-sm); color: var(--text); } .auth-wrap { min-height: calc(100vh - var(--topbar-h) - 4rem); display: flex; align-items: center; justify-content: center; padding: var(--space-5) 0; } .auth-card { width: 100%; max-width: 960px; display: grid; grid-template-columns: 1.05fr 1fr; border-radius: var(--radius-xl); overflow: hidden; border: 1px solid var(--border); background: var(--surface); box-shadow: var(--shadow-lg); } .auth-visual { position: relative; padding: var(--space-6-5); display: flex; flex-direction: column; justify-content: center; gap: var(--space-4); color: #fff; background: radial-gradient(120% 90% at 85% 10%, rgba(34,211,238,.22), transparent 55%), linear-gradient(140deg, #24457f 0%, #1a2a33 55%, #2c509b 100%); overflow: hidden; } .auth-visual::after { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px); background-size: 34px 34px; mask-image: radial-gradient(90% 80% at 50% 40%, #000 30%, transparent 100%); -webkit-mask-image: radial-gradient(90% 80% at 50% 40%, #000 30%, transparent 100%); pointer-events: none; } .auth-visual > * { position: relative; z-index: 1; } .auth-card:has(.auth-visual-in), .auth-visual:has(> .auth-visual-in) { overflow: clip; } .auth-visual:has(> .auth-visual-in) { justify-content: flex-start; } .auth-visual > .auth-visual-in { position: sticky; top: calc(var(--topbar-h) + var(--space-5)); display: flex; flex-direction: column; gap: var(--space-4); } .auth-visual h2 { color: #fff; } .auth-visual p { color: rgba(255,255,255,.92); } .auth-feature { display: flex; align-items: center; gap: var(--space-3); font-size: var(--text-md); color: rgba(255,255,255,.96); } .auth-feature i { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: var(--radius-sm); background: rgba(255,255,255,.14); flex-shrink: 0; } .auth-steps { display: grid; gap: var(--space-3); margin-top: var(--space-2); } .auth-visual .auth-steps-title { margin: 0; color: var(--ground-ink); font-size: var(--text-sm); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; } .auth-steps .land-steps { grid-template-columns: 1fr; gap: var(--space-4); } .auth-steps .land-step { grid-template-columns: auto minmax(0, 1fr); column-gap: var(--space-3); row-gap: var(--space-1); } .auth-steps .land-step::before { grid-row: span 2; width: 2.25rem; height: 2.25rem; margin-bottom: 0; font-size: var(--text-base); } .auth-steps .land-step:not(:last-child)::after { top: 2.25rem; bottom: calc(-1 * var(--space-4)); left: 1.125rem; right: auto; width: 1px; height: auto; } .auth-steps .land-step b { font-size: var(--text-base); } .auth-steps .land-step span { color: var(--ground-ink); font-size: var(--text-md); line-height: 1.5; } .auth-visual .auth-steps-call { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-1) var(--space-2); margin: var(--space-2) 0 0; color: var(--ground-ink); font-size: var(--text-md); } .auth-steps-call i { color: var(--ground-accent); } .auth-steps-call a { color: var(--ground-ink); font-weight: 700; font-variant-numeric: tabular-nums; text-decoration-color: var(--ground-line); text-underline-offset: .2em; } .auth-steps-call a:hover, .auth-steps-call a:focus-visible { text-decoration-color: currentColor; } .auth-steps-call a:focus-visible { outline: 2px solid var(--ground-ink); outline-offset: 2px; } .auth-next { display: none; } @media (max-width: 900px) { .auth-next { display: grid; gap: var(--space-3); margin-top: var(--space-4); } } .auth-steps-fold { display: block; margin: 0; padding: 0 var(--space-4); border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface-muted); } .auth-steps-fold > summary { display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); min-height: 3rem; color: var(--text); font-weight: 600; list-style: none; cursor: pointer; } .auth-steps-fold > summary::-webkit-details-marker { display: none; } .auth-steps-fold > summary i { color: var(--muted); transition: transform var(--dur-2) var(--ease-out); } .auth-steps-fold[open] > summary i { transform: rotate(180deg); } .auth-steps-fold > summary:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; border-radius: var(--radius-xs); } .auth-steps-fold > .land-steps { padding-block: var(--space-2) var(--space-4); } .auth-steps-fold .land-step, .auth-steps-fold .land-step b { color: var(--text); } .auth-steps-fold .land-step span { color: var(--muted); } .auth-steps-fold .land-step:not(:last-child)::after { background: var(--border); } .auth-next-call { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-1) var(--space-2); margin: 0; color: var(--muted); font-size: var(--text-md); } .auth-next-call i { color: var(--primary-text); } .auth-next-call a { color: var(--text); font-weight: 700; font-variant-numeric: tabular-nums; } .auth-sent { display: grid; align-content: center; gap: var(--space-3); } .auth-sent > p { margin: 0; color: var(--text); line-height: 1.6; } .auth-sent .card-title { margin: 0; } .auth-sent-mark { display: inline-flex; align-items: center; justify-content: center; width: var(--space-7); height: var(--space-7); border-radius: var(--radius-round); background: var(--success-soft); color: var(--success); font-size: var(--text-2xl); } .auth-sent > .auth-sent-note { display: flex; gap: var(--space-2); color: var(--muted); font-size: var(--text-md); } .auth-sent-note i { color: var(--primary-text); } .auth-sent .auth-next { margin-top: 0; } .auth-form { padding: var(--space-6-5); } .auth-input { display: grid; transition: transform var(--dur-2) var(--ease-out); } .auth-input > .form-control, .auth-input > .pw-wrap { grid-area: 1 / 1; } .auth-input > .caps-hint { grid-area: 2 / 1; } .auth-input > .bi { grid-area: 1 / 1; align-self: center; justify-self: start; z-index: 1; pointer-events: none; margin-inline-start: var(--space-4); font-size: var(--text-lg); line-height: 1; color: var(--faint); transition: color var(--dur-1) var(--ease-out); } .auth-input .form-control { padding-inline-start: 2.75rem; border-radius: var(--radius); } .auth-field .form-label { font-weight: 600; transition: color var(--dur-1) var(--ease-out); } .auth-field:focus-within .form-label, .auth-field:focus-within .auth-input > .bi { color: var(--primary-text); } .auth-field:focus-within .auth-input { transform: translateY(-1px); } .auth-choice { min-width: 0; margin-inline: 0; padding: 0; border: 0; } .auth-choice > legend { float: none; width: auto; font-size: var(--text-sm); } .auth-chips { display: flex; flex-wrap: wrap; gap: var(--space-2); } .auth-chip { display: inline-flex; align-items: center; gap: var(--space-1-5); min-height: 2.75rem; padding: var(--space-1) var(--space-3); border: 1px solid var(--border); border-radius: var(--radius-pill); background: var(--surface); color: var(--text); font-size: var(--text-sm); cursor: pointer; transition: border-color var(--dur-1) var(--ease-out), background-color var(--dur-1) var(--ease-out); } .auth-chip input { margin: 0; accent-color: var(--primary); } .auth-chip > i { color: var(--muted); } .auth-chip:hover { border-color: var(--primary-line); } .auth-chip:has(:checked) { border-color: var(--primary); background: var(--primary-soft); color: var(--primary-text); } .auth-chip:has(:checked) > i { color: var(--primary-text); } .pass-rules { display: grid; gap: var(--space-0); margin-bottom: 0; padding-inline-start: 0; list-style: none; } .pass-rules > li { display: flex; align-items: center; gap: var(--space-1); transition: color var(--dur-1) var(--ease-out); } .pass-rules > li > .bi { font-size: var(--text-base); line-height: 1; } .pass-rules > li.is-met { color: var(--success); } .auth-captcha-pic { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin-bottom: var(--space-2); } .auth-captcha-pic > img { max-width: 100%; height: auto; border: 1px solid var(--border); border-radius: var(--radius-sm); } .auth-captcha-new { display: inline-flex; align-items: center; gap: var(--space-1); } .auth-captcha .form-control { text-transform: uppercase; letter-spacing: .2em; } .auth-captcha-say { margin: var(--space-1) 0 0; font-size: var(--text-sm); color: var(--muted); } .auth-captcha-ze.is-off { visibility: hidden; } .auth-captcha-ze:disabled { cursor: progress; } .auth-captcha-audio { display: block; width: 100%; margin-top: var(--space-2); } .auth-field-error { display: flex; align-items: baseline; gap: var(--space-1-5); margin: var(--space-1-5) 0 0; color: var(--danger); font-size: var(--text-sm); font-weight: 600; } .auth-field-error > .bi { flex: none; } .auth-captcha > .auth-field-error { grid-column: 1 / -1; } .auth-submit { position: relative; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); } .auth-submit > .bi { transition: transform var(--dur-2) var(--ease-out); } .auth-submit:hover > .bi { transform: translateX(3px); } .auth-submit::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(100deg, transparent 38%, rgba(255,255,255,.28) 50%, transparent 62%); transform: translateX(-110%); transition: transform var(--dur-3) var(--ease-out); } .auth-submit:hover::after, .auth-submit:focus-visible::after { transform: translateX(110%); } @media (max-width: 900px) { .auth-card { grid-template-columns: 1fr; max-width: 460px; } .auth-visual { display: none; } .auth-form { padding: var(--space-6) var(--space-5); } } :root { --chart-bar: #2c509b; } input[type="password"]::-ms-reveal, input[type="password"]::-ms-clear { display: none; width: 0; height: 0; } .auth-visual-brand { display: flex; align-items: center; gap: var(--space-3); margin-bottom: var(--space-1); } .auth-visual-brand h2 { font-family: 'Sora Marka', 'Inter Variable', Inter, sans-serif; } .auth-visual-mark { display: inline-flex; flex-shrink: 0; width: 54px; height: 54px; border-radius: var(--radius-lg); box-shadow: 0 0 0 var(--hairline) var(--ground-line), var(--shadow-md); } @media (forced-colors: active) { .auth-submit::after { display: none; } } @media (max-width: 576px) { .auth-wrap { min-height: auto; padding: 0; display: block; } .auth-card { max-width: none; border: 0; border-radius: var(--radius-lg); } .auth-form { padding: var(--space-5) var(--space-4) var(--space-4); } .auth-form hr { margin: var(--space-3) 0; } .auth-form a.small { display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--space-2); } } .net-chip { position: fixed; left: var(--space-4); bottom: calc(var(--space-4) + var(--bottomnav-h)); z-index: 3500; display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-4); border-radius: var(--radius-pill); background: var(--surface); border: 1px solid var(--border); box-shadow: var(--shadow-lg); color: var(--text); font-size: var(--text-sm); font-weight: 600; opacity: 0; transform: translateY(.5rem); pointer-events: none; transition: opacity var(--dur-2) var(--ease-out), transform var(--dur-2) var(--ease-out); } .net-chip.show { opacity: 1; transform: none; } .net-chip.net-off { border-color: var(--danger); color: var(--danger); } .net-chip.net-off i { color: var(--danger); } .net-chip.net-on { border-color: var(--success); color: var(--success); } tr.is-picked > td { background: var(--primary-soft); } .alert { border-radius: var(--radius); border: 1px solid transparent; } .alert-danger { background: var(--danger-soft); color: var(--danger); border-color: rgba(220,38,38,.22); } .alert-info { background: var(--info-soft); color: var(--info); border-color: rgba(14,165,233,.25); } .progress { background-color: var(--surface-muted); border-radius: var(--radius-pill); } .pw-wrap { position: relative; display: block; } .pw-wrap > input { padding-right: 2.7rem; } .pw-toggle { position: absolute; top: 50%; right: .45rem; transform: translateY(-50%); border: 0; background: transparent; color: var(--faint); padding: var(--space-1) var(--space-2); border-radius: var(--radius-sm); cursor: pointer; line-height: 1; } .pw-toggle:hover { color: var(--primary); background: var(--primary-soft); } .caps-hint { display: none; margin-top: var(--space-1); font-size: var(--text-xs); font-weight: 600; color: var(--warning); } .caps-hint.on { display: block; } .page-progress { position: fixed; top: 0; left: 0; height: 3px; width: 0; z-index: 5000; background: var(--grad-primary); box-shadow: 0 0 8px color-mix(in srgb, var(--primary-2) 55%, transparent); opacity: 0; transition: width 4s var(--ease-out), opacity var(--dur-2) var(--ease-out); pointer-events: none; } .page-progress.loading { width: 82%; opacity: 1; } .is-clickable { cursor: pointer; } .passkey-status { margin: var(--space-3) 0 0; font-size: var(--text-sm); color: var(--muted); } .passkey-status.is-bad { color: var(--danger); } .passkey-status.is-ok { color: var(--success); } .geo-status { margin: var(--space-2) 0 0; font-size: var(--text-sm); color: var(--muted); } .geo-status.is-bad { color: var(--danger); } .geo-status.is-ok { color: var(--success); } .auth-passkey { margin-top: var(--space-4); text-align: center; } .auth-or { display: block; margin-bottom: var(--space-3); font-size: var(--text-xs); color: var(--muted); text-transform: uppercase; letter-spacing: .12em; } @media screen and (max-width: 575.98px) { .auth-passkey .btn { padding-inline: var(--space-3); font-size: var(--text-base); text-wrap: balance; } } .access-ask { margin-bottom: var(--space-4); padding: var(--space-4); border: 1px solid var(--warning); border-radius: var(--radius); background: var(--warning-soft); } .access-ask-head { display: flex; align-items: center; gap: var(--space-2); margin: 0 0 var(--space-2); font-weight: 600; } .access-ask-say { margin: 0 0 var(--space-3); font-size: var(--text-sm); color: var(--muted); } .access-ask-who { margin: 0 0 var(--space-3); font-size: var(--text-sm); font-weight: 600; } .access-ask-form { display: grid; gap: var(--space-2); } .access-ask-form .form-label { margin: 0; font-size: var(--text-xs); color: var(--muted); } .access-ask-quiet { border-color: var(--border); background: var(--surface-muted); } .access-ask-quiet > summary { cursor: pointer; font-size: var(--text-sm); color: var(--muted); } .access-ask-quiet[open] > summary { margin-bottom: var(--space-3); } .otp-input { letter-spacing: .4em; font-size: var(--text-2xl); } @media print { nav.navbar, aside.sidebar, .app-sidebar, .app-topbar, .no-print, .toast-container, .toast-stack, .bottom-nav { display: none !important; } body { background: #fff !important; color: #000 !important; } body::before { display: none !important; } body::after { display: none !important; } .app-shell::after { display: none !important; } main, .app-content { width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important; padding: 0 !important; animation: none !important; } tr, .row { page-break-inside: avoid; } h5 { page-break-after: avoid; } a { text-decoration: none !important; color: #000 !important; } @page { margin: 1.5cm; } } :where(a, button, .btn, .form-control, .form-select, .form-check-input, [tabindex]:not([tabindex="-1"])):focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; } .skip-link { position: absolute; left: .5rem; top: -3rem; z-index: 4000; padding: var(--space-2) var(--space-4); border-radius: var(--radius-sm); background: var(--primary); color: var(--primary-contrast); font-weight: 600; transition: top var(--dur-2) var(--ease-out); } .skip-link:focus { top: .5rem; color: #fff; } .stagger > * { animation: pageIn var(--dur-3) var(--ease-out) both; } .stagger > *:nth-child(1) { animation-delay: .02s; } .stagger > *:nth-child(2) { animation-delay: .07s; } .stagger > *:nth-child(3) { animation-delay: .12s; } .stagger > *:nth-child(4) { animation-delay: .17s; } .stagger > *:nth-child(5) { animation-delay: .22s; } .stagger > *:nth-child(6) { animation-delay: .27s; } .stagger > *:nth-child(n+7) { animation-delay: .3s; } @media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; } .collapse-card:hover, .stat-card:hover, .card-lift:hover, .task-card:hover, .btn-primary:hover, .icon-btn:hover, .topbar-back:hover i, .bi-report .bi-card:not(.bi-focused):hover, .btn:active { transform: none; } .is-busy::before, .cmdk-backdrop.is-searching .cmdk-spinner { animation-duration: var(--beat) !important; animation-iteration-count: infinite !important; } body::after { animation: none; } .stagger > *, .app-content .page-head .page-head-main > *, .app-content .page-head > .page-actions { animation-delay: 0s !important; } *::details-content { transition-duration: .001ms !important; } } .print-head { display: none; } @media print { @page { margin: 14mm 12mm; } .app-sidebar, .app-topbar, .bottom-nav, .toast-stack, .skip-link, .cmdk-backdrop, .sheet-backdrop, .offcanvas-backdrop, .modal, .modal-backdrop, .page-actions, .net-chip, .btn-close, .dropdown-menu, .page-head-toggle, .tbl-col-actions { display: none !important; } html, body { background: #fff !important; color: #000 !important; } :root { --ground-ink: #000; --ground-ink-muted: #333; --ground-accent: #000; --ground-success: #000; --ground-warning: #000; --ground-danger: #000; --ground-info: #000; --ground-wash: transparent; --ground-line: rgba(0,0,0,.25); } .app-shell, .app-main, .app-content { display: block !important; margin: 0 !important; padding: 0 !important; max-width: none !important; width: auto !important; height: auto !important; overflow: visible !important; } .stagger > *, .app-content .page-head .page-head-main > *, .app-content .page-head > .page-actions { animation: none !important; } .print-head { display: flex !important; align-items: baseline; justify-content: space-between; gap: var(--space-4); padding-bottom: var(--space-1-5); margin-bottom: var(--space-3); border-bottom: 2px solid #000; } .print-brand { display: inline-flex; align-self: center; } .print-brand .cpc-logo { width: 28px; height: 28px; } .print-title { font-weight: 700; } .print-meta { font-size: var(--text-xs); text-align: right; line-height: 1.35; } .card, .table-card, .stat-card, .bi-card { box-shadow: none !important; border: 1px solid #999 !important; background: #fff !important; backdrop-filter: none !important; break-inside: avoid; page-break-inside: avoid; } .chip { background: transparent !important; color: #000 !important; border: 1px solid #666 !important; } h1, h2, h3, h4, .page-title { break-after: avoid; page-break-after: avoid; } a { text-decoration: none !important; color: #000 !important; } } .data-table { --data-head-h: 2.6rem; --data-pad-x: 1.1rem; } .data-table > thead > tr > th, .data-table > thead > tr > td { height: var(--data-head-h); padding-top: 0; padding-bottom: 0; vertical-align: middle; background: var(--surface); } .data-table > tbody > tr > td, .data-table > tbody > tr > th { border-bottom-color: var(--border); } .data-table > tbody > tr:last-child > td, .data-table > tbody > tr:last-child > th { border-bottom-width: 0; } .data-table > tbody > tr { scroll-margin-top: calc(var(--data-head-h) + var(--topbar-h) + var(--space-2)); } .num, th.num, td.num, .money, th.money, td.money { text-align: right; font-variant-numeric: tabular-nums; font-feature-settings: 'tnum' 1; } .app-content > .section-title, .app-content > p, .app-content > .small { color: var(--ground-ink-muted); } .page-head :is(.btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-dark, .btn-outline-light, .btn-link), .load-rail :is(.btn-outline-primary, .btn-outline-secondary, .btn-link), .filter-quick :is(.btn-outline-primary, .btn-outline-secondary, .btn-link), .form-actions :is(.btn-outline-primary, .btn-outline-secondary, .btn-link), .tm-ov-actions :is(.btn-outline-primary, .btn-outline-secondary, .btn-link), .app-content > :is(.btn-outline-primary, .btn-outline-secondary, .btn-outline-success, .btn-outline-dark, .btn-outline-light, .btn-link) { --bs-btn-color: var(--ground-ink); --bs-btn-border-color: var(--ground-line); --bs-btn-hover-color: var(--primary-text); --bs-btn-hover-bg: var(--ground-ink); --bs-btn-hover-border-color: var(--ground-ink); --bs-btn-active-color: var(--primary-text); --bs-btn-active-bg: var(--ground-ink); --bs-btn-active-border-color: var(--ground-ink); --bs-btn-disabled-color: var(--ground-ink-muted); --bs-btn-disabled-border-color: var(--ground-line); } .app-content > .alert, .app-content > .chip, .app-content > :is(.filter-quick, .load-rail, .filter-bar) .chip { background: var(--ground-shade); border-color: var(--ground-line); color: var(--ground-ink); } .app-content > .alert-danger { border-color: color-mix(in srgb, var(--ground-danger) 42%, transparent); } .app-content > .alert-info { border-color: color-mix(in srgb, var(--ground-info) 42%, transparent); } .app-content > .alert-danger :is(strong, b, .alert-heading, .notice-title), .app-content > .chip-danger { color: var(--ground-danger); } .app-content > .alert-info :is(strong, b, .alert-heading, .notice-title), .app-content > .chip-info { color: var(--ground-info); } .app-content > .alert :is(a:not(.btn), .alert-link) { color: var(--ground-ink); } .load-rail-label, .app-content > .small, .app-content > .text-body-secondary { color: var(--ground-ink-muted); } .app-content > a:not(.btn), .app-content > p a:not(.btn), .app-content > .small a:not(.btn), .app-content > .text-muted a:not(.btn), .app-content > .section-title a:not(.btn), .page-head a:not(.btn) { color: var(--ground-ink); } .notice { display: flex; align-items: flex-start; flex-wrap: wrap; gap: var(--space-2) var(--space-3); } .notice-icon { flex: 0 0 auto; font-size: var(--text-lg); line-height: 1.5; } .notice-body { flex: 1 1 14rem; min-width: 0; } .notice-body > :last-child { margin-bottom: 0; } @media print { .detail-card, .card-slot, .kv-row, .data-table > tbody > tr { break-inside: avoid; } } .land-head { display: grid; gap: var(--space-2); margin-bottom: var(--space-5); max-width: 46rem; } .land-kicker { font-size: var(--text-sm); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ground-accent); } .land-kicker a { color: var(--ground-accent); text-decoration-color: var(--ground-line); text-underline-offset: .25em; } .land-kicker a:hover { color: var(--ground-ink); text-decoration-color: currentColor; } .land-kicker a:focus-visible { outline: 2px solid var(--ground-ink); outline-offset: 3px; border-radius: var(--radius-sm); } .land-h2 { margin: 0; font-size: var(--display-section); font-weight: 800; line-height: 1.15; letter-spacing: -.02em; text-wrap: balance; color: var(--ground-ink); } .land-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); margin: 0; padding: 0; list-style: none; counter-reset: land-step; } .land-step { position: relative; display: grid; align-content: start; gap: var(--space-2); counter-increment: land-step; color: var(--ground-ink); } .land-step::before { content: counter(land-step); width: 3rem; height: 3rem; display: grid; place-items: center; margin-bottom: var(--space-2); border-radius: var(--radius-round); border: 1px solid transparent; background: var(--shell); color: var(--shell-ink); box-shadow: var(--shadow-md); font-family: 'Sora Marka', 'Inter Variable', Inter, sans-serif; font-size: var(--text-lg); font-weight: 700; } .land-step:not(:last-child)::after { content: ""; position: absolute; top: 1.5rem; left: calc(3rem + var(--space-3)); right: calc(var(--space-3) - var(--space-5)); height: 1px; background: var(--ground-line); } .land-step b { color: var(--ground-ink); font-size: var(--text-lg); } .land-step span { max-width: 22rem; color: var(--ground-ink-muted); font-size: var(--text-base); line-height: 1.6; } .land-steps[data-ku="2"] > .land-step:nth-child(1)::before, .land-steps[data-ku="3"] > .land-step:nth-child(-n + 2)::before { content: "\f272"; font-family: "bootstrap-icons"; font-weight: 400; } .land-steps[data-ku="2"] > .land-step:nth-child(1)::after, .land-steps[data-ku="3"] > .land-step:nth-child(-n + 2)::after { background: var(--shell); } .land-steps[data-ku="1"] > .land-step:nth-child(1)::before, .land-steps[data-ku="2"] > .land-step:nth-child(2)::before, .land-steps[data-ku="3"] > .land-step:nth-child(3)::before { outline: 2px solid var(--shell); outline-offset: 3px; } .land-step-tag { position: absolute; top: 0; inset-inline-end: 0; padding: 0 var(--space-2); border: 1px solid transparent; border-radius: var(--radius-pill); background: var(--shell); color: var(--shell-ink); font-size: var(--text-xs); font-style: normal; font-weight: 700; letter-spacing: .06em; line-height: 1.7; text-transform: uppercase; } @supports (animation-timeline: view()) { @media (prefers-reduced-motion: no-preference) { .land-how > .land-steps:not([data-ku]) { view-timeline: --hapat block; } .land-how > .land-steps:not([data-ku]) > .land-step:not(:last-child)::after { background-image: linear-gradient(var(--shell), var(--shell)); background-repeat: no-repeat; background-size: 0% 100%; animation-name: hapatVija; animation-timing-function: linear; animation-fill-mode: both; animation-timeline: --hapat; animation-range: cover 25% cover 40%; } .land-how > .land-steps:not([data-ku]) > .land-step:nth-child(2)::after { animation-range: cover 40% cover 55%; } } @media (prefers-reduced-motion: no-preference) and (max-width: 767.98px) { .land-how > .land-steps:not([data-ku]) > .land-step:not(:last-child)::after { background-size: 100% 0%; } } } @keyframes hapatVija { to { background-size: 100% 100%; } } @supports selector(:has(*)) { @starting-style { .land-tabs .land-tab { opacity: 0; } } } @supports selector(::details-content) { .land-faq-item, .pub-foot-fold, .auth-steps-fold { interpolate-size: allow-keywords; } .land-faq-item::details-content, .pub-foot-fold::details-content, .auth-steps-fold::details-content { block-size: 0; overflow-y: clip; transition: block-size var(--dur-3) var(--ease-in-out), content-visibility var(--dur-3) var(--ease-in-out) allow-discrete; } .land-faq-item[open]::details-content, .pub-foot-fold[open]::details-content, .auth-steps-fold[open]::details-content { block-size: auto; } } html:has(.land, .pub-nav) { scroll-padding-top: calc(var(--topbar-h) + var(--space-2)); } @media screen and (orientation: landscape) and (max-height: 500px) { .app-topbar:has(.pub-nav) { position: relative; } :root { --display-hero: clamp(1.75rem, min(1.1rem + 3.3vw, 1rem + 5svh), 3.6rem); } html:has(.app-topbar .pub-nav) { scroll-padding-top: var(--space-2); } } @media (max-width: 767.98px) { .land-steps { grid-template-columns: 1fr; } .land-step { grid-template-columns: auto minmax(0, 1fr); column-gap: var(--space-4); } .land-step::before { grid-row: span 2; margin-bottom: 0; } .land-step:not(:last-child)::after { top: 3rem; bottom: calc(-1 * var(--space-5)); left: 1.5rem; right: auto; width: 1px; height: auto; } } .pub-menu-btn:is(:hover, :active) { background: var(--shell-well-strong); } .pub-menu-link:is(:hover, :active), .pub-menu-sub:is(:hover, :active), .pub-menu-reach a:is(:hover, :active) { background: var(--surface-muted); color: var(--primary-text); } @media (pointer: coarse) { :is(.pub-shtegu a, .land-more, .land-returning a, .land-video-text > summary, .pub-door .pub-door-mail, .pub-foot-legal a, .pub-foot-h a, .pub-foot-home, .entry-office a, .entry-register a, .auth-next-call a, .auth-back, .entry .lang-opt) { position: relative; } :is(.pub-shtegu a, .land-more, .land-returning a, .land-video-text > summary, .pub-door .pub-door-mail, .pub-foot-legal a, .pub-foot-h a, .pub-foot-home, .entry-office a, .entry-register a, .auth-next-call a, .auth-back, .entry .lang-opt)::after { content: ""; position: absolute; inset-inline: 0; inset-block: min(0px, calc((100% - 44px) / 2)); } .pw-toggle::after { content: ""; position: absolute; inset: min(0px, calc((100% - 44px) / 2)); } } .app-main:has(.entry) .app-topbar { display: none; } .entry { padding-top: clamp(var(--space-2), 4vh, var(--space-6)); } .entry-scene { position: fixed; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; background: radial-gradient(72% 46% at 50% 104%, color-mix(in srgb, var(--primary-2) 24%, transparent), transparent 72%), radial-gradient(52% 40% at 8% -4%, color-mix(in srgb, var(--primary) 34%, transparent), transparent 70%), linear-gradient(180deg, var(--night) 0%, var(--night-2) 100%); } .entry-scene > * { position: absolute; } .entry-scene::before { content: ""; position: absolute; inset: 0; background: var(--night-deep); -webkit-mask: var(--grain) 0 0 / 180px 180px repeat; mask: var(--grain) 0 0 / 180px 180px repeat; opacity: .3; } .entry-photo { inset: 0; -webkit-mask-image: linear-gradient(180deg, transparent 6%, #000 38%); mask-image: linear-gradient(180deg, transparent 6%, #000 38%); } .entry-photo-img { position: absolute; inset: -4%; background: var(--night-deep); animation: entryPhoto var(--drift-slow) var(--ease-in-out) infinite alternate; } .entry-photo-img::before { content: ""; position: absolute; inset: 0; background: color-mix(in srgb, var(--primary-2) 24%, var(--night-2)); -webkit-mask: var(--entry-photo) 50% 50% / cover no-repeat; mask: var(--entry-photo) 50% 50% / cover no-repeat; } @keyframes entryPhoto { from { transform: scale(1.04) translate3d(-1.6%, .8%, 0); } to { transform: scale(1.14) translate3d(1.6%, -.8%, 0); } } .entry-grid { inset: 0; background: linear-gradient(color-mix(in srgb, var(--ground-ink) 6%, transparent) 1px, transparent 1px) 0 100% / 100% 96px, linear-gradient(90deg, color-mix(in srgb, var(--ground-ink) 6%, transparent) 1px, transparent 1px) 50% 0 / 96px 100%, linear-gradient(color-mix(in srgb, var(--ground-ink) 3%, transparent) 1px, transparent 1px) 0 100% / 100% 24px, linear-gradient(90deg, color-mix(in srgb, var(--ground-ink) 3%, transparent) 1px, transparent 1px) 50% 0 / 24px 100%; -webkit-mask-image: linear-gradient(180deg, transparent 4%, #000 58%); mask-image: linear-gradient(180deg, transparent 4%, #000 58%); } .entry-sparks { left: 0; right: 0; bottom: 0; height: 76%; -webkit-mask-image: linear-gradient(0deg, transparent 0%, #000 20%, #000 42%, transparent 88%); mask-image: linear-gradient(0deg, transparent 0%, #000 20%, #000 42%, transparent 88%); } .entry-sparks > * { position: absolute; left: 0; right: 0; top: 0; height: calc(100% + var(--spark-h)); animation: entrySparks var(--drift-a) linear infinite; } .entry-sparks-near { --spark-h: 600px; --spark-glow: color-mix(in srgb, var(--ground-accent) 40%, transparent); background: radial-gradient(circle at 8% 6%, var(--ground-accent) 0 1.9px, var(--spark-glow) 3.6px, transparent 9px), radial-gradient(circle at 31% 22%, var(--ground-accent) 0 2.5px, var(--spark-glow) 4.4px, transparent 10px), radial-gradient(circle at 57% 9%, var(--ground-accent) 0 1.6px, var(--spark-glow) 3.2px, transparent 8px), radial-gradient(circle at 83% 30%, var(--ground-accent) 0 2.1px, var(--spark-glow) 3.8px, transparent 9px), radial-gradient(circle at 18% 47%, var(--ground-accent) 0 1.5px, var(--spark-glow) 3px, transparent 8px), radial-gradient(circle at 69% 55%, var(--ground-accent) 0 2.7px, var(--spark-glow) 4.6px, transparent 10px), radial-gradient(circle at 44% 71%, var(--ground-accent) 0 1.8px, var(--spark-glow) 3.4px, transparent 8px), radial-gradient(circle at 92% 78%, var(--ground-accent) 0 1.5px, var(--spark-glow) 3px, transparent 8px), radial-gradient(circle at 6% 88%, var(--ground-accent) 0 2.3px, var(--spark-glow) 4px, transparent 9px), radial-gradient(circle at 36% 96%, var(--ground-accent) 0 1.7px, var(--spark-glow) 3.2px, transparent 8px); background-size: 520px var(--spark-h); } .entry-sparks-far { --spark-h: 440px; --spark: color-mix(in srgb, var(--ground-ink) 72%, transparent); --spark-glow: color-mix(in srgb, var(--ground-ink) 22%, transparent); background: radial-gradient(circle at 14% 12%, var(--spark) 0 1.2px, var(--spark-glow) 2.2px, transparent 5px), radial-gradient(circle at 47% 4%, var(--spark) 0 1.4px, var(--spark-glow) 2.4px, transparent 5px), radial-gradient(circle at 79% 19%, var(--spark) 0 1.1px, var(--spark-glow) 2px, transparent 4.5px), radial-gradient(circle at 29% 38%, var(--spark) 0 1.3px, var(--spark-glow) 2.2px, transparent 5px), radial-gradient(circle at 63% 46%, var(--spark) 0 1.1px, var(--spark-glow) 2px, transparent 4.5px), radial-gradient(circle at 91% 58%, var(--spark) 0 1.4px, var(--spark-glow) 2.4px, transparent 5px), radial-gradient(circle at 9% 67%, var(--spark) 0 1.2px, var(--spark-glow) 2.2px, transparent 5px), radial-gradient(circle at 42% 81%, var(--spark) 0 1.3px, var(--spark-glow) 2.2px, transparent 5px), radial-gradient(circle at 74% 90%, var(--spark) 0 1.1px, var(--spark-glow) 2px, transparent 4.5px); background-size: 380px var(--spark-h); animation-duration: var(--drift-c); } @keyframes entrySparks { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(0, calc(-1 * var(--spark-h)), 0); } } .entry-chart { left: -6%; right: -6%; bottom: 0; height: clamp(180px, 50vh, 520px); animation: entryChart var(--drift-tick) var(--ease-in-out) infinite alternate; } .entry-chart > * { position: absolute; inset: 0; -webkit-mask: var(--entry-chart) 100% 100% / auto 100% no-repeat; mask: var(--entry-chart) 100% 100% / auto 100% no-repeat; } .entry-chart-area { background: linear-gradient(180deg, color-mix(in srgb, var(--primary-2) 36%, transparent) 0%, color-mix(in srgb, var(--primary-2) 16%, transparent) 62%, transparent 100%); } .entry-chart-past { background: color-mix(in srgb, var(--ground-ink) 34%, transparent); -webkit-mask-image: var(--entry-chart-past); mask-image: var(--entry-chart-past); } .entry-chart-line { background: var(--ground-accent); -webkit-mask-image: var(--entry-chart-line); mask-image: var(--entry-chart-line); } .entry-chart-glint { -webkit-mask-image: var(--entry-chart-line); mask-image: var(--entry-chart-line); } .entry-chart-glint::before, .entry-chart-glint::after { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 16%; background: radial-gradient(closest-side, var(--ground-ink), transparent); transform: translate3d(-100%, 0, 0); animation: entryGlint var(--drift-b) linear infinite; } .entry-chart-glint::after { animation-delay: calc(var(--drift-b) / -2); } .entry-chart-dots { background: var(--ground-accent); -webkit-mask-image: var(--entry-chart-dots-a); mask-image: var(--entry-chart-dots-a); animation: entryDots var(--drift-a) var(--ease-in-out) infinite alternate; } .entry-chart-dots-2 { background: var(--ground-ink); -webkit-mask-image: var(--entry-chart-dots-b); mask-image: var(--entry-chart-dots-b); animation-duration: var(--drift-b); animation-direction: alternate-reverse; } @keyframes entryChart { from { transform: translate3d(1.5%, 0, 0); } to { transform: translate3d(-1.5%, 0, 0); } } @keyframes entryGlint { 0% { transform: translate3d(-100%, 0, 0); } 28% { transform: translate3d(640%, 0, 0); } 100% { transform: translate3d(640%, 0, 0); } } @keyframes entryDots { from { opacity: .95; } to { opacity: .3; } } @media (prefers-reduced-motion: reduce) { .entry-scene *, .entry-scene *::before, .entry-scene *::after { animation: none; } .entry-sparks { display: none; } } @media (prefers-contrast: more) { .entry-scene { display: none; } } .entry-title { max-width: 46rem; margin: 0 auto var(--space-5); text-align: center; font-size: var(--display-sm); font-weight: 800; line-height: 1.25; letter-spacing: .03em; text-transform: uppercase; text-wrap: balance; color: var(--ground-ink); text-shadow: 0 2px 18px var(--night); } .entry-title-mark { display: none; width: 1.75em; height: 1.75em; margin-right: var(--space-2); vertical-align: middle; border-radius: var(--radius-sm); box-shadow: var(--shadow-sm); } .app-content:has(.entry) .app-foot { text-shadow: 0 0 .12em var(--night-deep), 0 0 .3em var(--night-deep), 0 0 .6em var(--night-deep), 0 0 1em var(--night-deep); } .entry-card { width: min(100%, 38rem); margin: 0 auto; padding: var(--space-6) var(--space-6-5) var(--space-5); border-radius: var(--radius-xl); background: var(--surface); color: var(--text); box-shadow: var(--shadow-lg); } .entry-brand { display: flex; align-items: center; justify-content: center; gap: var(--space-3); padding-bottom: var(--space-4); margin-bottom: var(--space-4); border-bottom: 1px solid var(--border); } .entry-mark { display: inline-flex; width: 3rem; height: 3rem; border-radius: var(--radius); box-shadow: 0 0 0 var(--hairline) var(--border), var(--shadow-sm); } .entry-word { font-family: 'Sora Marka', 'Inter Variable', Inter, sans-serif; font-size: var(--text-xl); font-weight: 800; letter-spacing: .02em; color: var(--primary-text); } .entry-head { display: grid; justify-items: center; gap: var(--space-2); margin-bottom: var(--space-4); text-align: center; } .entry-head h2 { margin: 0; font-size: var(--text-xl); font-weight: 700; } .entry-help { display: grid; gap: var(--space-2); margin-top: var(--space-4); } .entry-row { display: flex; align-items: center; gap: var(--space-3); min-height: 44px; padding: var(--space-1-5) var(--space-3); border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface-muted); color: var(--text); font-size: var(--text-sm); font-weight: 500; text-decoration: none; transition: border-color var(--dur-1) var(--ease-out), background var(--dur-1) var(--ease-out); } .entry-row:hover, .entry-row:active, .entry-row:focus-visible { border-color: var(--border-strong); background: var(--surface-sunken); color: var(--text); } .entry-row-icon { display: inline-grid; place-items: center; flex-shrink: 0; width: 1.9rem; height: 1.9rem; border-radius: var(--radius-sm); background: var(--primary-soft); color: var(--primary-text); } .entry-ask { margin: 0; padding: 0; border: 0; background: none; } .entry-ask > summary { list-style: none; cursor: pointer; } .entry-ask > summary::-webkit-details-marker { display: none; } .entry-ask[open] { padding: 0 var(--space-3) var(--space-3); border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface-muted); } .entry-ask[open] > summary { margin: 0 calc(var(--space-3) * -1) var(--space-3); border-color: transparent; border-bottom-color: var(--border); border-radius: var(--radius) var(--radius) 0 0; } .entry-register { margin: var(--space-4) 0 0; text-align: center; font-size: var(--text-sm); color: var(--muted); } .entry-register a { font-weight: 600; } .entry-note { margin: var(--space-4) 0 0; padding-top: var(--space-3); border-top: 1px solid var(--border); text-align: center; font-size: var(--text-xs); color: var(--muted); } .entry-note .bi { margin-inline-end: var(--space-1); } .entry-office { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: var(--space-2); margin: var(--space-4) auto 0; font-size: var(--text-sm); color: var(--ground-ink-muted); text-shadow: 0 0 .12em var(--night-deep), 0 0 .3em var(--night-deep), 0 0 .6em var(--night-deep); } .entry-office a { color: var(--ground-ink); font-weight: 600; text-decoration: underline; text-decoration-color: var(--ground-line); text-underline-offset: .22em; } .entry-office a:hover, .entry-office a:focus-visible { text-decoration-color: currentColor; } .entry-office a:focus-visible { outline: 2px solid var(--ground-ink); outline-offset: 3px; border-radius: var(--radius-xs); } @media (max-width: 991.98px) { .entry-chart { height: clamp(160px, 26vh, 280px); } } @media (max-width: 576px) { .entry { display: flex; flex-direction: column; padding-top: var(--space-2); } .entry-title { font-size: var(--text-lg); margin-bottom: var(--space-2); } .entry-office { order: 1; margin: 0 auto var(--space-3); } .entry-card { order: 2; } .entry-title-dot { display: none; } .entry-title-work { display: block; } .entry-card { padding: var(--space-5) var(--space-4) var(--space-4); border-radius: var(--radius-lg); } .entry-title-mark { display: inline-flex; } .entry-brand { display: none; } .auth-captcha-pic { flex-wrap: nowrap; } .auth-captcha-pic > img { flex: 0 1 auto; min-width: 0; } .auth-captcha-new { flex: none; justify-content: center; width: 2.75rem; height: 2.75rem; padding: 0; } .auth-captcha-new-word { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; } .entry-chart { height: clamp(150px, 24vh, 220px); } .entry-chart > * { -webkit-mask-position: 30% 100%; mask-position: 30% 100%; } } @media screen and (min-width: 600px) and (max-height: 860px) { .entry { padding-top: var(--space-2); } .entry-title { margin-bottom: var(--space-4); } .entry-title-mark { display: inline-flex; width: 1.25em; height: 1.25em; } .entry-brand { display: none; } .entry-card { padding-top: var(--space-5); } .entry-head { grid-auto-flow: column; justify-content: center; align-items: center; column-gap: var(--space-3); margin-bottom: var(--space-3); } .entry-form .auth-field { margin-bottom: var(--space-3) !important; } .auth-captcha { display: grid; grid-template-columns: auto auto auto minmax(0, 1fr); align-items: center; column-gap: var(--space-2); } .auth-captcha > .form-label, .auth-captcha > .auth-captcha-say { grid-column: 1 / -1; } .auth-captcha > .auth-captcha-audio { grid-column: 1 / -1; } .auth-captcha-pic { display: contents; } .auth-captcha-new { justify-content: center; width: 2.75rem; height: 2.75rem; padding: 0; } .auth-captcha-new-word { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; } .auth-passkey { margin-top: var(--space-3); } .auth-or { margin-bottom: var(--space-2); } } } @layer base { h1, .h1 { font-size: var(--text-3xl); } h2, .h2 { font-size: var(--text-2xl); } h3, .h3 { font-size: var(--text-xl); } h4, .h4 { font-size: var(--text-lg); } h5, .h5 { font-size: var(--text-base); } h6, .h6 { font-size: var(--text-md); } .small, small { font-size: var(--text-sm); } .lead { font-size: var(--text-lg); } } @layer components { .btn { --bs-btn-font-size: var(--text-base); } .btn-sm, .btn-group-sm > .btn { --bs-btn-font-size: var(--text-sm); } .btn-lg, .btn-group-lg > .btn { --bs-btn-font-size: var(--text-lg); } .toast { --bs-toast-font-size: var(--text-sm); } .progress, .progress-stacked { --bs-progress-font-size: var(--text-2xs); } .form-control, .form-select { font-size: var(--text-base); } .form-control-lg, .form-select-lg, .input-group-lg > .btn, .input-group-lg > .form-control, .input-group-lg > .form-select, .input-group-lg > .input-group-text { font-size: var(--text-lg); } .form-text { font-size: var(--text-sm); } .form-control, .form-select, .form-check-input, .btn-close, .nav-link, .fade { transition-duration: var(--dur-1); transition-timing-function: var(--ease-out); } .modal.fade .modal-dialog, .collapsing { transition-duration: var(--dur-3); transition-timing-function: var(--ease-out); } .progress, .progress-stacked { --bs-progress-bar-transition: width var(--dur-4) var(--ease-out); } } @layer utilities { .fs-4 { font-size: var(--text-lg) !important; } .fs-5 { font-size: var(--text-base) !important; } } @layer utilities { @media (forced-colors: active) { :root { --glass: Canvas; --border: CanvasText; --border-strong: CanvasText; } .app-sidebar, .app-topbar, .bottom-nav, .navbar, .dropdown-menu, .toast, .glass-card, .cmdk, .bulk-bar, .bi-report .export-bar, .bi-report .alarm-panel, .bi-report .drill-bar, .bi-report .xf-bar { background: Canvas; -webkit-backdrop-filter: none; backdrop-filter: none; } .dropdown-menu, .toast, .glass-card, .cmdk, .bulk-bar, .bi-report .export-bar, .bi-report .alarm-panel, .bi-report .drill-bar, .bi-report .xf-bar { border: 1px solid CanvasText; } .auth-visual::after { display: none; } body::after { display: none; } .entry-scene { display: none; } .entry-card { border: 1px solid CanvasText; } :where(a, button, .btn, .form-control, .form-select, .form-check-input, [tabindex]:not([tabindex="-1"])):focus-visible { outline: 2px solid Highlight; outline-offset: 2px; } .btn-primary, .btn-export-excel { border: 1px solid ButtonText; } .pub-nav-link { border-bottom-color: Canvas; } .pub-nav-link.active { border-bottom-color: CanvasText; } .land-tab-btn:has(input:checked), .auth-chip:has(:checked), .lang-opt.active, .pub-nav-sub.active, .pub-menu-link.active, .pub-menu-sub.active { forced-color-adjust: none; background: SelectedItem; color: SelectedItemText; } :is(.land-tab-btn:has(input:checked), .auth-chip:has(:checked), .pub-menu-link.active, .pub-menu-sub.active) i { color: SelectedItemText; } } @media (prefers-contrast: more) { :root { --faint: var(--muted); --border: var(--border-strong); --glass: var(--surface); } .app-sidebar, .app-topbar, .bottom-nav, .navbar, .dropdown-menu, .toast, .glass-card, .cmdk, .bulk-bar, .bi-report .export-bar, .bi-report .alarm-panel, .bi-report .drill-bar, .bi-report .xf-bar { background: var(--surface); -webkit-backdrop-filter: none; backdrop-filter: none; } .card, .table-card, .stat-card, .bi-card, .form-control, .form-select, .dropdown-menu, .toast { border-width: 2px; } } }