@font-face { font-family:"Nest Montserrat"; font-style:normal; font-weight:400; font-display:swap; src:url("montserrat-latin-400.ttf") format("truetype"); }
@font-face { font-family:"Nest Montserrat"; font-style:normal; font-weight:500; font-display:swap; src:url("montserrat-latin-500.ttf") format("truetype"); }
:root {
  --bg:#fdfdfb;
  --surface:#f1f1ef;
  --elevated:#ffffff;
  --sidebar:#fdfdfb;
  --border:#d4d1c9;
  --text:#292927;
  --text-muted:#85857f;
  --accent:#d97757;
  --accent-disabled:rgba(var(--accent-rgb),.35);
  --toggle:#3478c7;
  --danger:#b44645;
  --overlay:rgba(0,0,0,.2);
  --bg-rgb:253,253,251;
  --elevated-rgb:255,255,255;
  --text-rgb:41,41,39;
  --accent-rgb:217,119,87;
  --toggle-rgb:52,120,199;
  --danger-rgb:180,70,69;
  --glass:rgba(var(--bg-rgb),.88);
  --glass-strong:rgba(var(--elevated-rgb),.96);
  --focus-ring:rgba(var(--accent-rgb),.20);
  --focus-ring-soft:rgba(var(--accent-rgb),.11);
  --shadow-button:0 9px 20px rgba(var(--text-rgb),.075);
  --shadow-subtle:0 7px 18px rgba(var(--text-rgb),.045);
  --shadow-drawer:-18px 0 15px rgba(var(--text-rgb),.063);
  --shadow-sheet:0 -20px 54px rgba(var(--text-rgb),.16);
  --composer-glass:rgba(var(--elevated-rgb),.88);
  --composer-glass-highlight:rgba(var(--elevated-rgb),.90);
  --composer-shadow:0 0 30px rgba(var(--text-rgb),.085),inset 0 1px 0 var(--composer-glass-highlight);
  --paper:var(--bg);
  --side-paper:var(--bg);
  --side-active:var(--surface);
  --ink:var(--text);
  --muted:var(--text-muted);
  --line:var(--border);
  --orange:var(--accent);
  --pill:var(--surface);
  --side-width:min(74vw,320px);
}
* { box-sizing:border-box; }
html, body { width:100%; min-height:100%; height:100%; margin:0; }
body { overflow:hidden; background:var(--paper); color:var(--ink); font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","PingFang SC",sans-serif; }
button, input, textarea { font:inherit; }
button { cursor:pointer; -webkit-tap-highlight-color:transparent; }
.app-shell { position:fixed; inset:0; width:100%; min-height:0; height:auto; overflow:hidden; background:var(--side-paper); }
@media all and (display-mode:standalone) {
  html, body { min-height:100vh; }
  .app-shell { inset:0 0 auto; min-height:100vh; height:100vh; }
}
.main-layer { --panel-fog:0; position:absolute; z-index:2; inset:0; overflow:hidden; background:var(--paper); transition:transform .42s cubic-bezier(.22,.74,.2,1), border-radius .42s cubic-bezier(.22,.74,.2,1), box-shadow .42s ease; will-change:transform; }
.main-layer::before { position:absolute; z-index:6; inset:0; background:rgb(var(--elevated-rgb)); content:""; opacity:var(--panel-fog); pointer-events:none; transition:opacity .42s cubic-bezier(.22,.74,.2,1); }
.app-shell.is-panel-open .main-layer::before, .app-shell.is-panel-dragging .main-layer::before { pointer-events:auto; }
.main-layer::after { position:absolute; z-index:2; top:0; right:0; left:0; height:max(118px,calc(env(safe-area-inset-top) + 88px)); pointer-events:none; background:linear-gradient(to bottom,rgba(var(--elevated-rgb),.98) 0%,rgba(var(--elevated-rgb),.94) 24%,rgba(var(--elevated-rgb),.64) 55%,rgba(var(--elevated-rgb),.2) 78%,rgba(var(--elevated-rgb),0) 100%); content:""; }
.app-shell.is-panel-open .main-layer { --panel-fog:.72; border-radius:44px 0 0 44px; box-shadow:-18px 0 15px rgba(var(--text-rgb),.063); transform:translateX(var(--side-width)); }
.app-shell.is-panel-dragging .main-layer { border-radius:44px 0 0 44px; box-shadow:-18px 0 15px rgba(var(--text-rgb),.063); transition:none; }
.round-button { position:absolute; z-index:3; top:max(27px,calc(env(safe-area-inset-top) + 3px)); display:grid; place-items:center; width:44px; height:44px; padding:0; border:0; border-radius:50%; background:rgb(var(--elevated-rgb)); color:var(--ink); box-shadow:0 9px 20px rgba(var(--text-rgb),.075); transform:translate3d(0,var(--viewport-top,0px),0); }
.round-button svg { display:block; width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; }
.menu-button { left:17px; }.new-button { right:17px; }
.conversation { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; min-height:0; padding:max(96px,calc(env(safe-area-inset-top) + 60px)) 21px calc(162px + var(--composer-extra,0px) + var(--keyboard-offset,0px) + var(--keyboard-nudge,0px)); overflow-y:auto; scrollbar-width:none; }
.conversation::-webkit-scrollbar { display:none; }
.greeting { width:100%; margin-top:-3px; color:rgb(var(--text-rgb)); font-family:"Avenir Next",Avenir,-apple-system,BlinkMacSystemFont,"SF Pro Display",sans-serif; font-size:22px; font-weight:400; line-height:1.2; letter-spacing:0; text-align:center; transform:translate3d(0,calc(292px + var(--viewport-top,0px)),0); transition:opacity .25s ease, transform .25s ease; }
.greeting.is-hidden { position:absolute; opacity:0; transform:translateY(-8px); pointer-events:none; }
.app-shell.is-keyboard-open .greeting:not(.is-hidden) { transform:translate3d(0,calc(122px + var(--viewport-top,0px)),0); transition:opacity .25s ease; }
.claude-spark { display:block; width:42px; height:42px; margin:0 auto 14px; }
.messages { width:100%; max-width:620px; display:grid; align-content:start; flex:0 0 auto; gap:22px; margin:0; padding-top:0; }
.conversation-scroll-space { display:block; flex:0 0 0; width:1px; height:0; pointer-events:none; }
.message { display:flex; max-width:84%; }.message.user { align-self:end; justify-self:end; flex-direction:column; align-items:flex-end; gap:4px; }.message.assistant { align-self:start; justify-self:start; flex-direction:column; align-items:flex-start; gap:2px; width:100%; max-width:100%; }
.message-actions { display:flex; align-items:center; gap:13px; margin:4px 14px 0 0; }.message-time { color:rgb(var(--text-rgb)); font-size:12px; font-weight:400; line-height:1; }.message-edit { display:grid; place-items:center; width:23px; height:23px; margin:-6px -5px -6px 0; padding:0; border:0; background:transparent; color:rgb(var(--text-rgb)); -webkit-tap-highlight-color:transparent; }.message-edit svg { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }.message-edit:active { color:rgb(var(--text-rgb)); transform:scale(.92); }
.bubble { margin:0; padding:11px 16px; border-radius:23px; background:var(--pill); color:rgb(var(--text-rgb)); font-size:17px; line-height:1.5; white-space:pre-wrap; }.message.assistant .bubble { width:100%; padding:0; border-radius:0; background:transparent; font-size:17px; line-height:26px; letter-spacing:.002em; }.assistant-blank-line { display:block; height:.86em; }.bubble.is-empty { display:none; }
.message.is-streaming .bubble:not(.is-empty)::after { display:inline-block; width:2px; height:1.05em; margin-left:3px; border-radius:2px; background:rgb(var(--danger-rgb)); vertical-align:-.15em; content:""; animation:stream-caret .85s ease-in-out infinite; }
.thinking-panel { display:grid; grid-template-columns:17px minmax(0,1fr) 15px; align-items:center; gap:9px; width:100%; min-height:42px; padding:0; border:0; background:transparent; color:var(--text-muted); text-align:left; }.thinking-panel:not(:disabled):active { color:var(--text); }.thinking-panel:disabled { cursor:default; opacity:.72; }.thinking-label { overflow:hidden; font-size:15px; font-weight:400; line-height:1.4; text-overflow:ellipsis; white-space:nowrap; }.thinking-clock, .thinking-chevron { display:block; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; }.thinking-clock { width:17px; height:17px; stroke-width:2; }.thinking-chevron { width:15px; height:15px; stroke-width:2; }.thinking-panel.is-pending .thinking-clock { animation:recall-pulse 1.4s ease-in-out infinite; }.stream-note { margin:0 3px; color:rgb(var(--danger-rgb)); font-size:10px; }.stream-note:empty { display:none; }
.message-meta { display:flex; align-items:center; gap:6px; width:100%; min-height:29px; }.message-meta[hidden] { display:none; }.assistant-actions { display:flex; flex:0 0 auto; align-items:center; gap:1px; min-height:29px; margin-left:0; }.assistant-action { display:grid; place-items:center; width:29px; height:29px; padding:0; border:0; border-radius:10px; background:transparent; color:var(--text-muted); -webkit-tap-highlight-color:transparent; }.assistant-action svg { display:block; width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }.assistant-action:active { background:var(--surface); color:var(--text); transform:scale(.94); }.assistant-action.is-playing, .assistant-action.is-done { background:transparent; color:var(--text-muted); }
.token-usage { position:relative; display:flex; min-height:29px; padding:0 2px; border:0; background:transparent; color:var(--text-muted); font-family:inherit; font-size:12px; font-weight:400; line-height:1; -webkit-tap-highlight-color:transparent; }.token-usage-title { display:flex; align-items:center; white-space:nowrap; }.token-usage:active .token-usage-title { color:var(--text); transform:scale(.98); }.token-usage:focus-visible { border-radius:8px; box-shadow:inset 0 0 0 2px var(--focus-ring); outline:0; }.token-popover { position:absolute; z-index:5; bottom:calc(100% + 8px); left:0; display:grid; grid-template-columns:repeat(2,minmax(72px,1fr)); gap:7px; width:184px; padding:10px; border-radius:16px; background:var(--elevated); box-shadow:var(--shadow-subtle); opacity:0; pointer-events:none; transform:translateY(8px); transition:opacity .18s ease,transform .18s ease; }.token-usage.is-open .token-popover { opacity:1; pointer-events:auto; transform:translateY(0); }.token-popover-stat { display:grid; gap:3px; min-width:0; padding:7px 8px; border-radius:10px; background:var(--surface); text-align:left; }.token-popover-stat small { overflow:hidden; color:var(--text-muted); font-size:10px; font-weight:400; text-overflow:ellipsis; white-space:nowrap; }.token-popover-stat strong { color:var(--text); font-size:13px; font-weight:500; }
.memory-tip { display:flex; align-items:center; min-height:29px; padding:0 2px; border:0; background:transparent; color:var(--text-muted); font-family:inherit; font-size:12px; font-weight:400; line-height:1; white-space:nowrap; -webkit-tap-highlight-color:transparent; }.memory-tip:active { color:var(--text); transform:scale(.98); }
@keyframes stream-caret { 0%,100% { opacity:.2; } 50% { opacity:1; } }
@keyframes thinking-dots { 0% { width:0; } 100% { width:13px; } }
@keyframes recall-pulse { 0%,100% { opacity:.55; } 50% { opacity:1; } }
.side-panel { position:absolute; z-index:1; inset:0 auto 0 0; display:flex; flex-direction:column; width:var(--side-width); padding:max(27px,calc(env(safe-area-inset-top) + 3px)) 18px calc(env(safe-area-inset-bottom) + 18px) 20px; background:var(--side-paper); color:var(--ink); }
.side-logo-slot { display:flex; flex:0 0 auto; align-items:center; height:45px; padding-left:7px; }.side-logo { display:block; width:118px; max-width:100%; height:auto; transform:translateX(0); }
.side-actions { display:grid; flex:0 0 auto; gap:3px; margin:17px 0 18px; }.side-action { display:flex; align-items:center; gap:13px; width:100%; min-height:48px; padding:0 11px; border:0; border-radius:13px; background:transparent; color:rgb(var(--text-rgb)); font-family:"Nest Montserrat","PingFang SC",sans-serif; font-size:19px; font-weight:400; text-align:left; }.side-action.is-current, .side-action:active { background:var(--side-active); }.side-action svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.side-chat-section { display:flex; flex:1; min-height:0; flex-direction:column; }.side-list-heading { display:flex; flex:0 0 auto; align-items:center; justify-content:space-between; min-height:34px; padding:0 9px; color:rgb(var(--text-rgb)); font-size:14px; font-weight:400; line-height:1.4; }.side-recents-heading { margin-top:14px; }
.side-chat-list { display:grid; align-content:start; gap:2px; min-height:0; overflow-y:auto; scrollbar-width:none; }.side-chat-list::-webkit-scrollbar { display:none; }.side-starred-list { flex:0 0 auto; max-height:170px; }.side-recent-list { flex:1; padding-bottom:8px; }.side-chat-status { margin:6px 10px; color:rgb(var(--text-rgb)); font-size:11px; line-height:1.45; }.side-chat-row { display:grid; grid-template-columns:minmax(0,1fr) 34px 34px; align-items:center; min-height:47px; padding-right:2px; border-radius:13px; background:transparent; }.side-chat-row.is-active { background:var(--side-active); }.side-chat-item { width:100%; min-width:0; min-height:47px; padding:9px 5px 9px 10px; overflow:hidden; border:0; border-radius:13px; background:transparent; color:rgb(var(--text-rgb)); text-align:left; }.side-chat-row:active, .side-chat-item:active { background:var(--side-active); }.side-chat-title { display:block; overflow:hidden; font-size:18px; font-weight:400; line-height:1.35; text-overflow:ellipsis; white-space:nowrap; }.side-chat-meta { display:none; }.side-chat-star, .side-chat-delete { display:grid; place-items:center; width:33px; height:33px; padding:0; border:0; border-radius:50%; background:transparent; color:rgb(var(--text-rgb)); }.side-chat-star svg, .side-chat-delete svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.55; stroke-linecap:round; stroke-linejoin:round; }.side-chat-star.is-starred { color:rgb(var(--text-rgb)); }.side-chat-star.is-starred svg { fill:currentColor; }.side-chat-delete:active { background:rgba(var(--danger-rgb),.08); color:rgb(var(--danger-rgb)); }
.side-settings { display:grid; place-items:center; flex:0 0 auto; width:43px; height:43px; padding:0; border:0; border-radius:50%; background:rgba(var(--elevated-rgb),.75); color:rgb(var(--text-rgb)); box-shadow:0 7px 20px rgba(var(--text-rgb),.04); }.side-settings.is-current, .side-settings:active { background:var(--side-active); }.side-settings svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.55; stroke-linecap:round; stroke-linejoin:round; }
.memory-view, .memory-editor, .settings-view, .photo-view { position:absolute; z-index:5; inset:0; display:flex; flex-direction:column; background:var(--paper); opacity:0; pointer-events:none; transform:translateX(18px); transition:opacity .24s ease, transform .28s cubic-bezier(.22,.74,.2,1); }.memory-view.is-active, .memory-editor.is-active, .settings-view.is-active, .photo-view.is-active { opacity:1; pointer-events:auto; transform:translateX(0); }
.memory-header { display:grid; grid-template-columns:42px 1fr 42px; align-items:center; min-height:max(78px,calc(env(safe-area-inset-top) + 50px)); padding:calc(env(safe-area-inset-top) + 8px) 17px 8px; }
.memory-home-header { grid-template-columns:44px minmax(0,1fr) 40px; align-items:start; min-height:max(184px,calc(env(safe-area-inset-top) + 156px)); padding:calc(env(safe-area-inset-top) + 18px) 24px 16px; }
.memory-heading { align-self:end; min-width:0; padding:0 8px 0 0; }
.memory-home-header .memory-heading h1 { margin:0; color:rgb(var(--text-rgb)); font-family:"Nest Montserrat","PingFang SC",sans-serif; font-size:42px; font-weight:500; line-height:1.04; letter-spacing:-.055em; text-align:left; }
.memory-heading p { margin:8px 0 0; color:rgb(var(--text-rgb)); font-size:14px; font-weight:400; line-height:1.45; letter-spacing:.01em; }
.memory-header h1, .memory-header h2 { margin:0; font-family:"Nest Montserrat","PingFang SC",sans-serif; font-size:25px; font-weight:500; letter-spacing:-.03em; text-align:center; }.memory-header h2 { font-family:inherit; font-size:17px; font-weight:500; letter-spacing:0; }
.memory-back, .memory-add { display:grid; place-items:center; width:40px; height:40px; padding:0; border:0; border-radius:50%; background:rgb(var(--bg-rgb)); color:var(--ink); }.memory-back svg { width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }.memory-add { font-size:27px; font-weight:300; line-height:1; }
.memory-home-header .memory-add { align-self:start; margin-top:2px; background:rgb(var(--bg-rgb)); color:rgb(var(--text-rgb)); font-size:24px; }
.view-menu { display:grid; place-items:center; width:44px; height:44px; padding:0; border:0; border-radius:50%; background:rgb(var(--elevated-rgb)); color:var(--ink); box-shadow:0 9px 20px rgba(var(--text-rgb),.075); }.view-menu svg { width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }.view-menu:active { background:rgb(var(--bg-rgb)); transform:scale(.96); }
.memory-body { flex:1; min-height:0; overflow-y:auto; padding:9px 24px calc(env(safe-area-inset-bottom) + 32px); scrollbar-width:none; }.memory-body::-webkit-scrollbar { display:none; }
.letter-body { flex:1; min-height:0; overflow-y:auto; padding:9px 24px calc(env(safe-area-inset-bottom) + 32px); scrollbar-width:none; }.letter-body::-webkit-scrollbar { display:none; }.letter-subtitle { margin:0 2px 18px; color:var(--text-muted); font-size:14px; line-height:1.45; }.letter-status { min-height:20px; margin:5px 2px 14px; color:var(--text-muted); font-size:13px; line-height:1.45; }.letter-status:empty { display:none; }.letter-list { display:grid; gap:14px; }.letter-empty { margin:44px auto 0; color:var(--text-muted); font-size:14px; line-height:1.65; text-align:center; }.letter-card { display:grid; gap:9px; padding:20px; border-radius:27px; background:var(--surface); color:var(--text); }.letter-card-top, .letter-card-meta { display:flex; align-items:center; justify-content:space-between; gap:12px; color:var(--text-muted); font-size:12px; line-height:1.3; }.letter-card-top time { white-space:nowrap; }.letter-person { overflow:hidden; font-size:13px; text-overflow:ellipsis; white-space:nowrap; }.letter-card h2 { margin:0; color:var(--text); font-size:18px; font-weight:500; line-height:1.4; letter-spacing:-.015em; }.letter-card p { margin:0; color:var(--text); font-size:15px; line-height:1.65; white-space:pre-wrap; }.letter-card-meta { padding-top:4px; border-top:1px solid var(--border); font-size:11px; }
.memory-tabs { display:grid; grid-template-columns:1fr 1fr; gap:4px; padding:6px; border-radius:999px; background:rgb(var(--bg-rgb)); }.memory-tab { height:48px; border:0; border-radius:999px; background:transparent; color:rgb(var(--text-rgb)); font-size:17px; font-weight:400; }.memory-tab.is-active { background:rgb(var(--elevated-rgb)); color:rgb(var(--text-rgb)); box-shadow:0 2px 6px rgba(var(--text-rgb),.08); }
.memory-search { display:flex; align-items:center; gap:9px; height:43px; margin:18px 1px; padding:0 14px; border-radius:15px; background:rgb(var(--bg-rgb)); color:rgb(var(--text-rgb)); }.memory-search svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; }.memory-search input { width:100%; min-width:0; border:0; outline:0; background:transparent; color:rgb(var(--text-rgb)); font-size:15px; }.memory-search input::placeholder { color:rgb(var(--text-rgb)); }.memory-search.is-hidden { display:none; }
.memory-status { min-height:20px; margin:5px 2px 14px; color:rgb(var(--text-rgb)); font-size:13px; font-weight:400; }.memory-status:empty { display:none; }
.memory-content.is-hidden, .memory-login.is-hidden { display:none; }
.memory-login { display:grid; justify-items:center; gap:14px; max-width:360px; margin:clamp(42px,12vh,108px) auto 0; padding:28px 24px; border:1px solid rgba(var(--text-rgb),.06); border-radius:25px; background:rgb(var(--elevated-rgb)); text-align:center; box-shadow:0 12px 34px rgba(var(--text-rgb),.055); }
.memory-login > img { width:31px; height:31px; }.memory-login h2 { margin:1px 0 -5px; font-size:19px; }.memory-login p { max-width:280px; margin:0 0 5px; color:rgb(var(--text-rgb)); font-size:13px; line-height:1.55; }
.memory-login label { display:grid; gap:7px; width:100%; color:rgb(var(--text-rgb)); font-size:12px; text-align:left; }.memory-login input { width:100%; height:46px; padding:0 14px; border:1px solid transparent; border-radius:15px; outline:0; background:rgb(var(--elevated-rgb)); color:var(--ink); }.memory-login input:focus { border-color:rgba(var(--danger-rgb),.35); box-shadow:0 0 0 3px rgba(var(--danger-rgb),.08); }
.memory-login button { width:100%; height:44px; border:0; border-radius:15px; background:var(--orange); color:rgb(var(--elevated-rgb)); font-weight:600; }.memory-login button:disabled { opacity:.55; }.memory-login-error { min-height:18px; color:rgb(var(--danger-rgb)); font-size:12px; }
.memory-logout { display:block; margin:24px auto 0; padding:8px 10px; border:0; background:transparent; color:rgb(var(--text-rgb)); font-size:12px; }
.memory-list { display:grid; gap:14px; }.memory-list.is-hidden { display:none; }
.chronicle-card, .memory-card { position:relative; width:100%; padding:20px 20px 19px; border:0; border-radius:27px; background:rgb(var(--bg-rgb)); color:rgb(var(--text-rgb)); text-align:left; transition:transform .16s ease,background .16s ease; }.chronicle-card:active, .memory-card:active { background:rgb(var(--bg-rgb)); transform:scale(.985); }.chronicle-date { display:block; margin-bottom:9px; color:rgb(var(--text-rgb)); font-size:13px; font-weight:400; line-height:1.3; }.chronicle-fact, .memory-card-title { display:block; font-size:18px; font-weight:400; line-height:1.52; letter-spacing:-.012em; }.chronicle-meaning, .memory-card-preview { display:block; margin-top:8px; color:rgb(var(--text-rgb)); font-size:14px; font-weight:400; line-height:1.6; }
.memory-card-meta { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-top:14px; }.memory-tag, .memory-created { padding:5px 10px; border-radius:999px; background:rgb(var(--elevated-rgb)); color:rgb(var(--text-rgb)); font-family:inherit; font-size:11px; font-weight:400; line-height:1.2; }.memory-created { margin-left:auto; padding-right:0; background:transparent; }
.memory-editor { --editor-card:rgba(var(--elevated-rgb),.78); --editor-stroke:rgba(var(--accent-rgb),.075); --editor-shadow:0 16px 46px rgba(var(--accent-rgb),.07); font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","PingFang SC","Hiragino Sans GB",sans-serif; -webkit-font-smoothing:antialiased; }
.memory-editor.is-chronicle { background:radial-gradient(circle at 88% 9%,rgba(var(--accent-rgb),.18),transparent 29%),radial-gradient(circle at 8% 78%,rgba(var(--accent-rgb),.16),transparent 28%),linear-gradient(180deg,rgb(var(--elevated-rgb)) 0%,rgb(var(--elevated-rgb)) 100%); }
.editor-header { position:relative; z-index:2; grid-template-columns:44px 1fr 70px; min-height:max(78px,calc(env(safe-area-inset-top) + 54px)); padding:calc(env(safe-area-inset-top) + 6px) 18px 8px; border-bottom:1px solid rgba(var(--accent-rgb),.055); background:rgba(var(--elevated-rgb),.72); backdrop-filter:blur(24px) saturate(150%); -webkit-backdrop-filter:blur(24px) saturate(150%); }
.editor-header .memory-back { width:40px; height:40px; background:rgba(var(--elevated-rgb),.72); box-shadow:0 7px 22px rgba(var(--accent-rgb),.06); }
.editor-heading { min-width:0; text-align:center; }.editor-kicker { display:block; margin-bottom:2px; color:rgb(var(--danger-rgb)); font-size:10px; font-weight:650; letter-spacing:.12em; }.editor-heading h2 { color:rgb(var(--text-rgb)); font-family:inherit; font-size:18px; font-weight:650; letter-spacing:-.02em; }
.editor-save { justify-self:end; width:66px; height:38px; padding:0; border:0; border-radius:19px; background:rgb(var(--danger-rgb)); color:rgb(var(--elevated-rgb)); font-size:14px; font-weight:650; box-shadow:0 8px 18px rgba(var(--danger-rgb),.2); }.editor-save:disabled { opacity:.55; box-shadow:none; }
.editor-form { display:grid; align-content:start; gap:11px; flex:1; overflow-y:auto; padding:16px 18px calc(env(safe-area-inset-bottom) + 18px); scrollbar-width:none; }.editor-form::-webkit-scrollbar { display:none; }
.chronicle-lead { display:flex; align-items:center; gap:10px; min-height:24px; padding:0 3px 2px; }.chronicle-lead > span { display:block; flex:0 0 auto; margin:0; color:rgb(var(--danger-rgb)); font-size:10px; font-weight:700; letter-spacing:.16em; }.chronicle-lead p { min-width:0; margin:0; overflow:hidden; color:rgb(var(--text-rgb)); font-size:12px; font-weight:500; line-height:1.4; letter-spacing:-.01em; text-overflow:ellipsis; white-space:nowrap; }
.editor-field { display:grid; gap:13px; padding:18px; border:1px solid var(--editor-stroke); border-radius:24px; background:var(--editor-card); box-shadow:var(--editor-shadow); backdrop-filter:blur(18px) saturate(145%); -webkit-backdrop-filter:blur(18px) saturate(145%); }
.editor-label-row { display:flex; align-items:flex-start; gap:12px; color:rgb(var(--text-rgb)); }.editor-label-row > span:last-child { display:grid; gap:3px; }.editor-label-row strong { display:block; color:rgb(var(--text-rgb)); font-size:15px; font-weight:650; line-height:1.25; letter-spacing:-.01em; }.editor-label-row small { display:block; color:rgb(var(--text-rgb)); font-size:11px; font-weight:450; line-height:1.4; }
.editor-index { display:grid; place-items:center; flex:0 0 31px; width:31px; height:31px; margin-top:-3px; border-radius:50%; background:rgb(var(--accent-rgb)); color:rgb(var(--danger-rgb)); font-size:10px; font-weight:700; letter-spacing:.04em; }
.editor-field input, .editor-field textarea { width:100%; border:1px solid rgba(var(--accent-rgb),.055); outline:0; border-radius:17px; background:rgba(var(--elevated-rgb),.82); color:rgb(var(--text-rgb)); caret-color:rgb(var(--danger-rgb)); transition:border-color .2s ease,box-shadow .2s ease,background .2s ease; }
.editor-field input:focus, .editor-field textarea:focus { border-color:rgba(var(--danger-rgb),.28); background:rgb(var(--elevated-rgb)); box-shadow:0 0 0 4px rgba(var(--danger-rgb),.07); }
.editor-field input { height:48px; padding:0 14px; font-size:15px; }.editor-field textarea { min-height:148px; padding:14px 15px; resize:vertical; font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","PingFang SC","Hiragino Sans GB",sans-serif; font-size:16px; font-weight:400; line-height:1.78; letter-spacing:.005em; }
.editor-date-field { grid-template-columns:1fr auto; align-items:center; gap:14px; padding:14px 16px; }.editor-date-field .editor-label-row { align-items:center; }.editor-date-field input { width:150px; min-width:0; color-scheme:light; text-align:center; }
.memory-editor.is-chronicle .editor-primary-field textarea, .memory-editor.is-chronicle .chronicle-meaning textarea { height:112px; min-height:112px; max-height:112px; overflow-y:auto; resize:none; }
.editor-name-field { display:none; }.memory-editor.is-memory .chronicle-lead { display:none; }.memory-editor.is-memory .editor-name-field { display:grid; }.memory-editor.is-memory .chronicle-meaning { display:none; }.memory-editor.is-memory .editor-date-field { display:grid; }.memory-editor.is-memory .editor-index { display:none; }.memory-editor.is-memory .editor-primary-field textarea { min-height:230px; }
.editor-danger { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:4px; padding:15px 17px; border:1px solid rgba(var(--danger-rgb),.08); border-radius:20px; background:rgba(var(--elevated-rgb),.7); }.editor-danger > span { display:grid; gap:3px; }.editor-danger strong { color:rgb(var(--danger-rgb)); font-size:13px; font-weight:600; }.editor-danger small { color:rgb(var(--danger-rgb)); font-size:10px; }.editor-delete { flex:0 0 auto; min-width:56px; height:34px; padding:0 13px; border:0; border-radius:17px; background:rgba(var(--danger-rgb),.09); color:rgb(var(--danger-rgb)); font-size:12px; font-weight:600; }.memory-editor.is-new .editor-danger { display:none; }
.settings-view { z-index:7; background:radial-gradient(circle at 92% 4%,rgba(var(--accent-rgb),.17),transparent 28%),linear-gradient(180deg,rgb(var(--elevated-rgb)) 0%,rgb(var(--elevated-rgb)) 100%); font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","PingFang SC",sans-serif; }
.settings-header { position:relative; z-index:2; display:grid; grid-template-columns:42px 1fr 62px; align-items:center; min-height:max(82px,calc(env(safe-area-inset-top) + 58px)); padding:calc(env(safe-area-inset-top) + 7px) 17px 9px; border-bottom:1px solid rgba(var(--text-rgb),.055); background:rgba(var(--elevated-rgb),.78); backdrop-filter:blur(24px) saturate(150%); -webkit-backdrop-filter:blur(24px) saturate(150%); }.settings-header > div { min-width:0; text-align:center; }.settings-header span { display:block; margin-bottom:1px; color:rgb(var(--danger-rgb)); font-size:9px; font-weight:700; letter-spacing:.13em; }.settings-header h1 { margin:0; color:rgb(var(--text-rgb)); font-size:23px; font-weight:500; letter-spacing:-.035em; }.settings-save { justify-self:end; width:58px; height:36px; padding:0; border:0; border-radius:18px; background:rgb(var(--danger-rgb)); color:rgb(var(--elevated-rgb)); font-size:13px; font-weight:650; box-shadow:0 8px 18px rgba(var(--danger-rgb),.18); }.settings-save:disabled { opacity:.5; box-shadow:none; }
.settings-form { flex:1; min-height:0; overflow-y:auto; padding:16px 16px calc(env(safe-area-inset-bottom) + 28px); scrollbar-width:none; }.settings-form::-webkit-scrollbar { display:none; }.settings-intro { padding:5px 6px 17px; }.settings-intro strong { display:block; color:rgb(var(--text-rgb)); font-size:17px; font-weight:650; letter-spacing:-.02em; }.settings-intro p { margin:5px 0 0; color:rgb(var(--text-rgb)); font-size:12px; line-height:1.5; }
.settings-card { display:grid; gap:12px; margin-bottom:14px; padding:18px; border:1px solid rgba(var(--accent-rgb),.065); border-radius:25px; background:rgba(var(--elevated-rgb),.76); box-shadow:0 14px 38px rgba(var(--accent-rgb),.055); backdrop-filter:blur(18px) saturate(140%); -webkit-backdrop-filter:blur(18px) saturate(140%); }.settings-card-heading { display:flex; align-items:center; gap:11px; margin-bottom:2px; }.settings-card-heading > span:nth-child(2) { min-width:0; flex:1; }.settings-card-heading h2 { margin:0; color:rgb(var(--text-rgb)); font-size:16px; font-weight:680; letter-spacing:-.015em; }.settings-card-heading p { margin:3px 0 0; overflow:hidden; color:rgb(var(--text-rgb)); font-size:10px; text-overflow:ellipsis; white-space:nowrap; }.settings-icon { display:grid; place-items:center; flex:0 0 38px; width:38px; height:38px; border-radius:13px; background:rgb(var(--accent-rgb)); color:rgb(var(--danger-rgb)); font-size:9px; font-weight:750; letter-spacing:.04em; }.settings-badge { flex:0 0 auto; padding:5px 8px; border-radius:10px; background:rgb(var(--bg-rgb)); color:rgb(var(--text-rgb)); font-size:9px; font-weight:650; }.settings-badge.is-ready { background:rgb(var(--bg-rgb)); color:rgb(var(--text-rgb)); }.settings-badge.is-empty { background:rgb(var(--bg-rgb)); color:rgb(var(--danger-rgb)); }
.settings-field { display:grid; gap:7px; color:rgb(var(--text-rgb)); font-size:11px; font-weight:600; }.settings-field input, .settings-field select, .settings-field textarea { width:100%; border:1px solid rgba(var(--text-rgb),.07); border-radius:15px; outline:0; background:rgb(var(--elevated-rgb)); color:rgb(var(--text-rgb)); font-size:16px; font-weight:450; transition:border-color .2s ease,box-shadow .2s ease,background .2s ease; }.settings-field input, .settings-field select { height:44px; padding:0 12px; }.settings-field select { appearance:none; background-image:linear-gradient(45deg,transparent 50%,rgb(var(--text-rgb)) 50%),linear-gradient(135deg,rgb(var(--text-rgb)) 50%,transparent 50%); background-position:calc(100% - 16px) 19px,calc(100% - 11px) 19px; background-repeat:no-repeat; background-size:5px 5px,5px 5px; }.settings-field textarea { height:132px; padding:12px 13px; resize:vertical; line-height:1.6; }.settings-field input:focus, .settings-field select:focus, .settings-field textarea:focus { border-color:rgba(var(--danger-rgb),.28); background:rgb(var(--elevated-rgb)); box-shadow:0 0 0 4px rgba(var(--danger-rgb),.065); }.settings-textarea { position:relative; }.settings-textarea small { justify-self:end; margin-top:-3px; color:rgb(var(--text-rgb)); font-size:9px; font-weight:500; }.settings-help { margin:-3px 1px 0; color:rgb(var(--text-rgb)); font-size:10px; line-height:1.5; }.settings-two-column { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.settings-test { height:42px; border:0; border-radius:14px; background:rgb(var(--bg-rgb)); color:rgb(var(--text-rgb)); font-size:13px; font-weight:650; }.settings-test:disabled { opacity:.5; }.settings-status { min-height:0; color:rgb(var(--text-rgb)); font-size:11px; line-height:1.45; }.settings-status:empty { display:none; }.settings-status.is-error { color:rgb(var(--danger-rgb)); }.settings-status.is-success { color:rgb(var(--text-rgb)); }
.settings-zero-prompt, .settings-mcp-disclosure { margin:-1px 0 0; padding:11px 12px; border-radius:14px; background:rgb(var(--bg-rgb)); color:rgb(var(--text-rgb)); font-size:11px; line-height:1.5; }.settings-mcp-disclosure code { padding:1px 4px; border-radius:5px; background:rgb(var(--bg-rgb)); color:rgb(var(--accent-rgb)); font-family:inherit; font-size:9px; }
.settings-slider { display:grid; grid-template-columns:1fr auto; align-items:center; gap:4px 12px; padding:4px 1px; }.settings-slider > span { display:grid; gap:2px; }.settings-slider strong, .settings-toggle strong, .settings-coming strong { color:rgb(var(--text-rgb)); font-size:13px; font-weight:620; }.settings-slider small, .settings-toggle small, .settings-coming small { color:rgb(var(--text-rgb)); font-size:10px; line-height:1.35; }.settings-slider output { min-width:36px; padding:5px 7px; border-radius:9px; background:rgb(var(--bg-rgb)); color:rgb(var(--text-rgb)); font-size:11px; text-align:center; }.settings-slider input { grid-column:1 / -1; width:100%; accent-color:rgb(var(--danger-rgb)); }
.settings-toggle { position:relative; display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:50px; padding:4px 1px; }.settings-toggle > span, .settings-coming > span, .settings-mcp-row > span { display:grid; gap:3px; min-width:0; }.settings-toggle input { position:absolute; opacity:0; pointer-events:none; }.settings-toggle i { position:relative; flex:0 0 45px; width:45px; height:27px; border-radius:14px; background:rgb(var(--bg-rgb)); transition:background .2s ease; }.settings-toggle i::after { position:absolute; top:3px; left:3px; width:21px; height:21px; border-radius:50%; background:rgb(var(--elevated-rgb)); box-shadow:0 2px 6px rgba(var(--text-rgb),.15); content:""; transition:transform .22s ease; }.settings-toggle input:checked + i { background:rgb(var(--danger-rgb)); }.settings-toggle input:checked + i::after { transform:translateX(18px); }.settings-toggle input:disabled + i { opacity:.45; }.settings-coming, .settings-mcp-row { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:50px; padding:4px 1px; }.settings-coming em, .settings-mcp-row em { flex:0 0 auto; padding:5px 8px; border-radius:9px; background:rgb(var(--bg-rgb)); color:rgb(var(--text-rgb)); font-size:9px; font-style:normal; }.settings-mcp-row strong { color:rgb(var(--text-rgb)); font-size:12px; font-weight:620; }.settings-mcp-row small { color:rgb(var(--text-rgb)); font-size:10px; }.settings-actions { display:grid; grid-template-columns:1fr 1fr; gap:9px; padding-top:3px; }.settings-actions button { height:42px; border:0; border-radius:14px; background:rgb(var(--bg-rgb)); color:rgb(var(--text-rgb)); font-size:12px; font-weight:620; }.settings-actions button.is-danger { background:rgb(var(--bg-rgb)); color:rgb(var(--danger-rgb)); }
@media (min-width:560px) { .editor-form { width:100%; max-width:540px; margin:0 auto; padding-right:26px; padding-left:26px; } }
.composer { position:absolute; z-index:3; right:13px; bottom:max(14px,env(safe-area-inset-bottom)); left:13px; padding:11px 13px 12px; border:1px solid transparent; border-radius:27px; background:var(--composer-glass); box-shadow:var(--composer-shadow); backdrop-filter:blur(8px) saturate(125%); -webkit-backdrop-filter:blur(8px) saturate(125%); transform:translate3d(0,calc(-1 * var(--keyboard-offset,0px) - var(--keyboard-nudge,0px)),0); will-change:transform; }
.composer-main { display:flex; align-items:flex-start; gap:10px; }.composer-input { width:0; min-width:0; min-height:30px; max-height:122px; flex:1; height:30px; padding:3px 0 4px; overflow-x:hidden; overflow-y:hidden; border:0; outline:0; background:transparent; color:rgb(var(--text-rgb)); caret-color:rgb(var(--toggle-rgb)); font-family:inherit; font-size:17px; line-height:23px; resize:none; white-space:pre-wrap; overflow-wrap:anywhere; scrollbar-width:none; -webkit-user-select:text; user-select:text; }.composer-input::-webkit-scrollbar { display:none; }.composer-input::placeholder { color:var(--text-muted); opacity:1; }.composer-input.is-overflowing { overflow-y:auto; }
.send-button, .attach-button { display:grid; place-items:center; padding:0; border:0; color:rgb(var(--elevated-rgb)); }.send-button { position:absolute; right:9px; bottom:9px; width:38px; height:38px; border-radius:50%; background:rgb(var(--danger-rgb)); color:rgb(var(--elevated-rgb)); box-shadow:none; transition:opacity .15s ease,transform .16s ease,background .15s ease; }.send-button svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; transform:translateY(1px); }.send-button:disabled { background:rgb(var(--danger-rgb)); opacity:.35; }.send-button:focus-visible { outline:3px solid rgba(var(--danger-rgb),.2); outline-offset:2px; }.send-button:not(:disabled):active { background:rgb(var(--danger-rgb)); transform:scale(.93); }.attach-button svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.composer-options { display:flex; align-items:center; gap:8px; margin-top:5px; padding-right:45px; }.attach-button { width:32px; height:32px; border-radius:50%; background:rgb(var(--bg-rgb)); color:rgb(var(--text-rgb)); }.attach-button svg { width:16px; height:16px; stroke-width:2.2; }.model-button { display:flex; align-items:center; min-width:0; max-width:245px; height:34px; margin:-2px 0 -3px; padding:0 13px; overflow:hidden; border:0; border-radius:17px; background:rgb(var(--bg-rgb)); color:rgb(var(--text-rgb)); font-size:12px; white-space:nowrap; transition:background .15s ease,transform .15s ease; }.model-button:active { background:rgb(var(--bg-rgb)); transform:scale(.98); }.model-button:focus-visible { outline:3px solid rgba(var(--danger-rgb),.16); outline-offset:2px; }.model-button-label { min-width:0; overflow:hidden; color:rgb(var(--text-rgb)); font-weight:500; text-overflow:ellipsis; }.model-button-mode { display:none; }
@media (min-width:721px) { body { background:rgb(var(--bg-rgb)); }.app-shell { width:min(100%,560px); margin:auto; box-shadow:0 0 42px rgba(var(--text-rgb),.07); }.main-layer::after { display:none; } }
.message-detail-overlay { position:fixed; z-index:36; inset:0; display:flex; align-items:flex-end; justify-content:center; background:rgba(var(--text-rgb),.2); opacity:0; pointer-events:none; transition:opacity .22s ease; backdrop-filter:blur(2px); -webkit-backdrop-filter:blur(2px); }.message-detail-overlay.is-open { opacity:1; pointer-events:auto; }.message-detail-sheet { display:flex; width:min(100%,560px); height:min(72vh,720px); max-height:calc(100vh - env(safe-area-inset-top) - 12px); flex-direction:column; padding:8px 18px calc(env(safe-area-inset-bottom) + 20px); border-radius:34px 34px 0 0; background:rgb(var(--elevated-rgb)); box-shadow:0 -20px 54px rgba(var(--text-rgb),.16); transform:translateY(103%); transition:transform .3s cubic-bezier(.22,.74,.2,1); }.message-detail-overlay.is-open .message-detail-sheet { transform:translateY(0); }.message-detail-sheet.is-memory { height:auto; min-height:380px; max-height:min(62vh,610px); }.message-detail-handle { flex:0 0 auto; width:38px; height:5px; margin:0 auto 10px; border-radius:4px; background:rgb(var(--text-rgb)); }.message-detail-header { display:grid; grid-template-columns:46px minmax(0,1fr) 46px; flex:0 0 auto; align-items:center; min-height:54px; }.message-detail-header h2 { margin:0; color:rgb(var(--text-rgb)); font-size:19px; font-weight:680; letter-spacing:-.02em; text-align:center; }.message-detail-back { display:grid; place-items:center; width:44px; height:44px; padding:0; border:0; border-radius:50%; outline:0; background:rgb(var(--bg-rgb)); color:rgb(var(--text-rgb)); box-shadow:0 7px 18px rgba(var(--text-rgb),.045); }.message-detail-back:focus-visible { box-shadow:0 0 0 3px rgba(var(--danger-rgb),.11),0 7px 18px rgba(var(--text-rgb),.045); }.message-detail-back svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }.message-detail-body { flex:1; min-height:0; overflow-y:auto; padding:25px 12px 8px; scrollbar-width:none; }.message-detail-body::-webkit-scrollbar { display:none; }.thought-detail-text { margin:0; color:rgb(var(--text-rgb)); font-size:17px; line-height:1.8; white-space:pre-wrap; }.memory-detail-intro { margin:0 0 16px; color:rgb(var(--text-rgb)); font-size:12px; line-height:1.55; }.memory-detail-list { display:grid; gap:9px; margin:0; padding:0; counter-reset:memory-detail; list-style:none; }.memory-detail-list li { position:relative; min-height:52px; padding:15px 16px 15px 44px; border-radius:17px; background:rgb(var(--bg-rgb)); color:rgb(var(--text-rgb)); font-size:14px; font-weight:560; line-height:1.5; }.memory-detail-list li::before { position:absolute; top:14px; left:14px; display:grid; place-items:center; width:22px; height:22px; border-radius:8px; background:rgb(var(--bg-rgb)); color:rgb(var(--text-rgb)); font-size:10px; font-weight:700; content:counter(list-item); }
.message-detail-overlay[data-mode="thought"] { padding:0 8px 8px; background:rgba(var(--text-rgb),.34); backdrop-filter:none; -webkit-backdrop-filter:none; }.message-detail-sheet.is-thought { width:100%; max-width:544px; height:50vh; max-height:50vh; padding:8px 10px 10px; border-radius:44px 44px 52px 52px; }.message-detail-sheet.is-thought .message-detail-header h2 { font-weight:500; }.message-detail-sheet.is-thought .message-detail-back { transform:translateX(10px); }.message-detail-sheet.is-thought .message-detail-body { padding:12px 6px 2px; }
@media all and (display-mode:standalone) { .message-detail-overlay { inset:0 0 auto; height:100vh; } }
.model-picker-overlay { position:fixed; z-index:32; inset:0; display:flex; align-items:flex-end; justify-content:center; background:rgba(var(--text-rgb),.25); opacity:0; pointer-events:none; transition:opacity .2s ease; backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px); }.model-picker-overlay.is-open { opacity:1; pointer-events:auto; }.model-picker-sheet { width:min(100%,560px); padding:10px 18px calc(env(safe-area-inset-bottom) + 18px); border-radius:29px 29px 0 0; background:rgb(var(--elevated-rgb)); box-shadow:0 -18px 50px rgba(var(--text-rgb),.16); transform:translateY(102%); transition:transform .28s cubic-bezier(.22,.74,.2,1); }.model-picker-overlay.is-open .model-picker-sheet { transform:translateY(0); }.model-picker-handle { width:36px; height:4px; margin:0 auto 13px; border-radius:3px; background:rgb(var(--bg-rgb)); }.model-picker-header { display:flex; align-items:center; justify-content:space-between; gap:14px; margin:0 2px 14px; }.model-picker-header > span { display:grid; gap:2px; }.model-picker-header small { color:rgb(var(--danger-rgb)); font-size:9px; font-weight:700; letter-spacing:.12em; }.model-picker-header h2 { margin:0; color:rgb(var(--text-rgb)); font-size:20px; font-weight:680; letter-spacing:-.025em; }.model-picker-close { width:38px; height:38px; padding:0 0 2px; border:0; border-radius:50%; background:rgb(var(--bg-rgb)); color:rgb(var(--text-rgb)); font-size:24px; font-weight:300; line-height:1; }.model-picker-options { display:grid; gap:8px; }.model-picker-option { display:flex; align-items:center; justify-content:space-between; gap:14px; width:100%; min-height:61px; padding:10px 14px; border:1px solid rgba(var(--accent-rgb),.06); border-radius:18px; background:rgb(var(--bg-rgb)); color:rgb(var(--text-rgb)); text-align:left; transition:border-color .16s ease,background .16s ease,transform .16s ease; }.model-picker-option:not(:disabled):active { transform:scale(.985); }.model-picker-option.is-selected { border-color:rgba(var(--danger-rgb),.24); background:rgb(var(--elevated-rgb)); }.model-picker-option:disabled { opacity:.45; }.model-picker-option > span { display:grid; gap:4px; }.model-picker-option strong { font-size:14px; font-weight:650; }.model-picker-option small { color:rgb(var(--text-rgb)); font-size:10px; }.model-picker-option > i { position:relative; flex:0 0 22px; width:22px; height:22px; border:1.5px solid rgb(var(--text-rgb)); border-radius:50%; background:rgb(var(--elevated-rgb)); }.model-picker-option.is-selected > i { border-color:rgb(var(--danger-rgb)); background:rgb(var(--danger-rgb)); }.model-picker-option.is-selected > i::after { position:absolute; top:5px; left:5px; width:9px; height:5px; border-bottom:2px solid rgb(var(--elevated-rgb)); border-left:2px solid rgb(var(--elevated-rgb)); content:""; transform:rotate(-45deg); }.model-thinking-toggle { position:relative; display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:65px; margin-top:10px; padding:9px 14px; border:1px solid rgba(var(--accent-rgb),.06); border-radius:18px; background:rgb(var(--bg-rgb)); }.model-thinking-toggle > span { display:grid; gap:4px; min-width:0; }.model-thinking-toggle strong { color:rgb(var(--text-rgb)); font-size:14px; font-weight:650; }.model-thinking-toggle small { color:rgb(var(--text-rgb)); font-size:10px; line-height:1.35; }.model-thinking-toggle input { position:absolute; opacity:0; pointer-events:none; }.model-thinking-toggle > i { position:relative; flex:0 0 45px; width:45px; height:27px; border-radius:14px; background:rgb(var(--text-rgb)); transition:background .2s ease; }.model-thinking-toggle > i::after { position:absolute; top:3px; left:3px; width:21px; height:21px; border-radius:50%; background:rgb(var(--elevated-rgb)); box-shadow:0 2px 6px rgba(var(--text-rgb),.15); content:""; transition:transform .22s ease; }.model-thinking-toggle input:checked + i { background:rgb(var(--danger-rgb)); }.model-thinking-toggle input:checked + i::after { transform:translateX(18px); }.model-picker-disclosure { margin:10px 3px 6px; color:rgb(var(--text-rgb)); font-size:10px; line-height:1.45; }.model-picker-status { min-height:17px; margin:0 3px 5px; color:rgb(var(--danger-rgb)); font-size:11px; }.model-picker-status:empty { display:none; }.model-picker-save { width:100%; height:50px; border:0; border-radius:17px; background:rgb(var(--danger-rgb)); color:rgb(var(--elevated-rgb)); font-size:15px; font-weight:650; box-shadow:0 9px 20px rgba(var(--danger-rgb),.18); }.model-picker-save:disabled { opacity:.5; }
.model-picker-overlay { padding:0 8px 8px; background:rgba(var(--text-rgb),.34); transition:opacity .22s ease; backdrop-filter:none; -webkit-backdrop-filter:none; }
.model-picker-sheet { display:flex; width:100%; max-width:544px; height:50vh; max-height:50vh; flex-direction:column; padding:8px 10px 10px; border-radius:44px 44px 52px 52px; background:rgb(var(--elevated-rgb)); box-shadow:0 -20px 54px rgba(var(--text-rgb),.16); transform:translateY(103%); transition:transform .3s cubic-bezier(.22,.74,.2,1); }
.model-picker-handle { flex:0 0 auto; width:38px; height:5px; margin:0 auto 10px; border-radius:4px; background:rgb(var(--text-rgb)); }
.model-picker-header { display:grid; grid-template-columns:46px minmax(0,1fr) 46px; flex:0 0 auto; align-items:center; gap:0; min-height:54px; margin:0; }
.model-picker-header h2 { margin:0; color:rgb(var(--text-rgb)); font-size:19px; font-weight:500; letter-spacing:-.02em; text-align:center; }
.model-picker-close { display:grid; place-items:center; width:44px; height:44px; padding:0; border:0; border-radius:50%; outline:0; background:rgb(var(--bg-rgb)); color:rgb(var(--text-rgb)); box-shadow:0 7px 18px rgba(var(--text-rgb),.045); transform:translateX(10px); }
.model-picker-close:focus-visible { box-shadow:0 0 0 3px rgba(var(--danger-rgb),.11),0 7px 18px rgba(var(--text-rgb),.045); }
.model-picker-close svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.model-picker-body { display:flex; flex:1; min-height:0; flex-direction:column; overflow-y:auto; padding:12px 6px 2px; scrollbar-width:none; }
.model-picker-body::-webkit-scrollbar { display:none; }

/* Settings home: keep the current API and form controls, but present them as calm, focused pages. */
.settings-view { background:var(--bg); }
.settings-header { display:flex; align-items:center; min-height:max(82px,calc(env(safe-area-inset-top) + 58px)); padding:calc(env(safe-area-inset-top) + 7px) 17px 9px; border:0; background:transparent; backdrop-filter:none; -webkit-backdrop-filter:none; }
.settings-header > div { flex:1; min-width:0; margin-left:14px; text-align:left; }
.settings-header h1 { font-size:34px; font-weight:600; letter-spacing:-.035em; }
.settings-form { position:relative; flex:1; min-height:0; padding:0 22px calc(env(safe-area-inset-bottom) + 30px); overflow-y:auto; scrollbar-width:none; }
.settings-page { display:none; min-height:100%; padding:0 0 24px; }
.settings-page.is-active { display:block; }
.settings-intro { padding:2px 5px 28px; }
.settings-intro p { margin:0; color:var(--text-muted); font-size:15px; line-height:1.5; }
.settings-group { margin:0 0 25px; }
.settings-group h2, .settings-subheading { margin:0 0 9px 5px; color:var(--text-muted); font-size:14px; font-weight:400; letter-spacing:.01em; }
.settings-list { overflow:hidden; border-radius:25px; background:var(--surface); }
.settings-home-row { display:flex; width:100%; min-height:66px; align-items:center; gap:14px; padding:12px 17px; border:0; border-top:1px solid transparent; background:transparent; color:var(--text); text-align:left; -webkit-tap-highlight-color:transparent; }
.settings-home-row + .settings-home-row { border-top-color:var(--border); }
.settings-home-row:active { background:var(--elevated); }
.settings-row-icon { display:grid; flex:0 0 34px; width:34px; height:34px; place-items:center; border-radius:12px; background:var(--elevated); color:var(--text); }
.settings-row-icon svg, .settings-chevron, .settings-page-back svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.settings-home-row > span:nth-child(2) { display:grid; min-width:0; flex:1; gap:2px; }
.settings-home-row strong { overflow:hidden; color:var(--text); font-size:17px; font-weight:400; line-height:21px; text-overflow:ellipsis; white-space:nowrap; }
.settings-home-row small { overflow:hidden; color:var(--text-muted); font-size:13px; font-weight:400; line-height:17px; text-overflow:ellipsis; white-space:nowrap; }
.settings-chevron { flex:0 0 18px; color:var(--text-muted); }
.settings-home-footer { margin:29px 5px 0; color:var(--text-muted); font-size:13px; line-height:19px; }
.settings-page-header { display:grid; grid-template-columns:44px minmax(0,1fr) 58px; align-items:center; min-height:54px; margin:2px 0 27px; }
.settings-page-header h2 { margin:0; color:var(--text); font-size:25px; font-weight:600; letter-spacing:-.03em; text-align:center; }
.settings-page-back { display:grid; width:44px; height:44px; place-items:center; padding:0; border:0; border-radius:50%; background:var(--surface); color:var(--text); }
.settings-page-back:active { background:var(--elevated); }
.settings-page-lead { margin:0 5px 25px; color:var(--text-muted); font-size:15px; line-height:1.5; }
.settings-page .settings-card { gap:14px; margin-bottom:24px; padding:18px; border:0; border-radius:25px; background:var(--surface); box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; }
.settings-page .settings-save { justify-self:end; width:58px; height:36px; border-radius:18px; background:var(--accent); color:var(--elevated); box-shadow:none; }
.settings-page .settings-save:active { opacity:.84; }
.settings-page .settings-field { gap:7px; color:var(--text-muted); font-size:12px; font-weight:400; }
.settings-page .settings-field input, .settings-page .settings-field select, .settings-page .settings-field textarea { border:0; background:var(--elevated); color:var(--text); font-weight:400; }
.settings-page .settings-field input:focus, .settings-page .settings-field select:focus, .settings-page .settings-field textarea:focus { border-color:transparent; background:var(--elevated); box-shadow:0 0 0 3px var(--focus-ring-soft); }
.settings-page .settings-field select { background-image:linear-gradient(45deg,transparent 50%,var(--text-muted) 50%),linear-gradient(135deg,var(--text-muted) 50%,transparent 50%); }
.settings-page .settings-help, .settings-page .settings-textarea small { color:var(--text-muted); }
.settings-page .settings-badge { width:max-content; background:var(--elevated); color:var(--text-muted); box-shadow:none; }
.settings-page .settings-test, .settings-page .settings-actions button { background:var(--elevated); color:var(--text); font-weight:500; }
.settings-page .settings-actions button.is-danger { color:var(--danger); }
.settings-page .settings-zero-prompt, .settings-page .settings-mcp-disclosure, .settings-page .settings-slider output, .settings-page .settings-toggle > i { background:var(--elevated); color:var(--text-muted); }
.settings-page .settings-mcp-disclosure code { background:transparent; color:var(--text-muted); }
.settings-page .settings-slider strong, .settings-page .settings-toggle strong, .settings-page .settings-mcp-row strong { font-weight:400; }
.settings-page .settings-slider small, .settings-page .settings-toggle small, .settings-page .settings-mcp-row small { color:var(--text-muted); }
.settings-page .settings-slider input { accent-color:var(--toggle); }
.settings-page .settings-toggle input:checked + i { background:var(--toggle); }
.model-picker-options { display:grid; flex:0 0 auto; gap:0; padding:0 18px; overflow:hidden; border-radius:26px; background:rgb(var(--bg-rgb)); }
.model-picker-option { min-height:64px; padding:0 3px; border:0; border-bottom:1px solid rgb(var(--bg-rgb)); border-radius:0; background:transparent; color:rgb(var(--text-rgb)); transition:opacity .16s ease,transform .16s ease; }
.model-picker-option:last-child { border-bottom:0; }
.model-picker-option.is-selected { border-color:rgb(var(--bg-rgb)); background:transparent; }
.model-picker-option strong { overflow:hidden; font-size:17px; font-weight:500; line-height:1.25; text-overflow:ellipsis; white-space:nowrap; }
.model-picker-option > i { border-color:rgb(var(--text-rgb)); }
.model-thinking-toggle { flex:0 0 auto; min-height:64px; margin-top:14px; padding:0 21px; border:0; border-radius:26px; background:rgb(var(--bg-rgb)); }
.model-thinking-toggle strong { color:rgb(var(--text-rgb)); font-size:17px; font-weight:500; }
.model-thinking-toggle > i { flex-basis:49px; width:49px; height:30px; border-radius:15px; }
.model-thinking-toggle > i::after { width:24px; height:24px; }
.model-thinking-toggle input:checked + i::after { transform:translateX(19px); }
.model-picker-status { min-height:17px; margin:7px 4px 0; line-height:1.45; }
.model-picker-status:empty { display:block; visibility:hidden; }
.model-picker-save { flex:0 0 auto; height:46px; margin-top:auto; border-radius:23px; background:rgb(var(--bg-rgb)); color:rgb(var(--text-rgb)); font-size:15px; font-weight:600; box-shadow:none; }
.model-picker-save:active { background:rgb(var(--bg-rgb)); transform:scale(.99); }
@media all and (display-mode:standalone) { .model-picker-overlay { inset:0 0 auto; height:100vh; } }
.message-detail-overlay.is-closing, .model-picker-overlay.is-closing { opacity:1; pointer-events:none; }
.model-picker-option strong { font-family:inherit; font-size:15px; font-weight:500; }
.model-picker-option > i { width:22px; height:22px; border:0; border-radius:0; background:transparent; }
.model-picker-option.is-selected > i { border:0; background:transparent; }
.model-picker-option.is-selected > i::after { top:3px; left:7px; width:7px; height:12px; border:0; border-right:2.2px solid rgb(var(--toggle-rgb)); border-bottom:2.2px solid rgb(var(--toggle-rgb)); transform:rotate(45deg); }
.model-thinking-toggle input:checked + i { background:rgb(var(--toggle-rgb)); }
.model-picker-option { min-height:54px; }
.model-picker-option > i { display:grid; place-items:center; flex-basis:18px; width:18px; height:18px; margin-right:10px; }
.model-picker-option.is-selected > i::after { content:none; }
.model-picker-option > i svg { display:block; width:16px; height:16px; fill:none; stroke:rgb(var(--toggle-rgb)); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; opacity:0; }
.model-picker-option.is-selected > i svg { opacity:1; }
.model-thinking-toggle { min-height:54px; }
.model-thinking-toggle[hidden], .settings-field[hidden] { display:none; }
.settings-slider input:disabled, .settings-field input:disabled, .settings-field select:disabled { opacity:.5; }
.send-button.is-stopping svg { transform:none; }
.model-thinking-toggle strong { font-weight:400; }
.chat-delete-overlay { position:fixed; z-index:30; inset:0; display:flex; align-items:flex-end; justify-content:center; padding:0; background:rgba(var(--text-rgb),.24); opacity:0; pointer-events:none; transition:opacity .2s ease; backdrop-filter:blur(2px); -webkit-backdrop-filter:blur(2px); }.chat-delete-overlay.is-open { opacity:1; pointer-events:auto; }.chat-delete-sheet { width:min(100%,560px); padding:10px 20px calc(env(safe-area-inset-bottom) + 18px); border-radius:28px 28px 0 0; background:rgb(var(--elevated-rgb)); box-shadow:0 -18px 50px rgba(var(--text-rgb),.16); text-align:center; transform:translateY(102%); transition:transform .28s cubic-bezier(.22,.74,.2,1); }.chat-delete-overlay.is-open .chat-delete-sheet { transform:translateY(0); }.chat-delete-handle { width:36px; height:4px; margin:0 auto 17px; border-radius:3px; background:rgb(var(--bg-rgb)); }.chat-delete-icon { display:grid; place-items:center; width:48px; height:48px; margin:0 auto 12px; border-radius:17px; background:rgb(var(--bg-rgb)); color:rgb(var(--danger-rgb)); }.chat-delete-icon svg { width:23px; height:23px; fill:none; stroke:currentColor; stroke-width:1.65; stroke-linecap:round; stroke-linejoin:round; }.chat-delete-sheet h2 { margin:0; color:rgb(var(--text-rgb)); font-size:19px; font-weight:680; letter-spacing:-.02em; }.chat-delete-sheet p { max-width:350px; margin:9px auto 13px; color:rgb(var(--text-rgb)); font-size:12px; line-height:1.6; }.chat-delete-sheet p span { color:rgb(var(--text-rgb)); font-weight:620; }.chat-delete-status { min-height:17px; margin:-3px 0 4px; color:rgb(var(--danger-rgb)); font-size:11px; }.chat-delete-status:empty { display:none; }.chat-delete-confirm, .chat-delete-cancel { width:100%; height:50px; border:0; border-radius:17px; font-size:15px; font-weight:650; }.chat-delete-confirm { background:rgb(var(--danger-rgb)); color:rgb(var(--elevated-rgb)); box-shadow:0 9px 20px rgba(var(--danger-rgb),.18); }.chat-delete-confirm:disabled, .chat-delete-cancel:disabled { opacity:.45; }.chat-delete-confirm:not(:disabled):active { transform:scale(.985); }.chat-delete-cancel { margin-top:8px; background:rgb(var(--bg-rgb)); color:rgb(var(--text-rgb)); }
@media (prefers-reduced-motion:reduce) { .chat-delete-overlay, .chat-delete-sheet, .model-picker-overlay, .model-picker-sheet, .message-detail-overlay, .message-detail-sheet { transition:none; } }

/* Nest skin: every visible surface and state resolves from the tokens above. */
.main-layer::before { background:var(--elevated); }
.main-layer::after { background:linear-gradient(to bottom,rgba(var(--bg-rgb),.98) 0%,rgba(var(--bg-rgb),.94) 24%,rgba(var(--bg-rgb),.64) 55%,rgba(var(--bg-rgb),.2) 78%,rgba(var(--bg-rgb),0) 100%); }
.app-shell.is-panel-open .main-layer, .app-shell.is-panel-dragging .main-layer { box-shadow:var(--shadow-drawer); }
.round-button, .view-menu { box-shadow:var(--shadow-button); }
.side-settings { color:var(--text); box-shadow:var(--shadow-subtle); }
.round-button, .view-menu, .side-settings, .memory-tab.is-active, .memory-tag, .memory-login input, .editor-field input, .editor-field textarea, .settings-field input, .settings-field select, .settings-field textarea, .model-picker-close, .message-detail-back, .chat-delete-cancel { background:var(--elevated); }
.bubble, .memory-back, .memory-add, .memory-home-header .memory-add, .memory-tabs, .memory-search, .memory-login, .chronicle-card, .memory-card, .settings-card, .editor-field, .settings-field input, .settings-field select, .settings-field textarea, .settings-zero-prompt, .settings-mcp-disclosure, .settings-slider output, .settings-coming em, .settings-mcp-row em, .settings-actions button, .attach-button, .model-button, .model-picker-options, .model-thinking-toggle, .model-picker-save, .message-detail-list li, .settings-badge, .settings-toggle > i { background:var(--surface); }
.side-action.is-current, .side-chat-row.is-active, .side-settings.is-current { background:var(--surface); }
.memory-editor.is-chronicle, .settings-view, .message-detail-sheet, .model-picker-sheet, .chat-delete-sheet { background:var(--bg); }
.memory-editor.is-chronicle { background-image:none; }
.editor-header, .settings-header { background:var(--glass); border-color:var(--border); }
.memory-login, .settings-card, .editor-field, .editor-field input, .editor-field textarea, .settings-field input, .settings-field select, .settings-field textarea, .model-picker-option, .model-picker-option.is-selected, .editor-danger { border-color:var(--border); }
.memory-heading p, .memory-tab, .memory-search, .memory-search input::placeholder, .memory-status, .chronicle-date, .chronicle-meaning, .memory-card-preview, .memory-card-meta, .message-time, .message-edit, .token-usage, .memory-tip, .side-list-heading, .side-chat-status, .settings-field, .settings-field textarea::placeholder, .settings-help, .settings-slider small, .settings-toggle small, .settings-coming small, .settings-mcp-row small, .settings-status, .message-detail-body .memory-detail-intro, .message-detail-list li, .chat-delete-sheet p { color:var(--text-muted); }
.greeting, .bubble, .side-action, .side-chat-item, .side-chat-title, .memory-home-header .memory-heading h1, .memory-tab.is-active, .memory-search input, .chronicle-fact, .memory-card-title, .memory-login h2, .editor-heading h2, .editor-field input, .editor-field textarea, .settings-header h1, .settings-card-heading h2, .settings-field input, .settings-field select, .settings-field textarea, .settings-slider strong, .settings-toggle strong, .settings-coming strong, .settings-mcp-row strong, .composer-input, .model-button, .model-button-label, .message-detail-header h2, .thought-detail-text, .model-picker-header h2, .model-picker-option, .model-thinking-toggle strong, .chat-delete-sheet h2 { color:var(--text); }
.stream-note, .editor-kicker, .chronicle-lead > span, .settings-header span, .settings-icon, .settings-badge.is-empty, .settings-status.is-error, .chat-delete-status, .editor-delete { color:var(--danger); }
.settings-badge.is-ready, .settings-badge.is-empty { background:var(--surface); color:var(--text-muted); box-shadow:none; }
.settings-icon, .editor-index, .chat-delete-icon, .editor-danger { background:var(--surface); color:var(--text-muted); }
.memory-login button, .editor-save, .settings-save, .send-button { background:var(--accent); }
.send-button:disabled { background:var(--accent); opacity:.35; }
.send-button:not(:disabled):active, .model-button:active, .model-picker-save:active { background:var(--accent); }
.settings-slider input { accent-color:var(--accent); }
.settings-field select { background-image:linear-gradient(45deg,transparent 50%,var(--text-muted) 50%),linear-gradient(135deg,var(--text-muted) 50%,transparent 50%); }
.settings-toggle input:checked + i, .model-thinking-toggle input:checked + i { background:var(--toggle); }
.model-picker-option > i svg { stroke:var(--accent); }
.model-picker-option.is-selected > i::after { border-color:var(--accent); }
.chat-delete-confirm { background:var(--danger); box-shadow:none; }
.chat-delete-icon { color:var(--danger); }
.settings-actions button.is-danger, .editor-danger, .editor-delete { background:var(--surface); color:var(--danger); }
.message-detail-overlay, .message-detail-overlay[data-mode="thought"], .model-picker-overlay, .chat-delete-overlay { background:var(--overlay); backdrop-filter:none; -webkit-backdrop-filter:none; }
.model-picker-option { border-bottom-color:var(--border); }
.model-picker-handle, .message-detail-handle, .chat-delete-handle { background:var(--border); }
.composer-input { caret-color:var(--accent); }
.settings-status.is-success { color:var(--text-muted); }
.message.is-streaming .bubble:not(.is-empty)::after { background:var(--accent); }
.side-chat-star, .side-chat-delete, .memory-tag, .memory-created { color:var(--text-muted); }
.round-button { background:var(--composer-glass); color:var(--text); box-shadow:var(--composer-shadow); backdrop-filter:blur(8px) saturate(125%); -webkit-backdrop-filter:blur(8px) saturate(125%); }
.round-button .menu-button-icon { width:21px; height:21px; fill:none; stroke:none; }
.round-button .new-chat-button-icon { width:22px; height:22px; fill:none; stroke:none; }
.side-settings { background:var(--composer-glass); color:var(--text); box-shadow:var(--composer-shadow); backdrop-filter:blur(8px) saturate(125%); -webkit-backdrop-filter:blur(8px) saturate(125%); }
.side-settings .side-settings-icon { width:22px; height:22px; fill:none; stroke:none; stroke-width:1.1; }
.side-chat-star.is-starred { color:var(--text); }
.side-chat-delete:active { background:var(--surface); color:var(--danger); }
.memory-tag, .memory-created { background:var(--elevated); }
.memory-created { background:transparent; }
.message-detail-list li::before { background:var(--elevated); color:var(--text-muted); }
.settings-toggle i::after, .model-thinking-toggle > i::after { background:var(--elevated); box-shadow:0 2px 6px rgba(var(--text-rgb),.15); }
.settings-field input:focus, .settings-field select:focus, .settings-field textarea:focus, .memory-login input:focus { border-color:var(--accent); box-shadow:0 0 0 3px var(--focus-ring-soft); }
.send-button:focus-visible, .model-button:focus-visible { outline-color:var(--focus-ring); }
.message-detail-back:focus-visible, .model-picker-close:focus-visible { box-shadow:0 0 0 3px var(--focus-ring-soft),var(--shadow-subtle); }
.message-detail-sheet, .model-picker-sheet, .chat-delete-sheet { box-shadow:var(--shadow-sheet); }
@media (min-width:721px) { body { background:var(--sidebar); } }
.side-chat-row { position:relative; display:block; overflow:hidden; padding:0; }.side-chat-actions { position:absolute; inset:0 0 0 auto; display:flex; align-items:center; gap:5px; padding:0 3px; }.side-chat-action { display:grid; place-items:center; width:35px; height:35px; padding:0; border:0; border-radius:50%; background:var(--surface); color:var(--text-muted); }.side-chat-action.is-danger { color:var(--danger); }.side-chat-action svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }.side-chat-item { position:relative; z-index:1; width:100%; padding:9px 10px; background:var(--bg); transition:transform .2s ease,background .16s ease; touch-action:pan-y; }.side-chat-row.is-active .side-chat-item { background:var(--surface); }.side-chat-row.is-actions-open .side-chat-item { transform:translateX(-120px); }
.side-chat-rename-input { width:100%; height:29px; padding:0 2px; border:0; border-bottom:1px solid var(--text-muted); outline:0; background:transparent; color:var(--text); caret-color:var(--accent); font:inherit; font-size:18px; line-height:1.35; }

