:root{--p-bg: #f1f1f1;--p-surface: #ffffff;--p-surface-subdued: #fafbfb;--p-border: #e1e3e5;--p-border-strong: #c9cccf;--p-text: #202223;--p-text-subdued: #6d7175;--p-primary: #008060;--p-primary-hover: #006e52;--p-critical: #d72c0d;--p-warning: #ffc453;--p-info: #2c6ecb;--p-radius: 8px;--p-radius-sm: 6px;--p-shadow: 0 1px 0 rgba(0,0,0,.05), 0 0 0 1px rgba(0,0,0,.04);--p-shadow-card: 0 1px 3px rgba(0,0,0,.08), 0 0 0 1px rgba(0,0,0,.03);--p-space-2: 8px;--p-space-3: 12px;--p-space-4: 16px;--p-space-5: 20px;--p-space-6: 24px;--p-space-8: 32px;--p-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif}*{box-sizing:border-box}html,body,#root{margin:0;height:100%}body{font-family:var(--p-font);color:var(--p-text);background:var(--p-bg);font-size:14px;line-height:1.45;-webkit-font-smoothing:antialiased}.app-shell{max-width:1040px;margin:0 auto;padding:var(--p-space-5) var(--p-space-5) 64px}.app-bar{display:flex;align-items:center;justify-content:space-between;gap:var(--p-space-4);padding:16px 20px;margin-bottom:var(--p-space-5);border-radius:14px;background:radial-gradient(120% 160% at 0% 0%,#00b48829,#00b48800 55%),linear-gradient(135deg,#0c2c24,#0f3a2e 45%,#114636);box-shadow:0 8px 24px #0b2c2338,inset 0 1px #ffffff0f;color:#fff}.app-bar__brand{display:flex;align-items:center;gap:14px;min-width:0}.app-bar__logo{display:inline-grid;place-items:center;flex:none;filter:drop-shadow(0 4px 10px rgba(0,0,0,.35))}.app-bar__titles{min-width:0}.app-bar__name{font-size:17px;font-weight:680;letter-spacing:-.01em;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.app-bar__tag{font-size:12.5px;color:#ffffffb8;margin-top:2px}.plan-pill{display:inline-flex;align-items:center;gap:7px;flex:none;padding:6px 13px;border-radius:999px;text-decoration:none;font-size:12.5px;font-weight:600;color:#eafff7;background:#ffffff1a;border:1px solid rgba(255,255,255,.18);transition:background .12s,border-color .12s}.plan-pill:hover{background:#ffffff2e;border-color:#ffffff4d}.plan-pill__dot{width:7px;height:7px;border-radius:50%;background:#57e3b3;box-shadow:0 0 0 3px #57e3b338}.plan-pill--pro,.plan-pill--premium{background:linear-gradient(135deg,#d9d2ff38,#ffffff1a)}.plan-pill--pro .plan-pill__dot,.plan-pill--premium .plan-pill__dot{background:#c9b8ff;box-shadow:0 0 0 3px #c9b8ff38}@media (max-width: 560px){.app-bar{padding:14px 16px}.app-bar__tag{display:none}}.page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--p-space-4);margin-bottom:var(--p-space-6)}.page-title{font-size:20px;font-weight:650;margin:0}.page-subtitle{color:var(--p-text-subdued);margin:4px 0 0}.row{display:flex;gap:var(--p-space-4);flex-wrap:wrap}.col{flex:1 1 0;min-width:0}.stack{display:flex;flex-direction:column;gap:var(--p-space-4)}.stack-sm{display:flex;flex-direction:column;gap:var(--p-space-2)}.inline{display:flex;align-items:center;gap:var(--p-space-2)}.spacer{flex:1}.grid-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--p-space-4)}.card{background:var(--p-surface);border-radius:var(--p-radius);box-shadow:var(--p-shadow-card);padding:var(--p-space-5)}.card-tight{padding:var(--p-space-4)}.card-title{font-weight:600;font-size:14px;margin:0 0 var(--p-space-3)}.card-section+.card-section{border-top:1px solid var(--p-border);margin-top:var(--p-space-4);padding-top:var(--p-space-4)}.metric{position:relative;overflow:hidden;transition:box-shadow .15s,transform .15s}.metric:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#00b488,#008060)}.metric:hover{box-shadow:0 6px 18px #00000014,0 0 0 1px #00000008;transform:translateY(-1px)}.metric .metric-label{color:var(--p-text-subdued);font-size:13px}.metric .metric-value{font-size:28px;font-weight:650;margin-top:4px;letter-spacing:-.02em}.metric .metric-sub{color:var(--p-text-subdued);font-size:12px;margin-top:2px}.btn{display:inline-flex;align-items:center;gap:6px;justify-content:center;border:1px solid var(--p-border-strong);background:var(--p-surface);color:var(--p-text);border-radius:var(--p-radius-sm);padding:7px 14px;font-size:13px;font-weight:550;cursor:pointer;text-decoration:none;transition:background .12s,border-color .12s}.btn:hover{background:var(--p-surface-subdued)}.btn-primary{background:var(--p-primary);border-color:var(--p-primary);color:#fff}.btn-primary:hover{background:var(--p-primary-hover);border-color:var(--p-primary-hover)}.btn-critical{color:var(--p-critical);border-color:#e0b3b2}.btn-plain{border-color:transparent;background:transparent;color:var(--p-info);padding:4px 6px}.btn-plain:hover{background:#2c6ecb14}.btn-sm{padding:4px 10px;font-size:12px}.btn:disabled{opacity:.5;cursor:not-allowed}.badge{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:550;padding:2px 8px;border-radius:20px;background:#e4e5e7;color:var(--p-text)}.badge-live{background:#aee9d1;color:#0c5132}.badge-paused{background:#ffd79d;color:#5c3d00}.badge-draft{background:#e4e5e7;color:#44474a}.badge-pro{background:#d9d2ff;color:#3b2c8c}.table{width:100%;border-collapse:collapse}.table th{text-align:left;color:var(--p-text-subdued);font-weight:550;font-size:12px;padding:10px 12px;border-bottom:1px solid var(--p-border)}.table td{padding:12px;border-bottom:1px solid var(--p-border);vertical-align:middle}.table tr:last-child td{border-bottom:none}.table tbody tr:hover{background:var(--p-surface-subdued)}.field-label{font-size:13px;font-weight:550;margin-bottom:4px;display:block}.input,.select,.textarea{width:100%;border:1px solid var(--p-border-strong);border-radius:var(--p-radius-sm);padding:8px 10px;font-size:14px;font-family:inherit;background:#fff}.input:focus,.select:focus,.textarea:focus{outline:2px solid var(--p-info);outline-offset:-1px;border-color:var(--p-info)}.textarea{min-height:72px;resize:vertical}.help{color:var(--p-text-subdued);font-size:12px;margin-top:4px}.checklist-item{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--p-border)}.checklist-item:last-child{border-bottom:none}.check-dot{width:22px;height:22px;border-radius:50%;border:2px solid var(--p-border-strong);flex:none;display:grid;place-items:center;color:#fff;font-size:13px}.check-dot.done{background:var(--p-primary);border-color:var(--p-primary)}.empty{text-align:center;padding:48px 24px}.empty .empty-emoji{font-size:40px}.empty h3{margin:12px 0 4px}.empty p{color:var(--p-text-subdued);margin:0 0 20px}.skel{background:linear-gradient(90deg,#ececec 25%,#f5f5f5 37%,#ececec 63%);background-size:400% 100%;animation:shimmer 1.2s infinite;border-radius:6px}@keyframes shimmer{0%{background-position:100% 0}to{background-position:-100% 0}}.skel-line{height:12px;margin:8px 0}.skel-card{height:96px}.tabs{display:flex;gap:4px;flex-wrap:wrap;background:var(--p-surface);padding:5px;border-radius:12px;box-shadow:var(--p-shadow-card);margin-bottom:var(--p-space-6)}.tab{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:8px;cursor:pointer;color:var(--p-text-subdued);text-decoration:none;font-weight:600;font-size:13px;border:none;transition:background .12s,color .12s}.tab:hover{background:var(--p-surface-subdued);color:var(--p-text)}.tab.active{color:#0c5132;background:#e3f5ee}.tab__icon{font-size:14px;line-height:1}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;display:grid;place-items:center;z-index:100;padding:16px}.modal{background:#fff;border-radius:12px;max-width:460px;width:100%;box-shadow:0 20px 60px #00000040;overflow:hidden}.modal-head{padding:24px 24px 0}.modal-body{padding:12px 24px 24px}.modal-foot{padding:16px 24px;background:var(--p-surface-subdued);display:flex;justify-content:flex-end;gap:8px}.unlock-list{list-style:none;padding:0;margin:12px 0 0}.unlock-list li{display:flex;gap:8px;padding:6px 0;color:var(--p-text)}.unlock-list li:before{content:"✓";color:var(--p-primary);font-weight:700}.current-plan-bar{display:flex;align-items:center;margin-bottom:var(--p-space-4)}.plans-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--p-space-4);align-items:stretch;margin-top:var(--p-space-3)}@media (max-width: 920px){.plans-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 540px){.plans-grid{grid-template-columns:1fr}}.plan-card{position:relative;display:flex;flex-direction:column;background:var(--p-surface);border:1px solid var(--p-border);border-radius:12px;padding:var(--p-space-5);box-shadow:var(--p-shadow-card);transition:box-shadow .15s,transform .15s}.plan-card:hover{transform:translateY(-2px);box-shadow:0 8px 22px #0000001a}.plan-card--featured{border:2px solid var(--p-primary);box-shadow:0 10px 28px #00806029}.plan-card--current{background:linear-gradient(180deg,#f3fbf8,#fff 70%)}.plan-card__ribbon{position:absolute;top:-12px;left:50%;transform:translate(-50%);background:var(--p-primary);color:#fff;font-size:11px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;padding:4px 14px;border-radius:999px;white-space:nowrap;box-shadow:0 4px 12px #00806059}.plan-card__head{display:flex;align-items:center;gap:8px;min-height:24px}.plan-card__name{font-size:16px;font-weight:680}.plan-card__price{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap;margin:10px 0 16px}.plan-card__amount{font-size:30px;font-weight:700;letter-spacing:-.02em;line-height:1}.plan-card__period{font-size:12.5px;color:var(--p-text-subdued)}.plan-card__features{list-style:none;padding:0;margin:0 0 var(--p-space-5);flex:1 1 auto}.plan-card__features li{display:flex;gap:8px;align-items:flex-start;padding:7px 0;font-size:13px;line-height:1.4;border-bottom:1px solid var(--p-surface-subdued)}.plan-card__features li:last-child{border-bottom:none}.plan-card__features li:before{content:"✓";color:var(--p-primary);font-weight:700;flex:none}.plan-card__cta{margin-top:auto}.plan-card__cta .btn{width:100%}.btn-choose{border-color:var(--p-primary);color:var(--p-primary);background:var(--p-surface)}.btn-choose:hover{background:#e3f5ee}.text-subdued{color:var(--p-text-subdued)}.divider{height:1px;background:var(--p-border);margin:var(--p-space-4) 0}.pill-usage{font-size:12px;color:var(--p-text-subdued)}.bar{height:6px;background:var(--p-border);border-radius:4px;overflow:hidden;margin-top:6px}.bar>span{display:block;height:100%;background:var(--p-primary)}
