@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap');
:root { color-scheme: light; --ink:#17243a; --muted:#66758b; --line:#dce5f0; --paper:#f5f8fc; --card:#fff; --accent:#4498FF; --accent-soft:#e9f3ff; --accent-dark:#0c4c9c; --error:#b34a43; }
* { box-sizing:border-box; }
html, body { margin:0; min-height:100%; }
body { background:var(--paper); color:var(--ink); font-family:'Manrope',system-ui,sans-serif; user-select:none; -webkit-user-select:none; }
input, textarea { user-select:text; -webkit-user-select:text; }
img { -webkit-user-drag:none; user-drag:none; }
button, input { font:inherit; } button { cursor:pointer; } a { color:inherit; }
.app-shell { width:min(100% - 40px,960px); margin:0 auto; padding:72px 0 80px; }
.hero { max-width:700px; margin-bottom:42px; }
.brand-lockup { display:flex; align-items:center; gap:15px; margin-bottom:27px; }
.brand-mark-shell { display:grid; place-items:center; width:74px; height:74px; flex:none; border:1px solid #b9d8fb; border-radius:21px; background:linear-gradient(145deg,#f5faff 0%,#e5f2ff 100%); box-shadow:0 10px 25px rgba(68,152,255,.17); }
.brand-mark { display:block; width:58px; height:58px; aspect-ratio:1 / 1; object-fit:contain; object-position:center; }
.brand-name { color:#12345a; font-size:clamp(21px,3vw,29px); font-weight:800; letter-spacing:-.055em; line-height:1; }
.brand-name span { color:var(--accent); }
.eyebrow, .step-label { margin:0 0 10px; color:var(--muted); font:500 12px 'DM Mono',monospace; letter-spacing:.12em; text-transform:uppercase; }
h1 { max-width:650px; margin:0; font-size:clamp(38px,7vw,70px); line-height:.99; letter-spacing:-.055em; }
.intro { max-width:610px; margin:24px 0 0; color:var(--muted); font-size:17px; line-height:1.65; }
code { padding:2px 6px; border-radius:5px; background:var(--accent-soft); color:var(--accent-dark); font-family:'DM Mono',monospace; font-size:.86em; }
.decrypt-card { padding:clamp(24px,5vw,48px); border:1px solid var(--line); border-radius:24px; background:var(--card); box-shadow:0 20px 70px rgba(34,56,43,.07); }
.card-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:26px; }
h2 { margin:0; font-size:26px; letter-spacing:-.035em; }
.privacy-badge { display:inline-flex; align-items:center; gap:6px; padding:8px 12px; border-radius:99px; background:var(--accent-soft); color:var(--accent-dark); font-size:12px; font-weight:700; white-space:nowrap; }
.privacy-icon { width:14px; height:14px; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.8; }
.privacy-check { stroke-width:2; }
.mode-switch { display:flex; width:max-content; gap:4px; margin-bottom:18px; padding:4px; border:1px solid var(--line); border-radius:10px; background:#f7faff; }
.mode-button { padding:8px 14px; border:0; border-radius:7px; background:transparent; color:var(--muted); font-size:12px; font-weight:800; }
.mode-button.active { background:var(--accent); color:#fff; box-shadow:0 2px 5px rgba(68,152,255,.22); }
.mode-button.premium-gated { color:#7893ad; }
.mode-button:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.full-access-cta { display:flex; width:100%; align-items:center; justify-content:space-between; gap:16px; margin-bottom:18px; padding:15px 17px; border:1px solid #b9d8fb; border-radius:12px; background:linear-gradient(135deg,#f5faff 0%,#eaf4ff 100%); color:#1769bb; text-align:left; }
.full-access-cta:hover { border-color:var(--accent); background:#e9f3ff; }
.full-access-cta span:first-child { display:grid; gap:3px; }
.full-access-cta strong { font-size:14px; } .full-access-cta small { color:#5a708b; font-size:11px; }
.modal-backdrop { position:fixed; z-index:1000; inset:0; display:grid; place-items:center; padding:20px; background:rgba(14,32,54,.48); backdrop-filter:blur(5px); }
.premium-modal { position:relative; width:min(100%,480px); padding:32px; border:1px solid #c9e0f8; border-radius:20px; background:#fff; box-shadow:0 24px 80px rgba(18,54,93,.25); }
.modal-close { position:absolute; top:13px; right:15px; width:30px; height:30px; border:0; border-radius:50%; background:transparent; color:#7b8da1; font-size:25px; line-height:1; }
.modal-close:hover { background:#eef6ff; color:var(--ink); }
.premium-modal h2 { margin:5px 28px 0 0; color:#183a62; font-size:27px; }
.modal-intro { margin:12px 0 18px; color:#5a708b; font-size:14px; line-height:1.6; }
.premium-card { margin-bottom:18px; padding:22px; border:1px solid #b9d8fb; border-radius:16px; background:linear-gradient(135deg,#f5faff 0%,#eaf4ff 100%); }
.premium-card-topline { display:flex; align-items:center; justify-content:space-between; margin-bottom:9px; }
.premium-label { color:var(--accent-dark); font:500 11px 'DM Mono',monospace; letter-spacing:.1em; text-transform:uppercase; }
.premium-card h3 { margin:0; color:#183a62; font-size:20px; letter-spacing:-.03em; }
.premium-card p { max-width:620px; margin:8px 0 14px; color:#5a708b; font-size:13px; line-height:1.55; }
.premium-benefits { display:flex; flex-wrap:wrap; gap:8px 18px; margin-bottom:16px; color:#35618d; font-size:12px; font-weight:700; }
.purchase-link { display:inline-flex; align-items:center; gap:5px; color:#1769bb; font-size:12px; font-weight:800; text-decoration:none; }
.purchase-link:hover { text-decoration:underline; }
.license-form { display:flex; gap:8px; margin-top:14px; }
.license-form input { min-width:0; flex:1; padding:11px 12px; border:1px solid #b9d2eb; border-radius:8px; outline:none; background:#fff; color:var(--ink); font-size:13px; }
.license-form input:focus { border-color:var(--accent); box-shadow:0 0 0 3px #dcecff; }
.license-form button { padding:11px 17px; border:0; border-radius:8px; background:var(--accent); color:#fff; font-size:13px; font-weight:800; }
.license-form button:hover { background:#2f82e8; }
.license-message { margin:10px 0 0 !important; color:#1769bb !important; font-size:12px !important; }
.premium-unlocked { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:18px; padding:11px 14px; border:1px solid #c8e2b8; border-radius:10px; background:#f2faed; color:#3c7625; font-size:12px; font-weight:800; }
.premium-unlocked small { color:#64835b; font-size:11px; font-weight:500; }
.free-plan-notice { margin:-10px 0 18px; color:var(--muted); text-align:center; font:11px 'DM Mono',monospace; }
.memory-notice { display:flex; align-items:flex-start; gap:10px; margin:0 0 18px; padding:12px 14px; border:1px solid #cfe3fa; border-radius:10px; background:#f4f9ff; color:#4d6784; font-size:12px; line-height:1.5; }
.notice-icon { display:grid; flex:none; place-items:center; width:18px; height:18px; border-radius:50%; background:var(--accent); color:#fff; font-size:12px; font-weight:800; }
.memory-notice strong { color:#24466d; }
.drop-zone { position:relative; display:flex; min-height:202px; align-items:center; justify-content:center; flex-direction:column; border:1.5px dashed #b9c7be; border-radius:16px; background:#fbfdfb; transition:.2s ease; }
.drop-zone:hover, .drop-zone.has-file { border-color:var(--accent); background:#f5faff; }
.drop-zone.free-plan-locked { cursor:not-allowed; opacity:.58; pointer-events:none; }
.upload-icon { display:grid; place-items:center; width:42px; height:42px; margin-bottom:14px; border-radius:50%; background:var(--accent); color:#fff; font-size:26px; line-height:1; }
.drop-title { max-width:90%; overflow:hidden; font-size:17px; font-weight:800; text-overflow:ellipsis; white-space:nowrap; }
.drop-hint { margin-top:7px; color:var(--muted); font-size:13px; }
.file-input { position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer; }
.file-meta { display:flex; justify-content:space-between; gap:12px; margin:11px 2px 0; color:var(--muted); font:12px 'DM Mono',monospace; }
.clear-button { border:0; background:transparent; color:var(--error); font-size:12px; }
.divider { display:flex; align-items:center; gap:14px; margin:34px 0 22px; color:var(--muted); font:500 11px 'DM Mono',monospace; letter-spacing:.08em; text-transform:uppercase; }
.divider::before, .divider::after { height:1px; flex:1; content:''; background:var(--line); }
.field-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.password-field-grid { max-width:520px; }
.field { display:grid; gap:8px; color:var(--ink); font-size:13px; font-weight:700; }
.field small { color:var(--muted); font-size:11px; font-weight:400; }
.field-hint { line-height:1.45; }
.field input { width:100%; padding:13px 14px; border:1px solid var(--line); border-radius:9px; outline:none; background:#fbfdfb; color:var(--ink); font-size:14px; }
.field input:focus { border-color:var(--accent); box-shadow:0 0 0 3px #dcecff; }
.check-row { display:flex; align-items:center; gap:10px; margin-top:16px; color:var(--muted); font-size:13px; }
.check-row input { width:16px; height:16px; accent-color:var(--accent); }
.advanced-toggle { align-items:flex-start; }
.advanced-toggle > span { display:grid; gap:3px; }
.advanced-toggle strong { color:var(--ink); font-size:13px; }
.advanced-toggle small { color:var(--muted); font-size:11px; font-weight:400; }
.advanced-toggle.premium-locked { cursor:pointer; }
.advanced-toggle.premium-locked strong { color:#718096; }
.advanced-options { margin-top:2px; }
.message { margin-top:20px; padding:13px 15px; border-radius:9px; font-size:13px; line-height:1.45; }
.message.error { background:#fff0ed; color:var(--error); } .message.success { background:#eaf4ff; color:#175da9; }
.decrypt-button { display:flex; width:100%; align-items:center; justify-content:center; gap:16px; margin-top:28px; padding:16px 20px; border:0; border-radius:10px; background:var(--accent); color:#fff; font-weight:800; transition:.2s ease; }
.decrypt-button:hover:not(:disabled) { background:#2f82e8; transform:translateY(-1px); } .decrypt-button:disabled { cursor:not-allowed; opacity:.42; }
.spinner { width:16px; height:16px; border:2px solid rgba(255,255,255,.35); border-top-color:#fff; border-radius:50%; animation:spin .7s linear infinite; }
.footnote { margin:15px 0 0; color:var(--muted); text-align:center; font-size:11px; }
.site-footer { margin-top:26px; color:#8a98aa; font:500 11px 'DM Mono',monospace; text-align:center; }
.not-found { padding:80px 24px; text-align:center; }
@keyframes spin { to { transform:rotate(360deg); } }
@media (max-width:640px) { .app-shell { width:min(100% - 28px,960px); padding:38px 0 50px; } .brand-lockup { gap:12px; margin-bottom:23px; } .brand-mark-shell { width:62px; height:62px; border-radius:17px; } .brand-mark { width:49px; height:49px; } .brand-name { font-size:23px; } .card-heading { flex-direction:column; } .privacy-badge { align-self:flex-start; } .field-grid { grid-template-columns:1fr; } .premium-unlocked { align-items:flex-start; flex-direction:column; } .license-form { flex-direction:column; } .license-form button { width:100%; } .premium-modal { padding:28px 22px; } }
#blazor-error-ui { display:none; }