:root{--bg: #0b1020;--panel: #10182e;--panel-soft: #0f1430;--border: #1f2a44;--accent: #6ea8fe;--accent-weak: #3b82f6;--text: #e8eefc;--muted: #97a4c0;--danger: #ef4343;--shadow: 0 10px 30px rgba(0,0,0,.25);--radius: 14px;--radius-sm: 10px;--gap: 14px;--topbar: 60px}*{box-sizing:border-box}html,body,#app{height:100%;margin:0;background:linear-gradient(180deg,#0a0f1f,#0d1330);color:var(--text);font:14px/1.45 system-ui,-apple-system,Segoe UI,Roboto,Arial}.page{min-height:100vh;display:flex;flex-direction:column}.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:12px;height:var(--topbar);padding:12px 16px;background:#0a1022b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid rgba(255,255,255,.06)}.brand{font-weight:700;letter-spacing:.3px}.actions{margin-left:auto;display:flex;gap:10px;align-items:center}.toggle{color:var(--muted);display:flex;gap:8px;align-items:center}.split{display:grid;grid-template-columns:1.2fr .8fr;gap:var(--gap);padding:var(--gap);height:calc(100vh - var(--topbar))}.left{overflow:auto;padding-right:4px}.right{display:flex;flex-direction:column;min-height:0}.preview-bar{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:10px;padding:10px 12px;margin-bottom:8px;background:#10182ebf;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}.preview-bar .spacer{flex:1}iframe{display:block;width:100%;flex:1;min-height:0;border:1px solid var(--border);background:#0b1226;border-radius:var(--radius);box-shadow:var(--shadow)}.card{background:radial-gradient(1200px 400px at -10% -20%,rgba(110,168,254,.12),transparent 40%),linear-gradient(180deg,#ffffff0a,#ffffff05);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:14px;margin-bottom:var(--gap)}.card.soft{background:linear-gradient(180deg,#ffffff08,#ffffff04);border-radius:var(--radius-sm)}.card-title{font-weight:650;margin-bottom:10px;display:flex;align-items:center;gap:10px}.card-title.with-action{justify-content:space-between}.subcard{margin-top:10px;padding:10px;background:#ffffff08;border:1px dashed var(--border);border-radius:var(--radius-sm)}.subcard-title{display:flex;align-items:center;justify-content:space-between;color:var(--muted);margin-bottom:8px}label{display:flex;flex-direction:column;gap:6px;color:var(--muted)}input,select,textarea{background:#0d1530;color:var(--text);border:1px solid var(--border);padding:10px 12px;border-radius:10px;outline:none}input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px #6ea8fe26}textarea{resize:vertical}.grid{display:grid;gap:10px}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.span-3{grid-column:1 / -1}.list-rows{display:flex;flex-direction:column;gap:8px}.row{display:flex;gap:10px;align-items:center}.w-40{width:40%}.w-100{flex:1}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--muted)}.btn{border:1px solid var(--border);background:linear-gradient(180deg,#ffffff0a,#ffffff05);color:var(--text);padding:8px 12px;border-radius:10px;cursor:pointer;transition:transform .06s ease,box-shadow .2s ease,border-color .2s ease,background .2s ease}.btn:hover{transform:translateY(-1px);border-color:#ffffff40}.btn:active{transform:translateY(0)}.btn.ghost{background:transparent}.btn.primary{border-color:var(--accent-weak);background:linear-gradient(180deg,#6ea8fe40,#6ea8fe26)}.btn.danger{border-color:#ef434380;background:linear-gradient(180deg,#ef434333,#ef434314);color:#ffecec}.btn.danger.ghost{background:transparent;color:#ffbcbc;border-color:#ef434366}.toggle input{transform:translateY(1px)}.chip{font-size:12px;color:var(--text);background:linear-gradient(180deg,#ffffff14,#ffffff0a);border:1px solid var(--border);padding:4px 8px;border-radius:999px}.error{margin-top:10px;color:#ffb4b4;background:#ef434314;border:1px solid rgba(239,67,67,.35);border-radius:10px;padding:10px}.pdf-frame{display:block;width:100%;flex:1;min-height:0;border:1px solid var(--border);background:#0b1226;border-radius:var(--radius);box-shadow:var(--shadow)}.photo-upload{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:16px;border:1px dashed var(--border);border-radius:var(--radius);background:#ffffff05;text-align:center}.photo-title{font-size:12px;color:var(--muted);margin-top:-4px}.photo-preview{display:flex;flex-direction:column;align-items:center;gap:8px}.photo-preview img{display:block;width:180px;height:180px;object-fit:cover;border-radius:10px;border:1px solid var(--border);box-shadow:var(--shadow)}.photo-dropzone{display:flex;align-items:center;justify-content:center;width:200px;height:180px;border:2px dashed var(--border);border-radius:12px;color:var(--muted);cursor:pointer}.auto-preview{display:flex;align-items:center;gap:6px;font-size:14px;color:var(--text);cursor:pointer;-webkit-user-select:none;user-select:none}.auto-preview input[type=checkbox]{appearance:none;width:18px;height:18px;border:2px solid var(--border);border-radius:4px;background:var(--bg-dark);transition:background .2s,border-color .2s}.auto-preview input[type=checkbox]:checked{background:var(--accent);border-color:var(--accent);background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 7l2.5 2.5L11 4' stroke='white' stroke-width='2'/%3E%3C/svg%3E");background-position:center;background-repeat:no-repeat}.auto-preview input[type=checkbox]:hover{border-color:var(--accent)}@media (max-width: 1100px){.split{grid-template-columns:1fr}.right{order:-1;margin-bottom:var(--gap)}}@media (max-width: 720px){.grid-3{grid-template-columns:1fr}.w-40{width:100%}}
