@keyframes wb-fade-in{0%{opacity:0}to{opacity:.85}}.winbox{position:fixed;left:0;top:0;background:#0050ff;box-shadow:0 14px 28px rgba(0,0,0,.25),0 10px 10px rgba(0,0,0,.22);transition:width .3s,height .3s,left .3s,top .3s;transition-timing-function:cubic-bezier(.3,1,.3,1);contain:layout size;text-align:left;touch-action:none}.wb-body,.wb-header{position:absolute;left:0}.wb-header{top:0;width:100%;height:35px;line-height:35px;color:#fff;overflow:hidden;z-index:1}.wb-body{top:35px;right:0;bottom:0;overflow:auto;-webkit-overflow-scrolling:touch;overflow-scrolling:touch;will-change:contents;background:#fff;margin-top:0!important;contain:strict;z-index:0}.wb-control *,.wb-icon{background-repeat:no-repeat}.wb-drag{height:100%;padding-left:10px;cursor:move}.wb-title{font-family:Arial,sans-serif;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wb-icon{display:none;width:20px;height:100%;margin:-1px 8px 0-3px;float:left;background-size:100%;background-position:center}.wb-e,.wb-w{width:10px;top:0}.wb-n,.wb-s{left:0;height:10px;position:absolute}.wb-n{top:-5px;right:0;cursor:n-resize;z-index:2}.wb-e{position:absolute;right:-5px;bottom:0;cursor:w-resize;z-index:2}.wb-s{bottom:-5px;right:0;cursor:n-resize;z-index:2}.wb-nw,.wb-sw,.wb-w{left:-5px}.wb-w{position:absolute;bottom:0;cursor:w-resize;z-index:2}.wb-ne,.wb-nw,.wb-sw{width:15px;height:15px;z-index:2;position:absolute}.wb-nw{top:-5px;cursor:nw-resize}.wb-ne,.wb-sw{cursor:ne-resize}.wb-ne{top:-5px;right:-5px}.wb-se,.wb-sw{bottom:-5px}.wb-se{position:absolute;right:-5px;width:15px;height:15px;cursor:nw-resize;z-index:2}.wb-control{float:right;height:100%;max-width:100%;text-align:center}.wb-control *{display:inline-block;width:30px;height:100%;max-width:100%;background-position:center;cursor:pointer}.no-close .wb-close,.no-full .wb-full,.no-header .wb-header,.no-max .wb-max,.no-min .wb-min,.no-resize .wb-body~div,.wb-body .wb-hide,.wb-show,.winbox.hide,.winbox.min .wb-body>*,.winbox.min .wb-full,.winbox.min .wb-min,.winbox.modal .wb-full,.winbox.modal .wb-max,.winbox.modal .wb-min{display:none}.winbox.max .wb-drag,.winbox.min .wb-drag{cursor:default}.wb-min{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxNiAyIj48cGF0aCBmaWxsPSIjZmZmIiBkPSJNOCAwaDdhMSAxIDAgMCAxIDAgMkgxYTEgMSAwIDAgMSAwLTJoN3oiLz48L3N2Zz4=);background-size:14px auto;background-position:center calc(50% + 6px)}.wb-max{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9IiNmZmYiIHZpZXdCb3g9IjAgMCA5NiA5NiI+PHBhdGggZD0iTTIwIDcxLjMxMUMxNS4zNCA2OS42NyAxMiA2NS4yMyAxMiA2MFYyMGMwLTYuNjMgNS4zNy0xMiAxMi0xMmg0MGM1LjIzIDAgOS42NyAzLjM0IDExLjMxMSA4SDI0Yy0yLjIxIDAtNCAxLjc5LTQgNHY1MS4zMTF6Ii8+PHBhdGggZD0iTTkyIDc2VjM2YzAtNi42My01LjM3LTEyLTEyLTEySDQwYy02LjYzIDAtMTIgNS4zNy0xMiAxMnY0MGMwIDYuNjMgNS4zNyAxMiAxMiAxMmg0MGM2LjYzIDAgMTItNS4zNyAxMi0xMnptLTUyIDRjLTIuMjEgMC00LTEuNzktNC00VjM2YzAtMi4yMSAxLjc5LTQgNC00aDQwYzIuMjEgMCA0IDEuNzkgNCA0djQwYzAgMi4yMS0xLjc5IDQtNCA0SDQweiIvPjwvc3ZnPg==);background-size:17px auto}.wb-close{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9Ii0xIC0xIDE4IDE4Ij48cGF0aCBmaWxsPSIjZmZmIiBkPSJtMS42MTMuMjEuMDk0LjA4M0w4IDYuNTg1IDE0LjI5My4yOTNsLjA5NC0uMDgzYTEgMSAwIDAgMSAxLjQwMyAxLjQwM2wtLjA4My4wOTRMOS40MTUgOGw2LjI5MiA2LjI5M2ExIDEgMCAwIDEtMS4zMiAxLjQ5N2wtLjA5NC0uMDgzTDggOS40MTVsLTYuMjkzIDYuMjkyLS4wOTQuMDgzQTEgMSAwIDAgMSAuMjEgMTQuMzg3bC4wODMtLjA5NEw2LjU4NSA4IC4yOTMgMS43MDdBMSAxIDAgMCAxIDEuNjEzLjIxeiIvPjwvc3ZnPg==);background-size:15px auto;background-position:5px center}.wb-full{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2Utd2lkdGg9IjIuNSIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNOCAzSDVhMiAyIDAgMCAwLTIgMnYzbTE4IDBWNWEyIDIgMCAwIDAtMi0yaC0zbTAgMThoM2EyIDIgMCAwIDAgMi0ydi0zTTMgMTZ2M2EyIDIgMCAwIDAgMiAyaDMiLz48L3N2Zz4=);background-size:16px auto}.winbox.max .wb-body~div,.winbox.min .wb-body~div,.winbox.modal .wb-body~div,.winbox.modal .wb-drag,body.wb-lock iframe{pointer-events:none}.winbox.max{box-shadow:none}.winbox.max .wb-body{margin:0!important}.winbox iframe{position:absolute;width:100%;height:100%;border:0}body.wb-lock .winbox{will-change:left,top,width,height;transition:none}.winbox.modal:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:inherit;border-radius:inherit}.winbox.modal:after{content:"";position:absolute;top:-50vh;left:-50vw;right:-50vw;bottom:-50vh;background:#0d1117;animation:wb-fade-in .2s ease-out forwards;z-index:-1}.no-animation{transition:none}.no-shadow{box-shadow:none}.no-header .wb-body{top:0}.no-move:not(.min) .wb-title{pointer-events:none}.wb-body .wb-show{display:revert}
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --window-bg: #fffffd;
    --yellow-bg: #ffffea;
    --blue-tag: #eaffff;
    --green-tag: #eaffea;
    --border: #888888;
    --text: #000000;
    --tag-border: #9eeeee;
    --scroll-bg: #aaaaaa;
    --scroll-bg-editor: #99994c;
}

