:root{--sui-color-neutral-primary: #31363a;--sui-color-neutral-secondary: #899196;--sui-color-neutral-tertiary: #dbe0e4;--sui-color-on-neutral-tertiary: #6c757b;--sui-color-key-primary: #1261ec;--sui-color-on-key-primary: #ffffff;--sui-color-key-secondary: #6093ec;--sui-color-key-tertiary: #d4e2fc;--sui-color-outline-primary: #c1c8ce;--sui-color-outline-secondary: #e3e7e9;--sui-color-highlight-primary: #dfdfe7;--sui-color-highlight-secondary: #f6f6f8;--sui-color-surface: #ffffff;--sui-color-disabled-fill: #f3f5f8;--sui-color-success: #00a846;--sui-color-warning: #d18b00;--sui-color-error: #ff4b6c;--sui-color-scrim: rgba(57, 69, 79, .65);--sui-roundness-strong: 8px;--sui-roundness-normal: 8px;--sui-base-padding: 12px;--sui-icon-gap: .3em;--sui-regular-ripple-effect-density: .2;--sui-broad-ripple-effect-density: .5;--sui-input-base-height: 40px;--sui-shadow-hover: 0px 2px 12px rgba(24, 69, 95, .2);--sui-button-height: 40px;--sui-button-font-weight: 400;--sui-button-horizontal-padding: 16px;--sui-button-ripple-effect-content: "";--sui-checkbox-size: 20px;--sui-radio-size: 20px;--sui-label-gap: 4px}@media(prefers-color-scheme:dark){:root{--sui-color-neutral-primary: #dbe0e4;--sui-color-neutral-secondary: #899196;--sui-color-neutral-tertiary: #6c757b;--sui-color-on-neutral-tertiary: #dbe0e4;--sui-color-key-primary: #4ea1ff;--sui-color-on-key-primary: #000000;--sui-color-key-secondary: #6093ec;--sui-color-key-tertiary: #223145;--sui-color-outline-primary: #444c52;--sui-color-outline-secondary: #60666c;--sui-color-highlight-primary: #2c2c2c;--sui-color-highlight-secondary: #252525;--sui-color-surface: #121212;--sui-color-disabled-fill: #2c2c2c;--sui-color-error: #ff453a;--sui-color-success: #34c759;--sui-color-warning: #ffd60a;--sui-color-scrim: rgba(0, 0, 0, .65)}}.button:where(button){border:none;font:inherit}.button:where(a){text-decoration:none}.button{align-items:center;background:var(--sui-color-key-primary);border-radius:var(--sui-roundness-strong);box-sizing:border-box;color:var(--sui-color-on-key-primary);cursor:pointer;display:inline-flex;font-weight:var(--sui-button-font-weight);gap:var(--sui-icon-gap);height:var(--sui-button-height);justify-content:center;overflow:hidden;padding:0 var(--sui-button-horizontal-padding);position:relative;width:-moz-fit-content;width:fit-content}.button:hover{opacity:.9}.button:active:not(:disabled){transform:translateY(1px)}.button:before{aspect-ratio:1/1;background:var(--sui-color-on-key-primary);border-radius:50%;content:var(--sui-button-ripple-effect-content);display:block;opacity:0;position:absolute;transition:all .3s ease-out;width:110%;z-index:-1}.button:active:before{height:0;opacity:var(--sui-regular-ripple-effect-density);transition:all 0s;width:0}.button:disabled:before{content:none}.button:where(.secondary){background:transparent;border:1px solid var(--sui-color-key-tertiary);color:var(--sui-color-key-primary)}.button:where(.secondary):hover{background:var(--sui-color-key-tertiary)}.button:where(.secondary):before{background:var(--sui-color-key-secondary)}.button:where(.tertiary){background:transparent;border:1px solid var(--sui-color-outline-secondary);color:var(--sui-color-neutral-secondary)}.button:where(.tertiary):hover{background:var(--sui-color-highlight-secondary)}.button:where(.tertiary):before{background:var(--sui-color-neutral-primary)}.button:where(.shy){background:transparent;color:var(--sui-color-neutral-secondary)}.button:where(.shy):hover{background:var(--sui-color-highlight-secondary)}.button:where(.shy):before{background:var(--sui-color-neutral-primary)}.button:disabled{background:var(--sui-color-disabled-fill);border-width:0;color:var(--sui-color-on-neutral-tertiary);cursor:default;opacity:1}.button .icon{height:1.1em;width:1.1em}.button .icon:first-child{margin-left:-.2em}.button .icon:last-child{margin-right:-.2em}.callout{background:var(--sui-color-highlight-secondary);border-radius:var(--sui-roundness-normal);margin:0;padding:24px 16px;position:relative}.callout:where(:has(>.icon)){padding-inline-start:calc(28px + 1.2em)}.callout>.icon{height:1.2em;inset-block-start:26px;inset-inline-start:16px;position:absolute;width:1.2em}.callout>:where(.icon)+*,.callout>:where(:first-child){margin-block-start:0}.callout>:where(:last-child){margin-block-end:0}.callout>:where(blockquote){margin:0}.callout:where(.info){background:var(--sui-color-key-tertiary)}.callout:where(.success){background:color-mix(in srgb,var(--sui-color-success) 12%,transparent)}.callout:where(.warning){background:color-mix(in srgb,var(--sui-color-warning) 12%,transparent)}.callout:where(.destructive){background:color-mix(in srgb,var(--sui-color-error) 12%,transparent)}.card-option:has(>input[type=radio]){--card-option-control-size:var(--sui-radio-size)}.card-option:has(>input[type=checkbox]){--card-option-control-size:var(--sui-checkbox-size)}.card-option{--card-option-padding:calc(var(--sui-base-padding)*4/3);background-color:var(--sui-color-surface);border:1px solid var(--sui-color-outline-primary);border-radius:var(--sui-roundness-normal);box-sizing:border-box;cursor:pointer;display:block;padding:var(--card-option-padding);padding-inline-start:calc(var(--card-option-padding) + var(--sui-base-padding) + var(--card-option-control-size));position:relative;width:100%}.card-option:hover{background-color:var(--sui-color-highlight-secondary)}.card-option>input{inset-block-start:round(nearest,calc(var(--card-option-padding) + (1lh - var(--card-option-control-size))/2 + 2px),1px);inset-inline-start:var(--card-option-padding);line-height:inherit;margin:0;position:absolute}.card-option:has(>input:checked){background-color:var(--sui-color-key-tertiary);border-color:var(--sui-color-key-primary)}.card-option:has(>input:focus-visible){border-color:var(--sui-color-key-primary)}.card-option:has(>input.error){border-color:var(--sui-color-error)}.card-option:has(>input.error:checked){background-color:color-mix(in srgb,var(--sui-color-error) 12%,transparent);border-color:var(--sui-color-error)}.card-option:has(>input:disabled){background-color:var(--sui-color-disabled-fill);color:var(--sui-color-on-neutral-tertiary);cursor:default}.card:where(button){background:none;border:none;font:inherit;text-align:inherit}.card:where(a){color:inherit;text-decoration:none}.card{background-color:var(--sui-color-surface);border:1px solid var(--sui-color-outline-primary);border-radius:var(--sui-roundness-normal);box-sizing:border-box;display:block;overflow:hidden;padding:var(--sui-base-padding);position:relative;z-index:0}.card:where(a),.card:where(button){color:inherit;cursor:pointer}.card:where(a):hover:before,.card:where(button):hover:before{background-color:var(--sui-color-highlight-secondary);content:"";display:block;inset:0;position:absolute;z-index:-1}.card:where(a):hover:after,.card:where(button):hover:after{aspect-ratio:1/1;background-color:var(--sui-color-neutral-primary);border-radius:50%;content:"";display:block;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%);transition:all .2s ease-out;width:110%;z-index:1}.card:where(a):active:after,.card:where(button):active:after{height:0;opacity:var(--sui-broad-ripple-effect-density);transition:all 0s;width:0}.checkbox:where(input[type=checkbox]){-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent}.checkbox{background:radial-gradient(circle,var(--sui-color-key-primary) 50%,transparent 50%);background-position:50%;background-repeat:no-repeat;background-size:0 0;border-radius:calc(var(--sui-roundness-normal)*2/3);box-shadow:inset 0 0 0 2px var(--sui-color-outline-primary);cursor:pointer;height:var(--sui-checkbox-size);margin:0;min-width:var(--sui-checkbox-size);padding:0;position:relative;transition:background-size 50ms cubic-bezier(1,.345,1,.265);vertical-align:middle;width:var(--sui-checkbox-size);--check-width:calc(var(--sui-checkbox-size)/8);--check-hook-length:calc(var(--sui-checkbox-size)/2.9);--check-tail-length:calc(var(--sui-checkbox-size)/1.8);--check-anchor:calc(var(--sui-checkbox-size)/1.7) calc(var(--sui-checkbox-size)/2.4);--check-color:var(--sui-color-on-key-primary);--timing-former-half:cubic-bezier(.605,1.27,.445,.95);--timing-latter-half:cubic-bezier(.755,0,.3,-.055);--check-duration:.1s}.checkbox:where(:checked){background-size:calc(var(--sui-checkbox-size)*2) calc(var(--sui-checkbox-size)*2);box-shadow:inset 0 0 0 2px var(--sui-color-key-primary);transition:background-size .15s ease-out}.checkbox:before{background-color:var(--check-color);content:"";display:block;height:var(--check-width);inset:var(--check-anchor);position:absolute;transform:translate(-100%) rotate(45deg) translate(calc(var(--check-hook-length)*-1));transform-origin:bottom right;transition:all var(--check-duration) var(--timing-latter-half);width:0}.checkbox:where(:checked):before{transform:translate(-100%) rotate(45deg) translate(0);transition:all var(--check-duration) var(--timing-former-half);width:var(--check-hook-length)}.checkbox:after{background-color:var(--check-color);content:"";display:block;height:var(--check-width);inset:var(--check-anchor);position:absolute;transform:rotate(-45deg);transform-origin:bottom left;transition:all var(--check-duration) var(--timing-former-half);width:0}.checkbox:where(:checked):after{transition:all var(--check-duration) var(--timing-latter-half);width:var(--check-tail-length)}.checkbox:where(.error){background:radial-gradient(circle,var(--sui-color-error) 50%,transparent 50%);background-position:50%;background-repeat:no-repeat;background-size:0 0;box-shadow:inset 0 0 0 2px var(--sui-color-error)}.checkbox:where(.error):checked{background-size:calc(var(--sui-checkbox-size)*2) calc(var(--sui-checkbox-size)*2);border-color:var(--sui-color-error);transition:background-size .15s ease-out}.checkbox:where(:disabled){background-color:var(--sui-color-disabled-fill);box-shadow:inset 0 0 0 1px var(--sui-color-outline-primary);cursor:default}.checkbox:where(:disabled):where(:checked){opacity:.5}.chip:where(button){font:inherit}.chip:where(a){text-decoration:none}.chip{align-items:center;background:transparent;border:1px solid var(--sui-color-outline-primary);border-radius:999px;box-sizing:border-box;color:var(--sui-color-neutral-primary);display:inline-flex;font-size:14px;font-weight:600;gap:2px;justify-content:center;line-height:1;min-height:32px;padding:0 12px;width:-moz-fit-content;width:fit-content}.chip:where(button,a){cursor:pointer}.chip:where(button,a):where(:hover){background:var(--sui-color-highlight-secondary)}.chip:where(button,a):where(:active:not(:disabled)){transform:translateY(1px)}.chip:where(.active){background:var(--sui-color-key-tertiary);border-color:var(--sui-color-key-tertiary);color:var(--sui-color-key-primary)}.chip:where(:disabled){background:var(--sui-color-disabled-fill);border-color:transparent;color:var(--sui-color-on-neutral-tertiary);cursor:default}.chip .icon{height:1em;width:1em}.details:where(details){background-color:var(--sui-color-surface);border:1px solid var(--sui-color-outline-primary);border-radius:var(--sui-roundness-normal);box-sizing:border-box;overflow:hidden;width:100%}.details:where(details)>:where(summary){align-items:center;box-sizing:border-box;cursor:pointer;display:flex;font-weight:600;list-style:none;min-height:48px;padding:20px calc(var(--sui-base-padding)*4/3)}.details:where(details)>:where(summary)::-webkit-details-marker{display:none}.details:where(details)>:where(summary)>.icon{flex:0 0 auto;height:1.2em;margin-block-start:-.15em;margin-inline-end:var(--sui-icon-gap);width:1.2em}.details:where(details)>:where(summary):after{border-block-end:2px solid currentColor;border-inline-end:2px solid currentColor;content:"";height:.45em;margin-inline-start:auto;transform:rotate(45deg);transition:transform .15s ease-out;width:.45em}.details:where(details)>:where(summary:hover){background-color:var(--sui-color-highlight-secondary)}.details:where(details)>:where(summary:focus-visible){outline:2px solid var(--sui-color-key-primary);outline-offset:-2px}.details:where(details[open])>:where(summary):after{transform:rotate(225deg)}.details:where(details)>:where(:not(summary)){margin-block:8px 24px;margin-inline:calc(var(--sui-base-padding)*4/3)}.details:where(details):where(:has(>summary>.icon))>:where(:not(summary)){margin-inline-start:calc(var(--sui-base-padding)*4/3 + 1.2em + var(--sui-icon-gap))}.dialog{background-color:var(--sui-color-surface);border:none;border-radius:var(--sui-roundness-normal);box-shadow:var(--sui-shadow-hover);box-sizing:border-box;color:inherit;overflow:hidden;z-index:1000}.dialog::backdrop{background-color:var(--sui-color-scrim)}.dialog:where(.popover){border-radius:var(--sui-roundness-normal);margin:0;padding:0;position:fixed}.dialog:where(.anchor_left):where(.anchor_top){transform:none}.dialog:where(.anchor_left):where(.anchor_bottom){transform:translateY(-100%)}.dialog:where(.anchor_right):where(.anchor_top){transform:translate(-100%,8px)}.dialog:where(.anchor_right):where(.anchor_bottom){transform:translate(-100%,calc(-100% - 8px))}.dialog:where(.modal){border-radius:calc(var(--sui-roundness-normal)*1.5)}.dialog:where(.modal)::backdrop{background-color:var(--sui-color-scrim)}.fieldset{border:none;display:flex;flex-direction:column;margin:0;padding:0}.file-input:where(input[type=file]){background-color:var(--sui-color-surface);border:1px solid var(--sui-color-outline-primary);border-radius:calc(var(--sui-roundness-normal) + 4px);box-sizing:border-box;color:var(--sui-color-neutral-secondary);cursor:pointer;font:inherit;max-width:100%;padding:8px}.file-input:where(input[type=file])::file-selector-button{background-color:var(--sui-color-key-primary);border:0;border-radius:var(--sui-roundness-normal);color:var(--sui-color-on-key-primary);cursor:pointer;font:inherit;height:32px;margin-inline-end:var(--sui-base-padding);padding-inline:var(--sui-base-padding)}.file-input:where(input[type=file]):where(:hover)::file-selector-button{opacity:.9}.file-input:where(input[type=file]):where(.secondary)::file-selector-button{background-color:transparent;border:1px solid var(--sui-color-key-tertiary);color:var(--sui-color-key-primary)}.file-input:where(input[type=file]):where(.secondary):where(:hover)::file-selector-button{background-color:var(--sui-color-key-tertiary);opacity:1}.file-input:where(input[type=file]):where(.tertiary)::file-selector-button{background-color:transparent;border:1px solid var(--sui-color-outline-secondary);color:var(--sui-color-neutral-secondary)}.file-input:where(input[type=file]):where(.tertiary):where(:hover)::file-selector-button{background-color:var(--sui-color-highlight-secondary);opacity:1}.file-input:where(input[type=file]):where(.shy)::file-selector-button{background-color:transparent;color:var(--sui-color-neutral-secondary)}.file-input:where(input[type=file]):where(.shy):where(:hover)::file-selector-button{background-color:var(--sui-color-highlight-secondary);opacity:1}.file-input:where(input[type=file]):where(.dragover){background-color:var(--sui-color-key-tertiary);border-color:var(--sui-color-key-primary)}.file-input:where(input[type=file]):where(.error){border-color:var(--sui-color-error)}.file-input:where(input[type=file]):where(:disabled){background-color:var(--sui-color-disabled-fill);color:var(--sui-color-on-neutral-tertiary);cursor:default}.file-input:where(input[type=file]):where(:disabled)::file-selector-button{background-color:var(--sui-color-neutral-tertiary);color:var(--sui-color-on-neutral-tertiary);cursor:default;opacity:1}.helper-text{color:var(--sui-color-neutral-secondary);font-size:.9em;line-height:1.2;margin:0;padding:4px 0}.helper-text:where(.error){color:var(--sui-color-error)}.icon{display:inline-block;height:1.2em;max-width:1.2em;vertical-align:text-bottom;width:auto}picture.icon>img{display:block;height:100%;width:auto}.input:where(:not([type])),.input:where([type=date]),.input:where([type=datetime-local]),.input:where([type=email]),.input:where([type=month]),.input:where([type=number]),.input:where([type=password]),.input:where([type=search]),.input:where([type=tel]),.input:where([type=text]),.input:where([type=time]),.input:where([type=url]),.input:where([type=week]){background-color:var(--sui-color-surface);border:1px solid var(--sui-color-outline-primary);border-radius:var(--sui-roundness-normal);box-sizing:border-box;color:var(--sui-color-neutral-primary);font:inherit;height:var(--sui-input-base-height);padding:0 var(--sui-base-padding)}.input::-moz-placeholder{color:var(--sui-color-neutral-secondary)}.input::placeholder{color:var(--sui-color-neutral-secondary)}.input:disabled{background-color:var(--sui-color-disabled-fill)}.input:where(.error){border-color:var(--sui-color-error)}.key-value:where(dl){-moz-column-gap:24px;column-gap:24px;display:grid;grid-template-columns:auto 1fr;list-style:none;margin:0;padding:0;row-gap:8px}.key-value:where(dl) dt{color:var(--sui-color-neutral-secondary)}.key-value:where(dl) dd{justify-self:end;margin:0}.label:has(.checkbox){align-items:center;display:inline-flex;gap:var(--sui-label-gap)}.label:has(+.checkbox){margin-inline-end:var(--sui-label-gap)}.checkbox+.label{margin-inline-start:var(--sui-label-gap)}.label:has(.switch){align-items:center;display:inline-flex;gap:var(--sui-label-gap)}.label:has(+.switch){margin-inline-end:var(--sui-label-gap);vertical-align:middle}.switch+.label{margin-inline-start:var(--sui-label-gap);vertical-align:middle}.label:has(.radio){align-items:center;display:inline-flex;gap:var(--sui-label-gap)}.label:has(+.radio){margin-inline-end:var(--sui-label-gap)}.radio+.label{margin-inline-start:var(--sui-label-gap)}.label:where(.error){color:var(--sui-color-error)}.legend:where(legend){padding:0}.legend:where(legend):where(.error){color:var(--sui-color-error)}.link:where(button){background-color:transparent;border:none;font:inherit;padding:0;position:relative}.link{align-items:center;color:var(--sui-color-key-primary);cursor:pointer;display:inline-flex;flex-wrap:wrap;text-align:left;text-decoration:underline}.link:where(:hover){text-decoration:underline}.link:where(.seamless){color:inherit;font:inherit}.link:where(.passive){color:var(--sui-color-neutral-secondary);text-decoration:none}.link:where(.passive):where(:hover){text-decoration:underline}:where(.link) .icon{height:1.1em;width:1.1em}.menu-item:where(a){color:inherit;text-decoration:none}.menu-item:where(button){background:none;border:none;color:inherit;font:inherit;text-align:inherit}.menu-item{align-items:center;background-color:transparent;border-radius:var(--sui-roundness-normal);box-sizing:border-box;cursor:pointer;display:flex;font:inherit;gap:var(--sui-icon-gap);justify-content:flex-start;min-height:40px;overflow:hidden;padding:calc(var(--sui-base-padding)*2/3) var(--sui-base-padding);position:relative;width:100%;z-index:0}.menu-item:hover:before{background-color:var(--sui-color-highlight-secondary);content:"";display:block;inset:0;position:absolute;z-index:-2}.menu-item:where(a):hover:after,.menu-item:where(button):hover:after{aspect-ratio:1/1;background-color:var(--sui-color-neutral-primary);border-radius:50%;content:"";display:block;left:50%;opacity:0;position:absolute;top:50%;transform:translate(-50%,-50%);transition:all .2s ease-out;width:110%;z-index:-1}.menu-item:where(a):active:after,.menu-item:where(button):active:after{height:0;opacity:var(--sui-regular-ripple-effect-density);transition:all 0s;width:0}.menu-item:where(.active){background-color:var(--sui-color-key-tertiary);color:var(--sui-color-key-primary)}.menu-item:where(.active):hover{opacity:.8}.menu-item:where(.active):hover:before{content:none}:where(.menu-item) .icon{height:1.3em;width:1.3em}.meter:where(meter){-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;border-radius:4px;box-sizing:border-box;height:24px;overflow:hidden}.meter:where(meter)::-webkit-meter-bar{background:var(--sui-color-key-tertiary);border:0;border-radius:4px}.meter:where(meter)::-webkit-meter-optimum-value{background:var(--sui-color-key-primary)}.meter:where(meter)::-webkit-meter-suboptimum-value{background:var(--sui-color-warning)}.meter:where(meter)::-webkit-meter-even-less-good-value{background:var(--sui-color-error)}.meter:where(meter)::-moz-meter-bar{background:var(--sui-color-key-primary);border-radius:4px}.meter:where(meter:-moz-meter-sub-optimum)::-moz-meter-bar{background:var(--sui-color-warning)}.meter:where(meter:-moz-meter-sub-sub-optimum)::-moz-meter-bar{background:var(--sui-color-error)}.progress{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:3px;height:8px;overflow:hidden;position:relative}.progress::-webkit-progress-value{background-color:var(--sui-color-key-primary)}.progress::-webkit-progress-bar{background-color:var(--sui-color-key-tertiary)}.progress:where(:not(.circular)):indeterminate:before{animation:sui-indeterminate 1s linear infinite;background-color:var(--sui-color-key-primary);content:"";inset:0;position:absolute;transform-origin:0 50%}.progress:where(.circular){-webkit-appearance:none;-moz-appearance:none;appearance:none;color:var(--sui-color-key-primary);container-type:size;height:48px;overflow:visible;position:relative;width:48px}.progress:where(.circular):before{animation:sui-rotate 1s linear infinite;background-color:transparent;border:12cqh solid;border-radius:50%;content:"";inset:0;-webkit-mask:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAiIGhlaWdodD0iMTAwIiBmaWxsPSJub25lIj48cGF0aCBmaWxsPSIjRDlEOUQ5IiBkPSJNMTAwIDBINDBsMTAgNTBMMCA0MHY2MGgxMDB6Ii8+PC9zdmc+);mask:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAiIGhlaWdodD0iMTAwIiBmaWxsPSJub25lIj48cGF0aCBmaWxsPSIjRDlEOUQ5IiBkPSJNMTAwIDBINDBsMTAgNTBMMCA0MHY2MGgxMDB6Ii8+PC9zdmc+);-webkit-mask-size:cover;mask-size:cover;position:absolute}.progress.circular::-webkit-progress-bar{background-color:transparent}.progress.skeleton{-webkit-appearance:none;-moz-appearance:none;appearance:none;border-radius:6px;height:240px;overflow:hidden;position:relative;width:100%}.progress.skeleton:indeterminate:before{animation:sui-skeleton 1s linear infinite;background:linear-gradient(.28turn,transparent 20%,var(--sui-color-highlight-primary) 50%,transparent 80%);transform-origin:0 50%;width:200%}.progress.skeleton::-webkit-progress-bar{background-color:var(--sui-color-highlight-secondary)}@keyframes sui-rotate{0%{transform:rotate(0)}to{transform:rotate(1turn)}}@keyframes sui-indeterminate{0%{transform:translate(0) scaleX(0)}40%{transform:translate(0) scaleX(.4)}to{transform:translate(100%) scaleX(.5)}}@keyframes sui-skeleton{0%{transform:translate(-100%)}to{transform:translate(100%)}}.radio:where(input[type=radio]){-webkit-appearance:none;-moz-appearance:none;appearance:none}.radio{border:2px solid var(--sui-color-outline-primary);border-radius:50%;cursor:pointer;height:var(--sui-radio-size);margin:0;min-width:var(--sui-radio-size);padding:0;position:relative;vertical-align:-.3em;width:var(--sui-radio-size)}.radio:where(:checked){border-color:var(--sui-color-key-primary)}.radio:before{background-color:var(--sui-color-key-primary);border-radius:50%;content:"";display:block;height:calc(var(--sui-radio-size)*1/3);left:50%;opacity:0;position:absolute;top:50%;transition:width .12s ease-out,height .12s ease-out;translate:-50% -50%;width:calc(var(--sui-radio-size)*1/3)}.radio:where(:checked):before{height:calc(var(--sui-radio-size)*3/5);opacity:1;width:calc(var(--sui-radio-size)*3/5)}.radio:where(.error){border-color:var(--sui-color-error)}.radio:where(.error):before{background-color:var(--sui-color-error)}.radio:where(:disabled){border-color:var(--sui-color-outline-primary);cursor:default}.radio:where(:disabled):where(:checked):before{background-color:var(--sui-color-neutral-secondary)}.select:where(select){-webkit-appearance:none;-moz-appearance:none;appearance:none}.select{background-color:var(--sui-color-surface);background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMSIgaGVpZ2h0PSI3Ij48cGF0aCBmaWxsPSIjNGU2NzdjIiBkPSJNNS40ODYgNC4xIDguODA4Ljc3OGwxLjQxNCAxLjQxNEw1LjQ4NiA2LjkzLjc0OSAyLjE5MiAyLjE2My43Nzh6Ii8+PC9zdmc+);background-position:center right 6px;background-repeat:no-repeat;border:1px solid var(--sui-color-outline-primary);border-radius:var(--sui-roundness-normal);color:var(--sui-color-neutral-primary);font:inherit;height:var(--sui-input-base-height);padding:calc(var(--sui-base-padding)*2/3) calc(var(--sui-base-padding)*2) calc(var(--sui-base-padding)*2/3) var(--sui-base-padding);position:relative}.select:has(option:checked[value=""]){color:var(--sui-color-neutral-secondary)}:where(.select) option{color:var(--sui-color-neutral-primary)}.select:where(.error){border-color:var(--sui-color-error)}.select:disabled{background-color:var(--sui-color-disabled-fill)}.switch:where(input[type=checkbox]){align-items:center;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--sui-color-neutral-tertiary);border-radius:16px;cursor:pointer;display:inline-flex;height:32px;position:relative;transition:background-color .15s ease;vertical-align:middle;width:48px}.switch:where(input[type=checkbox]):checked{background-color:var(--sui-color-key-primary)}.switch:where(input[type=checkbox]):after{background-color:#fff;border:1px solid;border-color:var(--sui-color-outline-primary);border-radius:50%;bottom:0;box-sizing:border-box;content:"";display:block;height:26px;left:2px;margin:auto;position:absolute;top:0;transition:left .15s ease;width:26px}.switch:where(input[type=checkbox]):checked:after{left:calc(100% - 29px)}.switch:where(input[type=checkbox]):where(.error){border:1px solid var(--sui-color-error)}.switch:where(input[type=checkbox]):where(.error):checked{background-color:var(--sui-color-error)}.switch:where(input[type=checkbox]):disabled{cursor:default;opacity:.4}.tab-item:where(button){font:inherit}.tab-item:where(a){text-decoration:none}.tab-item:where(button,a){align-items:center;background:transparent;border:0;box-sizing:border-box;color:var(--sui-color-neutral-primary);display:inline-flex;justify-content:center;min-height:48px;min-width:64px;padding:0 16px;position:relative;white-space:nowrap}.tab-item:where(button,a){cursor:pointer}.tab-item:where(button,a):where(:hover){background:var(--sui-color-highlight-secondary)}.tab-item:where(button,a):where(:focus-visible){outline:2px solid var(--sui-color-key-primary);outline-offset:-2px}.tab-item:where(button,a):where(.active){color:var(--sui-color-key-primary);font-weight:600}.tab-item:where(button,a):where(.active):after{background:currentColor;border-radius:2px 2px 0 0;content:"";height:3px;inset-block-end:0;inset-inline:12px;position:absolute}.tab-item:where(button):where(:disabled){color:var(--sui-color-neutral-secondary);cursor:default}.tab-item:where(button):where(:disabled:hover){background:transparent}.table{border-collapse:collapse}.table thead{border-bottom:1px solid var(--sui-color-outline-secondary)}.table th{color:var(--sui-color-neutral-secondary);font-weight:inherit;padding:calc(var(--sui-base-padding)/3) var(--sui-base-padding);text-align:left}.table td,.table th{vertical-align:middle}.table td{padding:calc(var(--sui-base-padding)*2/3) var(--sui-base-padding)}.table tbody tr:hover{background-color:var(--sui-color-highlight-secondary)}.table caption{caption-side:bottom;color:var(--sui-color-neutral-secondary);font-size:.9em}.textarea{background:var(--sui-color-surface);border-color:var(--sui-color-outline-primary);border-radius:var(--sui-roundness-normal);border-style:solid;border-width:1px;box-sizing:border-box;color:var(--sui-color-neutral-primary);font:inherit;padding:calc(var(--sui-base-padding)*2/3) var(--sui-base-padding)}.textarea::-moz-placeholder{color:var(--sui-color-neutral-secondary)}.textarea::placeholder{color:var(--sui-color-neutral-secondary)}.textarea:disabled{background-color:var(--sui-color-disabled-fill)}.textarea:where(.error){border-color:var(--sui-color-error)}:root{--paper:#f5f0e8;--ink:#25211d;--muted:#786f65;--line:#d9d0c4;--white:#fffdf9;--red:#e85d3f;--green:#487c71;--gold:#ef9f38}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Noto Sans JP,Hiragino Sans,sans-serif}button,input{font:inherit}.dashboard{width:min(1240px,calc(100% - 40px));margin:auto;padding:44px 0 36px}header{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;border-bottom:1px solid var(--ink);padding-bottom:22px;margin-bottom:16px}h1{font-family:Georgia,Yu Mincho,serif;font-size:clamp(2.2rem,5vw,4.5rem);line-height:.95;margin:7px 0 12px;letter-spacing:-.045em}h2{font-family:Georgia,Yu Mincho,serif;margin:4px 0;font-size:1.55rem}h3{font:700 1.15rem Georgia,Yu Mincho,serif;margin:6px 0}.eyebrow{color:var(--red)!important;font-size:.72rem;letter-spacing:.17em;font-weight:800;margin:0}.dashboard header p,.panel p{color:var(--muted);margin:0}.controls{display:flex;gap:9px;align-items:flex-end}.controls>span{padding-bottom:10px;color:var(--muted)}.controls label{font-size:.7rem;font-weight:700}.controls input{display:block;margin-top:5px;border:1px solid var(--line);background:var(--white);padding:9px}.button{min-height:40px;padding:0 18px;border:1px solid var(--ink);border-radius:0;background:transparent;color:var(--ink);font-weight:700;cursor:pointer}.button:hover{background:var(--ink);color:#fff}.modes{display:flex;gap:0;overflow:auto;margin-bottom:18px;border-bottom:1px solid var(--line)}.modes button{border:0;background:transparent;padding:13px 18px;color:var(--muted);font-weight:700;white-space:nowrap;cursor:pointer;border-bottom:3px solid transparent}.modes button.active{color:var(--ink);border-color:var(--red)}.metrics{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--ink);margin-bottom:20px;background:var(--white)}.metric{padding:22px;min-height:132px;border-right:1px solid var(--ink);display:flex;flex-direction:column}.metric:last-child{border:0}.metric p,.metric span{margin:0;color:var(--muted);font-size:.78rem}.metric strong{font:700 clamp(1.65rem,3vw,2.65rem) Georgia;margin:auto 0 4px}.income,.income strong{color:var(--green)}.expense,.expense strong{color:var(--red)}.panel{background:var(--white);border:1px solid var(--line);padding:25px;box-shadow:4px 4px #25211d0f;margin-bottom:20px}.head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:24px}.head>strong{font:700 1rem Georgia;color:var(--muted);text-align:right}.accounts{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px}.accounts article{background:var(--white);border:1px solid var(--line);padding:19px;min-height:145px;display:flex;flex-direction:column}.accounts article.card{border-top:3px solid var(--red)}.accounts article.bank{border-top:3px solid var(--green)}.accounts p,.accounts small{color:var(--muted);margin:0;font-size:.68rem}.accounts strong{font:700 1.55rem Georgia;margin:auto 0 8px}.accounts small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.table{overflow-x:auto}table{width:100%;border-collapse:collapse}th{color:var(--muted);font-size:.68rem;letter-spacing:.08em;text-align:left}td,th{padding:13px 9px;border-bottom:1px solid var(--line);white-space:nowrap}td:last-child,th:last-child{text-align:right;font-weight:800}td small{display:block;color:var(--muted);max-width:300px;overflow:hidden;text-overflow:ellipsis}td span{padding:4px 9px;background:#eee8df;font-size:.72rem}.trend{min-height:390px}.trend-grid{height:330px;display:flex;align-items:stretch;gap:5px;border-bottom:1px solid var(--ink);background:repeating-linear-gradient(to bottom,transparent 0,transparent 81px,#e5ded3 82px);overflow-x:auto}.trend-col{height:100%;min-width:25px;flex:1;display:flex;flex-direction:column;align-items:center}.bars{height:300px;width:100%;display:flex;gap:2px;align-items:flex-end;justify-content:center}.bars i{width:min(12px,42%);min-height:3px}.income-bar{background:var(--green)}.expense-bar{background:var(--red)}.trend-col small{font-size:.6rem;color:var(--muted);padding-top:6px}.legend{text-align:right;padding-top:17px;color:var(--muted);font-size:.75rem}.legend span{display:inline-block;width:9px;height:9px;border-radius:50%;margin:0 5px 0 14px}.green-dot{background:var(--green)}.red-dot{background:var(--red)}.pie-layout{display:grid;grid-template-columns:310px 1fr;gap:50px;align-items:center}.donut{aspect-ratio:1;border-radius:50%;position:relative;display:grid;place-items:center}.donut:after{content:"";position:absolute;width:58%;height:58%;border-radius:50%;background:var(--white)}.donut span{position:relative;z-index:1;font:700 2.5rem Georgia;text-align:center}.donut small{display:block;font:700 .65rem sans-serif;color:var(--muted)}.donut.large{width:280px}.pie-list>div{display:grid;grid-template-columns:10px 1fr auto 54px;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid var(--line)}.pie-list b{width:9px;height:9px;border-radius:50%}.pie-list strong{font-family:Georgia}.pie-list small{text-align:right;color:var(--muted)}.waterfall{height:420px;display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:end;padding:10px 8% 0}.waterfall article{text-align:center;height:100%;display:flex;flex-direction:column}.water-track{height:350px;display:flex;align-items:flex-end;justify-content:center;border-bottom:1px solid var(--ink)}.water-track i{width:min(160px,70%);display:block;position:relative;background:var(--green)}.water-track i.loss{background:var(--red)}.water-track i.remain{background:var(--gold)}.water-track em{position:absolute;top:-29px;left:50%;transform:translate(-50%);font:700 .85rem Georgia;white-space:nowrap}.waterfall article>strong{padding-top:14px}.statements{display:grid;grid-template-columns:1fr 1fr;gap:20px}.statement{margin:0}.statement-line{display:flex;justify-content:space-between;gap:18px;padding:14px 4px;border-bottom:1px solid var(--line)}.statement-line strong{font-family:Georgia}.statement-line.muted{font-size:.82rem;color:var(--muted);padding:8px 4px}.statement-line.total{border-top:2px solid var(--ink);border-bottom:3px double var(--ink);margin-top:12px;font-size:1.15rem}.category-lines{background:#f7f2ea}.accounting-note{grid-column:1/-1;margin:0;color:var(--muted);font-size:.72rem;line-height:1.7}.empty{min-height:180px;display:grid;place-content:center;text-align:center;color:var(--muted);font-size:2rem}.empty small{display:block;font-size:.8rem}footer{text-align:center;color:var(--muted);font-size:.65rem;letter-spacing:.14em;margin-top:30px}.login{min-height:100vh;display:grid;place-items:center;padding:24px}.login section{width:min(440px,100%);border:1px solid var(--ink);background:var(--white);padding:42px;box-shadow:10px 10px 0 var(--ink);position:relative}.login h1{font-size:2.8rem}.login p{color:var(--muted)}.login form{margin-top:28px}.login label{font-size:.8rem;font-weight:700}.login input{display:block;width:100%;margin:8px 0 10px;padding:10px}.login button{width:100%;background:var(--ink);color:#fff}.login i{position:absolute;top:18px;right:18px;border:1px solid var(--red);color:var(--red);padding:4px 7px;font-size:.62rem}.error{color:#a93226!important;background:#fee9e4;padding:10px;margin-top:12px!important}@media(max-width:850px){.dashboard{width:calc(100% - 24px);padding-top:28px}header{align-items:flex-start;flex-direction:column}.controls{width:100%;flex-wrap:wrap}.controls label{flex:1}.controls input{width:100%}.metrics{grid-template-columns:1fr}.metric{border-right:0;border-bottom:1px solid var(--ink);min-height:105px}.accounts{grid-template-columns:1fr 1fr}.pie-layout,.statements{grid-template-columns:1fr}.donut.large{margin:auto;width:min(280px,80vw)}.waterfall{padding:10px 0;gap:7px}.water-track i{width:75%}.panel{padding:19px}.accounting-note{grid-column:auto}td:nth-child(3),th:nth-child(3){display:none}}@media(max-width:480px){.accounts{grid-template-columns:1fr}.modes button{padding:11px 13px}.head{flex-direction:column}.head>strong{text-align:left}.waterfall{height:360px}.water-track{height:285px}}.single-stack,.stack-column{width:min(160px,70%);display:block;position:relative}.single-stack.remain{background:var(--gold)}.single-stack.negative{background:var(--red)}.stack-column{display:flex;flex-direction:column-reverse}.water-track .stack-column i{display:block;width:100%;min-height:3px;border-top:1px solid #fff9;position:static}.stack-legend{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin:22px auto 5px;max-width:760px;border-top:1px solid var(--line);padding-top:18px}.stack-legend h3{margin-bottom:10px}.stack-legend span{display:grid;grid-template-columns:9px 1fr auto;align-items:center;gap:8px;padding:5px 0;font-size:.78rem}.stack-legend span b{width:8px;height:8px;border-radius:50%}.stack-legend span strong{font-family:Georgia}@media(max-width:850px){.single-stack,.stack-column{width:75%}.stack-legend{grid-template-columns:1fr}}
