@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap";body{margin:0;font-family:Inter,sans-serif;display:flex;justify-content:center;align-items:center;min-height:100vh;background-color:#dce3ee;background-image:radial-gradient(circle at 15% 50%,rgba(120,255,214,.4),transparent 25%),radial-gradient(circle at 85% 30%,rgba(255,175,189,.4),transparent 30%),radial-gradient(circle at 90% 80%,rgba(200,220,255,.6),transparent 30%),radial-gradient(circle at 30% 80%,rgba(255,230,150,.4),transparent 30%),radial-gradient(circle at 50% 50%,rgba(200,200,255,.2),transparent 50%);background-attachment:fixed}.app{text-align:center;padding:40px;max-width:500px;width:90%;margin:40px auto;background:#ffffff59;backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px);border:1px solid rgba(255,255,255,.6);border-radius:24px;box-shadow:0 8px 32px #0000001a}h1{margin-bottom:20px;color:#1f2937;font-weight:600;font-size:24px}p{color:#4b5563;font-size:14px;margin-bottom:20px}.logo{max-width:100%;height:auto;width:100px;margin-bottom:20px;opacity:.9}.mode-toggle{display:flex;justify-content:center;gap:10px;margin-bottom:25px}.mode-toggle button{padding:10px 16px;background-color:#fff6;color:#4b5563;border:1px solid rgba(255,255,255,.5);border-radius:12px;cursor:pointer;font-size:14px;font-weight:500;transition:all .3s ease}.mode-toggle button:hover{background-color:#ffffffb3}.mode-toggle button.active{background-color:#fff;color:#1f2937;box-shadow:0 4px 12px #0000000d;border-color:#fff}.upload-section{display:flex;flex-direction:column;gap:15px;margin-bottom:30px}.upload-section input[type=file],.upload-section input[type=text]{padding:14px;border:1px solid rgba(255,255,255,.6);border-radius:12px;font-size:15px;background:#fff9;color:#1f2937;transition:all .3s ease}.upload-section input[type=text]:focus{outline:none;background:#fff;box-shadow:0 0 0 3px #2563eb33}.upload-section button{padding:15px 20px;background-color:#2563eb;color:#fff;border:none;border-radius:12px;cursor:pointer;font-size:16px;font-weight:600;transition:all .3s ease;box-shadow:0 4px 12px #2563eb4d}.upload-section button:hover{background-color:#1d4ed8;transform:translateY(-1px)}.document-preview{margin-top:30px;display:flex;flex-direction:column;align-items:center;gap:20px;background:#fff6;padding:20px;border-radius:16px;border:1px solid rgba(255,255,255,.5)}.document-image{max-width:100%;height:auto;border-radius:8px;box-shadow:0 4px 12px #0000001a}.qr-code-section{display:flex;flex-direction:column;align-items:center;gap:10px;background:#fff;padding:20px;border-radius:16px;box-shadow:0 4px 12px #0000000d}.qr-code-section p{margin:0;font-size:14px;color:#6b7280;font-weight:500}.qr-code-section img{width:250px;height:250px}.action-buttons{display:flex;gap:15px;justify-content:center;flex-wrap:wrap;width:100%}.document-preview .download-btn{flex:1;padding:14px 20px;background-color:#2563eb;color:#fff;border:none;border-radius:12px;cursor:pointer;font-size:15px;font-weight:600;transition:all .3s ease;box-shadow:0 4px 12px #2563eb4d}.document-preview .download-btn:hover{background-color:#1d4ed8}.document-preview .create-new-btn{padding:14px 20px;background-color:#fff9;color:#dc2626;border:1px solid rgba(255,255,255,.8);border-radius:12px;cursor:pointer;font-size:15px;font-weight:600;transition:all .3s ease}.document-preview .create-new-btn:hover{background-color:#fff;color:#b91c1c}canvas{background-color:#fff}footer{margin-top:30px;font-size:13px;color:#6b7280}footer:before{content:"© "}@media (max-width: 600px){.app{padding:30px 20px}.action-buttons{flex-direction:column}.document-preview .download-btn,.document-preview .create-new-btn{width:100%}.mode-toggle{flex-direction:column}}
