:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:#222944;background:#f7f8fc;font-size:14px}*{box-sizing:border-box}body{margin:0}a{color:#6546cc;text-decoration:none}a:hover{text-decoration:underline}.app{display:flex;min-height:100vh}.sidebar{width:240px;flex:none;background:#fff;border-right:1px solid #ebebf2;display:flex;flex-direction:column;padding:24px 14px 17px;position:sticky;top:0;height:100vh}.brand{display:flex;gap:10px;align-items:center;margin:5px 10px 35px;color:#202440}.brand:hover{text-decoration:none}.brand-icon{background:linear-gradient(135deg,#6942d5,#9b82ff);width:38px;height:38px;border-radius:12px;display:grid;place-items:center;font-size:26px;color:white;box-shadow:0 5px 12px #6844d52a}.brand b{display:block;font-size:16px;letter-spacing:-.5px}.brand small{display:block;margin-top:2px;color:#858aa1;font-size:11px}.side-heading{color:#a1a4b4;font-weight:800;font-size:10px;letter-spacing:1.5px;margin:0 14px 12px}.side-heading.extra{margin-top:28px}.nav-item{display:flex;gap:12px;align-items:center;padding:12px 14px;margin:2px 0;border-radius:9px;color:#6c7187;font-weight:650}.nav-item:hover{background:#f7f6ff;text-decoration:none}.nav-item.selected{background:#f0eafe;color:#6742d2}.nav-icon{font-size:20px;line-height:1;width:20px;text-align:center}.side-bottom{margin:auto 10px 0;padding-top:20px}.sandbox-tag{font-size:12px;color:#16785e;font-weight:700;background:#e9fbf4;border-radius:8px;padding:10px}.side-bottom small{color:#939bad;margin:9px 3px;display:block}.main-area{flex:1;min-width:0}.topbar{height:77px;display:flex;justify-content:space-between;align-items:center;padding:0 38px;background:#fff;border-bottom:1px solid #eaeaf1}.topbar-title{font-weight:700;color:#656982}.top-controls{display:flex;align-items:center;gap:16px}.pill{background:#f1edff;color:#6545cc;border-radius:30px;padding:8px 13px;font-size:11px;font-weight:750}.avatar{border-radius:50%;width:32px;height:32px;display:grid;place-items:center;background:#6746d9;color:white;font-weight:800}.inline{display:inline}.text-btn{border:0;background:transparent;cursor:pointer;color:#737990;font-weight:600}.content{max-width:1280px;margin:0 auto;padding:35px 38px 20px}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px;gap:20px}.eyebrow{font-weight:800;color:#856bd7;font-size:10px;letter-spacing:2px;margin-bottom:9px}h1,h2,p{margin-top:0}h1{font-size:29px;letter-spacing:-1.05px;margin-bottom:6px;font-weight:750}h2{font-size:17px;letter-spacing:-.35px;margin-bottom:9px}.muted{color:#9298ab;line-height:1.55}.section-header p{margin:0}.header-tag{background:#f0eff9;border:1px solid #e9e5ff;color:#8174bb;border-radius:30px;padding:9px 14px;font-size:12px;white-space:nowrap}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-bottom:22px}.metric,.panel-box{background:#fff;border:1px solid #eeeff5;border-radius:15px;box-shadow:0 4px 24px #27365d05}.metric{padding:23px}.metric-icon{font-size:23px;width:42px;height:42px;display:grid;place-items:center;border-radius:12px;margin-bottom:16px}.purple{background:#f0eaff;color:#7252d7}.blue{background:#eaf4ff;color:#477ddc}.teal{background:#e7faf4;color:#1b9980}.orange{background:#fff2e7;color:#d68c4b}.metric small,.metric strong,.metric span{display:block}.metric small{color:#8c91a6;font-size:13px;margin-bottom:6px}.metric strong{font-size:29px;letter-spacing:-.8px;margin-bottom:4px}.metric span{font-size:11px;color:#adb0c0}.two-col{display:grid;grid-template-columns:1.28fr 1fr;gap:20px}.panel-box{padding:24px;margin-bottom:19px}.panel-title{margin-bottom:21px}.panel-title p{font-size:13px;color:#9ba0b0;margin:0}.quick-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.quick-grid a{border:1px solid #eff0f7;border-radius:12px;padding:17px;display:flex;flex-direction:column;gap:7px;color:#34364e}.quick-grid a:hover{border-color:#c7b7ff;text-decoration:none}.quick-icon{font-size:26px;color:#7052da}.quick-grid b{font-size:13px}.quick-grid small{font-size:11px;color:#979bad}.safety-list{line-height:2.8;color:#537d74;font-weight:600;font-size:12px}.tip{border-top:1px solid #f2f2f5;padding-top:16px;color:#a1a3b1;font-size:12px;line-height:1.6}.site-row{display:flex;align-items:center;gap:12px;border-top:1px solid #f0f0f6;padding:15px 0}.site-row small{display:block;color:#9ca0b0;font-size:11px;margin-top:4px}.site-mark{border-radius:12px;padding:10px;background:#f0eeff;color:#7356d9}.site-actions{margin-left:auto;display:flex;gap:7px;flex-wrap:wrap}.btn,.primary{padding:10px 15px;display:inline-flex;justify-content:center;align-items:center;cursor:pointer;font-weight:700;font-size:12px;border-radius:8px;border:1px solid #e2ddf2;background:#f1ebff;color:#6647c9}.primary{background:#6847da;border:1px solid #6847da;color:white}.btn.small{padding:8px 10px;font-size:11px}.btn.outline{background:white}.btn.danger{border-color:#ffe0e0;color:#a92545;background:#fff2f3}.btn-row{display:flex;gap:9px;margin-top:12px}.btn:hover,.primary:hover{filter:brightness(.95);text-decoration:none}.notice{margin-bottom:20px;padding:13px 16px;border-radius:10px;font-weight:600;font-size:12px}.notice.good{background:#e9fbf3;color:#20815c}.notice.bad{background:#fff0f2;color:#a02e49}form label{display:flex;flex-direction:column;color:#545a74;font-weight:700;font-size:12px;margin:0 0 15px;gap:7px}input,select,textarea{font:inherit;width:100%;border:1px solid #e2e4ed;border-radius:8px;padding:12px 13px;color:#252b46;background:white;outline:none}input:focus,textarea:focus{border-color:#8c78e5;box-shadow:0 0 0 3px #8974ef21}input[type=file]{padding:10px}textarea{font-family:ui-monospace,Consolas,monospace;line-height:1.6;resize:vertical}.tiny{font-size:11px}.file-toolbar{display:flex;gap:18px;justify-content:space-between;align-items:center;flex-wrap:wrap;margin-bottom:20px}.select-form label{min-width:160px;margin:0}.folder-path{background:#f6f7fb;border-radius:7px;padding:12px 15px;color:#67708e;font:12px ui-monospace,monospace;overflow-wrap:anywhere}.back-link{display:inline-block;margin-bottom:10px}.file-head,.file-row{display:grid;grid-template-columns:minmax(0,1fr) 85px 65px;gap:10px;padding:12px 9px;align-items:center}.file-head{color:#9aa0b1;font-size:11px;background:#f8f9fd;font-weight:700}.file-row{border-bottom:1px solid #f3f4f7}.file-row>div{min-width:0;overflow-wrap:anywhere}.file-ico{margin-right:9px}.empty{padding:20px}.file-tools{margin-top:20px}.file-tools .panel-box{margin:0}.editor{margin-top:20px}.db-card{border:1px solid #eeeef5;padding:16px;border-radius:11px;margin:12px 0}.db-card small{display:block;margin:8px 0;color:#9296ad}.db-fields{display:flex;flex-direction:column;gap:8px;word-break:break-all;font-size:12px;color:#626983}.db-fields code,code,pre{font-family:ui-monospace,Consolas,monospace;font-size:12px;background:#f4f3fa;color:#524a83;border-radius:5px;padding:2px 5px}pre{padding:18px;overflow:auto}.placeholder{text-align:center;padding:60px 20px}.placeholder p{max-width:560px;margin:16px auto;color:#949aab;line-height:1.7}.coming-icon{display:inline-grid;place-items:center;border-radius:50%;width:68px;height:68px;background:#eee9ff;color:#6b4bd8;font-size:38px;margin-bottom:22px}.status-line{display:inline-block;padding:12px 16px;border-radius:9px;background:#f3f0ff;color:#8069c9;font-weight:700;font-size:12px}footer{color:#b3b6c4;text-align:center;font-size:11px;padding:27px 0 10px}.login-body{min-height:100vh;display:grid;place-items:center;background:radial-gradient(ellipse at 10% 10%,#ede6ff,#f7f8fc 54%)}.login-card{width:min(92vw,430px);background:white;border:1px solid #f0eefe;border-radius:21px;box-shadow:0 20px 70px #5d508b23;padding:34px}.login-card .brand-icon{margin-bottom:22px}.login-card h1{font-size:25px}.login-card .muted{margin-bottom:25px}.login-card form{margin:26px 0}.login-card .full{width:100%;padding:12px}.login-card .tiny{margin:22px 0 0;text-align:center}@media(max-width:980px){.metrics{grid-template-columns:repeat(2,1fr)}.two-col{grid-template-columns:1fr}.content{padding:25px}.topbar{padding:0 25px}}@media(max-width:700px){.app{display:block}.sidebar{position:relative;width:100%;height:auto;padding:12px;display:flex;flex-direction:row;flex-wrap:wrap;gap:0;border-bottom:1px solid #eee}.brand{margin:0 0 8px;width:100%}.sidebar .side-heading,.sidebar .side-bottom{display:none}.nav-item{padding:9px 11px;font-size:11px;margin:1px 3px 1px 0}.nav-icon{font-size:16px;width:16px}.topbar{height:55px;padding:0 17px}.topbar-title,.header-tag{display:none}.content{padding:23px 15px}.metrics{gap:9px}.metric{padding:16px}.metric strong{font-size:25px}.quick-grid{gap:8px}.panel-box{padding:16px}.pill{font-size:10px}.site-row{flex-wrap:wrap}.site-actions{margin-left:0;width:100%}.file-head,.file-row{grid-template-columns:minmax(0,1fr) 62px 40px;font-size:12px}}
.cred-line{display:grid;grid-template-columns:minmax(90px,1fr) minmax(90px,2fr) auto auto;align-items:center;gap:8px;margin:8px 0;word-break:break-word}.cred-line>span{font-size:12px;color:#727891}.cred-line code{overflow-wrap:anywhere}.cred-line .secret-field{font-size:12px;min-width:0;padding:9px 10px}.db-card details{padding:12px 0}.db-card summary{cursor:pointer;color:#6847da;font-weight:700}form .btn[data-fill-password]{margin-bottom:12px}@media(max-width:700px){.cred-line{grid-template-columns:1fr 1fr;gap:7px}.cred-line>span{grid-column:1 / -1}.cred-line code,.cred-line input{grid-column:1 / -1}}

.file-head,.file-row{grid-template-columns:minmax(0,1fr) 75px minmax(145px,2fr)}.file-actions{display:flex;gap:6px;align-items:center;justify-content:flex-end;flex-wrap:wrap}.file-menu{display:inline-block;min-width:90px}.file-menu summary{cursor:pointer;font-weight:700;color:#6847da;padding:8px}.file-menu[open]{width:100%;padding:9px;border:1px solid #e2ddf2;border-radius:9px;background:#faf9ff}.file-menu form{margin:8px 0}.file-menu form label{margin-bottom:7px}.file-menu input{padding:8px;min-width:0}.file-tools .panel-box h2:not(:first-child){margin-top:20px}@media(max-width:700px){.file-head,.file-row{grid-template-columns:minmax(0,1fr) 54px minmax(110px,1.5fr);gap:4px}.file-actions{justify-content:flex-start}.file-actions .btn.small{padding:6px;font-size:10px}}
/* v0.5 mobile-first cards and popover actions */
.files-top{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}.files-top form{display:flex;flex-wrap:wrap;gap:8px;align-items:end}.files-top select{min-width:190px}.folder-path{padding:10px 14px;border-radius:9px;background:#f6f3ff;color:#5b5480;overflow-wrap:anywhere;font:12px ui-monospace,monospace}.filebar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:18px 0}.file-add,.entry-more{position:relative}.file-add>summary,.entry-more>summary{list-style:none;cursor:pointer}.file-add>summary::-webkit-details-marker,.entry-more>summary::-webkit-details-marker{display:none}.file-add-popup,.entry-pop{position:absolute;z-index:15;right:0;top:calc(100% + 4px);width:min(315px,calc(100vw - 44px));background:#fff;border:1px solid #e5e0f4;border-radius:15px;padding:15px;box-shadow:0 16px 42px #16122b2b}.file-add-popup form,.entry-pop form{display:block;margin:0 0 14px}.file-add-popup form+form,.entry-pop form+form{border-top:1px solid #eeeef3;padding-top:12px}.file-add-popup label,.entry-pop label{font-size:12px}.file-add-popup button,.entry-pop button,.entry-pop a{display:inline-flex;margin:5px 0}.entry-list{display:flex;flex-direction:column;gap:8px}.file-entry{display:flex;align-items:center;gap:11px;padding:12px;border:1px solid #eeeaf6;border-radius:12px;min-width:0}.entry-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:9px;background:#f3efff;flex-shrink:0;font-size:20px}.entry-info{min-width:0;flex:1;display:flex;flex-direction:column;gap:4px}.entry-info>b,.entry-info>a{font-size:13px;overflow-wrap:anywhere}.entry-info small,.site-main small{font-size:11px;color:#9093a8}.entry-actions{display:flex;gap:6px;align-items:center;flex-shrink:0}.entry-more>summary{display:grid;place-items:center;width:36px;height:36px;font-size:23px;border:1px solid #e7e3f3;border-radius:9px;color:#6546cc;background:white}.entry-pop .pop-title{font-weight:700;overflow-wrap:anywhere;padding-bottom:9px}.site-manage{border-top:1px solid #f1eff6;padding:15px 0;display:flex;align-items:center;gap:12px;justify-content:space-between;flex-wrap:wrap}.site-main{display:flex;flex-direction:column;gap:5px;min-width:160px;flex:1}.site-main code{font-size:11px;color:#6e638e;overflow-wrap:anywhere}.site-controls{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.owner-group{border:1px solid #ece9f3;border-radius:12px;margin:12px 0;padding:0;background:white}.owner-group>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px;color:#342b64;font-weight:700}.owner-group>summary::-webkit-details-marker{display:none}.owner-group>summary:before{content:'▸';margin-right:3px;color:#7957de}.owner-group[open]>summary:before{content:'▾'}.owner-group>summary small{color:#8c8ca7;font-weight:500}.owner-contents{padding:0 15px 12px}.code-editor{border:1px solid #d6d3e5;border-radius:10px;display:flex;max-width:100%;overflow:hidden;background:#fcfcff}.code-gutter,.code-input{margin:0;border:0;border-radius:0;line-height:23px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px;white-space:pre;tab-size:4}.code-gutter{width:50px;flex:0 0 50px;overflow:hidden;background:#f3f0fc;color:#958caa;padding:13px 9px;text-align:right;user-select:none;pointer-events:none}.code-input{display:block;flex:1;min-width:0;width:100%;resize:vertical;overflow:auto;padding:13px 12px;outline:none;background:transparent;min-height:380px}.code-input:focus{box-shadow:inset 0 0 0 1px #9e82eb}.edit-heading{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px}.edit-heading small{color:#8e8ca2}.db-card .cred-line{grid-template-columns:minmax(90px,1fr) minmax(85px,2fr) auto auto}.db-card .cred-line button{white-space:nowrap}.db-card .cred-line input{font-size:12px}
@media(max-width:700px){.files-top{align-items:stretch}.files-top form{width:100%}.files-top label{flex:1}.files-top select{min-width:0;width:100%}.file-entry{padding:10px}.entry-actions .btn.small{font-size:12px;padding:9px 10px}.entry-more>summary{width:38px;height:38px}.file-add-popup{left:0;right:auto}.site-controls{width:100%}.db-card .cred-line{display:grid;grid-template-columns:1fr auto auto}.db-card .cred-line>span{grid-column:1/-1}.db-card .cred-line code,.db-card .cred-line input{grid-column:1/-1}.db-card .cred-line .btn{grid-column:auto}.code-gutter{width:42px;flex-basis:42px;padding:12px 6px}.code-input{padding:12px 9px;min-height:320px}}
