:root{color-scheme: light;--bg: #f4f1ea;--panel: #fffdf9;--panel-2: #f0ebe3;--panel-3: #e6ded1;--editor-bg: #fbfaf7;--gutter-bg: #f1ebe1;--text: #181410;--muted: #6d6459;--accent: #d15f38;--accent-strong: #bb4f2b;--accent-soft: rgba(209, 95, 56, 0.1);--selection-bg: rgba(209, 95, 56, 0.22);--editor-active-line-bg: rgba(209, 95, 56, 0.07);--editor-selected-line-bg: rgba(209, 95, 56, 0.12);--search-match-bg: rgba(209, 95, 56, 0.18);--tab-mark-soft-fallback: rgba(209, 95, 56, 0.08);--border: #d7cfc3;--border-strong: #bdb3a4;--danger: #b64934;--warning: #9b691f;--success: #1f7c58;--danger-soft: rgba(182, 73, 52, 0.08);--danger-border-soft: rgba(182, 73, 52, 0.26);--danger-border: rgba(182, 73, 52, 0.36);--danger-border-strong: rgba(182, 73, 52, 0.5);--warning-border: rgba(155, 105, 31, 0.35);--success-border: rgba(31, 124, 88, 0.35);--backdrop: rgba(11, 10, 9, 0.46);--shadow: rgba(25, 20, 16, 0.12);--radius-sm: 8px;--radius: 12px;--radius-lg: 18px;--control-height: 34px;--editor-font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace;--editor-font-size: 14px;--editor-line-height: 1.7;--editor-pad-y: 18px;--editor-pad-x: 18px;--gutter-width: 56px;--gutter-pad-right: 10px} :root.theme-dark{color-scheme: dark;--bg: #12100e;--panel: #171513;--panel-2: #1d1a17;--panel-3: #26211c;--editor-bg: #12110f;--gutter-bg: #181614;--text: #efe8de;--muted: #b6ab9d;--accent: #ff7444;--accent-strong: #ff5f26;--accent-soft: rgba(255, 116, 68, 0.14);--selection-bg: rgba(255, 116, 68, 0.28);--editor-active-line-bg: rgba(255, 116, 68, 0.09);--editor-selected-line-bg: rgba(255, 116, 68, 0.16);--search-match-bg: rgba(255, 116, 68, 0.24);--tab-mark-soft-fallback: rgba(255, 116, 68, 0.12);--border: rgba(255, 255, 255, 0.12);--border-strong: rgba(255, 255, 255, 0.22);--danger: #ff6c59;--warning: #efb15f;--success: #7bc79d;--danger-soft: rgba(255, 108, 89, 0.12);--danger-border-soft: rgba(255, 108, 89, 0.34);--danger-border: rgba(255, 108, 89, 0.42);--danger-border-strong: rgba(255, 108, 89, 0.58);--warning-border: rgba(239, 177, 95, 0.42);--success-border: rgba(123, 199, 157, 0.42);--backdrop: rgba(0, 0, 0, 0.56);--shadow: rgba(0, 0, 0, 0.32)} *, *::before, *::after{box-sizing: border-box} html, body{height: 100%;margin: 0} body{min-height: 100dvh;display: flex;flex-direction: column;background: radial-gradient(circle at top left, var(--accent-soft), transparent 28%), linear-gradient(180deg, var(--bg) 0%, var(--bg) 58%, var(--panel-2) 100%);color: var(--text);font: 14px/1.45 "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale} body.view-landing #menubar, body.view-landing #main-content-outter{display: none} body.view-workspace #landing{display: none} a{color: inherit} button, input, textarea{font: inherit} button{appearance: none} ::selection{background: var(--selection-bg);color: inherit} :focus-visible{outline: 2px solid var(--accent);outline-offset: 2px} ::-webkit-scrollbar{width: 9px;height: 9px} ::-webkit-scrollbar-track{background: transparent} ::-webkit-scrollbar-thumb{background: var(--border-strong);border-radius: 999px} ::-webkit-scrollbar-thumb:hover{background: var(--muted)} .hidden{display: none !important} .app-toolbar{display: flex;flex-wrap: wrap;align-items: flex-start;gap: 12px 18px;padding: 14px 16px 12px;border-bottom: 1px solid var(--border);background: rgba(255, 253, 249, 0.86);backdrop-filter: blur(10px);position: sticky;top: 0;z-index: 20} :root.theme-dark .app-toolbar{background: rgba(23, 21, 19, 0.86)} .toolbar-brand{display: flex;align-items: flex-end;gap: 14px;min-width: 0} #brand{font-size: 18px;font-weight: 700;letter-spacing: 0.02em} .site-context{display: flex;align-items: center;gap: 8px;min-width: 0} .site-context-label, .status-label, .landing-eyebrow, .landing-meta-label, .dialog-eyebrow{font-family: var(--editor-font-family);font-size: 11px;font-weight: 600;letter-spacing: 0.08em;text-transform: uppercase;color: var(--muted)} .site-context-value{font-family: var(--editor-font-family);font-size: 12px;color: var(--text);padding: 3px 8px;border-radius: 999px;border: 1px solid var(--border);background: var(--panel);max-width: 240px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap} .toolbar-actions{display: flex;flex: 1;flex-wrap: wrap;align-items: center;gap: 10px 12px;justify-content: space-between} .toolbar-group{display: flex;flex-wrap: wrap;gap: 8px} #menubar-buttons button, .dialog-actions button, .tab-switcher-pin{height: var(--control-height);padding: 0 12px;border-radius: 10px;border: 1px solid var(--border);background: var(--panel);color: var(--text);cursor: pointer;font-size: 13px;font-weight: 600;letter-spacing: 0.01em;transition: background-color 0.16s ease, border-color 0.16s ease, color 0.16s ease, transform 0.16s ease} #menubar-buttons button:hover, .dialog-actions button:hover, .tab-switcher-pin:hover{background: var(--panel-2);border-color: var(--border-strong)} #menubar-buttons button:active, .dialog-actions button:active, .tab-switcher-pin:active{transform: translateY(1px)} #menubar-buttons button:disabled, .dialog-actions button:disabled{opacity: 0.45;cursor: not-allowed;transform: none} .button-primary, .dialog-actions .primary, .landing-submit{background: var(--accent);color: #fffaf5;border-color: var(--accent)} .button-primary:hover, .dialog-actions .primary:hover, .landing-submit:hover{background: var(--accent-strong);border-color: var(--accent-strong)} .button-danger, .dialog-actions .danger{color: var(--danger);border-color: var(--danger-border)} .button-danger:hover, .dialog-actions .danger:hover{background: var(--danger-soft);border-color: var(--danger-border-strong)} .theme-toggle{min-width: 76px} .status-indicator{display: flex;align-items: center;gap: 8px;min-height: var(--control-height);padding: 0 10px;border-radius: 10px;border: 1px solid var(--border);background: var(--panel);margin-left: auto} .status-dot{width: 7px;height: 7px;border-radius: 999px;background: var(--success)} .status-text{font-size: 13px;font-weight: 600} .last-saved{font-size: 12px;color: var(--muted)} .status-indicator.modified .status-dot{background: var(--accent)} .status-indicator.saving .status-dot{background: var(--warning)} .status-indicator.error .status-dot{background: var(--danger)} #main-content-outter{flex: 1;min-height: 0;padding: 0 16px 16px} .tabs{height: 100%;min-height: 0;display: flex;flex-direction: column} .tab-headers{display: grid;grid-template-columns: minmax(0, 1fr) auto;gap: 12px;align-items: start;padding: 12px 0 10px;border-bottom: 1px solid var(--border)} .tab-headers-container{display: flex;flex-wrap: wrap;gap: 8px;min-width: 0} .tab-tools{display: flex;flex-wrap: wrap;align-items: center;justify-content: flex-end;gap: 8px} .tab-header{position: relative;display: flex;align-items: center;gap: 8px;min-width: 96px;max-width: 220px;padding: 8px 10px;border-radius: 10px;border: 1px solid var(--border);background: var(--panel);color: var(--text);user-select: none;white-space: nowrap;overflow: hidden;transition: background-color 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease} .tab-header.has-mark{background: linear-gradient(180deg, var(--tab-mark-soft, var(--tab-mark-soft-fallback)) 0%, var(--panel) 100%)} .tab-header.has-mark::before{content: "";position: absolute;left: 10px;right: 10px;top: 0;height: 3px;border-radius: 999px;background: var(--tab-mark, var(--accent))} .tab-header:hover{background: var(--panel-2);border-color: var(--border-strong)} .tab-header.has-mark:hover{background: linear-gradient(180deg, var(--tab-mark-soft, var(--tab-mark-soft-fallback)) 0%, var(--panel-2) 100%)} .tab-header.active{border-color: var(--border-strong);box-shadow: inset 0 -2px 0 0 var(--accent)} .tab-header.pinned{border-left: 2px solid var(--accent);padding-left: 8px} .tab-title{appearance: none;flex: 1;min-width: 0;padding: 0;border: 0;background: transparent;color: inherit;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;text-decoration: none;text-align: left;font: inherit;font-weight: 600;cursor: inherit} .tab-title:focus-visible{outline: 2px solid var(--accent);outline-offset: 3px} .tab-header.modified .tab-title::after{content: "";display: inline-block;width: 6px;height: 6px;margin-left: 8px;border-radius: 999px;background: var(--accent);vertical-align: middle} .pin-indicator{width: 4px;align-self: stretch;border-radius: 999px;background: var(--accent);flex: 0 0 4px} .close{display: inline-flex;align-items: center;justify-content: center;width: 20px;height: 20px;flex: 0 0 20px;border-radius: 6px;border: 1px solid transparent;color: var(--muted);font-size: 12px;line-height: 1;cursor: pointer} .close:hover{color: var(--danger);border-color: var(--danger-border-soft);background: var(--danger-soft)} .tab-header[draggable="true"]{cursor: grab} .tab-header[draggable="true"]:active{cursor: grabbing} .tab-header.dragging{opacity: 0.64} .tab-header.drag-over, .tab-headers-container.drag-active{background: var(--accent-soft)} .tab-mark-control, .tab-tool-button, .add-tab{height: var(--control-height);border-radius: 10px;border: 1px solid var(--border);background: var(--panel);color: var(--text);font-size: 13px;font-weight: 600} .tab-mark-control, .tab-tool-button, .add-tab{cursor: pointer} .tab-mark-control{display: inline-flex;align-items: center;gap: 8px;padding: 0 10px;color: var(--muted);letter-spacing: 0.04em;text-transform: uppercase} .tab-mark-control.is-marked{color: var(--text);border-color: var(--border-strong)} .tab-mark-label{font-size: 11px} #tab-color-picker{width: 24px;height: 24px;padding: 0;border: 0;background: transparent;cursor: pointer} #tab-color-picker::-webkit-color-swatch-wrapper{padding: 0} #tab-color-picker::-webkit-color-swatch{border: 1px solid var(--border-strong);border-radius: 8px} #tab-color-picker::-moz-color-swatch{border: 1px solid var(--border-strong);border-radius: 8px} .tab-tool-button, .add-tab{padding: 0 12px} .tab-tool-button:disabled{opacity: 0.45;cursor: not-allowed} .tab-mark-control:hover, .tab-tool-button:hover, .add-tab:hover{background: var(--panel-2);border-color: var(--border-strong)} .tab-panel{display: none} .tab-panel.active{display: flex;flex: 1;min-height: 0;padding-top: 12px} .editor-wrap{position: relative;display: flex;flex: 1;min-height: 0;border-radius: 14px;border: 1px solid var(--border);background: var(--editor-bg);overflow: hidden} .editor-wrap:focus-within{border-color: var(--border-strong);box-shadow: inset 0 0 0 1px var(--accent-soft)} .editor-wrap .active-line, .editor-wrap .selected-line{position: absolute;left: 0;right: 0;pointer-events: none} .editor-wrap .active-line{background: var(--editor-active-line-bg);z-index: 0} .editor-wrap .selected-line{background: var(--editor-selected-line-bg);z-index: 0} .line-gutter{width: var(--gutter-width);flex: 0 0 var(--gutter-width);position: relative;border-right: 1px solid var(--border);background: var(--gutter-bg);color: var(--muted);text-align: right;user-select: none;overflow: hidden;padding: var(--editor-pad-y) var(--gutter-pad-right) var(--editor-pad-y) 8px;font-family: var(--editor-font-family);font-size: 12px;line-height: var(--editor-line-height);z-index: 2} .line-gutter::before{content: attr(data-lines);position: absolute;top: var(--editor-pad-y);right: var(--gutter-pad-right);white-space: pre;transform: var(--gutter-before-transform, translateY(0))} .textarea-contents{flex: 1;min-width: 0;min-height: 0;border: 0;outline: 0;resize: none;background: transparent;color: var(--text);padding: var(--editor-pad-y) var(--editor-pad-x);font-family: var(--editor-font-family);font-size: var(--editor-font-size);line-height: var(--editor-line-height);caret-color: var(--accent);overflow: auto;position: relative;z-index: 2} .textarea-contents::placeholder{color: var(--muted)} .textarea-contents:focus{outline: none} .loader{position: fixed;inset: 0;display: flex;align-items: center;justify-content: center;background: rgba(0, 0, 0, 0.18);z-index: 3000} .spinner{width: 38px;height: 38px;border-radius: 999px;border: 3px solid var(--panel-3);border-top-color: var(--accent);animation: spin 0.85s linear infinite} @keyframes spin{to{transform: rotate(360deg)} } .app-obscure-overlay{position: fixed;inset: 0;background: var(--backdrop);z-index: 2100;pointer-events: none;opacity: 1;transition: opacity 0.16s ease} .app-obscure-overlay.hidden{opacity: 0;display: none} .app-masked{filter: blur(7px) saturate(0.92);opacity: 0.22;pointer-events: none;user-select: none} .app-hidden{visibility: hidden;pointer-events: none} .app-dialog{width: min(430px, calc(100% - 24px));padding: 0;border: 0;border-radius: var(--radius-lg);background: var(--panel);color: var(--text);box-shadow: 0 28px 56px var(--shadow)} .app-dialog[open]{animation: dialog-enter 0.18s ease-out} .app-dialog--wide, .search-dialog, .tab-switcher-dialog{width: min(760px, calc(100% - 24px))} .app-dialog::backdrop{background: var(--backdrop);backdrop-filter: blur(4px);animation: backdrop-enter 0.18s ease-out} @keyframes dialog-enter{from{opacity: 0;transform: translateY(6px) scale(0.98)} to{opacity: 1;transform: translateY(0) scale(1)} } @keyframes backdrop-enter{from{opacity: 0} to{opacity: 1} } .dialog-shell, .search-shell{display: flex;flex-direction: column;gap: 18px;padding: 24px;margin: 0} .dialog-header, .search-header{display: flex;flex-direction: column;gap: 8px} .dialog-header h2, .search-header h2{margin: 0;font-size: 24px;line-height: 1.1} .dialog-header p{margin: 0;color: var(--muted)} .dialog-stack{display: flex;flex-direction: column;gap: 12px} .app-dialog input[type="password"], .search-input, .landing-field input[type="text"]{width: 100%;min-width: 0;height: 44px;padding: 0 14px;border-radius: 12px;border: 1px solid var(--border);background: var(--editor-bg);color: var(--text)} .app-dialog input[type="password"]:focus, .search-input:focus, .landing-field input[type="text"]:focus{outline: none;border-color: var(--border-strong);box-shadow: 0 0 0 3px var(--accent-soft)} .hint{font-size: 12px} .error{color: var(--danger)} .success{color: var(--success)} .warning{color: var(--warning)} .dialog-actions{display: flex;justify-content: flex-end;gap: 8px;margin: 0;padding: 0} .shortcut-grid{display: grid;grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));gap: 10px} .shortcut-item{display: flex;flex-direction: column;gap: 6px;padding: 12px;border-radius: 12px;border: 1px solid var(--border);background: var(--panel-2)} .shortcut-keys{font-family: var(--editor-font-family);font-size: 12px;color: var(--text)} .shortcut-description{font-size: 13px;color: var(--muted)} .landing{flex: 1;display: flex;align-items: center;justify-content: center;padding: 32px 16px} .landing-shell{width: min(640px, 100%);display: flex;flex-direction: column;gap: 18px;padding: 30px;border-radius: 22px;border: 1px solid var(--border);background: var(--panel);box-shadow: 0 24px 54px var(--shadow)} .landing-shell h1{margin: 0;font-size: 34px;line-height: 1.05} .landing-copy{margin: 0;color: var(--muted);font-size: 15px} .landing-form{display: flex;gap: 12px;align-items: flex-end} .landing-field{flex: 1;display: flex;flex-direction: column;gap: 8px} .landing-field-label{font-family: var(--editor-font-family);font-size: 11px;font-weight: 600;letter-spacing: 0.08em;text-transform: uppercase;color: var(--muted)} .landing-submit{height: 44px;padding: 0 16px;border-radius: 12px;cursor: pointer;font-weight: 700} .landing-meta{display: grid;grid-template-columns: repeat(2, minmax(0, 1fr));gap: 12px} .landing-meta-item{display: flex;flex-direction: column;gap: 6px;padding: 12px 14px;border-radius: 14px;border: 1px solid var(--border);background: var(--panel-2)} .landing-meta-item strong, .landing-meta-item code{color: var(--text);font-weight: 600} .landing-meta-item code{font-family: var(--editor-font-family)} .search-shell{gap: 0;padding: 0} .search-header{padding: 20px 20px 16px;border-bottom: 1px solid var(--border)} .search-input-wrapper{display: flex;align-items: center;gap: 10px;padding: 10px;border: 1px solid var(--border);border-radius: 14px;background: var(--editor-bg)} .search-input-wrapper:focus-within{border-color: var(--border-strong);box-shadow: 0 0 0 3px var(--accent-soft)} .search-input{height: auto;padding: 0;border: 0;background: transparent;box-shadow: none} .search-input:focus{box-shadow: none} .search-kbd, .tab-switcher-hint{display: inline-flex;align-items: center;justify-content: center;height: 26px;padding: 0 8px;border-radius: 8px;border: 1px solid var(--border);background: var(--panel);color: var(--muted);font-size: 11px;font-family: var(--editor-font-family)} .search-results{max-height: 420px;overflow-y: auto;padding: 12px} .search-results-header{padding: 0 6px 8px;font-family: var(--editor-font-family);font-size: 11px;text-transform: uppercase;letter-spacing: 0.08em;color: var(--muted)} .search-result{border: 1px solid transparent;border-radius: 12px;padding: 10px 12px;cursor: pointer} .search-result:hover, .search-result.selected{background: var(--panel-2);border-color: var(--border)} .search-result.selected{border-color: var(--accent)} .search-result-header{display: flex;justify-content: space-between;gap: 10px;margin-bottom: 6px} .search-result-tab{font-family: var(--editor-font-family);font-size: 12px;color: var(--text)} .search-result-line{font-size: 12px;color: var(--muted)} .search-result-content{font-family: var(--editor-font-family);font-size: 13px;color: var(--muted);white-space: nowrap;overflow: hidden;text-overflow: ellipsis} .search-result-content mark, .tab-switcher-item-title mark{background: var(--search-match-bg);color: var(--text);border-radius: 4px;padding: 0 2px} .search-hint, .search-no-results{display: flex;align-items: center;justify-content: center;min-height: 140px;color: var(--muted);text-align: center;padding: 20px} .search-footer{display: flex;justify-content: center;gap: 24px;padding: 12px 20px 18px;border-top: 1px solid var(--border);color: var(--muted);font-size: 12px} .tab-switcher-dialog{padding: 0} .tab-switcher-container{display: flex;flex-direction: column;max-height: min(540px, calc(100vh - 80px))} .tab-switcher-header{display: flex;align-items: center;gap: 10px;padding: 18px 20px 16px;border-bottom: 1px solid var(--border)} .tab-switcher-input{flex: 1;height: 42px;padding: 0 14px;border-radius: 12px;border: 1px solid var(--border);background: var(--editor-bg);color: var(--text)} .tab-switcher-input:focus{outline: none;border-color: var(--border-strong);box-shadow: 0 0 0 3px var(--accent-soft)} .tab-switcher-list{flex: 1;overflow-y: auto;padding: 10px} .tab-switcher-item{display: flex;align-items: flex-start;justify-content: space-between;gap: 14px;padding: 12px;border-radius: 12px;border: 1px solid transparent;cursor: pointer} .tab-switcher-item:hover, .tab-switcher-item.active{background: var(--panel-2);border-color: var(--border)} .tab-switcher-item.pinned{border-left: 2px solid var(--accent)} .tab-switcher-item-main{min-width: 0;flex: 1} .tab-switcher-item-title{display: flex;align-items: center;gap: 8px;min-width: 0;font-size: 14px;font-weight: 600} .tab-switcher-item-preview{margin-top: 4px;font-size: 12px;color: var(--muted);white-space: nowrap;overflow: hidden;text-overflow: ellipsis} .tab-switcher-item-meta{display: flex;flex-direction: column;align-items: flex-end;gap: 8px;flex: 0 0 auto} .tab-switcher-item-index{font-family: var(--editor-font-family);font-size: 11px;color: var(--muted)} .tab-switcher-pin{min-width: 66px} .modified-dot{width: 6px;height: 6px;border-radius: 999px;background: var(--accent);flex: 0 0 6px} .tab-switcher-footer{display: flex;justify-content: space-between;gap: 12px;padding: 12px 20px 18px;border-top: 1px solid var(--border);color: var(--muted);font-size: 12px} .password-strength{display: flex;flex-direction: column;gap: 8px} .password-strength-bar{height: 6px;border-radius: 999px;background: var(--panel-3);overflow: hidden} .password-strength-fill{height: 100%;width: 0;border-radius: inherit;transition: width 0.2s ease, background-color 0.2s ease} .password-strength-info{display: flex;gap: 10px;justify-content: space-between;align-items: flex-start} .password-strength-label{font-size: 12px;font-weight: 700} .password-strength-feedback{flex: 1;text-align: right;font-size: 12px;color: var(--muted)} .toast-container{position: fixed;right: 16px;bottom: 16px;z-index: 3200;display: flex;flex-direction: column;gap: 10px} .toast{min-width: 260px;max-width: min(420px, calc(100vw - 32px));padding: 12px;border-radius: 14px;border: 1px solid var(--border);background: var(--panel);color: var(--text);box-shadow: 0 18px 40px var(--shadow);animation: toast-enter 0.18s ease-out;will-change: opacity, transform} .toast.success{border-color: var(--success-border)} .toast.error{border-color: var(--danger-border)} .toast.warning{border-color: var(--warning-border)} .toast--leaving{animation: toast-exit 0.18s ease-in forwards;pointer-events: none} @keyframes toast-enter{from{opacity: 0;transform: translateY(8px)} to{opacity: 1;transform: translateY(0)} } @keyframes toast-exit{from{opacity: 1;transform: translateY(0)} to{opacity: 0;transform: translateY(8px)} } .toast-content{display: flex;align-items: flex-start;gap: 10px} .toast-icon{width: 18px;flex: 0 0 18px;text-align: center;font-size: 12px;font-family: var(--editor-font-family);color: var(--muted)} .toast-message{flex: 1;min-width: 0;font-size: 13px} .toast-close{flex: 0 0 auto;width: 22px;height: 22px;border: 0;border-radius: 999px;background: transparent;color: var(--muted);cursor: pointer} .toast-close:hover{background: var(--panel-2)} @media (prefers-reduced-motion: reduce){.app-dialog[open], .app-dialog::backdrop, .toast, .toast--leaving{animation: none} .toast--leaving{opacity: 0} } @media (max-width: 1024px){.status-indicator{margin-left: 0} .toolbar-actions{justify-content: flex-start} } @media (max-width: 820px){.tab-headers{grid-template-columns: 1fr} .tab-tools{justify-content: flex-start} .tab-tool-button, .add-tab{width: max-content} .landing-form{flex-direction: column;align-items: stretch} .landing-submit{width: 100%} .search-footer, .tab-switcher-footer{flex-direction: column;align-items: flex-start} } @media (max-width: 640px){.app-toolbar, #main-content-outter{padding-left: 12px;padding-right: 12px} .landing{padding: 20px 12px} .landing-shell{padding: 24px 20px} .landing-meta{grid-template-columns: 1fr} .app-dialog, .app-dialog--wide, .search-dialog, .tab-switcher-dialog{width: calc(100% - 16px)} .dialog-shell, .search-shell{padding: 18px} .shortcut-grid{grid-template-columns: 1fr} .password-strength-info{flex-direction: column;align-items: flex-start} .password-strength-feedback{text-align: left} } @media (prefers-reduced-motion: reduce){*, *::before, *::after{animation-duration: 0.01ms !important;animation-iteration-count: 1 !important;transition-duration: 0.01ms !important;scroll-behavior: auto !important} }