/* Reusable pieces: buttons, cards, tags, fields, notes, toasts, dialogs. */
button{cursor:pointer;border:0}
button:disabled{opacity:.5;cursor:not-allowed}
.muted{color:var(--muted)}
.eyebrow{font-size:.75rem;text-transform:uppercase;letter-spacing:.15em;font-weight:700;margin-bottom:15px}
.btn{display:inline-flex;justify-content:center;align-items:center;gap:12px;padding:13px 20px;min-height:46px;border-radius:9px;background:var(--ink);color:white;font-weight:600;text-decoration:none}
.btn.lime{background:var(--lime);color:var(--ink)}
.btn.white{background:white;color:var(--ink);border:1px solid var(--line)}
.btn.ghost{background:transparent;color:var(--muted);padding:10px}
.row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.between{justify-content:space-between}
.tag{font-size:.76rem;background:#eef2f8;padding:6px 10px;border-radius:6px;color:#52627b;font-weight:600;display:inline-block}
.tag.blue{background:#e9eeff;color:#3457d0}
.tag.lime{background:var(--lime);color:var(--ink)}
.avatar{width:35px;height:35px;border-radius:50%;background:#45546e;display:grid;place-items:center}
.page-head{margin-bottom:26px}
.page-head p{margin-bottom:0;color:var(--muted)}
.card{padding:25px;border:1px solid var(--line);border-radius:17px;background:#fff}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.hero{background:var(--ink);color:#fff;border-radius:20px;padding:33px;display:grid;grid-template-columns:1.25fr .85fr;gap:25px;margin-bottom:24px;overflow:hidden}
.hero .eyebrow{color:var(--lime)}
.hero h2{font-size:2.1rem;line-height:1.12;max-width:460px}
.hero p{color:#b5c5de;font-size:.93rem;max-width:480px}
.section-head{margin:30px 0 18px}
.section-head h2{margin:0}
.note{background:#eaf0ff;color:#3b527d;border-radius:10px;padding:16px 18px;font-size:.88rem;line-height:1.7;margin:20px 0}
.step{flex:1;border-top:3px solid var(--line);padding-top:12px;color:var(--muted);font-size:.8rem}
.step.active{border-color:var(--blue);color:var(--blue);font-weight:700}
.step.done{border-color:#86ac43}
.field{display:block;margin:18px 0}
.field>span{display:block;margin-bottom:9px;font-size:.88rem;font-weight:600}
textarea{min-height:85px;resize:vertical}
:focus-visible{outline:3px solid #829dff;outline-offset:3px}
.score{font-size:2.8rem;letter-spacing:-.07em;font-weight:750}
.score span{font-size:.9rem;letter-spacing:0;color:var(--muted);font-weight:400}
.bar{height:7px;border-radius:5px;background:#e5ebf4;margin:13px 0 19px;overflow:hidden}
.bar i,.bar>span{display:block;height:100%;background:var(--blue)}
.quote{border-left:3px solid var(--blue);padding:4px 0 4px 15px;color:#465a7a;font-size:.92rem;margin:17px 0}
.plot{width:100%;height:auto}
.legend{font-size:.8rem;color:var(--muted);display:flex;gap:15px;flex-wrap:wrap}
.divider{border-top:1px solid var(--line);margin:23px 0}
.filter{display:flex;gap:7px;flex-wrap:wrap;margin:20px 0}
.filter button{padding:10px 13px;border:1px solid var(--line);border-radius:8px;background:white;color:var(--muted);font-size:.85rem}
.filter button.active{background:var(--ink);color:#fff}
.source{display:flex;flex-direction:column}
.source h3{margin:17px 0 8px}
.source p{font-size:.89rem;color:var(--muted);margin-top:15px}
.source a{font-size:.87rem;font-weight:600;margin-top:auto;padding-top:16px;text-decoration:none}
.source a:hover{text-decoration:underline}
.price{font-size:2.8rem;font-weight:750;letter-spacing:-.06em;margin:20px 0 7px}
.price span{font-size:.85rem;font-weight:400;color:var(--muted);letter-spacing:0}
.plan ul{font-size:.9rem;line-height:2;padding-left:20px;min-height:170px}
.plan .btn{width:100%}
.featured{border:2px solid var(--blue)}
.toggle{display:inline-flex;background:#e5ebf3;padding:5px;border-radius:10px;margin-bottom:25px;gap:5px}
.toggle button{background:transparent;color:var(--muted);padding:10px 15px;border-radius:7px}
.toggle button.active{background:white;color:var(--ink)}
.history{padding:20px 0;border-bottom:1px solid var(--line)}
.history p{font-size:.87rem;margin:8px 0;color:var(--muted)}
.empty{text-align:center;padding:35px 20px}
.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,12px);padding:15px 22px;background:var(--ink);color:white;border:1px solid #5b6a81;border-radius:10px;max-width:90%;z-index:5;box-shadow:0 5px 30px #0003;font-size:.9rem;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease,transform .18s ease,visibility .18s}
.toast.show{opacity:1;visibility:visible;transform:translate(-50%,0)}
dialog{max-width:480px;width:calc(100% - 35px);border:1px solid var(--line);border-radius:16px;padding:30px;color:var(--ink)}
dialog::backdrop{background:#101c3c99}
dialog p{color:var(--muted)}
table{width:100%;border-collapse:collapse;font-size:.85rem}
th,td{padding:10px;border-bottom:1px solid var(--line);text-align:left}
.hidden-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}