/* Forms, buttons, glass */
.glass-card{background:color-mix(in oklab,var(--surface) 92%,transparent);border:1px solid var(--border);border-radius:20px;box-shadow:0 30px 60px -30px rgba(0,0,0,.35);backdrop-filter:blur(20px)}
.field{display:flex;flex-direction:column;gap:.4rem;margin-bottom:1rem}
.field>span{font-size:.78rem;font-weight:600;color:var(--fg-muted);letter-spacing:.04em}
.field input,.field select,.field textarea{background:var(--surface-2);border:1px solid var(--border);color:var(--fg);padding:.7rem .85rem;border-radius:10px;font:inherit;font-size:.92rem;transition:.15s;width:100%}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in oklab,var(--brand) 25%,transparent)}
.field textarea{resize:vertical;min-height:90px}
.checkbox{display:flex;align-items:center;gap:.55rem;font-size:.85rem;color:var(--fg-muted);margin-bottom:1rem;cursor:pointer}
.hint{font-size:.75rem;color:var(--fg-muted);margin:.75rem 0 0}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem}
.form-actions{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:1rem}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.65rem 1.2rem;border-radius:10px;border:1px solid var(--border);background:var(--surface-2);color:var(--fg);font:inherit;font-size:.88rem;font-weight:600;cursor:pointer;transition:transform .15s,box-shadow .15s,background .15s;text-decoration:none}
.btn:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(0,0,0,.15);text-decoration:none}
.btn:active{transform:none}
.btn:disabled{opacity:.6;cursor:not-allowed;transform:none}
.btn-primary{background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;border-color:transparent;box-shadow:0 10px 24px -12px color-mix(in oklab,var(--brand) 60%,transparent)}
.btn-ghost{background:transparent}
.btn-danger{background:linear-gradient(135deg,#dc2626,#ef4444);color:#fff;border-color:transparent}
.btn-block{width:100%}
.btn-sm{padding:.4rem .75rem;font-size:.8rem}

.theme-toggle{position:absolute;top:1rem;right:1rem;width:34px;height:34px;border-radius:10px;border:1px solid var(--border);background:var(--surface-2);color:var(--fg);cursor:pointer;font-size:1rem}

/* Filter bar */
.filters{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:1rem;align-items:end}
.filters .field{margin:0;min-width:160px}

/* Tabs */
.tabs{display:flex;gap:.25rem;border-bottom:1px solid var(--border);margin-bottom:1rem;overflow-x:auto}
.tabs button{background:none;border:none;padding:.7rem 1rem;color:var(--fg-muted);font:inherit;font-size:.88rem;font-weight:600;cursor:pointer;border-bottom:2px solid transparent;white-space:nowrap}
.tabs button.active{color:var(--fg);border-bottom-color:var(--brand)}

/* Template gallery */
.template-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.25rem}
.template-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;overflow:hidden;transition:.2s;cursor:pointer}
.template-card:hover{transform:translateY(-4px);box-shadow:0 20px 40px -20px rgba(0,0,0,.4)}
.template-card.selected{outline:2px solid var(--brand);outline-offset:2px}
.template-card__preview{aspect-ratio:1.414/1;background:#fff;position:relative;overflow:hidden}
.template-card__meta{padding:1rem}
.template-card__meta h4{margin:0;font-size:.98rem}
.template-card__meta p{margin:.25rem 0 0;font-size:.8rem;color:var(--fg-muted)}

/* Certificate preview */
.cert-stage{background:linear-gradient(135deg,var(--surface),var(--surface-2));border:1px solid var(--border);border-radius:16px;padding:1.25rem;display:flex;align-items:center;justify-content:center;min-height:520px}
.cert-canvas{width:100%;max-width:900px;aspect-ratio:1.414/1;background:#fff;color:#111;border-radius:8px;box-shadow:0 25px 60px rgba(0,0,0,.3);position:relative;overflow:hidden;transform-origin:center;font-family:'Georgia','Times New Roman',serif}
.cert-canvas *{box-sizing:border-box}

/* Editor split */
.split{display:grid;grid-template-columns:360px 1fr;gap:1.5rem;align-items:start}
@media(max-width:1080px){.split{grid-template-columns:1fr}}

/* Chart placeholder container */
.chart-box{position:relative;height:280px}

/* File upload */
.file-drop{display:flex;align-items:center;gap:1rem;padding:1rem;border:1px dashed var(--border);border-radius:12px;background:var(--surface-2);cursor:pointer;transition:.2s}
.file-drop:hover{border-color:var(--brand);background:color-mix(in oklab,var(--brand) 8%,var(--surface-2))}
.file-drop input{display:none}
.file-drop__preview{width:56px;height:56px;border-radius:10px;background:var(--surface);display:flex;align-items:center;justify-content:center;overflow:hidden;border:1px solid var(--border)}
.file-drop__preview img{width:100%;height:100%;object-fit:contain}
.file-drop__meta strong{display:block;font-size:.88rem}
.file-drop__meta span{font-size:.75rem;color:var(--fg-muted)}

/* Signatory rows */
.sig-row{display:grid;grid-template-columns:80px 1fr 1fr auto;gap:.75rem;align-items:center;padding:.75rem;background:var(--surface-2);border-radius:12px;margin-bottom:.5rem}
.sig-row .sig-thumb{width:70px;height:50px;background:var(--surface);border:1px dashed var(--border);border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:.7rem;color:var(--fg-muted);overflow:hidden}
.sig-row .sig-thumb img{max-height:100%;max-width:100%}
@media(max-width:640px){.sig-row{grid-template-columns:1fr}}

/* Empty state */
.empty{text-align:center;padding:3rem 1rem;color:var(--fg-muted)}
.empty svg,.empty .icon{font-size:2.5rem;opacity:.6;margin-bottom:1rem}

/* Chip row */
.chip{display:inline-flex;align-items:center;padding:.25rem .6rem;border-radius:999px;background:var(--surface-2);border:1px solid var(--border);font-size:.75rem;color:var(--fg-muted)}