*{font-family:Arial,sans-serif}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spinner{animation:spin 1s linear infinite;border-radius:50%;border:2px solid transparent;border-bottom-color:currentColor;display:inline-block}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#a1a1a1}.drag-item{transition:all .2s ease;cursor:grab}.drag-item:active{cursor:grabbing}.drag-item:hover{border-color:#3b82f6!important;transform:translateY(-1px);box-shadow:0 2px 8px #3b82f633}.drop-zone{transition:all .2s ease;position:relative;border:2px dashed #d1d5db;padding:.5rem;border-radius:.375rem;min-height:30px;display:flex;align-items:center;justify-content:center}.drop-zone.drag-over{border-color:#3b82f6!important;background-color:#dbeafe!important;transform:scale(1.02)}.drop-zone.has-answer{border-color:#16a34a!important;background-color:#dcfce7!important}.question-container{background-color:transparent;border-radius:0;border:none;box-shadow:none;padding:0;margin:0}.question-header{margin-bottom:.75rem;color:#1f2937;font-size:1rem;line-height:1.5;font-weight:600}.question-number{margin-right:.5rem;font-weight:700;color:#000}.instruction-box{margin-bottom:1rem;padding:.75rem;border-radius:.5rem;font-size:.875rem;font-weight:700;background-color:transparent;border:none;padding-left:0;color:#000}.instruction-multiple-choice,.instruction-note-form,.instruction-matching-headings,.instruction-matching-options,.instruction-map-plan{color:#000}.note-form-template{padding:1rem;background-color:transparent;border-radius:.375rem;border:none;line-height:1.6;font-size:1.05rem;margin-bottom:.75rem;color:#1f2937}.note-form-blank{display:inline-block;margin:0 .25rem;width:80px;padding:.25rem .5rem;border:2px solid #d1d5db;border-radius:.25rem;font-size:1rem;text-align:center;background-color:#fff}.note-form-blank:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.option-item{display:flex;align-items:center;gap:.75rem;padding:.5rem;cursor:pointer;border-radius:.25rem;transition:background-color .2s ease}.option-item:hover{background-color:#f8fafc}.option-item.selected{background-color:#dbeafe}.option-checkbox,.option-radio{width:1rem;height:1rem;accent-color:#3b82f6}.option-label{color:#374151;font-size:.95rem}.option-letter{font-weight:600;color:#6b7280;margin-right:.5rem}.available-items{margin-bottom:1rem;padding:1rem;background-color:transparent;border-radius:.5rem;border:none;padding-left:0}.available-items-title{font-size:.9rem;font-weight:600;color:#374151;margin-bottom:.75rem}.items-grid{display:flex;flex-direction:column;gap:.5rem}.draggable-item{padding:.5rem .75rem;background-color:#fff;border:2px solid #d1d5db;border-radius:.375rem;font-size:.875rem;box-shadow:0 1px 3px #0000001a}.item-letter{font-weight:600;margin-right:.5rem}.paragraph-container{padding:.5rem;background-color:transparent;border-radius:.375rem;border:none;margin-bottom:.5rem;font-size:.95rem;line-height:1.5;padding-left:0}.answer-display{padding:.5rem .75rem;background-color:#16a34a;color:#fff;border-radius:.375rem;font-weight:500;font-size:.875rem}.placeholder-text{color:#9ca3af;font-size:.875rem}.matching-paragraph-dropzone{display:flex;align-items:flex-start;gap:.75rem;padding:.75rem;border:2px dashed #d1d5db;border-radius:.375rem;margin-bottom:.75rem;transition:all .2s ease}.matching-paragraph-dropzone.drag-over{border-color:#3b82f6!important;background-color:#eff6ff!important;transform:scale(1.01)}.matching-paragraph-dropzone.has-answer{border-color:#16a34a!important;background-color:#f0fdf4!important}.paragraph-text-container{flex:1;color:#374151;font-size:.95rem;line-height:1.5}.answer-box{width:40px;height:40px;display:flex;align-items:center;justify-content:center}.answer-placeholder{width:32px;height:32px;border:2px solid #9ca3af;border-radius:.25rem;background-color:#f3f4f6}.answer-display-inline{padding:.5rem;background-color:#16a34a;color:#fff;border-radius:.375rem;font-weight:600;font-size:1rem;min-width:32px;text-align:center}.map-container{margin-bottom:1rem;text-align:center}.map-image{max-width:100%;max-height:700px;width:auto;height:auto}.location-question{margin-bottom:1rem}.location-input{width:70%;padding:.5rem;border:2px solid #d1d5db;border-radius:.375rem;font-size:1rem;box-sizing:border-box}.location-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.audio-controls{display:flex;align-items:center;gap:1rem;background-color:#fff;padding:.5rem 1rem;border-radius:.5rem;border:none;box-shadow:none}.volume-control{display:flex;align-items:center;gap:.5rem}.volume-slider{width:80px;accent-color:#000000}.volume-percentage{font-size:.75rem;color:#6b7280;min-width:3rem}.audio-status{font-size:.75rem;font-weight:500;padding:.25rem .5rem;border-radius:.25rem}.audio-playing{color:#16a34a;background-color:#dcfce7}.audio-finished{color:#6b7280;background-color:#f3f4f6}.audio-ready,.audio-paused{color:#f59e0b;background-color:#fef3c7}.progress-container{background-color:#f1f5f9;padding:.75rem 1rem;border-bottom:1px solid #d1d5db}.progress-inner{max-width:800px;margin:0 auto}.progress-controls{display:flex;align-items:center;gap:1rem}.progress-filename{font-size:.875rem;color:#374151;min-width:6rem}.progress-track-container{flex:1;display:flex;flex-direction:column;gap:.25rem}.progress-track{width:100%;height:.375rem;background-color:#e5e7eb;border-radius:.25rem;overflow:hidden}.progress-bar{height:100%;background-color:#3b82f6;border-radius:.25rem;transition:width .1s ease}.progress-times{display:flex;justify-content:space-between;font-size:.75rem;color:#6b7280}.question-nav{display:flex;gap:.25rem;flex-wrap:wrap;align-items:center}.section-nav{display:flex;align-items:center;gap:.5rem;background-color:#fff;padding:.25rem;border-radius:.375rem;border:1px solid #d1d5db;margin-right:1rem}.section-btn{padding:.375rem .75rem;border:none;border-radius:.25rem;font-size:.75rem;font-weight:500;cursor:pointer;transition:all .2s ease}.section-btn.active{background-color:#3b82f6;color:#fff}.section-btn.inactive{background-color:#f8fafc;color:#374151}.section-btn.inactive:hover{background-color:#e2e8f0}.section-range{font-size:.625rem;opacity:.8}.question-btn{width:1.75rem;height:1.75rem;font-size:.75rem;border-radius:.25rem;border:none;cursor:pointer;font-weight:500}.question-answered{background-color:#16a34a;color:#fff}.question-current{background-color:#e5e7eb;color:#4b5563;border:2px solid #3b82f6}.question-other{background-color:#f3f4f6;color:#4b5563}.timer{font-size:1.25rem;font-weight:700;min-width:4rem;text-align:center}.timer-normal{color:#2d3748}.timer-warning{color:#dc2626}.timer-overtime{color:#10b981}.header{background-color:#f8fafc;padding:.75rem 1rem;border-bottom:1px solid #e2e8f0;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:100}.header-left h2{font-size:1.125rem;font-weight:600;color:#1f2937;margin:0}.header-left p{color:#4b5563;font-size:.875rem;margin:.25rem 0 0}.main-content{flex:1;overflow-y:auto;padding:1rem;max-width:900px;margin:0 auto;width:100%}.section-title{font-size:1.5rem;font-weight:600;color:#1f2937;text-align:center;margin-bottom:1.5rem}.questions-container{display:flex;flex-direction:column;gap:.5rem}.bottom-bar{border-top:1px solid #d1d5db;background-color:#f3f4f6;padding:.5rem 1rem;display:flex;align-items:center;justify-content:space-between}.bottom-right{display:flex;gap:.5rem;align-items:center}.developer-link{padding:.375rem .75rem;border-radius:.25rem;font-weight:500;background-color:#3b82f6;color:#fff;cursor:pointer;border:none;font-size:.75rem;text-decoration:none}.submit-btn{padding:.5rem 1.25rem;border-radius:.375rem;font-weight:600;border:none;font-size:.875rem;cursor:pointer}.submit-btn.enabled{background-color:#16a34a;color:#fff}.submit-btn.disabled{background-color:#9ca3af;color:#fff;cursor:not-allowed}.submit-spinner{width:.75rem;height:.75rem;border:2px solid transparent;border-bottom-color:#fff;margin-right:.5rem}.warning-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;background-color:#f3f4f6}.warning-card{background-color:#fff;padding:2rem;border-radius:.5rem;box-shadow:0 10px 25px #0000001a;max-width:600px;text-align:center}.warning-icon{font-size:3rem;margin-bottom:1rem}.warning-title{font-size:1.75rem;font-weight:700;color:#1f2937;margin-bottom:1rem}.test-info{margin-top:-10px;background-color:#f0f9ff;padding:1rem;border-radius:.5rem;margin-bottom:1.5rem;border:1px solid #bfdbfe}.test-info-title{margin-top:1px;font-size:1.125rem;font-weight:600;color:#1e40af;margin-bottom:.75rem}.test-info-grid{display:flex;flex-direction:column;gap:.5rem;font-size:.875rem}.test-info-row{display:flex;justify-content:space-between}.test-info-label{font-weight:500;color:#374151}.test-info-value{color:#1e40af;font-weight:600}.important-notice{margin-top:-10px;background-color:#fef3c7;padding:1rem;border-radius:.5rem;margin-bottom:1.5rem;border:1px solid #fbbf24}.notice-title{margin-top:-1px;font-size:1rem;font-weight:600;color:#92400e;margin-bottom:.5rem}.notice-text{color:#92400e;font-size:.875rem;margin:0;text-align:left;line-height:1.5}.link-share{display:flex;align-items:center;justify-content:center;gap:.5rem;background-color:#f1f5f9;padding:.75rem;border-radius:.375rem;margin-bottom:1.5rem;font-size:.875rem}.link-share-label{color:#4a5568;font-weight:500}.link-share-input{flex:1;border:none;background-color:transparent;color:#2d3748;cursor:pointer;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.copy-btn{background-color:#3b82f6;color:#fff;padding:.375rem .75rem;border-radius:.25rem;font-size:.75rem;cursor:pointer;border:none;font-weight:500}.action-buttons{display:flex;gap:1rem;justify-content:center}.start-btn{background-color:#16a34a;color:#fff;padding:.875rem 2rem;border-radius:.375rem;cursor:pointer;font-weight:600;border:none;font-size:1rem;box-shadow:0 2px 4px #0000001a}.home-btn{background-color:#6b7280;color:#fff;padding:.875rem 1.5rem;border-radius:.375rem;cursor:pointer;font-weight:500;border:none;font-size:1rem}.loading-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;background-color:#fff}.loading-content{text-align:center}.loading-spinner{width:3rem;height:3rem;border:2px solid transparent;border-bottom-color:#ef4444;margin:0 auto 1rem}.loading-text{color:#4b5563}.error-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;background-color:#fff}.error-card{text-align:center;background-color:#fff;padding:2rem;border-radius:.5rem;box-shadow:0 4px 6px #0000001a}.error-icon{color:#ef4444;font-size:1.25rem;margin-bottom:1rem}.error-title{font-size:1.25rem;font-weight:600;color:#1f2937;margin-bottom:.5rem}.error-text{color:#4b5563;margin-bottom:1rem}.back-btn{background-color:#dc2626;color:#fff;padding:.5rem 1rem;border-radius:.25rem;cursor:pointer;border:none}.highlighted-text{transition:background-color .2s ease}.highlighted-text:hover{background-color:#fbbf24!important}@media (max-width: 768px){.header{flex-direction:column;gap:.5rem;align-items:flex-start}.audio-controls{flex-direction:column;gap:.5rem}.section-nav{flex-wrap:wrap}.question-nav{justify-content:center}.bottom-bar{flex-direction:column;gap:.5rem}}