@import"https://fonts.googleapis.com/css2?family=Sora:wght@400;500;600;700&display=swap";:root{font-family:Sora,Helvetica Neue,Arial,sans-serif;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-height:100vh;background:#f7f8fc;color:#0f172a}a{color:inherit;text-decoration:none}button,input,textarea,select{font-family:inherit}:root{--bg: #f7f8fc;--panel: #ffffff;--panel-text: #000000;--gradient: linear-gradient(135deg, #0f172a, #111827);--ink: #0f172a;--muted: #5f6b7a;--accent: #f97316;--border: #e2e8f0;--radius: 12px;--shadow: 0 20px 60px rgba(15, 23, 42, .08);--success: #22c55e;--success-light: rgba(34, 197, 94, .12);--danger: #ef4444;--danger-light: rgba(239, 68, 68, .12);--warning: #f59e0b;--warning-light: rgba(245, 158, 11, .12);--info: #3b82f6;--info-light: rgba(59, 130, 246, .12)}@media(prefers-color-scheme:dark){:root{--bg: #0f172a;--panel: #1e293b;--panel-text: #ffffff;--ink: #f8fafc;--muted: #94a3b8;--accent: #f97316;--border: #334155;--shadow: 0 20px 60px rgba(0, 0, 0, .25);--success: #4ade80;--success-light: rgba(74, 222, 128, .12);--danger: #f87171;--danger-light: rgba(248, 113, 113, .12);--warning: #fbbf24;--warning-light: rgba(251, 191, 36, .12);--info: #60a5fa;--info-light: rgba(96, 165, 250, .12)}.sidebar{background:var(--panel)}.user-chip{background:var(--panel);border-color:var(--border);box-shadow:0 10px 20px #0003}.panel.highlight{background:linear-gradient(135deg,#0f172a,#0b1220)}.tile{background:#0f172a80;border-color:#ffffff1a}.button.ghost{background:var(--panel);color:var(--ink);border-color:var(--border)}.inline-form{background:var(--bg);border-color:var(--border)}input,textarea,select{background:var(--bg);border-color:var(--border);color:var(--ink)}.card{background:var(--panel)}.credential-chip{background:var(--panel);border-color:var(--border)}.table-head{background:var(--bg)}.table-body{background:var(--panel)}.dropdown-trigger{background:var(--bg);border-color:var(--border)}.dropdown-menu{background:var(--panel);border-color:var(--border)}.dropdown-section{background:var(--bg);border-color:var(--border)}.dropdown-item{background:var(--panel);border-color:var(--border)}.button.icon{background:var(--panel);border-color:var(--border);color:var(--ink)}.group-header{background:var(--panel)}.group-header:hover{background:#f9731614}.metrics-card{background:var(--panel);border-color:var(--border)}.log-feed{background:var(--bg);border-color:var(--border)}}*,*:before,*:after{box-sizing:border-box}body{margin:0;font-family:Sora,Helvetica Neue,Arial,sans-serif;background:var(--bg);color:var(--ink)}.app-shell{display:grid;grid-template-columns:240px 1fr;min-height:100vh}.sidebar{background:var(--panel);border-right:1px solid var(--border);padding:24px 16px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:24px}.brand{display:flex;align-items:center;gap:12px;font-weight:700;letter-spacing:-.01em}.brand-name{font-size:18px}.brand-sub{font-size:12px;color:var(--muted)}.logo-dot{width:32px;height:32px;border-radius:10px;background:linear-gradient(135deg,#0f172a,#111827);position:relative}.logo-dot:after{content:"";position:absolute;inset:6px;border-radius:8px;background:linear-gradient(135deg,#f97316,#facc15);opacity:.9}.nav{display:flex;flex-direction:column;gap:6px}.nav-item{display:flex;align-items:center;gap:12px;padding:12px 14px;border:none;background:transparent;border-radius:10px;font-size:15px;color:var(--muted);cursor:pointer;transition:background .18s ease,color .18s ease}.nav-item:hover{background:#f9731614;color:var(--ink)}.nav-item.active{background:#f973161f;color:var(--ink);font-weight:600}.nav-item.active .icon{color:var(--accent)}.icon{width:18px;height:18px;display:grid;place-items:center;color:var(--muted)}.content{padding:32px 32px 48px}.page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.header-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end}.user-chip{display:inline-flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--border);border-radius:12px;padding:8px 10px;box-shadow:0 10px 20px #0f172a0f}.user-dot{width:10px;height:10px;border-radius:50%;background:var(--success);box-shadow:0 0 0 6px var(--success-light)}.user-meta{display:flex;flex-direction:column;line-height:1.2}.user-role{color:var(--muted);font-size:12px}.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:11px;color:var(--muted);margin:0 0 2px}h1,h2,h3{margin:0;letter-spacing:-.02em}.panel{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow)}.panel.highlight{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;background:var(--gradient);color:var(--bg);border:none}.panel.highlight .muted{color:var(--muted)}.placeholder-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.tile{background:#ffffff0f;border:1px dashed rgba(255,255,255,.2);border-radius:10px;padding:16px;text-align:center;color:var(--muted)}.status-pill{display:inline-flex;align-items:center;gap:8px;background:var(--bg);color:var(--ink);padding:8px 12px;border-radius:999px;border:1px solid var(--border)}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--success);box-shadow:0 0 0 6px var(--success-light)}.status-dot.error{background:var(--danger);box-shadow:0 0 0 6px var(--danger-light)}.panel-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.button{border:none;border-radius:10px;padding:10px 14px;font-weight:600;cursor:pointer;font-family:inherit;transition:transform .1s ease,box-shadow .15s ease}.button.primary{background:linear-gradient(135deg,var(--accent),var(--warning));color:var(--ink);box-shadow:0 10px 30px #f973164d}.button.primary:hover{box-shadow:0 10px 40px #f9731666}.button.ghost{background:var(--panel);color:var(--ink);border:1px solid var(--border)}.button.danger{background:var(--danger-light);color:var(--danger);border:1px solid var(--danger)}.button.small{padding:7px 10px;font-size:13px}.button:active{transform:translateY(1px)}.inline-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;padding:16px;border-radius:12px;background:var(--bg);border:1px dashed var(--border);margin-bottom:14px}.inline-form.hidden{display:none}.form-row{display:flex;flex-direction:column;gap:6px}label{font-size:13px;color:var(--muted)}input,textarea,select{padding:10px 12px;border-radius:10px;border:1px solid var(--border);font-family:inherit;font-size:14px;background:var(--panel);transition:border-color .15s ease,box-shadow .15s ease}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light)}textarea{min-height:64px;resize:vertical}.form-actions{display:flex;align-items:center;gap:10px}.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}.card{border:1px solid var(--border);border-radius:var(--radius);padding:14px;background:var(--panel);display:flex;flex-direction:column;gap:10px;box-shadow:0 10px 30px #0f172a0d;min-width:0;transition:transform .2s ease,box-shadow .2s ease}.card:hover{transform:translateY(-2px);box-shadow:0 15px 40px #0f172a14}.card-header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap}.card-header .actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}.muted{color:var(--muted);margin:0}.badge{background:var(--ink);color:var(--bg);padding:8px 10px;border-radius:10px;font-family:Sora,monospace;font-size:13px;letter-spacing:.02em}.origins{font-size:13px}.credentials-list{display:flex;flex-direction:column;gap:6px}.credential-chip{display:flex;justify-content:space-between;align-items:center;background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:8px 10px;font-size:13px;gap:10px}.table{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}.table-head,.table-row{display:grid;grid-template-columns:1fr .6fr 1.1fr .6fr .6fr;gap:10px;align-items:center;padding:12px 14px}.table-head{background:var(--bg);font-weight:600;color:var(--muted)}.table-body{background:var(--panel)}.table-row+.table-row{border-top:1px solid var(--border)}.table-row div:nth-child(3){overflow-wrap:anywhere;word-break:break-word}.table-row .muted{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}.table-row textarea{height:38px;min-height:38px}.actions{display:flex;gap:6px;flex-wrap:nowrap;align-items:center}.table-row input,.table-row textarea{width:100%}.dropdown{position:relative}.dropdown-trigger{width:100%;display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-radius:10px;border:1px solid var(--border);background:var(--panel);cursor:pointer;font-weight:600}.dropdown-menu{position:absolute;z-index:5;top:calc(100% + 6px);left:0;right:0;background:var(--panel);border:1px solid var(--border);border-radius:12px;box-shadow:0 20px 50px #0f172a1a;max-height:280px;overflow:auto;display:grid;gap:6px;padding:8px}.dropdown-section{border:1px solid var(--border);border-radius:10px;padding:8px;background:var(--bg)}.dropdown-item{width:100%;text-align:left;border:none;background:var(--panel);padding:10px;border-radius:8px;margin-top:6px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;border:1px solid var(--border)}.dropdown-item:hover,.dropdown-item.active{background:#f973161f;border-color:#f973164d}.button.icon{padding:6px;width:34px;height:34px;font-size:14px;line-height:1;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;color:var(--ink);background:var(--panel);border:1px solid var(--border)}.button.icon svg{width:16px;height:16px;color:currentColor;fill:currentColor;stroke:currentColor}.button.icon.danger{background:var(--danger-light);border-color:var(--danger);color:var(--danger)}.chevron{color:var(--muted)}.group-block{border:1px solid var(--border);border-radius:var(--radius);margin-bottom:10px;overflow:hidden}.group-header{width:100%;border:none;background:var(--panel);display:flex;align-items:center;justify-content:space-between;padding:12px 14px;cursor:pointer}.group-header:hover{background:#f9731614}.table-segment{border-top:1px solid var(--border)}.table-body.grouped .table-head,.table-body.grouped .table-row{grid-template-columns:1fr .6fr 1.1fr .6fr .6fr}.chip{display:inline-flex;align-items:center;gap:6px;padding:6px 8px;background:var(--warning-light);border-radius:8px;color:var(--warning);font-weight:600;font-size:12px}.metrics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-bottom:16px}.metric-card{background:var(--ink);color:var(--bg);border-radius:var(--radius);padding:16px;border:1px solid var(--border);box-shadow:var(--shadow);transition:transform .2s ease,box-shadow .2s ease}.metric-card:hover{transform:translateY(-2px);box-shadow:0 15px 40px #0f172a1f}.metrics-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-top:12px}.metrics-section{margin-bottom:16px}.metrics-section h3{margin:0 0 10px}.metrics-clients .card{border:1px solid var(--border);box-shadow:0 10px 30px #0f172a0d}.status-chip{padding:6px 10px;border-radius:999px;font-weight:700;font-size:12px}.status-chip.ok{background:var(--success-light);color:var(--success);border:1px solid var(--success)}.status-chip.warn{background:var(--danger-light);color:var(--danger);border:1px solid var(--danger)}.log-feed{display:flex;flex-direction:column;gap:8px;max-height:360px;overflow-y:auto;padding:8px;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius)}.log-feed.tall{max-height:70vh;min-height:420px}.log-line{display:grid;grid-template-columns:auto auto auto auto 1fr;gap:8px;align-items:center;font-size:13px}.log-badge{padding:4px 8px;border-radius:8px;text-transform:uppercase;font-weight:700;font-size:11px}.log-badge.info{background:var(--info-light);color:var(--info)}.log-badge.error{background:var(--danger-light);color:var(--danger)}.log-badge.warn{background:var(--warning-light);color:var(--warning)}.badge.group{background:var(--bg);color:var(--ink);border:1px solid var(--border)}.sidebar-footer{margin-top:auto;font-size:12px;line-height:1.4}.error-text{color:var(--danger);font-weight:700}.view{display:none}.view.active{display:block}.hidden{display:none}.auth-layout{min-height:100vh;background:radial-gradient(circle at 15% 20%,var(--accent-light),transparent 35%),radial-gradient(circle at 85% 30%,var(--success-light),transparent 32%),var(--bg);display:flex;align-items:center;justify-content:center;padding:48px 16px}.auth-card{width:min(440px,100%);background:linear-gradient(145deg,#0f172af2,#0f172ad1);border:1px solid var(--border);border-radius:24px;padding:34px 30px;color:var(--ink);box-shadow:0 25px 80px #00000059;display:flex;flex-direction:column;gap:20px}.auth-badge{display:inline-flex;align-items:center;justify-content:center;padding:6px 12px;border-radius:999px;background:linear-gradient(135deg,var(--accent),var(--warning));color:var(--ink);font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:12px}.auth-header h1{margin:10px 0 6px;font-size:28px}.auth-header p{margin:0;color:var(--muted)}.auth-form{display:flex;flex-direction:column;gap:16px}.auth-label{display:flex;flex-direction:column;gap:6px;font-weight:600;color:var(--muted)}.auth-label input{background:var(--bg);border:1px solid var(--border);color:var(--ink)}.auth-label input::placeholder{color:var(--muted)}.auth-label input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-light)}.auth-error{background:var(--danger-light);border:1px solid var(--danger);color:var(--danger);padding:12px 14px;border-radius:12px;font-weight:700}.auth-form .button.primary{width:100%;display:inline-flex;align-items:center;justify-content:center}.auth-footer{color:var(--muted);font-size:.95rem}.auth-footer a{color:var(--accent);font-weight:700}.key-badge{display:inline-block;padding:4px 8px;background:var(--ink);color:var(--accent);border-radius:6px;font-family:Sora,monospace;font-size:12px;letter-spacing:.02em}.cred-table-head,.cred-table-row{grid-template-columns:1fr .8fr .5fr 1.2fr .8fr!important}.credential-clients-panel{background:var(--bg);border-top:1px solid var(--border);padding:16px;margin:0 -14px -12px}.credential-clients-panel .eyebrow{margin-bottom:12px}.client-checkbox-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px}.client-checkbox-item{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--panel);border:1px solid var(--border);border-radius:10px;font-size:14px;cursor:pointer;transition:background .15s,border-color .15s}.client-checkbox-item:hover{background:var(--accent-light);border-color:var(--accent)}.client-checkbox-item:has(input:checked){background:var(--success-light);border-color:var(--success)}.client-checkbox-item input[type=checkbox]{width:18px;height:18px;accent-color:var(--success);cursor:pointer}.client-checkbox-item .client-name{font-weight:600}.dropdown-item-content{display:flex;flex-direction:column;gap:2px;text-align:left}.dropdown-item-title{font-weight:600}.dropdown-item-key{font-size:11px;font-family:Sora,monospace}.add-credential-form{padding:12px;background:var(--panel);border:1px dashed var(--border);border-radius:10px;margin-top:10px}.add-credential-form .form-row{margin-bottom:10px}.add-credential-form .form-actions{justify-content:flex-end}.credentials-list-new{display:flex;flex-direction:column;gap:12px;margin-top:20px}.credential-card{background:var(--panel);border:1px solid var(--border);border-radius:14px;overflow:hidden}.credential-header{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;background:var(--bg);border-bottom:1px solid var(--border)}.credential-toggle{display:flex;align-items:center;gap:12px;background:none;border:none;cursor:pointer;flex:1;text-align:left}.credential-toggle .chevron{font-size:12px;color:var(--muted);transition:transform .2s}.credential-name{margin:0;font-size:16px;font-weight:600;color:var(--ink)}.credential-name-input{font-size:16px;font-weight:600;padding:4px 8px;border:1px solid var(--accent);border-radius:6px}.value-count{font-size:13px}.credential-actions{display:flex;gap:6px}.credential-body{padding:18px}.values-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.add-value-form{margin-bottom:16px;padding:12px;background:var(--bg);border:1px solid var(--border);border-radius:10px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}.add-value-form.token-form{flex-direction:column;align-items:stretch}.add-value-form .form-row-inline{display:flex;gap:8px;width:100%}.add-value-form .token-config-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;width:100%}.add-value-form .validity-input{display:flex;align-items:center;gap:4px}.add-value-form input,.add-value-form select{padding:6px 10px;border:1px solid var(--accent);border-radius:6px;font-size:13px;background:var(--panel);color:var(--ink)}.add-value-form input[name=key]{font-family:Sora,monospace}.add-value-form input[name=displayName]{width:140px}.add-value-form input[name=groupTag]{width:100px}.values-list{display:flex;flex-direction:column;gap:8px}.value-row{background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:12px 14px}.value-main{display:flex;align-items:center;gap:12px;flex:1;min-width:0}.value-row>.value-main{display:flex;justify-content:space-between}.value-row{display:flex;flex-direction:column;gap:10px}.value-row>div:first-child{display:flex;justify-content:space-between;align-items:center}.value-text{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:300px}.value-edit-form{display:flex;flex-direction:column;gap:8px;flex:1}.value-edit-row{display:flex;gap:8px}.value-key-input,.value-value-input,.value-displayname-input,.value-group-input{padding:6px 10px;border:1px solid var(--accent);border-radius:6px;font-size:13px}.value-key-input{width:140px;font-family:Sora,monospace}.value-value-input,.value-displayname-input{flex:1}.value-group-input{width:140px}.value-info{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.value-displayname{font-size:13px;color:var(--text);font-weight:500}.value-group-badge{font-size:11px;padding:2px 8px;background:#f973161a;color:var(--accent);border-radius:10px;font-weight:500}.value-rotation-badge{font-size:11px;padding:2px 8px;background:#22c55e1a;color:#22c55e;border-radius:10px;font-weight:500}.value-oncall-badge{font-size:11px;padding:2px 8px;background:#3b82f61a;color:var(--info);border-radius:10px;font-weight:500}.value-content{display:flex;align-items:center;gap:12px;flex:1}.value-updated{font-size:11px;white-space:nowrap}.value-expanded-panel{display:flex;gap:24px;width:100%;padding:12px 0 0;border-top:1px solid var(--border);margin-top:8px}.value-rotation-config{min-width:280px}.rotation-controls{display:flex;flex-direction:column;gap:12px;margin-top:8px}.rotation-controls .config-label{display:flex;flex-direction:column;gap:4px}.rotation-controls .config-label span{font-size:11px}.rotation-controls select,.rotation-controls input{padding:6px 10px;border:1px solid var(--accent);border-radius:6px;font-size:13px;background:var(--panel);color:var(--ink)}.value-clients-panel{flex:1}.value-actions{display:flex;gap:6px;flex-shrink:0}.value-clients-panel .eyebrow,.value-rotation-config .eyebrow{margin-bottom:10px}.empty-state{padding:40px;text-align:center}.tokens-filters{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-end;padding:16px 0;border-bottom:1px solid var(--border);margin-bottom:20px}.tokens-filters .filter-checkbox{display:flex;align-items:center;gap:8px;font-size:14px;cursor:pointer}.tokens-filters .filter-checkbox input{width:16px;height:16px;accent-color:var(--accent)}.tokens-filters .filter-input{display:flex;flex-direction:column;gap:4px}.tokens-filters .filter-input input{padding:8px 12px;border:1px solid var(--border);border-radius:8px;font-size:13px;width:180px;background:var(--panel);color:var(--ink)}.tokens-filters .filter-input input:focus{outline:none;border-color:var(--accent)}.tokens-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}.token-card-compact{background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:12px;display:flex;flex-direction:column;gap:8px;transition:opacity .2s}.token-card-compact.inactive{opacity:.5}.token-card-top{display:flex;justify-content:space-between;align-items:center}.token-code-compact{font-family:Sora,monospace;font-size:11px;background:var(--panel);padding:6px 8px;border-radius:4px;border:1px solid var(--border);word-break:break-all;color:var(--muted);line-height:1.4}.token-card-details{display:flex;flex-direction:column;gap:2px;font-size:12px}.token-detail{color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.time-remaining{color:var(--accent);font-weight:600;font-size:12px}.token-revoke-btn{margin-top:4px;align-self:flex-start}.tokens-pagination{display:flex;justify-content:space-between;align-items:center;margin-top:20px;padding-top:16px;border-top:1px solid var(--border)}.pagination-buttons{display:flex;gap:8px}.loading-state{padding:40px;text-align:center}.error-banner{background:var(--danger-light);color:var(--danger);padding:12px 16px;border-radius:8px;margin-bottom:16px;font-size:14px}@media(max-width:960px){.app-shell{grid-template-columns:1fr}.sidebar{position:relative;height:auto;flex-direction:row;align-items:center;justify-content:space-between}.nav{flex-direction:row;flex-wrap:wrap}.content{padding:20px}}
