@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";@import"https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@24,400,1,0";.nav-drawer{width:100%;height:100%;background:transparent;display:flex;flex-direction:column;padding:24px 16px;box-sizing:border-box}.drawer-headline{padding:0 12px 16px;font-family:var(--font-sans);font-size:11px;font-weight:600;color:var(--app-text-secondary);text-transform:uppercase;letter-spacing:.05em;opacity:.8}.drawer-content{display:flex;flex-direction:column;gap:4px}.nav-item{display:flex;align-items:center;height:40px;padding:0 12px;border-radius:8px;border:none;background:transparent;color:var(--app-text-primary);cursor:pointer;font-family:var(--font-sans);font-size:14px;font-weight:500;text-decoration:none;transition:background .15s ease;width:100%;text-align:left;outline:none}.nav-item:hover{background-color:#0000000a}.nav-item:focus-visible{box-shadow:0 0 0 2px var(--color-accent)}.nav-item.active{background-color:#00000014;color:var(--color-accent);font-weight:600}.nav-icon{margin-right:12px;font-size:18px;color:inherit;display:flex;align-items:center;justify-content:center;opacity:.7}.nav-item.active .nav-icon{opacity:1}.nav-label{flex:1}.nav-separator{height:1px;background-color:#0000000f;margin:8px 12px}.dashboard{min-height:100vh;display:flex}.sidebar-container{width:250px;flex-shrink:0;background:#fff6;backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px);border-right:1px solid rgba(255,255,255,.4)}.main-content{flex:1;display:flex;flex-direction:column;width:calc(100% - 250px)}.top-app-bar{height:64px;padding:0 32px;display:flex;align-items:center;justify-content:space-between;background:#fff6;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid rgba(255,255,255,.4);position:sticky;top:0;z-index:1000}.app-headline{font-weight:600;font-size:17px;color:var(--app-text-primary);display:flex;align-items:center;gap:12px;letter-spacing:-.01em}.app-headline .brand-color-dot{width:8px;height:8px;border-radius:50%;background-color:var(--color-accent);box-shadow:0 0 8px var(--color-accent)}.search-bar{height:36px;background:#0000000d;border-radius:8px;display:flex;align-items:center;padding:0 10px;width:360px;transition:all .2s ease}.search-bar:focus-within{background:#fffc;box-shadow:0 0 0 3px #007aff33}.search-icon{color:var(--app-text-tertiary);font-size:16px;margin-right:6px}.search-input{border:none;background:transparent;font-family:var(--font-sans);font-size:13px;color:var(--app-text-primary);flex:1;outline:none}.search-input::placeholder{color:var(--app-text-tertiary)}.content-area{padding:32px 40px;display:flex;flex-direction:column;gap:24px;max-width:1000px;width:100%;margin:0 auto;box-sizing:border-box}.fab-create{position:fixed;bottom:32px;right:32px;height:50px;padding:0 24px;border-radius:25px;background:var(--color-accent-gradient);color:var(--color-white);border:none;box-shadow:var(--shadow-float);display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;font-weight:600;font-size:15px;transition:transform .2s cubic-bezier(.34,1.56,.64,1);z-index:1100}.fab-create:hover{transform:scale(1.05) translateY(-2px);box-shadow:0 24px 48px -10px #007aff59}.md-card{background:var(--app-surface);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:var(--radius-lg);padding:24px;display:flex;flex-direction:column;gap:20px;box-shadow:var(--shadow-card)}.card-header-row{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:6px;border-bottom:1px solid rgba(0,0,0,.04);padding-bottom:12px}.card-title{font-weight:700;font-size:19px;color:var(--app-text-primary);letter-spacing:-.02em;margin:0}.card-subtitle{font-size:14px;color:var(--app-text-secondary)}.md-input-container{display:flex;flex-direction:column;gap:8px}.md-label{font-size:12px;font-weight:600;color:var(--app-text-secondary);margin-left:2px}.md-input{height:44px;border-radius:10px;border:1px solid rgba(0,0,0,.1);background:#ffffff80;padding:0 12px;font-size:15px;color:var(--app-text-primary);transition:all .2s;font-family:var(--font-sans)}.md-input:focus{background:#fff;border-color:var(--color-accent);box-shadow:0 0 0 3px #007aff26;outline:none}.md-btn{height:38px;padding:0 18px;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;border:none;display:flex;align-items:center;justify-content:center;gap:6px;transition:all .2s}.md-btn-filled{background:var(--color-accent);color:var(--color-white)}.md-btn-filled:hover{filter:brightness(1.1)}.md-btn-text{background:transparent;color:var(--color-accent)}.md-btn-text:hover{background:#007aff14}.form-grid{display:grid;grid-template-columns:300px 1fr;gap:40px}.values-grid{display:grid;grid-template-columns:1fr;gap:16px}.checkbox-row{display:flex;align-items:center;gap:10px;cursor:pointer;-webkit-user-select:none;user-select:none;padding:6px 0}.checkbox-input{width:18px;height:18px;accent-color:var(--color-accent);border-radius:4px}.checkbox-label{font-size:14px;font-weight:500;color:var(--app-text-primary)}.cards-list{display:flex;flex-direction:column;background:var(--app-surface);border-radius:var(--radius-lg);border:1px solid var(--glass-border);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);overflow:hidden}.custom-checkbox{width:16px;height:16px;accent-color:var(--color-accent);cursor:pointer}.key-row{display:grid;grid-template-columns:24px 280px 1fr;gap:24px;padding:16px 24px;border-bottom:1px solid rgba(0,0,0,.06);align-items:flex-start;transition:background .2s ease}.key-row.selected{background-color:#007aff14}.key-check-col{display:flex;align-items:flex-start;padding-top:2px}.bulk-actions-bar{position:fixed;bottom:32px;left:50%;transform:translate(-50%);background:#ffffffd9;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);padding:12px 24px;border-radius:var(--radius-full);display:flex;align-items:center;gap:24px;box-shadow:var(--shadow-float);z-index:1300;min-width:400px;justify-content:space-between;animation:slideUp .3s cubic-bezier(.2,.8,.2,1)}@keyframes slideUp{0%{transform:translate(-50%,100%);opacity:0}to{transform:translate(-50%);opacity:1}}.bulk-divider{width:1px;height:20px;background:#0000001a}.bulk-input{background:transparent;border:none;border-bottom:1px solid var(--color-accent);padding:4px;font-size:13px;color:var(--app-text-primary);width:120px;outline:none}@media (max-width: 900px){.key-row{grid-template-columns:24px 1fr;gap:12px;padding:16px}.key-info-col{grid-column:2 / -1;flex-direction:row;justify-content:space-between;align-items:center;padding-top:0;width:100%}.key-input-col{grid-column:2 / -1;flex-direction:row}.bulk-actions-bar{width:90%;min-width:auto;bottom:24px;flex-direction:column;gap:16px;border-radius:var(--radius-lg)}}.key-row{display:grid;grid-template-columns:280px 1fr;gap:24px;padding:16px 24px;border-bottom:1px solid rgba(0,0,0,.06);align-items:flex-start;transition:background .2s ease}.key-row:last-child{border-bottom:none}.key-row:hover{background-color:#fff6}.key-info-col{display:flex;flex-direction:column;gap:6px;padding-top:6px}.key-name-text{font-family:var(--font-mono);font-size:13px;font-weight:600;color:var(--app-text-primary);word-break:break-all}.tags-row{display:flex;flex-wrap:wrap;gap:4px}.tag-pill{font-size:10px;font-weight:500;background:#0000000a;color:var(--app-text-secondary);padding:2px 6px;border-radius:4px}.key-input-col{position:relative;width:100%}.row-input{width:100%;min-height:38px;padding:8px 10px;border-radius:8px;background:transparent;border:1px solid transparent;font-family:var(--font-sans);font-size:14px;color:var(--app-text-primary);line-height:1.5;outline:none;transition:all .2s;resize:vertical}.row-input:hover{background:#00000008}.row-input:focus{background:var(--color-white);border-color:var(--color-accent);box-shadow:0 0 0 3px #007aff1a}.char-count{position:absolute;bottom:-18px;right:0;font-size:10px;color:var(--app-text-tertiary);opacity:0;transition:opacity .2s}.row-input:focus+.char-count{opacity:1}.no-tags-label{font-size:10px;color:var(--app-text-tertiary);font-style:italic}.edit-tags-btn{background:transparent;border:none;cursor:pointer;color:var(--app-text-tertiary);opacity:.5;padding:0 4px;display:flex;align-items:center;transition:all .2s}.edit-tags-btn:hover{color:var(--color-accent);opacity:1}.tag-editor-inline{display:flex;align-items:center}.tag-input-small{font-size:11px;padding:4px 6px;border-radius:4px;border:1px solid var(--color-accent);outline:none;width:120px;font-family:var(--font-mono)}.broadcast-btn{opacity:.4;transition:all .2s;height:38px;width:38px;flex-shrink:0;margin-top:1px}.broadcast-btn:hover{opacity:1;background:#007aff1a;color:var(--color-accent)}@media (max-width: 900px){.key-row{grid-template-columns:1fr;gap:12px;padding:16px}.key-info-col{flex-direction:row;justify-content:space-between;align-items:center;padding-top:0;width:100%}.key-input-col{flex-direction:row}}.icon-btn{background:transparent;border:none;color:var(--app-text-tertiary);cursor:pointer;border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;transition:all .2s}.icon-btn:hover{background:#0000000a;color:var(--app-text-primary)}.key-card-body{position:relative;display:flex;flex-direction:column}.card-input{width:100%;min-height:44px;padding:10px 14px;border-radius:10px;background:#fff6;border:1px solid transparent;font-family:var(--font-sans);font-size:15px;color:var(--app-text-primary);line-height:1.5;outline:none;transition:all .2s;box-sizing:border-box}.card-input:hover{background:#fff9}.card-input:focus{background:#fff;box-shadow:0 0 0 3px #007aff26}.char-count{position:absolute;bottom:-20px;right:4px;font-size:11px;color:var(--app-text-tertiary);font-weight:500}.tag-editor-area{margin-top:8px;padding-bottom:8px;border-bottom:1px dashed var(--app-border);margin-bottom:8px}.tag-input{width:100%;padding:6px 8px;border-radius:var(--radius-sm);border:1px solid var(--color-brand-primary);font-size:13px;outline:none;background-color:var(--color-white)}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.skeleton-wrapper{position:relative;overflow:hidden;background:#fff6;border-radius:var(--radius-md)}.skeleton-wrapper:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(90deg,#fff0,#fff6,#fff0);animation:shimmer 1.5s infinite}.skeleton-card{background:var(--app-surface);border:1px solid var(--glass-border);border-radius:var(--radius-lg);padding:24px;height:180px;display:flex;flex-direction:column;gap:16px;margin-bottom:16px}.skeleton-line{height:16px;border-radius:4px;background:#0000000f;width:100%}.skeleton-title{width:40%;height:20px}.skeleton-input{height:44px;border-radius:10px;width:100%;margin-top:auto}.mobile-backdrop{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#0003;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1150;opacity:0;pointer-events:none;transition:opacity .3s ease}.mobile-backdrop.visible{opacity:1;pointer-events:auto}@media (max-width: 900px){.dashboard{position:relative}.menu-btn{display:flex!important}.sidebar-container{position:fixed;left:-280px;width:280px;top:0;bottom:0;z-index:1200;transition:transform .4s cubic-bezier(.19,1,.22,1);box-shadow:none;border-right:none;background-color:#ffffffbf;backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px)}.sidebar-container.open{transform:translate(280px);box-shadow:0 0 40px #00000026}.sidebar-container>*{background:transparent!important}.main-content{width:100%;margin-left:0}.search-bar{width:auto;flex:1;max-width:100%}.content-area{padding:16px}.fab-create{bottom:24px;right:24px}.form-grid{grid-template-columns:1fr;gap:24px}}:root{--color-white: #ffffff;--color-black: #000000;--glass-base: rgba(255, 255, 255, .65);--glass-border: rgba(255, 255, 255, .4);--glass-highlight: rgba(255, 255, 255, .8);--glass-shadow: rgba(0, 0, 0, .05);--color-accent: #007aff;--color-accent-gradient: linear-gradient(135deg, #007aff, #00C6FF);--color-accent-text: #007aff;--app-bg: #f5f5f7;--app-bg-gradient: radial-gradient(at 0% 0%, hsla(253, 16%, 7%, 1) 0, transparent 50%), radial-gradient(at 50% 0%, hsla(225, 39%, 30%, 1) 0, transparent 50%), radial-gradient(at 100% 0%, hsla(339, 49%, 30%, 1) 0, transparent 50%);--app-bg-mesh: radial-gradient(at 80% 0%, hsla(189, 100%, 96%, 1) 0px, transparent 50%), radial-gradient(at 0% 50%, hsla(341, 100%, 96%, 1) 0px, transparent 50%), radial-gradient(at 80% 50%, hsla(269, 100%, 96%, 1) 0px, transparent 50%), radial-gradient(at 0% 100%, hsla(341, 100%, 96%, 1) 0px, transparent 50%), radial-gradient(at 80% 100%, hsla(172, 100%, 96%, 1) 0px, transparent 50%), radial-gradient(at 0% 0%, hsla(341, 100%, 96%, 1) 0px, transparent 50%);--app-surface: rgba(255, 255, 255, .75);--app-surface-hover: rgba(255, 255, 255, .85);--app-border: rgba(0, 0, 0, .06);--app-text-primary: rgba(0, 0, 0, .92);--app-text-secondary: rgba(0, 0, 0, .55);--app-text-tertiary: rgba(0, 0, 0, .35);--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", sans-serif;--font-mono: "SF Mono", "Menlo", "Monaco", "Courier New", monospace;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 18px;--radius-full: 9999px;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-card: 0 4px 24px -1px rgba(0, 0, 0, .06);--shadow-float: 0 20px 40px -8px rgba(0, 0, 0, .12);--blur-strength: 20px}body{background-color:#fbfbfd;background-image:var(--app-bg-mesh);background-attachment:fixed;background-size:120% 120%;color:var(--app-text-primary);font-family:var(--font-sans);font-size:14px;line-height:1.5;margin:0;-webkit-font-smoothing:antialiased}.material-symbols-rounded{font-size:20px;font-variation-settings:"FILL" 1,"wght" 400,"GRAD" 0,"opsz" 24}
