:root{--primary-color: #4285F4;--background-color: #f8f9fa;--text-color: #3c4043;--border-color: #dee2e6;--box-color: rgba(66, 133, 244, .8);--box-shadow: 0 1px 3px rgba(0,0,0,.12), 0 1px 2px rgba(0,0,0,.24)}*{box-sizing:border-box}body{font-family:Roboto,sans-serif;margin:0;background-color:var(--background-color);color:var(--text-color);display:flex;justify-content:center;align-items:flex-start;min-height:100vh;padding:1rem}@media(min-width:576px){body{padding:2rem}}#root{width:100%;max-width:1400px}h1{font-size:1.75rem;font-weight:500;margin-bottom:.5rem}p{color:#5f6368;margin-top:0;margin-bottom:2rem}.upload-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:300px;border:2px dashed var(--border-color);border-radius:8px;padding:2rem}input[type=file]{display:none}.image-container{position:relative;max-width:100%;margin:0 auto;line-height:0;overflow:auto;border:1px solid var(--border-color);border-radius:8px;box-shadow:var(--box-shadow);background-color:#f1f3f4;text-align:center;height:100%}.zoom-wrapper{transform-origin:center;transition:transform .2s ease-out;display:inline-block;vertical-align:top;position:relative}.image-container img{max-width:100%;max-height:70vh;display:block}.bounding-box{position:absolute;border:2px solid var(--box-color);cursor:move;z-index:10;transition:border .2s ease-in-out}.bounding-box.highlighted{border:3px solid #fbbc05;z-index:12}.bounding-box.selected{border:3px solid #dc3545;z-index:13}.bounding-box:hover .box-label{opacity:1}.box-label{position:absolute;bottom:100%;left:-2px;background-color:var(--box-color);color:#fff;padding:4px 8px;font-size:12px;white-space:nowrap;border-radius:4px 4px 0 0;opacity:0;transition:opacity .2s;display:flex;flex-direction:column;align-items:flex-start;gap:2px;line-height:1.2}.box-label span{text-align:left}.english-text{font-weight:700}.phonetic-text{font-style:italic;color:#090202}.resize-handle{position:absolute;width:10px;height:10px;background-color:#fff;border:1px solid var(--box-color);border-radius:50%;z-index:11}.resize-handle.tl{top:-5px;left:-5px;cursor:nwse-resize}.resize-handle.tr{top:-5px;right:-5px;cursor:nesw-resize}.resize-handle.bl{bottom:-5px;left:-5px;cursor:nesw-resize}.resize-handle.br{bottom:-5px;right:-5px;cursor:nwse-resize}.loader-container{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#ffffffd9;display:flex;justify-content:center;align-items:center;z-index:20;border-radius:8px}.zoom-controls{background-color:#ffffffe6;border-radius:20px;box-shadow:var(--box-shadow);display:flex;align-items:center;gap:.5rem;padding:.5rem}.zoom-controls button{width:30px;height:30px;border-radius:50%;border:1px solid var(--border-color);background-color:#fff;color:var(--text-color);font-size:1.2rem;font-weight:700;cursor:pointer;display:flex;justify-content:center;align-items:center;line-height:1;padding:0;transition:background-color .2s}.zoom-controls button:hover:not(:disabled){background-color:#f1f3f4}.zoom-controls button:disabled{opacity:.5;cursor:not-allowed}.zoom-controls span{font-size:.9rem;font-weight:500;min-width:40px;text-align:center;color:var(--text-color)}.info-container{border:1px solid var(--border-color);border-radius:8px;background-color:#fff;text-align:left;display:flex;flex-direction:column}.info-container h2{font-size:1.25rem;margin:0;text-align:center;font-weight:500;padding:1rem;border-bottom:1px solid var(--border-color);color:#000}.table-wrapper{max-height:550px;overflow-y:auto;overflow-x:auto;flex-grow:1}.info-table th,.info-table td{text-align:left;line-height:1.4;word-break:break-word;vertical-align:middle}.info-table th{font-weight:500;position:sticky;top:0;z-index:1}.info-table tbody tr.selected-row>td,.info-table tbody tr.selected-row>th{background-color:#cfe2ff}.info-table td input{width:100%;border:1px solid transparent;background-color:transparent;padding:0;margin:0;border-radius:3px;padding:.375rem .75rem;margin:-.375rem -.75rem;color:#3c4043}.info-table td input:focus{outline:none;border-color:var(--primary-color);background-color:#fff;box-shadow:0 0 0 .25rem #0d6efd40}.action-cell{width:1%;white-space:nowrap;text-align:center}.clear-api-button{white-space:nowrap}@media(max-width:600px){h1{font-size:1.5rem}p{margin-bottom:1.5rem}}