:root {
    --bg:#EEEEF7; --surface:#FFFFFF; --border:#DDDDF0;
    --text-1:#0A0A1E; --text-2:#6060A0; --text-3:#9090C0;
    --accent:#5040E8; --accent-soft:rgba(80,64,232,.10);
    --err:#EF4444; --ok:#10B981; --warn:#F59E0B;
}
@media (prefers-color-scheme:dark) {
    :root {
        --bg:#07070F; --surface:#111122; --border:#1C1C38;
        --text-1:#DCDCF4; --text-2:#7A7AA8; --text-3:#48487A;
        --accent:#7B6FFF; --accent-soft:rgba(123,111,255,.12);
    }
}
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
body { font-family:system-ui,-apple-system,'Segoe UI',sans-serif; background:var(--bg); color:var(--text-1); min-height:100vh; }
input, textarea, select, button { font:inherit; color:inherit; }
input, textarea, select {
    width:100%; padding:10px 12px; background:var(--bg); border:1.5px solid var(--border);
    border-radius:10px; outline:none; transition:border-color .15s;
}
input:focus, textarea:focus, select:focus { border-color:var(--accent); }
textarea { resize:vertical; min-height:120px; }

.btn { border:none; border-radius:10px; padding:9px 16px; cursor:pointer; font-weight:600; font-size:.875rem; transition:opacity .15s, transform .15s; background:var(--accent-soft); color:var(--accent); }
.btn:hover { opacity:.85; }
.btn-primary { background:var(--accent); color:#fff; }
.btn-danger { background:rgba(239,68,68,.1); color:var(--err); }
.btn-generate { background:linear-gradient(135deg,#6B48FF,#C044CC); color:#fff; }
.btn-icon { padding:7px 10px; }

.card { background:var(--surface); border:1px solid var(--border); border-radius:16px; }
.logo { font-size:1.375rem; font-weight:800; letter-spacing:-.02em; }
.logo span { color:var(--accent); }
.subtitle { font-size:.875rem; color:var(--text-2); }

.login-body { display:flex; align-items:center; justify-content:center; padding:24px; }
.login-card { width:100%; max-width:360px; padding:32px; display:flex; flex-direction:column; gap:14px; }
.alert { padding:10px 14px; border-radius:8px; font-size:.875rem; background:rgba(239,68,68,.1); color:var(--err); }
.back { text-align:center; font-size:.8125rem; color:var(--text-3); text-decoration:none; }

.wrap { max-width:900px; margin:0 auto; padding:24px 16px 80px; }
header { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:20px; flex-wrap:wrap; }
header nav { display:flex; gap:8px; flex-wrap:wrap; }

.quick-add { display:flex; gap:8px; padding:12px; margin-bottom:16px; }
.quick-add input { flex:1; }

.toolbar { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:16px; }
.toolbar input { flex:1; min-width:180px; }
.toolbar select { width:auto; }
.filters { display:flex; gap:6px; }
.chip { border:1px solid var(--border); background:var(--surface); border-radius:999px; padding:6px 12px; font-size:.8125rem; cursor:pointer; color:var(--text-2); }
.chip.active { background:var(--accent); border-color:var(--accent); color:#fff; }

.list { display:flex; flex-direction:column; gap:10px; }
.idea { padding:14px 16px; display:flex; gap:14px; align-items:flex-start; }
.idea.is-generated { opacity:.75; }
.idea.is-done { opacity:.5; }
.idea-icon { font-size:1.75rem; line-height:1; }
.idea-body { flex:1; min-width:0; }
.idea-title { font-weight:700; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.idea-desc { font-size:.875rem; color:var(--text-2); margin-top:4px; white-space:pre-wrap; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.idea-meta { font-size:.75rem; color:var(--text-3); margin-top:6px; }
.idea-actions { display:flex; gap:6px; flex-shrink:0; }
.badge { font-size:.6875rem; font-weight:600; padding:2px 8px; border-radius:999px; }
.p-high { background:rgba(239,68,68,.12); color:var(--err); }
.p-medium { background:rgba(245,158,11,.12); color:var(--warn); }
.p-low { background:var(--accent-soft); color:var(--accent); }
.s-generated { background:rgba(16,185,129,.12); color:var(--ok); }
.s-done { background:var(--border); color:var(--text-2); }
.empty { text-align:center; color:var(--text-3); padding:48px 0; }

.modal { position:fixed; inset:0; background:rgba(0,0,0,.45); display:flex; align-items:center; justify-content:center; padding:16px; z-index:10; }
.modal[hidden] { display:none; }
.modal-card { width:100%; max-width:560px; max-height:90vh; overflow:auto; padding:24px; display:flex; flex-direction:column; gap:12px; }
.modal-card h2 { font-size:1.125rem; }
.row { display:flex; gap:8px; }
.row .icon-input { width:64px; text-align:center; }
label { font-size:.8125rem; color:var(--text-2); display:flex; flex-direction:column; gap:4px; }
.modal-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:4px; }
.toast { position:fixed; bottom:20px; left:50%; transform:translateX(-50%); background:var(--text-1); color:var(--bg); padding:10px 18px; border-radius:10px; font-size:.875rem; z-index:20; }

@media (max-width:600px) {
    .idea { flex-wrap:wrap; }
    .idea-actions { width:100%; justify-content:flex-end; }
}
.logo { display:flex; align-items:center; gap:10px; }
.logo-img { width:36px; height:36px; border-radius:10px; }
.login-card .logo { justify-content:center; }

.modal-confirm { z-index:15; backdrop-filter:blur(3px); }
.modal:not([hidden]) .modal-card { animation:pop .16s ease-out; }
@keyframes pop { from { opacity:0; transform:scale(.96) translateY(6px); } }
.confirm-card { max-width:400px; text-align:center; align-items:center; }
.confirm-icon { width:56px; height:56px; border-radius:50%; background:rgba(239,68,68,.12); display:flex; align-items:center; justify-content:center; font-size:1.5rem; }
.confirm-idea { display:flex; align-items:center; gap:8px; padding:8px 14px; border-radius:10px; background:var(--bg); border:1px solid var(--border); max-width:100%; }
.confirm-idea strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.confirm-text { font-size:.875rem; color:var(--text-2); }
.confirm-actions { width:100%; justify-content:stretch; }
.confirm-actions .btn { flex:1; }
.btn-danger-solid { background:var(--err); color:#fff; }