body {margin: 0;padding: 0;min-height: 100vh;background: #000;position: relative;overflow: hidden;}
#camera {
    width: 100vw;
    height: 100vh;
    object-fit: cover;
    transform: rotate(0deg) scaleX(1); 
    transition: transform 0.3s;
}
.hint {position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);color: white;font-size: 1.1em;background: rgba(0,0,0,0.8);padding: 15px 20px;border-radius: 8px;display: none;max-width: 90%;text-align: center;line-height: 1.4;}
.button-container {position: fixed;bottom: 20px;left: 50%;transform: translateX(-50%);display: flex;gap: 15px;opacity: 1;transition: opacity 0.3s, transform 0.3s;}
.capture-button {width: 70px;height: 70px;border-radius: 50%;background: rgba(255,255,255,0.2);border: none;cursor: pointer;font-size: 16px;color: white;display: flex;align-items: center;justify-content: center;box-shadow: 0 2px 8px rgba(0,0,0,0.4);backdrop-filter: blur(10px);transition: all 0.2s;}
.capture-button:hover {background: rgba(255,255,255,0.3);transform: scale(1.05);}
#blindModeToggle {position: absolute;top: 10px;left: 10px;z-index: 10;}
#voiceToggle {position: absolute;top: 10px;right: 10px;z-index: 10;}
.toggle-group {display: flex;align-items: center;gap: 5px;padding: 5px 10px;background: rgba(255,255,255,0.15);border-radius: 4px;color: white;font-size: 13px;cursor: pointer;transition: all 0.2s;}
.toggle-group input[type="checkbox"] {width: 18px;height: 18px;accent-color: #4a90e2;}
#resultText {position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);color: white;font-size: 1.1em;background: rgba(0,0,0,0.9);padding: 15px 20px;border-radius: 8px;max-width: 90%;max-height: 80%;overflow-y: auto;display: none;line-height: 1.5;tabindex: -1;}
#resultText:focus {outline: 2px solid #4a90e2;}
.spinner {width: 16px;height: 16px;border: 2px solid rgba(255,255,255,0.3);border-top-color: white;border-radius: 50%;animation: spin 1s linear infinite;}
@keyframes spin {to {transform: rotate(360deg);}}