/* App pages (dashboard, preferences, features, admin, connect, legal). */
*{box-sizing:border-box}
body{font:16px/1.5 system-ui,sans-serif;margin:0;color:oklch(23% .012 150);background:oklch(96.8% .006 120)}
.wrap{max-width:32rem;margin:0 auto;padding:1rem 1.1rem 4rem}
h1{font-size:1.45rem;margin:.6rem 0;letter-spacing:-.01em}
h2{font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:oklch(52% .02 150);margin:1.8rem 0 .5rem}
.card{background:oklch(99.2% .003 120);border:1px solid oklch(90.5% .01 120);border-radius:14px;padding:.8rem 1rem;margin:.5rem 0;box-shadow:0 1px 2px oklch(0% 0 0/.04)}
.row{display:flex;justify-content:space-between;align-items:center;gap:.5rem;padding:.5rem 0;border-bottom:1px solid oklch(94.5% .006 120)}
.row:last-child{border:0}
.muted{color:oklch(54% .015 150)}
.btn{display:inline-block;background:#1f7a3d;color:#fff;border:0;border-radius:10px;padding:.7rem 1.1rem;font:inherit;font-weight:500;cursor:pointer;text-decoration:none;transition:background-color .15s ease-out}
.btn:hover{background:#1a6a35}
.btn:active{background:#175e2f}
.btn.sec{background:transparent;color:#1f7a3d;border:1px solid oklch(80% .06 150)}
.btn.sec:hover{background:oklch(95.5% .02 150)}
a{color:#1f7a3d}
:where(button,a):focus-visible{outline:2px solid #1f7a3d;outline-offset:2px}
input,textarea{font:inherit;padding:.55rem .6rem;border:1px solid oklch(86% .008 120);border-radius:8px;min-width:0;background:oklch(99.2% .003 120)}
input:focus,textarea:focus{border-color:#1f7a3d;outline:none;box-shadow:0 0 0 2px oklch(48% .12 150/.18)}
textarea{width:100%;resize:vertical}
.add{display:flex;gap:.4rem;margin:.5rem 0}
.add input.n{flex:1}
.add input.q{width:3.5rem}
.del,.edit{background:none;border:0;line-height:1;cursor:pointer;padding:.55rem .4rem;margin:-.4rem 0;border-radius:8px;transition:background-color .15s ease-out}
.del{color:#b3372c;font-size:1.15rem}
.edit{color:oklch(54% .015 150);font-size:.95rem}
.del:hover,.edit:hover{background:oklch(93.5% .008 120)}
.soon{color:#a15c00}
.expired{color:#b3372c;font-weight:500}
.card.ok{background:oklch(95.5% .03 150);border-color:oklch(85% .05 150)}
.chips{display:flex;flex-wrap:wrap;gap:.3rem;align-items:center;border:1px solid oklch(86% .008 120);border-radius:8px;padding:.3rem .4rem;margin-top:.3rem;background:oklch(99.2% .003 120);cursor:text}
.chips:focus-within{border-color:#1f7a3d;box-shadow:0 0 0 2px oklch(48% .12 150/.18)}
.chip{display:inline-flex;align-items:center;gap:.25rem;background:oklch(93% .04 150);border-radius:6px;padding:.1rem .45rem;font-size:.9rem}
.chip button{background:none;border:0;cursor:pointer;padding:0 .1rem;color:oklch(40% .05 150);font-size:1rem;line-height:1}
.chips input{border:0;background:transparent;flex:1;min-width:5rem;padding:.25rem}
.chips input:focus{box-shadow:none}
.actions{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin:1rem 0}