/* Dark mode - muted Plan 9 night palette */
:root.dark {
    --window-bg: #252525;
    --yellow-bg: #2a2a28;
    --blue-tag: #2a3a3a;
    --green-tag: #2a3a2a;
    --border: #555555;
    --text: #e0e0d8;
    --tag-border: #4a5a5a;
    --scroll-bg: #555555;
    --scroll-bg-editor: #4a4a3a;
}

:root.dark body {
    background-color: #1a1a1a;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAEUlEQVQIW2M0NDT8z8DAwAgABKoCGPEBcioAAAAASUVORK5CYII=");
}

:root.dark .status-bar {
    background: #2a2a2a;
    border-top-color: #3a3a3a;
    color: #b0b0a8;
}

:root.dark .post-body pre {
    background: #232320;
    border-color: var(--border);
}

:root.dark .post-body blockquote {
    color: #a0a098;
    border-left-color: var(--border);
}

:root.dark .post-body a {
    color: var(--text);
    background: #3a4a4a;
}

:root.dark .post-body a:hover {
    background: #3a4a3a;
}

:root.dark .login-field input,
:root.dark .bookmark-editor .editor-field input,
:root.dark .editor-field input {
    background: #232320;
    border-color: var(--border);
    color: var(--text);
}

:root.dark .login-field input:focus,
:root.dark .bookmark-editor .editor-field input:focus,
:root.dark .editor-field input:focus {
    background: #282825;
    border-color: #666;
}

