.detail-panel{position:fixed;top:0;left:0;right:0;bottom:0;display:none;z-index:100000!important}.detail-panel.active{display:flex}.detail-panel-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.7)}.detail-panel-content{position:absolute;top:0;right:0;height:100vh;width:90%;max-width:700px;background:#0f0f0f;border-left:1px solid #2a2a2a;display:flex;flex-direction:column;animation:slideIn .3s ease-out;z-index:100001!important}@keyframes slideIn{from{transform:translateX(100%)}to{transform:translateX(0)}}.detail-panel-header{background:#1a1a1a;border-bottom:1px solid #2a2a2a;padding:1.5rem;display:flex;justify-content:space-between;align-items:center}.detail-panel-title{display:flex;align-items:center;gap:1rem;flex:1}.detail-panel-back{background:0 0;border:none;color:#60a5fa;cursor:pointer;font-size:1rem;padding:.5rem 1rem;transition:color .3s}.detail-panel-back:hover{color:#93c5fd}.detail-panel-title h2{font-size:1.5rem;margin:0}.detail-panel-close{background:0 0;border:none;color:#888;cursor:pointer;font-size:1.5rem;padding:0;transition:color .3s}.detail-panel-close:hover{color:#e0e0e0}.detail-panel-tabs{display:flex;gap:0;border-bottom:1px solid #2a2a2a;background:#1a1a1a;padding:0 1.5rem;align-items:center}.detail-tab-button{padding:1rem 1.5rem;background:0 0;border:none;color:#888;cursor:pointer;font-size:.95rem;font-weight:500;border-bottom:3px solid transparent;transition:all .3s}.detail-tab-button.active{color:#60a5fa;border-bottom-color:#60a5fa}#new-note-quick-action{margin-left:auto;font-size:.85rem;padding:.5rem 1rem;background:#60a5fa;color:#fff;border:none;border-radius:.375rem;cursor:pointer;font-weight:500;transition:background .2s}#new-note-quick-action:hover{background:#3b82f6}.detail-panel-body{flex:1;overflow-y:auto;padding:1.5rem}.detail-tab-content{display:none}.detail-tab-content.active{display:block}.detail-form{display:grid;gap:1.5rem}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-group label{font-weight:500;color:#aaa;font-size:.9rem;text-transform:uppercase;letter-spacing:.05em}.form-input{background:#1a1a1a;border:1px solid #2a2a2a;color:#e0e0e0;padding:.75rem;border-radius:.5rem;font-size:1rem;font-family:inherit;transition:border-color .3s}.form-input:focus{outline:0;border-color:#60a5fa}.form-input:disabled{opacity:.6;cursor:not-allowed}.activity-item{display:flex;gap:1rem;margin-bottom:1rem;padding:1rem;background:#1a1a1a;border-radius:.5rem;border-left:3px solid #60a5fa}.activity-time{color:#888;font-size:.85rem;white-space:nowrap;padding-top:.2rem}.activity-content{flex:1}.activity-title{font-weight:500;margin-bottom:.25rem}.activity-description{color:#aaa;font-size:.9rem}.related-section{margin-bottom:1.5rem}.related-item{background:#1a1a1a;border:1px solid #2a2a2a;padding:1rem;border-radius:.5rem;cursor:pointer;transition:all .3s;margin-bottom:.5rem}.related-item:hover{border-color:#60a5fa;background:#1a1a1a;transform:translateX(4px)}.empty-state{text-align:center;padding:2rem;color:#888}.error-state{background:#1a1a1a;border:1px solid #f87171;padding:1rem;border-radius:.5rem;color:#f87171}.detail-panel-footer{background:#1a1a1a;border-top:1px solid #2a2a2a;padding:1.5rem;display:flex;gap:.75rem;justify-content:flex-end}.detail-panel-footer #detail-edit-controls{display:flex}@media (max-width:768px){.detail-panel-content{width:100%;max-width:none;border-left:none;border-top:1px solid #2a2a2a;bottom:0;top:auto;max-height:90vh;border-radius:16px 16px 0 0;animation:slideUp .3s ease-out}@keyframes slideUp{from{transform:translateY(100%)}to{transform:translateY(0)}}.detail-panel-header{padding:16px}.detail-panel-header h2{font-size:20px}.detail-panel-tabs{padding:0 16px;gap:0;overflow-x:auto;-webkit-overflow-scrolling:touch}.detail-tab-button{padding:12px 16px;font-size:14px;min-height:44px;display:flex;align-items:center;white-space:nowrap}.detail-panel-body{padding:16px;overflow-y:auto;-webkit-overflow-scrolling:touch}.detail-form{gap:12px}.form-group label{font-size:12px}.form-input{font-size:16px!important;padding:12px;min-height:44px}.activity-item{padding:12px;margin-bottom:12px}.detail-panel-footer{padding:12px;flex-direction:column-reverse;gap:8px}.detail-panel-footer button{width:100%;min-height:44px}.detail-panel-title{gap:8px}.detail-panel-back{padding:8px;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center}.detail-panel-close{padding:8px;min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center}}@media (max-width:480px){.detail-panel-header{padding:12px}.detail-panel-header h2{font-size:18px}.detail-panel-tabs{padding:0 12px}.detail-tab-button{padding:10px 12px;font-size:13px;min-height:44px}.detail-panel-body{padding:12px}.form-input{font-size:16px!important;padding:10px}.activity-item{padding:10px;margin-bottom:10px;gap:8px}.activity-time{font-size:12px}.activity-description{font-size:13px}.related-item{padding:12px;margin-bottom:8px}.empty-state{padding:24px 12px;font-size:14px}}