:root{--c-slate-900:#0f172a;--c-slate-800:#1e293b;--c-slate-700:#334155;--c-slate-600:#475569;--c-slate-500:#64748b;--c-slate-400:#94a3b8;--c-slate-300:#cbd5e1;--c-slate-200:#e2e8f0;--c-slate-100:#f1f5f9;--c-slate-50:#f8fafc;--c-blue-700:#1d4ed8;--c-blue-600:#2563eb;--c-blue-500:#3b82f6;--c-blue-200:#bfdbfe;--c-blue-100:#dbeafe;--c-blue-50:#eff6ff;--c-amber-600:#d97706;--c-amber-500:#f59e0b;--c-amber-100:#fef3c7;--c-green-600:#16a34a;--c-green-100:#dcfce7;--c-red-600:#dc2626;--c-red-100:#fee2e2;--c-red-50:#fef2f2;--bg:var(--c-slate-50);--bg-surface:#fff;--bg-nav:var(--c-slate-900);--border:var(--c-slate-200);--fg:var(--c-slate-900);--fg-2:var(--c-slate-500);--fg-3:var(--c-slate-400);--fg-inv:#fff;--accent:var(--c-blue-600);--accent-hov:var(--c-blue-700);--accent-bg:var(--c-blue-50);--s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:20px;--s6:24px;--s8:32px;--s10:40px;--r:6px;--r-md:8px;--r-lg:12px;--r-xl:16px;--r-full:9999px;--sh-xs:0 1px 2px 0 #0000000d;--sh-sm:0 1px 3px 0 #0000001a, 0 1px 2px -1px #0000001a;--sh:0 4px 6px -1px #00000014, 0 2px 4px -2px #0000000d;--font:-apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;--font-mono:ui-monospace, "SF Mono", Consolas, monospace;--nav-h:60px;--t:.15s ease}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font);color:var(--fg);background:var(--bg);-webkit-font-smoothing:antialiased;padding-top:var(--nav-h);font-size:14px;line-height:1.5}a{color:inherit;text-decoration:none}button{cursor:pointer;background:0 0;border:none;font-family:inherit}svg{flex-shrink:0;display:block}.app-nav{height:var(--nav-h);background:var(--bg-nav);padding:0 var(--s6);z-index:100;border-bottom:1px solid #ffffff0f;justify-content:space-between;align-items:center;display:flex;position:fixed;inset:0 0 auto}.nav-left{align-items:stretch;gap:var(--s6);height:100%;display:flex}.nav-brand{align-items:center;gap:var(--s3);display:flex}.nav-brand-icon{flex-shrink:0;align-items:center;display:flex}.nav-title{letter-spacing:-.02em;color:#fff;font-size:16px;font-weight:700}.nav-title span{color:#275c8d}.nav-right{align-items:center;gap:var(--s3);display:flex}.nav-user{align-items:center;gap:var(--s2);display:flex}.nav-avatar{border-radius:var(--r-full);color:#fff;background:#275c8d;justify-content:center;align-items:center;width:28px;height:28px;font-size:11px;font-weight:600;display:flex}.nav-username{color:var(--c-slate-300);font-size:13px}.btn-logout{border-radius:var(--r);width:32px;height:32px;color:var(--c-slate-400);transition:color var(--t), background var(--t);justify-content:center;align-items:center;display:flex}.btn-logout:hover{color:#fff;background:#ffffff14}.nav-tabs{align-items:stretch;gap:var(--s1);height:100%;display:flex}.nav-tab{align-items:center;gap:var(--s2);padding:0 var(--s3);color:var(--c-slate-400);transition:color var(--t), border-color var(--t);white-space:nowrap;cursor:pointer;border-bottom:2px solid #0000;font-size:13px;font-weight:500;display:flex}.nav-tab:hover{color:var(--c-slate-200)}.nav-tab.active{color:#fff;border-bottom-color:var(--c-blue-500)}.nav-tab svg{opacity:.6}.nav-tab.active svg{opacity:1}.page{max-width:1200px;padding:var(--s8) var(--s6);margin:0 auto}.page-header{margin-bottom:var(--s6);justify-content:space-between;align-items:flex-start;gap:var(--s4);flex-wrap:wrap;display:flex}.page-title{letter-spacing:-.025em;font-size:20px;font-weight:700}.page-subtitle{color:var(--fg-2);margin-top:2px;font-size:13px}.card{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden}.table-wrap{overflow-x:auto}.data-table{border-collapse:collapse;width:100%;font-size:13px}.data-table thead th{text-align:left;letter-spacing:.06em;text-transform:uppercase;color:var(--fg-2);padding:var(--s3) var(--s4);border-bottom:1px solid var(--border);background:var(--c-slate-50);white-space:nowrap;font-size:11px;font-weight:600}.data-table tbody tr{border-bottom:1px solid var(--border);transition:background var(--t)}.data-table tbody tr:last-child{border-bottom:none}.data-table tbody tr:hover{background:var(--c-slate-50)}.data-table td{padding:var(--s3) var(--s4);vertical-align:middle}.cell-name{font-weight:500}.cell-desc{color:var(--fg-2);text-overflow:ellipsis;white-space:nowrap;max-width:280px;overflow:hidden}.cell-mono{font-family:var(--font-mono);color:var(--fg-2);font-size:12px}.col-actions{white-space:nowrap;width:1%}.row-actions{align-items:center;gap:var(--s1);justify-content:flex-end;display:flex}.btn{align-items:center;gap:var(--s2);padding:0 var(--s4);border-radius:var(--r);height:34px;transition:background var(--t), color var(--t), box-shadow var(--t);white-space:nowrap;font-size:13px;font-weight:500;line-height:1;display:inline-flex}.btn-primary{background:var(--accent);color:#fff;box-shadow:var(--sh-xs)}.btn-primary:hover{background:var(--accent-hov)}.btn-secondary{background:var(--bg-surface);color:var(--fg);border:1px solid var(--border);box-shadow:var(--sh-xs)}.btn-secondary:hover{background:var(--c-slate-50)}.btn-ghost{color:var(--fg-2)}.btn-ghost:hover{background:var(--c-slate-100);color:var(--fg)}.btn-danger-ghost{color:var(--c-red-600)}.btn-danger-ghost:hover{background:var(--c-red-100)}.btn-del{color:var(--c-red-600)}.btn-del:hover{background:var(--c-red-100);color:var(--c-red-600)}.btn-new-rp,.btn-dup{color:var(--c-green-600)}.btn-new-rp:hover,.btn-dup:hover{background:var(--c-green-100);color:var(--c-green-600)}.btn-sm{height:28px;padding:0 var(--s3);font-size:12px}.btn-icon{border-radius:var(--r);flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;padding:0;display:inline-flex}.badge{padding:2px var(--s2);border-radius:var(--r-full);white-space:nowrap;align-items:center;gap:4px;font-size:11px;font-weight:600;display:inline-flex}.badge:before{content:"";border-radius:var(--r-full);flex-shrink:0;width:5px;height:5px}.badge-active{background:var(--c-blue-100);color:var(--c-blue-600)}.badge-active:before{background:var(--c-blue-600)}.badge-expired{background:var(--c-slate-100);color:var(--c-slate-500)}.badge-expired:before{background:var(--c-slate-400)}.badge-future{background:var(--c-blue-100);color:var(--c-blue-600)}.badge-future:before{background:var(--c-blue-500)}.badge-warning{background:var(--c-amber-100);color:var(--c-amber-600)}.badge-warning:before{background:var(--c-amber-500)}.chip{background:var(--c-slate-100);color:var(--fg-2);border-radius:var(--r-full);padding:2px var(--s2);font-variant-numeric:tabular-nums;align-items:center;gap:4px;font-size:11px;font-weight:500;display:inline-flex}.chip svg{color:var(--fg-3)}.empty-state{padding:64px var(--s6);text-align:center;justify-content:center;align-items:center;gap:var(--s3);flex-direction:column;display:flex}.empty-icon{border-radius:var(--r-xl);background:var(--c-slate-100);width:48px;height:48px;color:var(--fg-3);margin-bottom:var(--s2);justify-content:center;align-items:center;display:flex}.empty-title{font-size:14px;font-weight:600}.empty-desc{color:var(--fg-2);max-width:280px;font-size:13px}.skeleton{border-radius:var(--r);background:linear-gradient(90deg, var(--c-slate-100) 25%, var(--c-slate-200) 50%, var(--c-slate-100) 75%);background-size:200% 100%;height:13px;animation:1.4s infinite shimmer}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.error-banner{align-items:flex-start;gap:var(--s3);padding:var(--s4);background:var(--c-red-50);border:1px solid var(--c-red-100);border-radius:var(--r-md);color:var(--c-red-600);margin-bottom:var(--s6);font-size:13px;display:flex}.dialog-backdrop{z-index:200;padding:var(--s6);background:#00000073;justify-content:center;align-items:center;animation:.12s fade-in;display:flex;position:fixed;inset:0}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.dialog{background:var(--bg-surface);border-radius:var(--r-lg);border:1px solid var(--border);padding:var(--s6);width:100%;max-width:400px;animation:.15s slide-up;box-shadow:0 20px 48px #0000002e}@keyframes slide-up{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.dialog-title{margin-bottom:var(--s2);font-size:15px;font-weight:600}.dialog-body{color:var(--fg-2);margin-bottom:var(--s5);font-size:13px}.dialog-actions{gap:var(--s2);justify-content:flex-end;display:flex}.breadcrumb{background:var(--bg);border-bottom:1px solid var(--border);padding:0 var(--s6);align-items:center;gap:var(--s2);height:34px;top:var(--nav-h);z-index:40;display:flex;position:sticky}.breadcrumb-back{color:var(--fg-3);padding:2px var(--s2);border-radius:var(--r);margin-left:calc(-1 * var(--s2));transition:color var(--t), background var(--t);cursor:pointer;background:0 0;border:none;align-items:center;gap:5px;font-family:inherit;font-size:12px;font-weight:400;display:inline-flex}.breadcrumb-back:hover{color:var(--fg-2);background:var(--c-slate-100)}.breadcrumb-sep{color:var(--c-slate-300);-webkit-user-select:none;user-select:none;font-size:13px;line-height:1}.breadcrumb-current{color:var(--fg-2);text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:500;overflow:hidden}.detail-section{margin-top:var(--s8)}.detail-section:first-child{margin-top:0}.section-header{margin-bottom:var(--s4);justify-content:space-between;align-items:center;gap:var(--s4);display:flex}.section-title{color:var(--fg);align-items:center;gap:var(--s2);font-size:14px;font-weight:600;display:flex}.section-count{color:var(--fg-3);background:var(--c-slate-100);border-radius:var(--r-full);padding:1px 7px;font-size:12px;font-weight:500}.form-body{padding:var(--s5) var(--s6);gap:var(--s5);flex-direction:column;display:flex}.form-row{gap:var(--s5);grid-template-columns:1fr 1fr;display:grid}.form-group{gap:var(--s2);flex-direction:column;display:flex}.form-group-full{grid-column:1/-1}.form-label{color:var(--fg-2);letter-spacing:.02em;font-size:12px;font-weight:600}.form-input,.form-textarea{padding:var(--s2) var(--s3);border:1px solid var(--border);border-radius:var(--r);font:inherit;color:var(--fg);background:var(--bg-surface);transition:border-color var(--t), box-shadow var(--t);outline:none;width:100%;font-size:14px}.form-input:focus,.form-textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--c-blue-100)}.form-textarea{resize:vertical;min-height:76px;line-height:1.5}.form-select{padding:var(--s2) var(--s3);border:1px solid var(--border);border-radius:var(--r);font:inherit;color:var(--fg);background:var(--bg-surface);transition:border-color var(--t), box-shadow var(--t);cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-position:right 10px center;background-repeat:no-repeat;outline:none;width:100%;padding-right:32px;font-size:14px}.form-select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--c-blue-100)}.time-pills{gap:var(--s2);flex-wrap:wrap;align-items:center;min-height:34px;display:flex}.time-pill{background:var(--c-blue-50);border:1px solid var(--c-blue-200);border-radius:var(--r-full);color:var(--c-blue-700);font-size:13px;font-weight:500;font-family:var(--font-mono);font-variant-numeric:tabular-nums;align-items:center;gap:4px;padding:4px 5px 4px 10px;display:inline-flex}.time-pill-del{border-radius:var(--r-full);width:18px;height:18px;color:var(--fg-3);cursor:pointer;transition:color var(--t), background var(--t);background:0 0;border:none;justify-content:center;align-items:center;padding:0;display:flex}.time-pill-del:hover{color:var(--c-red-600);background:var(--c-red-100)}.btn-add-time{align-items:center;gap:var(--s2);padding:4px var(--s3);color:var(--accent);border:1px dashed var(--c-blue-200);border-radius:var(--r-full);cursor:pointer;transition:background var(--t), border-color var(--t);background:0 0;font-family:inherit;font-size:12px;font-weight:500;display:inline-flex}.btn-add-time:hover{background:var(--c-blue-50);border-color:var(--accent)}.time-add-inline{width:120px;height:30px;padding:0 var(--s3);border:1px solid var(--accent);border-radius:var(--r-full);font-size:13px;font-family:var(--font-mono);background:var(--c-blue-50);color:var(--fg);outline:none}.time-add-inline:focus{box-shadow:0 0 0 3px var(--c-blue-100)}.no-expiry-row{align-items:center;gap:var(--s2);margin-top:var(--s2);color:var(--fg-2);cursor:pointer;-webkit-user-select:none;user-select:none;font-size:12px;display:flex}.no-expiry-row input[type=checkbox]{cursor:pointer;accent-color:var(--accent)}.form-meta{gap:var(--s4);padding:var(--s3) var(--s6);border-top:1px solid var(--border);background:var(--c-slate-50);display:flex}.form-meta-item{flex-direction:column;gap:2px;display:flex}.form-meta-label{color:var(--fg-3);text-transform:uppercase;letter-spacing:.05em;font-size:11px;font-weight:500}.form-meta-value{color:var(--fg-2);font-size:12px;font-family:var(--font-mono)}.form-footer{justify-content:flex-end;align-items:center;gap:var(--s3);padding:var(--s4) var(--s6);border-top:1px solid var(--border);background:var(--c-slate-50);display:flex}.save-status{color:var(--c-green-600);align-items:center;gap:var(--s2);opacity:0;transition:opacity var(--t);font-size:13px;display:flex}.save-status.visible{opacity:1}th[data-sort]{cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap}th[data-sort]:hover{color:var(--fg)}th[data-sort]:after{content:" ↕";color:var(--fg-3);margin-left:2px;font-size:10px}th.sort-asc:after{content:" ↑";color:var(--accent)}th.sort-desc:after{content:" ↓";color:var(--accent)}.sp-info{align-items:center;gap:var(--s4);margin-top:var(--s2);padding:var(--s2) var(--s3);background:var(--c-slate-50);border:1px solid var(--border);border-radius:var(--r);font-size:12px;display:flex}.sp-info-item{align-items:center;gap:var(--s2);display:flex}.sp-info-label{color:var(--fg-3)}.sp-info-value{color:var(--fg-2);font-variant-numeric:tabular-nums;font-weight:600;font-family:var(--font-mono)}.timeline-outer{margin-top:var(--s3)}.timeline-track{background:var(--c-slate-100);border-radius:var(--r-md);height:36px;position:relative;overflow:hidden}.timeline-mark{background:var(--c-slate-200);width:1px;position:absolute;top:0;bottom:0}.timeline-block{background:var(--c-blue-500);opacity:.85;border-radius:4px;min-width:4px;position:absolute;top:5px;bottom:5px}.timeline-block.is-overlap{background:var(--c-red-600)}.timeline-axis{margin-top:var(--s1);color:var(--fg-3);font-variant-numeric:tabular-nums;justify-content:space-between;font-size:10px;display:flex}.timeline-empty{height:36px;color:var(--fg-3);background:var(--c-slate-100);border-radius:var(--r-md);justify-content:center;align-items:center;font-size:12px;display:flex}.timeline-overlap-warn{align-items:center;gap:var(--s2);margin-top:var(--s2);color:var(--c-red-600);font-size:12px;display:flex}.sr-only{clip:rect(0,0,0,0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}