:root.dark .editor-body textarea {
    background: var(--yellow-bg);
    color: var(--text);
}

:root.dark .editor-body textarea:focus {
    background: #2d2d2a;
}

:root.dark .preview-content {
    background: var(--yellow-bg);
}

:root.dark .pane-tag {
    color: #888;
    border-bottom-color: #3a3a3a;
}

:root.dark .column-tag .cmd:hover {
    background: #3a3a38;
}

:root.dark .column-tag .cmd.primary {
    background: var(--green-tag);
}

:root.dark .column-tag .cmd.primary:hover {
    background: #354535;
}

:root.dark .column-tag .cmd.danger:hover {
    background: #453535;
}

:root.dark .tag-bar .commands span:hover {
    background: #3a3a38;
}

:root.dark .error-window .content-wrapper,
:root.dark .error-window-content {
    background: #352a2a;
}

:root.dark .error-title {
    color: #d4a574;
}

:root.dark .login-error {
    color: #d4a574;
}

:root.dark .post-date {
    color: #888;
}

:root.dark .loading,
:root.dark .empty {
    color: #888;
}

html,
body {
    height: 100%;
    overflow: hidden;
}

body {
    font-family: "Go Mono", "Courier New", Courier, monospace;
    font-size: 16px;
    line-height: 1.3;
    /* Classic Plan 9 grey stipple pattern */
    background-color: #999999;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAYAAABytg0kAAAAEUlEQVQIW2NkYGD4z8DAwAgABUoBA/9tLV4AAAAASUVORK5CYII=");
    image-rendering: pixelated;
    color: var(--text);
    cursor: default;
}

/* Desktop area */
.desktop {
    width: 100%;
    height: 100%;
    padding: 8px;
    position: relative;
}

/* WinBox overrides for Plan 9 style */
.winbox {
    background: var(--window-bg) !important;
    border: 3px solid #9eeeee !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-family: "Go Mono", "Courier New", monospace !important;
    transition: none !important;
}

.winbox.active,
.winbox:focus-within {
    border-color: #6ecccc !important;
}

:root.dark .winbox {
    border-color: #3a4a4a !important;
}

:root.dark .winbox.active,
:root.dark .winbox:focus-within {
    border-color: #5a7a7a !important;
}

/* WinBox header - Plan 9 tag bar style */
.winbox .wb-header {
    background: var(--blue-tag) !important;
    border-bottom: 1px solid var(--border) !important;
    height: auto !important;
    line-height: 1.3 !important;
    position: relative !important;
}

.winbox .wb-drag {
    padding: 2px 4px !important;
    height: auto !important;
}

.winbox .wb-body {
    top: 25px !important;
}

.winbox .wb-title {
    font-family: "Go Mono", "Courier New", monospace !important;
    font-size: 16px !important;
    color: var(--text) !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    overflow: visible !important;
    text-overflow: unset !important;
}

.winbox .wb-title .path {
    color: var(--text);
    font-weight: bold;
}

.winbox .wb-title .commands {
    color: var(--text);
    margin-left: auto;
    font-weight: bold;
    display: flex;
    gap: 0;
}

