.topbar{height:56px;min-height:56px;display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid transparent;position:relative;z-index:10}
.segment-bar{padding:0 14px 10px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;overflow-x:hidden;overflow-y:visible;scrollbar-width:none;border-bottom:1px solid color-mix(in srgb,var(--border) 76%, transparent)}
.segment-bar::-webkit-scrollbar{display:none}
.segment-chip{border:none;border-radius:999px;padding:8px 12px;background:var(--background);border:1px solid var(--border);color:var(--desc);font-weight:650;font-size:13px;white-space:nowrap;box-shadow:0 2px 12px rgba(15,23,42,.03)}
.segment-chip.active{background:color-mix(in srgb,var(--secondary) 12%, var(--background));border-color:color-mix(in srgb,var(--secondary) 28%, var(--border));color:var(--foreground)}
.topbar .focus-btn.active,.segment-chip:hover{color:var(--foreground)}
.topbar .focus-btn.active{background:color-mix(in srgb,var(--secondary) 12%, transparent);color:var(--secondary)}
.editor-shell{position:relative}
.editor-shell:not(.fullscreen) .rich-toolbar{position:sticky;top:0;z-index:3;padding:6px 0 10px;background:linear-gradient(180deg,var(--background) 75%, transparent);backdrop-filter:blur(12px)}
.editor-shell.fullscreen .rich-toolbar{position:sticky;top:0;z-index:3;padding:0 0 10px;background:linear-gradient(180deg,var(--background) 82%, transparent)}
.editor-meta-line{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:10px 0 0;color:var(--desc);font-size:12px}
.editor-meta-line .editor-hint{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.editor-status{display:inline-flex;align-items:center;gap:6px;padding:4px 9px;border-radius:999px;background:color-mix(in srgb,var(--secondary) 10%, transparent);color:var(--secondary);font-weight:700;letter-spacing:.01em}
@media (max-width:767px){.segment-bar{padding:0 12px 8px}.app-shell.focus-mode .content-shell{padding-inline:10px}.editor-shell:not(.fullscreen) .rich-toolbar{top:0}}
.topbar .header-card{width:100%;display:flex;align-items:center;gap:10px;padding:0 4px}
.topbar-title-wrap{display:flex;align-items:center;gap:10px;min-width:0}
.title-bar{width:4px;height:16px;border-radius:999px;background:var(--primary)}
.topbar-title{font-weight:800;font-size:17px;white-space:nowrap}
.topbar-actions{margin-left:auto;display:flex;align-items:center;gap:8px;min-width:0;flex-wrap:nowrap}
.icon-btn{height:36px;min-width:36px;border:none;border-radius:12px;background:transparent;color:var(--desc);display:grid;place-items:center;padding:0 10px;transition:background .18s ease,color .18s ease}
.icon-btn:hover{background:var(--hover);color:var(--foreground)}
.search-btn{height:38px;border:2px solid color-mix(in srgb,var(--desc) 60%, transparent);background:var(--background);border-radius:12px;padding:0 12px;display:flex;align-items:center;gap:10px;color:var(--desc);min-width:0;max-width:min(320px,100%);flex:0 1 240px;overflow:hidden}
.search-btn .kbd{display:inline-flex;align-items:center;justify-content:center;padding:2px 5px;border-radius:7px;background:var(--secondbackground);font-size:11px;color:var(--desc);border:1px solid var(--border)}