@layer existing {
.my-notes-page { min-height: 100vh; background: var(--bg); color: var(--fg); }
.mn-login[hidden],.mn-workspace[hidden] { display:none ; }
.mn-nav { position: sticky; top: 0; z-index: 100; height: 54px; display:flex; align-items:center; gap:30px; padding:0 max(22px,calc((100vw - 1180px)/2)); border-bottom:1px solid var(--ln-hair); background:color-mix(in srgb,var(--bg) 82%,transparent); backdrop-filter:blur(18px) saturate(160%); -webkit-backdrop-filter:blur(18px) saturate(160%); }
.mn-brand { display:inline-flex; align-items:center; gap:9px; color:var(--fg); text-decoration:none; font-size:14px; white-space:nowrap; }
.mn-mark { width:27px; height:27px; display:grid; place-items:center; border-radius:8px; background:var(--fg); color:var(--bg); font-size:10px; font-weight:700; }
.mn-nav nav { display:flex; align-items:center; gap:22px; flex:1; }
.mn-nav nav a { color:var(--muted); text-decoration:none; font-size:13px; white-space:nowrap; }
.mn-nav nav a:hover,.mn-nav nav a.is-current { color:var(--fg); }
.mn-nav .nav-actions { display:flex; align-items:center; gap:8px; }
.mn-nav .ae-theme-toggle { width:34px; height:34px; }
.mn-main { width:min(1180px,calc(100% - 44px)); margin:0 auto; padding:76px 0 96px; }
.mn-intro { max-width:710px; margin-bottom:38px; }
.mn-eyebrow { margin:0 0 11px; color:var(--accent); font-size:11px; font-weight:600; letter-spacing:.1em; }
.mn-intro h1 { margin:0 0 14px; font-size:clamp(36px,5vw,58px); line-height:1.08; letter-spacing:-.04em; font-weight:600; }
.mn-intro > p:last-child { max-width:630px; margin:0; color:var(--muted); font-size:16px; line-height:1.7; }
.mn-login { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:24px; border:1px solid var(--ln-hair); border-radius:20px; background:var(--surface); }
.mn-login strong { font-size:17px; font-weight:600; }
.mn-login p { margin:6px 0 0; color:var(--muted); font-size:14px; }
.mn-primary { min-height:40px; padding:0 17px; border:0; border-radius:999px; background:#0071e3; color:#fff; font:inherit; font-size:14px; font-weight:600; cursor:pointer; transition:filter 150ms ease,transform 150ms ease; white-space:nowrap; }
.mn-primary:hover:not(:disabled) { filter:brightness(1.08); transform:translateY(-1px); }
.mn-primary:disabled { opacity:.45; cursor:not-allowed; }
.mn-workspace { display:grid; grid-template-columns:280px minmax(0,1fr); min-height:620px; overflow:hidden; border:1px solid var(--ln-hair); border-radius:22px; background:var(--surface); box-shadow:0 22px 60px rgba(0,0,0,.07); }
.mn-sidebar { display:flex; flex-direction:column; min-width:0; border-right:1px solid var(--ln-hair); background:color-mix(in srgb,var(--surface) 84%,var(--bg)); }
.mn-list-head { display:flex; align-items:center; justify-content:space-between; padding:20px 18px 14px; }
.mn-list-head h2 { margin:0; font-size:17px; font-weight:600; }
.mn-list-head p { margin:3px 0 0; color:var(--muted); font-size:12px; }
.mn-new { width:32px; height:32px; border:1px solid var(--ln-hair); border-radius:50%; background:var(--bg); color:var(--fg); font-size:21px; line-height:1; cursor:pointer; }
.mn-new:hover { border-color:var(--accent); color:var(--accent); }
.mn-list { display:flex; flex-direction:column; gap:4px; padding:0 9px 16px; }
.mn-list-item { display:block; width:100%; padding:12px 11px; border:0; border-radius:12px; background:transparent; color:var(--fg); text-align:left; cursor:pointer; }
.mn-list-item:hover { background:color-mix(in srgb,var(--fg) 5%,transparent); }
.mn-list-item[aria-current="true"] { background:color-mix(in srgb,var(--accent) 11%,transparent); }
.mn-list-item strong { display:block; overflow:hidden; color:var(--fg); font-size:13px; font-weight:550; text-overflow:ellipsis; white-space:nowrap; }
.mn-list-item span { display:block; margin-top:5px; color:var(--muted); font-size:11px; }
.mn-empty { padding:20px 12px; color:var(--muted); font-size:13px; line-height:1.65; }
.mn-private { margin:auto 18px 16px; padding-top:13px; border-top:1px solid var(--ln-hair); color:var(--muted-2); font-size:11px; }
.mn-editor { display:flex; flex-direction:column; min-width:0; padding:24px clamp(18px,4vw,40px) 20px; }
.mn-editor-head { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:22px; }
.mn-editor-head .mn-eyebrow { margin-bottom:5px; }
.mn-saved { margin:0; color:var(--muted); font-size:12px; }
.mn-field { display:flex; flex-direction:column; gap:8px; margin-bottom:17px; }
.mn-field > span { color:var(--muted); font-size:12px; font-weight:500; }
.mn-field input,.mn-field select,.mn-field textarea { width:100%; box-sizing:border-box; border:1px solid var(--ln-hair); border-radius:12px; background:var(--bg); color:var(--fg); font:inherit; font-size:14px; outline:none; transition:border-color 150ms ease,box-shadow 150ms ease; }
.mn-field input,.mn-field select { min-height:43px; padding:0 13px; }
.mn-field textarea { flex:1; min-height:340px; padding:14px; resize:vertical; line-height:1.75; }
.mn-field :focus { border-color:#0071e3; box-shadow:0 0 0 3px color-mix(in srgb,#0071e3 15%,transparent); }
.mn-field :disabled { opacity:.58; }
.mn-subject { max-width:250px; }
.mn-content { flex:1; min-height:0; }
.mn-editor-foot { display:flex; justify-content:space-between; gap:12px; padding-top:2px; color:var(--muted-2); font-size:11px; }
@media(max-width:760px) {
  .mn-nav { gap:13px; padding:0 14px; }
  .mn-nav nav { gap:13px; }
  .mn-nav nav a { font-size:12px; }
  .mn-brand { font-size:0; }
  .mn-brand .mn-mark { font-size:10px; }
  .mn-main { width:calc(100% - 28px); padding-top:54px; }
  .mn-workspace { grid-template-columns:1fr; }
  .mn-sidebar { border-right:0; border-bottom:1px solid var(--ln-hair); }
  .mn-list { max-height:220px; overflow:auto; }
  .mn-private { display:none; }
  .mn-editor { min-height:520px; }
}

}