.winbox .wb-title .commands .cmd {
    cursor: pointer;
    padding: 0 4px;
}

.winbox .wb-title .commands .cmd:hover {
    background: var(--window-bg);
}

/* Hide WinBox default controls */
.winbox .wb-icon,
.winbox .wb-control,
.winbox .wb-min,
.winbox .wb-max,
.winbox .wb-full,
.winbox .wb-close {
    display: none !important;
}

/* WinBox body */
.winbox .wb-body {
    background: var(--window-bg) !important;
    margin: 0 !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
}

/* Content wrapper - holds gutter and content side by side */
.winbox .content-wrapper {
    flex: 1;
    display: flex;
    overflow: hidden;
    position: relative;
}

/* Scroll indicator - Plan 9 style */
.winbox .scroll-gutter {
    width: 12px;
    flex-shrink: 0;
    background: var(--scroll-bg);
    border-right: 1px solid var(--border);
    cursor: pointer;
    position: relative;
}

.winbox .scroll-thumb {
    position: absolute;
    left: 1px;
    width: 10px;
    background: var(--window-bg);
    min-height: 20px;
    cursor: grab;
}

.winbox .scroll-thumb.dragging {
    cursor: grabbing;
}

/* Content area */
.winbox .content {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 4px;
    scrollbar-width: none;
}

.winbox .content::-webkit-scrollbar {
    display: none;
}

.winbox .window-content {
    height: 100%;
}

/* Body tag (secondary tag bar) */
.winbox .body-tag {
    background: var(--yellow-bg);
    border-bottom: 1px solid #ccc;
    padding: 2px 4px 2px 16px;
    font-size: 13px;
    color: #666;
    flex-shrink: 0;
}

/* Editor window WinBox styling */
.winbox:has(.editor-container) {
    background: var(--yellow-bg) !important;
}

.winbox:has(.editor-container) .wb-body {
    background: var(--yellow-bg) !important;
}

.winbox:has(.editor-container) .scroll-gutter {
    background: var(--scroll-bg-editor);
}

.winbox:has(.editor-container) .scroll-thumb {
    background: var(--yellow-bg);
}

/* User window WinBox styling */
.winbox:has(.user-content) .content {
    padding: 0;
}

/* Error window WinBox styling */
.winbox:has(.error-window-content) .wb-body {
    background: #fff0f0 !important;
}

.winbox:has(.error-window-content) .content {
    padding: 0;
}

:root.dark .winbox:has(.error-window-content) .wb-body {
    background: #352a2a !important;
}

:root.dark .winbox .wb-header {
    background: var(--blue-tag) !important;
    border-bottom-color: var(--border) !important;
}

:root.dark .winbox .wb-title .commands .cmd:hover {
    background: #3a3a38;
}

:root.dark .winbox .body-tag {
    border-bottom-color: #3a3a3a;
}

/* Post list styling */
.post-list {
    padding: 4px 0;
}

.post-item {
    padding: 2px 0;
    cursor: pointer;
    display: flex;
    gap: 12px;
}

.post-item:hover {
    background: var(--blue-tag);
}

.post-date {
    color: var(--border);
    flex-shrink: 0;
}

.post-title {
    color: var(--text);
}

/* Post content styling */
.post-body {
    padding: 8px 4px;
    font-family: "Go Mono", "Courier New", Courier, monospace;
}

.post-body h1 {
    font-size: 16px;
    font-weight: normal;
    margin-bottom: 12px;
    padding-bottom: 4px;
    border-bottom: 1px solid var(--border);
}

.post-body p {
    margin-bottom: 12px;
    text-align: left;
}

.post-body a {
    color: var(--text);
    background: var(--blue-tag);
    text-decoration: none;
    padding: 0 2px;
}

.post-body a:hover {
    background: var(--green-tag);
}