/* Forms stay calm: raised fields are white, with no accent focus rings or halos. */
.settings-page .settings-field input, .settings-page .settings-field select, .settings-page .settings-field textarea { background:var(--elevated); }
.settings-page .settings-field input:focus, .settings-page .settings-field select:focus, .settings-page .settings-field textarea:focus, .settings-field input:focus, .settings-field select:focus, .settings-field textarea:focus, .memory-login input:focus, .editor-field input:focus, .editor-field textarea:focus { border-color:transparent; box-shadow:none; outline:0; }
.token-usage:focus-visible, .send-button:focus-visible, .model-button:focus-visible, .message-detail-back:focus-visible, .model-picker-close:focus-visible, .settings-home-row:focus-visible, .settings-page-back:focus-visible, .view-menu:focus-visible, .round-button:focus-visible, .side-settings:focus-visible { outline:0; }
.memory-card-end { display:flex; align-items:center; gap:6px; margin-left:auto; white-space:nowrap; }.memory-card-end .memory-created { margin-left:0; }.memory-id { color:var(--text-muted); font-family:ui-monospace,"SF Mono",Menlo,monospace; font-size:10px; letter-spacing:.02em; }
.editor-id { display:flex; align-items:center; gap:8px; width:100%; min-height:36px; padding:0 14px; border:0; border-radius:12px; background:var(--elevated); color:var(--text-muted); font-family:inherit; font-size:11px; text-align:left; -webkit-tap-highlight-color:transparent; }.editor-id[hidden] { display:none; }.editor-id code { flex:1; min-width:0; overflow:hidden; color:rgb(var(--text-rgb)); font-family:ui-monospace,"SF Mono",Menlo,monospace; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }.editor-id-copy { flex:0 0 auto; color:rgb(var(--accent-rgb)); }.editor-id:active { transform:scale(.99); }

