:root{color-scheme:light;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.5;font-weight:400;color:var(--text);background:var(--page);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;--page: #f6f7f4;--surface: #ffffff;--surface-muted: #edf1eb;--border: #d8ded2;--border-strong: #bac6b2;--text: #172018;--muted: #657160;--accent: #167761;--accent-strong: #0d5f4c;--accent-soft: #dff3eb;--warning: #a96300;--danger: #b42318;--danger-soft: #fff0ee;--shadow: 0 10px 28px rgba(34, 45, 32, .08);--radius: 8px;--mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, ui-monospace, monospace}:root[data-theme=dark]{color-scheme:dark;--page: #111510;--surface: #181e17;--surface-muted: #222b20;--border: #344033;--border-strong: #4d5b4b;--text: #eef2e9;--muted: #a7b29f;--accent: #60c8ad;--accent-strong: #90dcc9;--accent-soft: #173a33;--warning: #f0b45b;--danger: #ff8a7d;--danger-soft: #3d1d1b;--shadow: 0 12px 30px rgba(0, 0, 0, .25)}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;background:var(--page)}button,textarea,input{font:inherit}textarea,input{color:var(--text)}a{color:inherit;text-decoration:none}.app-shell{min-height:100vh;display:flex;flex-direction:column}.app-header{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px clamp(16px,3vw,32px);border-bottom:1px solid var(--border);background:color-mix(in srgb,var(--page) 88%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.brand{display:inline-flex;align-items:center;gap:12px;min-width:0}.brand-mark{width:38px;height:38px;display:inline-grid;place-items:center;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);color:var(--accent);font-family:var(--mono);font-weight:700}.brand-eyebrow,.section-kicker{display:block;color:var(--muted);font-size:.78rem;font-weight:700;letter-spacing:0;text-transform:uppercase}.brand-title{display:block;color:var(--text);font-size:1rem;font-weight:750}.app-actions,.toolbar,.action-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.app-main{width:min(1440px,100%);margin:0 auto;padding:28px clamp(16px,3vw,32px) 40px;flex:1}.home-page,.tool-page{display:grid;gap:22px}.home-heading,.tool-page-heading{display:flex;align-items:end;justify-content:space-between;gap:18px}.home-heading{justify-content:flex-start}h1,h2,p{margin:0}h1{color:var(--text);font-size:clamp(2rem,4vw,3.5rem);line-height:1.05;letter-spacing:0}h2{color:var(--text);font-size:.98rem;line-height:1.2;letter-spacing:0}.search-field{width:min(360px,100%);min-height:42px;display:flex;align-items:center;gap:10px;padding:0 12px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--muted)}.search-field:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.search-field input{width:100%;min-width:0;border:0;outline:0;color:var(--text);background:transparent}.tool-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}.tool-card{min-height:148px;display:grid;align-content:start;gap:10px;padding:18px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);transition:border-color .16s ease,transform .16s ease}.tool-card:hover{border-color:var(--accent);transform:translateY(-1px)}.tool-card-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:var(--radius);background:var(--accent-soft);color:var(--accent-strong)}.tool-card-title{font-weight:750;color:var(--text)}.tool-card-description,.panel-header p,.tree-preview,.tree-note,.empty-state{color:var(--muted)}.button,.icon-button{min-height:38px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:var(--radius);cursor:pointer;white-space:nowrap;transition:background .14s ease,border-color .14s ease,color .14s ease}.button{padding:0 13px;font-weight:700}.icon-button{width:38px;padding:0}.button:disabled,.icon-button:disabled{cursor:not-allowed;opacity:.55}.button-primary{background:var(--accent);color:#fff}.button-primary:hover:not(:disabled){background:var(--accent-strong)}.button-secondary{border-color:var(--border);background:var(--surface);color:var(--text)}.button-secondary:hover:not(:disabled){border-color:var(--accent)}.button-ghost{background:transparent;color:var(--muted)}.button-ghost:hover:not(:disabled){background:var(--surface-muted);color:var(--text)}.button-danger{background:var(--danger-soft);color:var(--danger)}.back-link{display:inline-flex;color:var(--muted);font-weight:700}.back-link:hover{color:var(--accent)}.tool-page-heading{align-items:start}.json-workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;min-height:min(68vh,780px)}.timestamp-tool,.hash-tool,.password-tool{display:grid;gap:12px}.base64-tool{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}.text-diff-tool{display:grid;gap:12px}.notes-workspace{display:grid;grid-template-columns:minmax(260px,.34fr) minmax(0,1fr);gap:12px;min-height:min(68vh,780px)}.notes-sidebar,.notes-editor-panel{min-width:0;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);overflow:hidden}.notes-sidebar{display:grid;grid-template-rows:auto auto minmax(0,1fr)}.notes-search{padding:12px;border-bottom:1px solid var(--border)}.notes-search .search-field{width:100%}.notes-tree{overflow:auto;padding:8px}.notes-tree-folder,.notes-tree-note{min-height:32px;display:flex;align-items:center;gap:8px;padding-left:calc(8px + var(--notes-indent, 0px))}.notes-tree-folder{color:var(--muted);font-size:.82rem;font-weight:750}.notes-tree-note{width:100%;border:0;border-radius:6px;background:transparent;color:var(--text);cursor:pointer;font-weight:700;text-align:left}.notes-tree-note span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.notes-tree-note:hover,.notes-tree-note[aria-current=page]{background:var(--surface-muted)}.notes-tree-note[aria-current=page]{color:var(--accent-strong)}.notes-editor-panel{display:grid;grid-template-rows:auto minmax(0,1fr)}.notes-editor-body{min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr);gap:12px;padding:12px}.notes-meta-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,.42fr);gap:12px}.notes-content{min-height:0;display:grid;gap:12px}.notes-content-split{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.notes-content-edit,.notes-content-preview{grid-template-columns:minmax(0,1fr)}.notes-markdown-field{min-height:0;display:grid}.notes-markdown-field textarea{width:100%;min-height:420px;resize:none;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);padding:14px;font-family:var(--mono);font-size:.92rem;line-height:1.6;outline:0}.notes-markdown-field textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.markdown-preview{min-height:420px;overflow:auto;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);padding:18px}.markdown-preview>*+*{margin-top:12px}.markdown-preview h1,.markdown-preview h2,.markdown-preview h3,.markdown-preview h4,.markdown-preview h5,.markdown-preview h6{line-height:1.2}.markdown-preview h1{font-size:1.7rem}.markdown-preview h2{font-size:1.28rem}.markdown-preview h3{font-size:1.08rem}.markdown-preview h4,.markdown-preview h5,.markdown-preview h6{font-size:.98rem}.markdown-preview p,.markdown-preview li,.markdown-preview blockquote{overflow-wrap:anywhere}.markdown-preview ul,.markdown-preview ol{margin-bottom:0;padding-left:1.4rem}.markdown-preview blockquote{margin-left:0;padding-left:12px;border-left:3px solid var(--accent);color:var(--muted)}.markdown-preview pre{overflow:auto;padding:12px;border-radius:var(--radius);background:var(--surface-muted)}.markdown-preview code{border-radius:4px;background:var(--surface-muted);padding:1px 4px;font-family:var(--mono);font-size:.9em}.markdown-preview pre code{padding:0;background:transparent}.markdown-preview a{color:var(--accent-strong);font-weight:700;text-decoration:underline;text-underline-offset:3px}.markdown-preview hr{border:0;border-top:1px solid var(--border)}.markdown-task{list-style:none}.markdown-task input{margin-right:8px;accent-color:var(--accent)}.markdown-empty{color:var(--muted)}.text-diff-inputs{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;min-height:min(46vh,560px)}.text-diff-editor-panel{grid-template-rows:auto minmax(320px,1fr)}.text-diff-editor-panel .cm-editor{min-height:320px}.password-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);gap:12px}.password-value{overflow-wrap:anywhere;color:var(--text);font-family:var(--mono);font-size:clamp(1.25rem,3vw,2.2rem);font-weight:750;line-height:1.2}.range-control{display:grid;grid-template-columns:minmax(0,1fr) 92px;gap:10px;align-items:center}.range-control input[type=range]{padding:0;accent-color:var(--accent)}.range-control input[type=number]{text-align:center}.toggle-field{min-height:42px;display:flex;align-items:center;gap:10px;padding:0 12px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);font-weight:700}.toggle-field input{width:18px;height:18px;accent-color:var(--accent)}.strength-panel{display:grid;gap:16px;padding:18px}.strength-label{color:var(--text);font-size:clamp(1.4rem,3vw,2.2rem);font-weight:750;line-height:1.1}.strength-meter{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.strength-step{height:10px;border-radius:999px;background:var(--surface-muted)}.strength-step-1{background:var(--danger)}.strength-step-2{background:var(--warning)}.strength-step-3,.strength-step-4{background:var(--accent)}.hash-input{width:100%;min-height:min(42vh,420px);resize:vertical;border:0;background:var(--surface);color:var(--text);padding:14px;font-family:var(--mono);font-size:.92rem;line-height:1.55;outline:0}.hash-result-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.hash-output{min-height:118px;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:10px;padding:14px;color:var(--text);font-family:var(--mono);font-size:.92rem;line-height:1.55}.hash-output svg{margin-top:3px;color:var(--accent)}.hash-output span{overflow-wrap:anywhere}.base64-output span{white-space:pre-wrap}.base64-error{padding:0 14px 14px}.diff-result-panel{overflow:hidden}.diff-stats{display:flex;flex-wrap:wrap;gap:8px;padding:10px 12px;border-bottom:1px solid var(--border)}.diff-stat{min-height:30px;display:inline-flex;align-items:center;padding:0 10px;border:1px solid var(--border);border-radius:var(--radius);color:var(--muted);font-size:.84rem;font-weight:750}.diff-stat-added{border-color:color-mix(in srgb,var(--accent) 38%,var(--border));background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent-strong)}.diff-stat-removed{border-color:color-mix(in srgb,var(--danger) 32%,var(--border));background:color-mix(in srgb,var(--danger) 10%,transparent);color:var(--danger)}.diff-stat-changed{border-color:color-mix(in srgb,var(--warning) 36%,var(--border));background:color-mix(in srgb,var(--warning) 12%,transparent);color:var(--warning)}.diff-result{max-height:min(58vh,660px);overflow:auto;background:var(--surface)}.diff-row{min-width:760px;display:grid;grid-template-columns:58px minmax(220px,1fr) 58px minmax(220px,1fr);border-bottom:1px solid color-mix(in srgb,var(--border) 76%,transparent)}.diff-line-number{min-height:32px;padding:6px 9px;border-right:1px solid var(--border);background:var(--surface-muted);color:var(--muted);font-family:var(--mono);font-size:.78rem;text-align:right;-webkit-user-select:none;user-select:none}.diff-cell{min-height:32px;padding:6px 10px;color:var(--text);font-family:var(--mono);font-size:.88rem;line-height:1.45;overflow-wrap:anywhere;white-space:pre-wrap}.diff-cell-old{border-right:1px solid var(--border)}.diff-row-added .diff-cell-new,.diff-row-added .diff-line-number:nth-child(3){background:color-mix(in srgb,var(--accent) 12%,var(--surface))}.diff-row-removed .diff-cell-old,.diff-row-removed .diff-line-number:first-child{background:color-mix(in srgb,var(--danger) 10%,var(--surface))}.diff-row-changed .diff-cell,.diff-row-changed .diff-line-number{background:color-mix(in srgb,var(--warning) 11%,var(--surface))}.diff-segment{border-radius:4px}.diff-segment-added{background:color-mix(in srgb,var(--accent) 22%,transparent)}.diff-segment-removed{background:color-mix(in srgb,var(--danger) 18%,transparent)}.current-time-panel{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow)}.current-time-content{min-width:0;display:grid;gap:12px}.current-timestamp-value{overflow-wrap:anywhere;color:var(--text);font-family:var(--mono);font-size:clamp(1.6rem,4vw,3rem);font-weight:750;line-height:1.1}.converter-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.converter-panel{min-width:0;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);overflow:hidden}.converter-body{display:grid;gap:14px;padding:14px}.form-field{display:grid;gap:6px;color:var(--muted);font-size:.82rem;font-weight:700}.form-field input{width:100%;min-height:42px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);padding:0 12px;font-family:var(--mono);outline:0}.form-field input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.form-field input[readonly]{background:var(--surface-muted)}.field-error{color:var(--danger);font-size:.86rem;font-weight:700}.editor-panel{min-width:0;display:grid;grid-template-rows:auto minmax(420px,1fr);border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);overflow:hidden;box-shadow:var(--shadow)}.panel-header{min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px;border-bottom:1px solid var(--border)}.panel-header-result{align-items:center}.code-editor{min-height:0;overflow:hidden}.cm-editor{height:100%;min-height:420px;background:var(--surface);color:var(--text);font-family:var(--mono);font-size:.9rem}.cm-gutters{background:var(--surface-muted)!important;color:var(--muted)!important;border-right:1px solid var(--border)!important}.cm-focused{outline:0!important}.cm-activeLine,.cm-activeLineGutter{background:var(--accent-soft)!important}.segmented-control{min-height:36px;display:inline-flex;padding:3px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface-muted)}.segmented-control-item{min-width:58px;border:0;border-radius:6px;background:transparent;color:var(--muted);cursor:pointer;font-size:.88rem;font-weight:700}.segmented-control-item[aria-checked=true]{background:var(--surface);color:var(--text);box-shadow:0 1px 4px #00000014}.tree-panel{min-height:420px;overflow:auto;background:var(--surface)}.json-tree{min-width:max-content;padding:8px;font-family:var(--mono);font-size:.9rem}.tree-row{width:100%;min-height:30px;display:grid;grid-template-columns:18px minmax(160px,auto) 78px minmax(180px,1fr);align-items:center;gap:8px;padding:0 8px 0 calc(8px + var(--tree-indent, 0px));border:0;border-radius:6px;background:transparent;color:var(--text);cursor:pointer;text-align:left}.tree-row:hover:not(:disabled){background:var(--surface-muted)}.tree-row:disabled{cursor:default}.tree-toggle{width:18px;color:var(--muted)}.tree-key{overflow:hidden;color:var(--text);font-weight:700;text-overflow:ellipsis;white-space:nowrap}.tree-type{color:var(--muted);font-size:.78rem}.tree-type-object,.tree-type-array{color:var(--accent)}.tree-type-string{color:var(--warning)}.tree-preview{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tree-note{padding:8px 8px 8px calc(34px + var(--tree-indent, 0px));font-size:.84rem}.action-bar{position:sticky;bottom:14px;z-index:10;width:fit-content;max-width:100%;padding:8px;border:1px solid var(--border);border-radius:var(--radius);background:color-mix(in srgb,var(--surface) 92%,transparent);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.status-pill{min-height:34px;display:inline-flex;align-items:center;gap:6px;padding:0 10px;color:var(--muted);font-size:.86rem;font-weight:700}.error-banner{display:grid;gap:2px;padding:12px 14px;border:1px solid color-mix(in srgb,var(--danger) 35%,var(--border));border-radius:var(--radius);background:var(--danger-soft);color:var(--danger)}.empty-state{min-height:180px;display:grid;place-items:center;padding:24px;border:1px dashed var(--border);border-radius:var(--radius)}.tree-panel .empty-state{min-height:100%;border:0}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:980px){.home-heading,.tool-page-heading{align-items:stretch;flex-direction:column}.json-workspace,.converter-grid,.hash-result-grid,.password-grid,.base64-tool,.text-diff-inputs,.notes-workspace,.notes-content-split{grid-template-columns:1fr}.editor-panel{grid-template-rows:auto minmax(360px,54vh)}.cm-editor,.tree-panel{min-height:360px}}@media(max-width:640px){.app-header,.current-time-panel,.panel-header,.action-bar{align-items:stretch}.current-time-panel,.panel-header,.action-bar{flex-direction:column}.toolbar,.action-bar{width:100%}.button{flex:1}.segmented-control{width:100%}.range-control,.notes-meta-grid{grid-template-columns:1fr}.segmented-control-item{flex:1}}