.post-body pre {
    background: #fafae0;
    padding: 8px;
    margin: 8px 0;
    border: 1px solid var(--border);
    overflow-x: auto;
    font-family: "Go Mono", "Courier New", Courier, monospace;
    font-size: 14px;
}

.post-body blockquote {
    border-left: 2px solid var(--border);
    padding-left: 12px;
    margin: 8px 0;
    color: #444;
}

/* Menu/directory window */
.menu-item {
    padding: 1px 4px;
    cursor: pointer;
}

.menu-item:hover {
    background: var(--blue-tag);
}

.menu-item.dir::before {
    content: "▸ ";
}

/* Sitemap/file listing */
.sitemap-list {
    padding: 4px 0;
}

.sitemap-item {
    padding: 2px 8px;
    cursor: pointer;
    font-size: 14px;
}

.sitemap-item:hover {
    background: var(--blue-tag);
}

.sitemap-item.dir::after {
    content: "";
}

/* Second tag bar for some windows (Acme style) */
.body-tag {
    background: var(--yellow-bg);
    border-bottom: 1px solid #ccc;
    padding: 2px 4px 2px 16px;
    font-size: 13px;
    color: #666;
}

/* Acme-style editor */
.content:has(.editor-container) {
    padding: 0;
}

.window:has(.editor-container) {
    background: var(--yellow-bg);
}

.window:has(.editor-container) .scroll-gutter {
    background: var(--scroll-bg-editor);
}

.window:has(.editor-container) .scroll-thumb {
    background: var(--yellow-bg);
}