.todo-form { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 4px; }.todo-form input { flex:1 1 200px; min-width:0; padding:11px 15px; border:1px solid var(--border); border-radius:18px; background:var(--surface); color:var(--text); font:inherit; font-size:15px; }.todo-form select { padding:11px 12px; border:1px solid var(--border); border-radius:18px; background:var(--surface); color:var(--text); font:inherit; font-size:14px; }.todo-form button { padding:11px 18px; border:0; border-radius:18px; background:var(--accent); color:#fff; font:inherit; font-size:14px; cursor:pointer; }.todo-form input:focus-visible, .todo-form select:focus-visible, .todo-form button:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.todo-list { display:grid; gap:10px; }.todo-section { margin:24px 2px 10px; color:var(--text-muted); font-size:13px; font-weight:500; letter-spacing:.04em; }.todo-card { display:flex; align-items:flex-start; gap:12px; padding:16px 18px; border-radius:22px; background:var(--surface); color:var(--text); }.todo-check { flex:none; display:grid; place-items:center; width:22px; height:22px; margin-top:1px; padding:0; border:1.5px solid var(--accent); border-radius:7px; background:transparent; cursor:pointer; }.todo-check svg { width:15px; height:15px; fill:none; stroke:#fff; stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; }.todo-card.is-done .todo-check { background:var(--accent); }.todo-text { flex:1; min-width:0; display:grid; gap:5px; }.todo-text h2 { margin:0; font-size:16px; font-weight:500; line-height:1.45; overflow-wrap:anywhere; }.todo-text p { margin:0; color:var(--text-muted); font-size:14px; line-height:1.6; overflow-wrap:anywhere; }.todo-card.is-done .todo-text h2 { color:var(--text-muted); text-decoration:line-through; }.todo-tags { display:flex; flex-wrap:wrap; gap:6px; }.todo-tag { padding:2px 9px; border-radius:999px; background:rgba(var(--text-rgb), .07); color:var(--text-muted); font-size:12px; line-height:1.6; }.todo-remove { flex:none; padding:2px 4px; border:0; background:none; color:var(--text-muted); font:inherit; font-size:12px; cursor:pointer; }

/* 2026-10-13: long URLs/words must wrap inside bubbles */
.bubble { overflow-wrap:anywhere; word-break:break-word; min-width:0; }
.message { min-width:0; max-width:100%; }

/* 放在心上 (By Heart) tab, 2026-10-14 */
.memory-tabs { grid-template-columns:repeat(3,1fr); }
.by-heart-card .memory-tag { display:inline-block; margin-bottom:10px; font-weight:600; }
.by-heart-content { display:block; font-size:16px; font-weight:400; line-height:1.6; white-space:pre-wrap; overflow-wrap:anywhere; }
.memory-editor.is-by_heart .chronicle-lead, .memory-editor.is-by_heart .editor-date-field, .memory-editor.is-by_heart .chronicle-meaning, .memory-editor.is-by_heart .editor-index { display:none; }
.memory-editor.is-by_heart .editor-name-field { display:grid; }
.memory-editor.is-by_heart .editor-primary-field textarea { min-height:200px; }
@media (max-width:380px) { .memory-tab { font-size:15px; } }

/* Memory UI simplification, 2026-10-14: month picker, title+date list, quiet editor */
.memory-months { display:flex; gap:6px; margin:-6px 1px 14px; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; }.memory-months::-webkit-scrollbar { display:none; }.memory-months[hidden] { display:none; }
.memory-month { flex:0 0 auto; height:32px; padding:0 13px; border:0; border-radius:999px; background:transparent; color:var(--text-muted); font-family:inherit; font-size:14px; font-weight:400; white-space:nowrap; -webkit-tap-highlight-color:transparent; }
.memory-month.is-active { background:var(--surface); color:var(--text); font-weight:500; }
.memory-months.is-searching .memory-month.is-active { background:transparent; color:var(--text-muted); font-weight:400; }
#memories-list { gap:0; }
.memory-row { display:flex; align-items:baseline; justify-content:space-between; gap:16px; width:100%; padding:15px 2px; border:0; border-bottom:1px solid rgba(var(--text-rgb),.07); background:transparent; color:var(--text); font-family:inherit; text-align:left; -webkit-tap-highlight-color:transparent; }
.memory-row:last-child { border-bottom:0; }
.memory-row:active { opacity:.55; }
.memory-row-title { flex:1; min-width:0; display:-webkit-box; overflow:hidden; font-size:16px; font-weight:400; line-height:1.5; letter-spacing:-.01em; overflow-wrap:anywhere; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.memory-row-date { flex:0 0 auto; color:var(--text-muted); font-size:13px; font-variant-numeric:tabular-nums; white-space:nowrap; }

.memory-editor .editor-header { grid-template-columns:44px minmax(0,1fr) auto; gap:10px; border-bottom:0; }
.memory-editor .editor-kicker { display:none; }
.memory-editor .editor-heading { text-align:left; }
.memory-editor .editor-heading h2 { overflow:hidden; font-size:17px; font-weight:600; text-align:left; text-overflow:ellipsis; white-space:nowrap; }
.editor-actions { display:flex; align-items:center; gap:8px; }
.memory-editor .editor-delete { min-width:0; width:auto; height:38px; padding:0 15px; border:0; border-radius:19px; background:var(--surface); color:var(--danger); font-size:14px; font-weight:500; }
.memory-editor .editor-save { width:auto; min-width:62px; padding:0 17px; box-shadow:none; }
.memory-editor.is-new .editor-delete { display:none; }
.memory-editor .editor-form { display:flex; flex-direction:column; gap:0; padding:8px 22px calc(env(safe-area-inset-bottom) + 28px); }
.memory-editor .editor-id { flex:0 0 auto; margin-bottom:4px; }
.memory-editor .chronicle-lead, .memory-editor .editor-danger, .memory-editor .editor-index, .memory-editor .editor-label-row small { display:none; }
.memory-editor .editor-field { flex:0 0 auto; align-content:start; gap:6px; padding:16px 0 14px; border:0; border-bottom:1px solid rgba(var(--text-rgb),.07); border-radius:0; background:transparent; box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; }
.memory-editor:not(.is-chronicle) .editor-primary-field, .memory-editor.is-chronicle .chronicle-meaning { flex:1 0 auto; border-bottom:0; }
.memory-editor .editor-label-row strong { color:var(--text-muted); font-size:13px; font-weight:500; letter-spacing:.02em; }
.memory-editor .editor-field input, .memory-editor .editor-field textarea, .memory-editor .editor-field input:focus, .memory-editor .editor-field textarea:focus { width:100%; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; outline:0; color:var(--text); }
.memory-editor .editor-field input { height:auto; min-height:30px; font-size:16px; line-height:1.5; }
.memory-editor .editor-name-field input { font-size:19px; font-weight:500; letter-spacing:-.01em; }
.memory-editor .editor-date-field { grid-template-columns:1fr; align-items:start; padding:16px 0 14px; }
.memory-editor .editor-date-field input { width:auto; justify-self:start; text-align:left; }
.memory-editor .editor-field textarea, .memory-editor.is-chronicle .editor-primary-field textarea, .memory-editor.is-chronicle .chronicle-meaning textarea { display:block; height:auto; min-height:96px; max-height:none; overflow:hidden; resize:none; font-size:16px; line-height:1.78; }
.memory-editor.is-memory .editor-primary-field textarea, .memory-editor.is-by_heart .editor-primary-field textarea { min-height:180px; }
@media (min-width:560px) { .memory-editor .editor-form { max-width:640px; padding-right:28px; padding-left:28px; } }

/* Lumi图鉴 (Lumidex) tab, 2026-10-14: same look as 放在心上; four tabs fit on a phone */
.memory-tabs { grid-template-columns:repeat(4,minmax(0,1fr)); gap:2px; padding:5px; }
.memory-tab { min-width:0; height:44px; padding:0 2px; font-size:15px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; letter-spacing:-.01em; }
@media (max-width:380px) { .memory-tab { font-size:14px; } }
@media (min-width:560px) { .memory-tabs { gap:4px; padding:6px; } .memory-tab { height:48px; font-size:16px; } }
.memory-editor.is-lumidex .chronicle-lead, .memory-editor.is-lumidex .editor-date-field, .memory-editor.is-lumidex .chronicle-meaning, .memory-editor.is-lumidex .editor-index { display:none; }
.memory-editor.is-lumidex .editor-name-field { display:grid; }
.memory-editor.is-lumidex .editor-primary-field textarea { min-height:180px; }