*,:before,:after{box-sizing:border-box;margin:0;padding:0}.hidden{display:none!important}:root{--bg-primary:#0a0a12;--bg-secondary:#12121f;--bg-panel:#161625;--bg-hover:#1e1e32;--bg-input:#1a1a2e;--border:#2a2a44;--border-light:#3a3a55;--text-primary:#e8e8f0;--text-secondary:#9898b0;--text-muted:#6a6a82;--accent-pink:#f472b6;--accent-blue:#60a5fa;--accent-green:#34d399;--accent-purple:#a78bfa;--status-test-now:#22c55e;--status-high-potential:#3b82f6;--status-interesting:#a855f7;--status-niche:#f59e0b;--status-revisit:#6b7280;--status-not-recommended:#ef4444;--radius:8px;--radius-sm:4px;--shadow:0 4px 24px #0006;--transition:.2s ease}html,body{background:var(--bg-primary);height:100%;color:var(--text-primary);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;overflow:hidden}#app{flex-direction:column;height:100vh;display:flex}#topbar{background:var(--bg-secondary);border-bottom:1px solid var(--border);z-index:10;flex-shrink:0;justify-content:space-between;align-items:center;padding:10px 20px;display:flex}.topbar-left{align-items:baseline;gap:12px;display:flex}.topbar-left h1{background:linear-gradient(135deg, var(--accent-pink), var(--accent-blue), var(--accent-green));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:18px;font-weight:700}.subtitle{color:var(--text-muted);letter-spacing:.5px;font-size:12px}.topbar-right{gap:8px;display:flex}.topbar-right button{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-panel);color:var(--text-secondary);cursor:pointer;transition:var(--transition);padding:6px 14px;font-size:12px}.topbar-right button:hover{background:var(--bg-hover);color:var(--text-primary);border-color:var(--border-light)}.topbar-right button.active{border-color:var(--accent-blue);color:var(--accent-blue)}#main-content{flex:1;display:flex;overflow:hidden}#sidebar{background:var(--bg-secondary);border-right:1px solid var(--border);flex-shrink:0;width:260px;min-width:260px;padding:8px 0;overflow-y:auto}#sidebar::-webkit-scrollbar{width:5px}#sidebar::-webkit-scrollbar-track{background:0 0}#sidebar::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}.sidebar-section{border-bottom:1px solid var(--border);padding:12px 14px}.section-header{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.section-header h3{text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted);font-size:13px;font-weight:600}.axis-selector{color:var(--text-muted);text-transform:uppercase;letter-spacing:.8px;cursor:pointer;background:0 0;border:none;flex:1;min-width:0;padding:2px 0;font-size:12px;font-weight:600}.axis-selector:focus{outline:none}.axis-selector option{background:var(--bg-panel);color:var(--text-primary);text-transform:none;letter-spacing:0;font-size:13px}[data-slot="0"] .axis-selector{color:var(--accent-pink)}[data-slot="1"] .axis-selector{color:var(--accent-blue)}[data-slot="2"] .axis-selector{color:var(--accent-green)}.btn-icon{border:1px solid var(--border);border-radius:var(--radius-sm);width:24px;height:24px;color:var(--text-muted);cursor:pointer;transition:var(--transition);background:0 0;justify-content:center;align-items:center;font-size:14px;display:flex}.btn-icon:hover{background:var(--bg-hover);color:var(--text-primary);border-color:var(--border-light)}.axis-list{list-style:none}.axis-list li{border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;transition:var(--transition);align-items:center;gap:6px;padding:5px 6px;font-size:13px;display:flex}.axis-list li:hover{background:var(--bg-hover);color:var(--text-primary)}.axis-list li.active{background:var(--bg-hover);color:var(--text-primary);font-weight:600}#axis-0-list li.active{border-left:2px solid var(--accent-pink)}#axis-1-list li.active{border-left:2px solid var(--accent-blue)}#axis-2-list li.active{border-left:2px solid var(--accent-green)}#axis-reset-link{border-bottom:1px solid var(--border);padding:8px 14px}#axis-reset-link button{border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--accent-blue);cursor:pointer;width:100%;transition:var(--transition);background:0 0;padding:4px 12px;font-size:12px}#axis-reset-link button:hover{background:var(--bg-hover);border-color:var(--accent-blue)}.axis-list li .dot{border-radius:50%;flex-shrink:0;width:6px;height:6px}.axis-list li .remove-btn{opacity:0;color:var(--text-muted);cursor:pointer;transition:var(--transition);background:0 0;border:none;margin-left:auto;padding:0 2px;font-size:14px}.axis-list li:hover .remove-btn{opacity:.7}.axis-list li .remove-btn:hover{opacity:1;color:var(--status-not-recommended)}#axis-0-list li .dot{background:var(--accent-pink)}#axis-1-list li .dot{background:var(--accent-blue)}#axis-2-list li .dot{background:var(--accent-green)}.filter-group{margin-bottom:10px}.filter-group label{color:var(--text-muted);margin-bottom:4px;font-size:11px;display:block}.filter-group select,.filter-group input[type=range]{width:100%}.filter-group select{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);padding:5px 8px;font-size:12px}.filter-group input[type=range]{-webkit-appearance:none;background:var(--border);border-radius:2px;outline:none;height:4px;margin-top:4px}.filter-group input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--accent-blue);cursor:pointer;border-radius:50%;width:14px;height:14px}#collections-list{list-style:none}#collections-list li{border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer;transition:var(--transition);align-items:center;gap:8px;padding:4px 6px;font-size:12px;display:flex}#collections-list li:hover{background:var(--bg-hover);color:var(--text-primary)}#collections-list li.active{background:var(--bg-hover);color:var(--accent-blue);border-left:2px solid var(--accent-blue)}#collections-list li .collection-count{color:var(--text-muted);background:var(--bg-input);border-radius:8px;margin-left:auto;padding:1px 6px;font-size:10px}#cube-stats{color:var(--text-secondary);font-size:12px;line-height:1.8}#cube-stats .stat-row{justify-content:space-between;display:flex}#cube-stats .stat-value{color:var(--text-primary);font-weight:500}#cube-container{background:var(--bg-primary);flex:1;position:relative;overflow:hidden}#cube-canvas{width:100%;height:100%;display:block}#tooltip{pointer-events:none;background:var(--bg-panel);border:1px solid var(--border-light);border-radius:var(--radius);max-width:280px;box-shadow:var(--shadow);z-index:20;padding:10px 14px;font-size:12px;line-height:1.5;position:absolute}#tooltip .tooltip-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;font-size:10px}#tooltip .tooltip-value{color:var(--text-primary);margin-bottom:4px}#cube-instructions{color:var(--text-muted);pointer-events:none;opacity:.7;background:#0a0a12b3;border-radius:20px;padding:6px 16px;font-size:11px;position:absolute;bottom:16px;left:50%;transform:translate(-50%)}.cube-label{white-space:nowrap;-webkit-user-select:none;user-select:none;pointer-events:none;font-size:12px}.cube-label.axis-title{text-transform:uppercase;letter-spacing:1px;opacity:.9;font-size:14px;font-weight:700}.cube-label.item-label{opacity:.7;font-size:11px}#detail-panel{background:var(--bg-secondary);border-left:1px solid var(--border);flex-shrink:0;width:380px;min-width:380px;transition:transform .3s,opacity .3s;overflow-y:auto}.panel-header{border-bottom:1px solid var(--border);background:var(--bg-secondary);z-index:5;justify-content:space-between;align-items:center;padding:14px 18px;display:flex;position:sticky;top:0}.panel-header h2{font-size:14px;font-weight:600}#detail-content{padding:14px 18px}#detail-content>div{margin-bottom:20px}#detail-content h3{text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted);margin-bottom:8px;font-size:13px;font-weight:600}.detail-intersection{background:var(--bg-panel);border-radius:var(--radius);border:1px solid var(--border);padding:14px}.detail-field{margin-bottom:10px}.detail-field:last-child{margin-bottom:0}.detail-field label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:2px;font-size:10px;display:block}.detail-field p{color:var(--text-primary);font-size:14px;line-height:1.4}.detail-field:first-child p{color:var(--accent-pink)}.detail-field:nth-child(2) p{color:var(--accent-blue)}.detail-field:nth-child(3) p{color:var(--accent-green)}.detail-concept{background:var(--bg-panel);border-radius:var(--radius);border:1px solid var(--border);padding:14px}.detail-concept p{color:var(--text-secondary);font-size:13px;font-style:italic;line-height:1.5}.rating-grid{flex-direction:column;gap:6px;display:flex}.rating-row{grid-template-columns:120px 1fr 28px;align-items:center;gap:8px;display:grid}.rating-row label{color:var(--text-secondary);font-size:13px}.rating-row input[type=range]{-webkit-appearance:none;background:var(--border);border-radius:2px;outline:none;width:100%;height:3px}.rating-row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--accent-purple);cursor:pointer;border-radius:50%;width:12px;height:12px}.rating-val{color:var(--text-muted);text-align:right;font-variant-numeric:tabular-nums;font-size:11px}.overall-score{border-top:1px solid var(--border);justify-content:space-between;align-items:center;margin-top:10px;padding-top:10px;font-size:13px;display:flex}.overall-score strong{color:var(--accent-purple);font-size:18px}.status-buttons{flex-wrap:wrap;gap:6px;display:flex}.status-btn{border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--bg-input);color:var(--text-secondary);cursor:pointer;transition:var(--transition);padding:5px 10px;font-size:11px}.status-btn:hover{border-color:var(--border-light)}.status-btn.active{font-weight:600}.status-btn.active.test-now{border-color:var(--status-test-now);color:var(--status-test-now);background:#22c55e1a}.status-btn.active.high-potential{border-color:var(--status-high-potential);color:var(--status-high-potential);background:#3b82f61a}.status-btn.active.interesting{border-color:var(--status-interesting);color:var(--status-interesting);background:#a855f71a}.status-btn.active.niche{border-color:var(--status-niche);color:var(--status-niche);background:#f59e0b1a}.status-btn.active.revisit{border-color:var(--status-revisit);color:var(--status-revisit);background:#6b72801a}.status-btn.active.not-recommended{border-color:var(--status-not-recommended);color:var(--status-not-recommended);background:#ef44441a}#detail-notes{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);width:100%;color:var(--text-primary);resize:vertical;min-height:60px;padding:10px;font-family:inherit;font-size:12px}#detail-notes:focus{border-color:var(--accent-blue);outline:none}.collection-add-row{gap:8px;display:flex}.collection-add-row select{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);flex:1;padding:5px 8px;font-size:12px}.btn-small{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-input);color:var(--text-secondary);cursor:pointer;transition:var(--transition);padding:5px 10px;font-size:11px}.btn-small:hover{background:var(--bg-hover);color:var(--text-primary)}.btn-primary{background:linear-gradient(135deg, var(--accent-purple), var(--accent-blue));border-radius:var(--radius);color:#fff;cursor:pointer;transition:var(--transition);border:none;justify-content:center;align-items:center;gap:6px;width:100%;padding:8px 18px;font-size:13px;font-weight:500;display:inline-flex}.btn-primary:hover{opacity:.9;transform:translateY(-1px)}.btn-primary:active{transform:translateY(0)}#ai-loading{color:var(--text-muted);align-items:center;gap:10px;padding:16px;font-size:12px;display:flex}.spinner{border:2px solid var(--border);border-top-color:var(--accent-purple);border-radius:50%;width:18px;height:18px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}#ai-output{margin-top:12px}#ai-output .ai-section{margin-bottom:14px}#ai-output .ai-section-title{color:var(--accent-purple);text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px;font-size:11px;font-weight:600}#ai-output .ai-section-content{color:var(--text-secondary);font-size:12px;line-height:1.6}#ai-output .ai-list{padding:0;list-style:none}#ai-output .ai-list li{border-bottom:1px solid var(--border);color:var(--text-secondary);padding:4px 0;font-size:12px}#ai-output .ai-list li:last-child{border-bottom:none}#ai-output .ai-demo-badge{color:var(--status-niche);background:#f59e0b26;border-radius:3px;margin-bottom:10px;padding:2px 6px;font-size:9px;display:inline-block}.modal{z-index:100;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0009;position:absolute;inset:0}.modal-content{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);width:480px;max-width:90vw;max-height:80vh;position:relative;overflow-y:auto}.modal-small{width:380px}.modal-wide{width:720px;max-height:85vh}.my-work-filters{margin-left:auto;margin-right:12px}.my-work-filters select{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);padding:4px 8px;font-size:12px}#my-work-list{flex-direction:column;gap:10px;display:flex}#my-work-empty p{text-align:center;color:var(--text-muted);padding:40px 20px;font-size:14px}.work-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;transition:var(--transition);padding:14px 16px}.work-card:hover{border-color:var(--border-light);background:var(--bg-hover)}.work-card-axes{flex-wrap:wrap;gap:6px;margin-bottom:8px;display:flex}.work-card-axis{border:1px solid var(--border);background:#ffffff0d;border-radius:3px;padding:2px 8px;font-size:11px}.work-card-axis .axis-name{text-transform:uppercase;letter-spacing:.5px;opacity:.6;margin-bottom:1px;font-size:9px;display:block}.work-card-axis:first-child{border-color:#f472b64d}.work-card-axis:nth-child(2){border-color:#60a5fa4d}.work-card-axis:nth-child(3){border-color:#34d3994d}.work-card-axis:first-child .axis-name{color:var(--accent-pink)}.work-card-axis:nth-child(2) .axis-name{color:var(--accent-blue)}.work-card-axis:nth-child(3) .axis-name{color:var(--accent-green)}.work-card-concept{color:var(--text-secondary);margin-bottom:8px;font-size:13px;font-style:italic;line-height:1.4}.work-card-meta{color:var(--text-muted);align-items:center;gap:10px;font-size:11px;display:flex}.work-card-badge{border-radius:3px;padding:2px 8px;font-size:10px;font-weight:600}.work-card-badge.has-ai{color:var(--accent-purple);background:#a78bfa26}.work-card-badge.status-badge{font-size:10px}.modal-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.modal-header h2{font-size:16px;font-weight:600}.modal-body{padding:20px}.modal-body label{color:var(--text-muted);margin-top:12px;margin-bottom:4px;font-size:12px;display:block}.modal-body label:first-child{margin-top:0}.modal-body input[type=text],.modal-body input[type=password],.modal-body textarea{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);width:100%;color:var(--text-primary);padding:8px 12px;font-family:inherit;font-size:13px}.modal-body input:focus,.modal-body textarea:focus{border-color:var(--accent-blue);outline:none}.modal-actions{justify-content:flex-end;gap:8px;margin-top:16px;display:flex}.btn-cancel{border:1px solid var(--border);border-radius:var(--radius);color:var(--text-secondary);cursor:pointer;transition:var(--transition);background:0 0;padding:8px 18px;font-size:13px}.btn-cancel:hover{background:var(--bg-hover)}.setting-group{border-bottom:1px solid var(--border);margin-bottom:20px;padding-bottom:16px}.setting-group:last-child{border-bottom:none}.setting-group h3{color:var(--text-primary);margin-bottom:4px;font-size:12px;font-weight:600}.checkbox-label{cursor:pointer;align-items:center;gap:8px;color:var(--text-secondary)!important;font-size:13px!important;display:flex!important}.checkbox-label input[type=checkbox]{width:auto}.setting-actions{flex-wrap:wrap;gap:8px;margin-top:16px;display:flex}.setting-actions button{border:1px solid var(--border);border-radius:var(--radius);background:var(--bg-input);color:var(--text-secondary);cursor:pointer;transition:var(--transition);padding:8px 18px;font-size:13px}.setting-actions button:hover{background:var(--bg-hover);color:var(--text-primary)}.setting-actions .btn-primary{border:none}#detail-panel::-webkit-scrollbar{width:5px}#detail-panel::-webkit-scrollbar-track{background:0 0}#detail-panel::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}@media (width<=1100px){#sidebar{width:220px;min-width:220px}#detail-panel{width:320px;min-width:320px}}@media (width<=800px){#main-content{flex-direction:column}#sidebar{width:100%;min-width:unset;border-right:none;border-bottom:1px solid var(--border);max-height:200px;display:flex;overflow-x:auto}.sidebar-section{border-bottom:none;border-right:1px solid var(--border);min-width:200px}#detail-panel{width:100%;min-width:unset;border-left:none;border-top:1px solid var(--border);max-height:50vh}}