html,body{width:100%;height:100%;overflow:hidden}#root{width:100%;height:100%}:root{--primary-color: #2196f3;--primary-dark: #1976d2;--secondary-color: #455a64;--background-color: #263238;--surface-color: #37474f;--text-color: #eceff1;--text-secondary-color: #90a4ae;--error-color: #ef5350;--success-color: #66bb6a;--border-color: #546e7a;--sidebar-width: 300px;--info-panel-width: 280px;--toolbar-height: auto;--header-height: 60px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;background-color:var(--background-color);color:var(--text-color);min-height:100vh}.dicom-viewer{display:flex;flex-direction:column;min-height:100vh}.viewer-header{display:flex;justify-content:space-between;align-items:center;padding:0 20px;height:var(--header-height);background-color:var(--surface-color);border-bottom:1px solid var(--border-color)}.viewer-header h1{font-size:1.5rem;font-weight:600;color:var(--primary-color)}.server-info{font-size:.875rem;color:var(--text-secondary-color)}.viewer-content{display:flex;flex:1;overflow:hidden}.sidebar{width:var(--sidebar-width);background-color:var(--surface-color);border-right:1px solid var(--border-color);overflow-y:auto}.main-viewer{flex:1;display:flex;flex-direction:column;position:relative}.viewport-container{flex:1;display:flex;align-items:center;justify-content:center;background-color:#000;min-height:400px}.dicom-viewport{width:100%;height:100%;min-height:400px}.placeholder{display:flex;align-items:center;justify-content:center;height:100%;color:var(--text-secondary-color);font-size:1.2rem}.error-message{padding:10px 20px;background-color:var(--error-color);color:#fff;text-align:center}.loading-overlay{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:#000000b3;z-index:100}.loading-spinner{width:50px;height:50px;border:4px solid var(--border-color);border-top-color:var(--primary-color);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-overlay p{margin-top:15px;color:var(--text-color)}.info-panel{width:var(--info-panel-width);background-color:var(--surface-color);border-left:1px solid var(--border-color);overflow-y:auto;padding:15px}.study-list{padding:15px}.study-list h3{margin-bottom:15px;color:var(--primary-color)}.search-container{margin-bottom:15px}.search-input{width:100%;padding:10px;border:1px solid var(--border-color);border-radius:4px;background-color:var(--background-color);color:var(--text-color);font-size:.9rem}.search-input:focus{outline:none;border-color:var(--primary-color)}.loading-indicator{text-align:center;padding:20px;color:var(--text-secondary-color)}.studies-container{display:flex;flex-direction:column;gap:10px}.no-studies{text-align:center;padding:20px;color:var(--text-secondary-color)}.study-card{background-color:var(--background-color);border:1px solid var(--border-color);border-radius:6px;padding:12px;cursor:pointer;transition:all .2s ease}.study-card:hover{border-color:var(--primary-color);transform:translateY(-2px)}.study-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.modality-badge{background-color:var(--primary-color);color:#fff;padding:2px 8px;border-radius:4px;font-size:.75rem;font-weight:600}.study-date{font-size:.8rem;color:var(--text-secondary-color)}.study-info{display:flex;flex-direction:column;gap:4px}.patient-name{font-weight:600;font-size:1rem}.patient-id{font-size:.85rem;color:var(--text-secondary-color)}.study-description{font-size:.9rem;color:var(--text-secondary-color);margin-top:4px}.toolbar{display:flex;flex-wrap:wrap;gap:20px;padding:15px 20px;background-color:var(--surface-color);border-top:1px solid var(--border-color)}.toolbar-section{flex:1;min-width:200px}.toolbar-section h4{margin-bottom:10px;color:var(--primary-color);font-size:.9rem}.control-group{margin-bottom:10px}.control-group label{display:flex;align-items:center;gap:10px;font-size:.85rem}.control-group input[type=range]{flex:1;height:6px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--border-color);border-radius:3px;outline:none}.control-group input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;background:var(--primary-color);border-radius:50%;cursor:pointer}.control-group span{min-width:50px;text-align:right}.presets-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.preset-button{padding:8px 12px;background-color:var(--background-color);border:1px solid var(--border-color);border-radius:4px;color:var(--text-color);cursor:pointer;font-size:.8rem;transition:all .2s ease}.preset-button:hover{background-color:var(--primary-color);border-color:var(--primary-color)}.tools-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.tool-button{padding:10px;background-color:var(--background-color);border:1px solid var(--border-color);border-radius:4px;color:var(--text-color);cursor:pointer;font-size:.85rem;transition:all .2s ease}.tool-button:hover{background-color:var(--primary-color);border-color:var(--primary-color)}.shortcuts-list{list-style:none;font-size:.8rem}.shortcuts-list li{padding:4px 0;color:var(--text-secondary-color)}.patient-info{margin-bottom:20px}.patient-info h3{margin-bottom:15px;color:var(--primary-color)}.info-section{margin-bottom:15px}.info-section h4{margin-bottom:10px;color:var(--text-secondary-color);font-size:.9rem;border-bottom:1px solid var(--border-color);padding-bottom:5px}.info-row{display:flex;justify-content:space-between;padding:6px 0;font-size:.85rem}.info-label{color:var(--text-secondary-color)}.info-value{color:var(--text-color);text-align:right;max-width:60%;word-break:break-all}.info-value.uid{font-size:.7rem;font-family:monospace}.series-selector{margin-top:20px}.series-selector h3{margin-bottom:10px;color:var(--primary-color)}.series-selector select{width:100%;padding:10px;background-color:var(--background-color);border:1px solid var(--border-color);border-radius:4px;color:var(--text-color);font-size:.9rem}.series-selector select:focus{outline:none;border-color:var(--primary-color)}.series-list{display:flex;flex-direction:column;gap:8px}.series-item{display:flex;align-items:center;gap:10px;padding:8px;background-color:var(--background-color);border-radius:4px;font-size:.85rem}.series-number{font-weight:600;color:var(--primary-color)}.series-description{flex:1;color:var(--text-color)}.series-modality{font-size:.75rem;color:var(--text-secondary-color);background-color:var(--surface-color);padding:2px 6px;border-radius:3px}@media(max-width:1200px){.viewer-content{flex-direction:column}.sidebar{width:100%;max-height:300px;border-right:none;border-bottom:1px solid var(--border-color)}.info-panel{width:100%;border-left:none;border-top:1px solid var(--border-color)}}@media(max-width:768px){.viewer-header{flex-direction:column;height:auto;padding:10px 15px;gap:5px}.viewer-header h1{font-size:1.2rem}.toolbar{flex-direction:column;gap:15px}.toolbar-section{min-width:100%}.presets-grid{grid-template-columns:repeat(3,1fr)}.tools-grid{grid-template-columns:repeat(4,1fr)}}@media(max-width:480px){.presets-grid,.tools-grid{grid-template-columns:repeat(2,1fr)}.info-row{flex-direction:column;gap:2px}.info-value{text-align:left;max-width:100%}}