









#sidebar-avatar{position: relative;}
.tj-cl-avatar-dot{
position: absolute;top: -2px;right: -2px;
width: 9px;height: 9px;border-radius: 50%;
background: #ff6b6b;border: 2px solid #131922;
box-shadow: 0 0 7px rgba(255, 107, 107, 0.7);
pointer-events: none;
}


.tj-cl-overlay{
position: fixed;inset: 0;z-index: 99990;
display: none;align-items: center;justify-content: center;
background: rgba(10, 7, 2, 0.64);padding: 24px;
--cl-card: #18130c;
--cl-glow: radial-gradient(120% 78% at 50% -12%, rgba(243, 156, 18, 0.15), transparent 62%);
--cl-panel: #130f09;
--cl-ink: #f0e7d6;
--cl-ink2: #bcae92;
--cl-ink3: #8a7e66;
--cl-body: #dccfb9;
--cl-line: rgba(243, 156, 18, 0.18);
--cl-line2: rgba(255, 255, 255, 0.05);
--cl-accent: #f39c12;
--cl-accent2: #f7b64a;
--cl-aglow: rgba(243, 156, 18, 0.85);
--cl-soft: rgba(243, 156, 18, 0.13);
--cl-sel: rgba(243, 156, 18, 0.13);
--cl-hover: rgba(255, 255, 255, 0.04);
--cl-red: #ff6b6b;
--cl-input: #201a10;
}


.tj-cl-modal{
width: 860px;max-width: 100%;
height: min(78vh, 620px);
background: var(--cl-glow), var(--cl-card);color: var(--cl-ink);
border: 1px solid var(--cl-line);border-radius: 16px;
box-shadow: 0 24px 70px rgba(0, 0, 0, 0.62), 0 0 0 1px rgba(243, 156, 18, 0.06);
display: flex;flex-direction: column;overflow: hidden;
font-family: var(--font-base);
}


.tj-cl-head{
display: flex;align-items: center;gap: 10px;
padding: 9px 16px;border-bottom: 1px solid var(--cl-line);flex: 0 0 auto;
}
.tj-cl-h-title{
font-size: 14.5px;font-weight: 700;color: var(--cl-ink);
padding-left: 11px;position: relative;
}
.tj-cl-h-title::before{
content: '';position: absolute;left: 0;top: 2px;bottom: 2px;width: 3px;
border-radius: 2px;background: linear-gradient(180deg, var(--cl-accent2), var(--cl-accent));
box-shadow: 0 0 8px var(--cl-aglow);
}
.tj-cl-h-spacer{flex: 1 1 auto;}

.tj-cl-newbtn{
background: transparent;color: var(--cl-accent);
border: 1px solid var(--cl-accent);border-radius: 8px;
padding: 5px 12px;font-size: 13px;cursor: pointer;font-family: inherit;
transition: background .15s;
}
.tj-cl-newbtn:hover{background: var(--cl-soft);}
.tj-cl-xbtn{
background: transparent;color: var(--cl-ink3);border: none;
font-size: 22px;line-height: 1;cursor: pointer;padding: 0 4px;
}
.tj-cl-xbtn:hover{color: var(--cl-ink);}


.tj-cl-body{display: flex;flex: 1 1 auto;min-height: 0;}


.tj-cl-list{
width: 244px;flex: 0 0 auto;overflow-y: auto;
border-right: 1px solid var(--cl-line);background: var(--cl-panel);
}
.tj-cl-item{
position: relative;padding: 12px 14px 12px 24px;cursor: pointer;
border-bottom: 1px solid var(--cl-line2);
}
.tj-cl-item:hover{background: var(--cl-hover);}
.tj-cl-item.sel{background: var(--cl-sel);box-shadow: inset 3px 0 0 var(--cl-accent);}
.tj-cl-dot{
position: absolute;left: 10px;top: 16px;
width: 7px;height: 7px;border-radius: 50%;background: var(--cl-red);
box-shadow: 0 0 6px rgba(255, 107, 107, 0.7);
}
.tj-cl-item-date{font-size: 12px;color: var(--cl-ink3);margin-bottom: 2px;}
.tj-cl-item-title{font-size: 13.5px;color: var(--cl-ink);line-height: 1.35;}
.tj-cl-draft{
font-size: 11px;color: var(--cl-accent2);border: 1px solid var(--cl-line);
border-radius: 4px;padding: 0 4px;margin-left: 4px;white-space: nowrap;
}
.tj-cl-empty{padding: 24px 16px;color: var(--cl-ink3);font-size: 13px;text-align: center;}