.editor-container {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.editor-columns {
    display: flex;
    flex: 1;
    overflow: hidden;
}

.editor-column {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.editor-column.main {
    flex: 1;
    min-width: 250px;
}

.editor-column.side {
    flex: 1;
    min-width: 200px;
}

.column-resizer {
    width: 1px;
    background: var(--border);
    cursor: col-resize;
    flex-shrink: 0;
}

.editor-columns.resizing {
    user-select: none;
}

.column-tag {
    background: var(--blue-tag);
    border-bottom: 1px solid var(--border);
    padding: 2px 6px;
    font-size: 13px;
    flex-shrink: 0;
}

.column-tag .cmd {
    cursor: pointer;
    padding: 0 4px;
    margin-left: 8px;
}

.column-tag .cmd:hover {
    background: var(--window-bg);
}

.column-tag .cmd.primary {
    background: var(--green-tag);
}

.column-tag .cmd.primary:hover {
    background: #ccffcc;
}

.column-tag .cmd.danger:hover {
    background: #ffcccc;
}

.editor-pane {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.pane-tag {
    background: var(--yellow-bg);
    border-bottom: 1px solid #ccc;
    padding: 2px 6px;
    font-size: 12px;
    color: #666;
    flex-shrink: 0;
}

.editor-field {
    display: flex;
    align-items: center;
    padding: 4px 8px;
    border-bottom: 1px solid #eee;
    background: var(--yellow-bg);
}

.editor-field label {
    width: 60px;
    font-size: 12px;
    color: #666;
    flex-shrink: 0;
}

.editor-field input {
    flex: 1;
    font-family: "Go Mono", "Courier New", Courier, monospace;
    font-size: 14px;
    border: none;
    background: transparent;
    outline: none;
    padding: 2px 0;
}

.editor-body {
    flex: 1;
    position: relative;
    overflow: hidden;
}

.editor-body textarea {
    width: 100%;
    height: 100%;
    font-family: "Go Mono", "Courier New", Courier, monospace;
    font-size: 14px;
    line-height: 1.3;
    border: none;
    background: var(--yellow-bg);
    padding: 8px;
    resize: none;
    outline: none;
}

.editor-body textarea:focus {
    background: #fffff0;
}

.preview-content {
    flex: 1;
    overflow-y: auto;
    padding: 8px;
    background: var(--yellow-bg);
}

/* Login window */
.login-form {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    padding: 0 16px;
}

.login-field {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}

.login-field label {
    width: 70px;
    font-size: 14px;
    flex-shrink: 0;
    margin-right: 8px;
}

.login-field input {
    flex: 1;
    font-family: "Go Mono", "Courier New", Courier, monospace;
    font-size: 14px;
    border: 1px solid var(--border);
    background: #fffff8;
    padding: 4px 6px;
    outline: none;
    min-width: 0;
}

.login-field input:focus {
    background: #ffffff;
    border-color: #666;
}

.login-error {
    color: #884400;
    font-size: 12px;
    margin-top: 4px;
    height: 16px;
    visibility: hidden;
}

.login-error.visible {
    visibility: visible;
}

/* User content (logged in state) */
.user-content {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 12px;
    gap: 4px;
    background: var(--blue-tag);
    align-items: flex-start;
    justify-content: center;
    font-weight: bold;
}

.user-face {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    image-rendering: pixelated;
    margin-bottom: 4px;
}

.user-face img {
    max-width: 96px;
    max-height: 96px;
    image-rendering: pixelated;
}

.user-face svg {
    width: 48px;
    height: 48px;
}

.user-name {
    font-size: 14px;
}

.user-time {
    font-size: 14px;
    color: #444;
    text-align: center;
}

/* User window - no scrollbar, no padding */
.content-wrapper:has(.user-content) .scroll-gutter {
    display: none;
}

.content:has(.user-content) {
    padding: 0;
}

/* Status/info bar */
.status-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #888888;
    border-top: 1px solid #666666;
    padding: 2px 8px;
    font-family: "Go Mono", "Courier New", Courier, monospace;
    font-size: 13px;
    color: var(--yellow-bg);
    z-index: 1000;
}

/* Login required popup */
.login-required-message {
    padding: 16px 12px;
    text-align: center;
}

.login-required-message p {
    margin-bottom: 8px;
}

.login-required-action {
    color: #666;
    font-size: 13px;
}

/* rc shell */
.rc-shell {
    min-height: 100%;
    background: var(--window-bg);
    font-family: "Go Mono", "Courier New", Courier, monospace;
    outline: none;
}

.rc-terminal {
    min-height: 100%;
    padding: 4px 8px;
}

.rc-line {
    white-space: pre-wrap;
    word-wrap: break-word;
}

.rc-prompt {
    font-weight: bold;
}

.rc-input,
.rc-input-done {
    outline: none;
    border: none;
    background: transparent;
    font-family: inherit;
    font-size: inherit;
}

.rc-input {
    caret-color: #000;
}

.rc-input:focus {
    outline: none;
}

/* Error window */
.error-window .content-wrapper {
    background: #fff0f0;
}

.error-window .scroll-gutter {
    display: none;
}

.error-window .content {
    padding: 0;
}

.error-window .window-content {
    height: 100%;
}

.error-window-content {
    height: 100%;
    background: #fff0f0;
}

.error-title {
    font-weight: bold;
    margin-bottom: 8px;
    padding: 16px 12px 0 12px;
    color: #884400;
}

.error-message {
    font-size: 14px;
    line-height: 1.4;
    padding: 0 12px 16px 12px;
}

/* Bookmark editor */
.bookmark-editor {
    padding: 12px 8px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.bookmark-editor .editor-field {
    border-bottom: none;
    padding: 4px 0;
}

.bookmark-editor .editor-field label {
    width: 50px;
}

.bookmark-editor .editor-field input {
    flex: 1;
    font-family: "Go Mono", "Courier New", Courier, monospace;
    font-size: 14px;
    border: 1px solid var(--border);
    background: #fffff8;
    padding: 4px 6px;
}

.bookmark-editor .editor-field input:focus {
    background: #ffffff;
    border-color: #666;
}

/* Bookmark list items */
.bookmark-item {
    display: flex;
    align-items: center;
    gap: 8px;
}

.bookmark-name {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}