:root{--bg: #0b1020;--bg-soft: #141a30;--panel: #1b2240;--panel-2: #232c52;--text: #eef1fb;--muted: #9aa3c7;--accent: #0a84ff;--accent-2: #6f6cff;--success: #2ee6a6;--danger: #ff5c7c;--radius: 18px;--shadow: 0 10px 40px rgba(0, 0, 0, .35);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-top: env(safe-area-inset-top, 0px)}*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:radial-gradient(1200px 600px at 50% -10%,#1a2348 0%,var(--bg) 60%);color:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}#app{min-height:100%;max-width:640px;margin:0 auto;padding:calc(16px + var(--safe-top)) 16px calc(28px + var(--safe-bottom))}header.app-header{display:flex;align-items:center;gap:10px;margin-bottom:18px}header.app-header .logo{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,var(--accent),var(--accent-2));display:grid;place-items:center;font-weight:800;color:#fff}header.app-header h1{font-size:18px;margin:0;font-weight:700;letter-spacing:-.01em}header.app-header .sub{color:var(--muted);font-size:12px}.card{background:linear-gradient(180deg,var(--panel),var(--bg-soft));border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow);margin-bottom:16px}.muted{color:var(--muted)}.center{text-align:center}.row{display:flex;align-items:center;gap:10px}.between{justify-content:space-between}.wrap{flex-wrap:wrap}.spacer{flex:1}.btn{appearance:none;border:1px solid rgba(255,255,255,.12);background:var(--panel-2);color:var(--text);font-size:15px;font-weight:600;padding:12px 16px;border-radius:12px;cursor:pointer;transition:transform .06s ease,background .15s ease,opacity .15s ease;-webkit-tap-highlight-color:transparent}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn.primary{background:linear-gradient(135deg,var(--accent),var(--accent-2));border-color:transparent;color:#fff}.btn.danger{background:#3a1322;border-color:#ff5c7c66;color:var(--danger)}.btn.block{width:100%}.btn.lg{padding:15px 18px;font-size:16px}.dropzone{border:2px dashed rgba(255,255,255,.16);border-radius:var(--radius);padding:28px 18px;text-align:center;background:#ffffff05;transition:border-color .15s ease,background .15s ease}.dropzone.active{border-color:var(--accent);background:#0a84ff14}.dropzone .big{font-size:40px;line-height:1;margin-bottom:8px}.dropzone h2{margin:0 0 4px;font-size:17px}.dropzone p{margin:0;color:var(--muted);font-size:13px}input[type=password],input[type=text]{width:100%;padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:var(--bg-soft);color:var(--text);font-size:16px}label.field{display:block;margin-bottom:14px}label.field>span{display:block;margin-bottom:6px;font-size:13px;color:var(--muted)}ul.file-list{list-style:none;padding:0;margin:12px 0 0}ul.file-list li{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;background:#ffffff08;margin-bottom:8px}.file-thumb{width:44px;height:44px;border-radius:10px;object-fit:cover;background:var(--panel-2);flex:0 0 auto}.file-meta{flex:1;min-width:0}.file-meta .name{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-meta .sub{font-size:12px;color:var(--muted)}.progress{height:6px;width:100%;background:#ffffff14;border-radius:999px;overflow:hidden;margin-top:6px}.progress>span{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-2));width:0%;transition:width .2s ease}.progress.done>span{background:var(--success)}.progress.err>span{background:var(--danger)}.badge{font-size:11px;font-weight:700;padding:3px 8px;border-radius:999px;background:#ffffff14;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.badge.ok{background:#2ee6a629;color:var(--success)}.badge.err{background:#ff5c7c29;color:var(--danger)}.share-link{display:flex;align-items:center;gap:10px;background:var(--bg-soft);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:10px 12px}.share-link code{flex:1;min-width:0;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text)}#qrcode{display:block;margin:14px auto 0;max-width:220px;width:60%}.empty{text-align:center;color:var(--muted);padding:40px 12px}.banner{border-radius:12px;padding:12px 14px;margin-bottom:14px;font-size:14px}.banner.error{background:#ff5c7c1f;color:var(--danger);border:1px solid rgba(255,92,124,.3)}.banner.info{background:#0a84ff1f;color:#a9c9ff;border:1px solid rgba(10,132,255,.3)}a{color:var(--accent)}.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.stat{background:#ffffff08;border-radius:12px;padding:12px}.stat .v{font-size:18px;font-weight:700}.stat .k{font-size:12px;color:var(--muted)}.switch{position:relative;display:inline-block;width:46px;height:26px;flex:0 0 auto}.switch input{opacity:0;width:0;height:0}.switch .slider{position:absolute;cursor:pointer;inset:0;background:#ffffff26;border-radius:999px;transition:background .18s ease}.switch .slider:before{content:"";position:absolute;height:20px;width:20px;left:3px;top:3px;background:#fff;border-radius:50%;transition:transform .18s ease}.switch input:checked+.slider{background:linear-gradient(135deg,var(--accent),var(--accent-2))}.switch input:checked+.slider:before{transform:translate(20px)}.preview-overlay{position:fixed;inset:0;z-index:1000;background:#050812f0;display:flex;flex-direction:column;padding:calc(8px + var(--safe-top)) 8px calc(8px + var(--safe-bottom))}.preview-bar{display:flex;align-items:center;gap:8px;padding:6px 8px 10px;color:var(--text)}.preview-bar .pname{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.preview-stage{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;border-radius:14px;overflow:hidden;background:#0000004d}.preview-stage img{max-width:100%;max-height:100%;object-fit:contain}.preview-stage video{max-width:100%;max-height:100%;width:100%;background:#000}.preview-stage iframe{width:100%;height:100%;border:0;background:#fff}