.tj-cl-detail{flex: 1 1 auto;overflow-y: auto;padding: 22px 26px;min-width: 0;}
.tj-cl-d-head{display: flex;align-items: center;gap: 8px;margin-bottom: 10px;}
.tj-cl-tag{font-size: 11px;border-radius: 5px;padding: 2px 8px;font-weight: 600;}
.tj-cl-tag-feature{background: rgba(243, 156, 18, 0.16);color: var(--cl-accent2);}
.tj-cl-tag-fix{background: rgba(88, 166, 255, 0.16);color: #79b8ff;}
.tj-cl-tag-notice{background: rgba(52, 211, 153, 0.15);color: #5eead4;}
.tj-cl-d-ver{font-size: 13px;color: var(--cl-accent2);font-weight: 700;font-family: Consolas, monospace;}
.tj-cl-d-date{font-size: 12px;color: var(--cl-ink3);margin-left: auto;}
.tj-cl-d-title{font-size: 19px;font-weight: 700;margin-bottom: 12px;line-height: 1.4;color: var(--cl-ink);}
.tj-cl-d-body{
font-size: 14px;color: var(--cl-body);line-height: 1.8;
white-space: pre-wrap;word-break: break-word;
}
.tj-cl-d-actions{
margin-top: 22px;display: flex;gap: 8px;
border-top: 1px solid var(--cl-line);padding-top: 16px;
}


.tj-cl-editor{display: flex;flex-direction: column;gap: 12px;}
.tj-cl-ed-row{display: flex;align-items: center;gap: 10px;}
.tj-cl-ed-row > label{width: 44px;flex: 0 0 auto;font-size: 13px;color: var(--cl-ink2);}
.tj-cl-ed-row-col{flex-direction: column;align-items: stretch;}
.tj-cl-ed-row-col > label{width: auto;margin-bottom: 2px;}
.tj-cl-inp{
flex: 1 1 auto;background: var(--cl-input);color: var(--cl-ink);
border: 1px solid var(--cl-line);border-radius: 8px;padding: 8px 10px;
font-size: 13.5px;font-family: inherit;
}
.tj-cl-inp:focus{outline: none;border-color: var(--cl-accent);box-shadow: 0 0 0 3px rgba(243, 156, 18, 0.16);}
.tj-cl-ta{min-height: 200px;resize: vertical;line-height: 1.6;}
.tj-cl-ed-notify{
display: flex;align-items: center;gap: 6px;
font-size: 13px;color: var(--cl-ink2);cursor: pointer;
}
.tj-cl-msg{font-size: 12.5px;min-height: 16px;}
.tj-cl-msg.err{color: #ff6b6b;}
.tj-cl-msg.ok{color: #5eead4;}
.tj-cl-ed-actions{margin-top: 4px;display: flex;gap: 8px;justify-content: flex-end;}


.tj-cl-btn{
background: #241c10;color: var(--cl-ink);border: 1px solid var(--cl-line);
border-radius: 8px;padding: 7px 14px;font-size: 13px;cursor: pointer;font-family: inherit;
}
.tj-cl-btn:hover{border-color: var(--cl-accent);background: #2c2212;}
.tj-cl-btn-primary{background: var(--cl-accent);color: #1a1206;border-color: var(--cl-accent);font-weight: 600;}
.tj-cl-btn-primary:hover{background: var(--cl-accent2);}
.tj-cl-btn-danger{color: var(--cl-red);}
.tj-cl-btn-danger:hover{border-color: var(--cl-red);background: rgba(255, 107, 107, 0.10);}
