:root{--bg: #f6f4ef;--surface: #fffcf5;--ink: #1c1b19;--muted: #5c5954;--line: #d8d3c9;--accent: #2f6feb;--accent-dim: #e8f0fe;--danger: #b42318;--radius: 8px;--font: "Literata", Georgia, "Times New Roman", serif;--mono: "JetBrains Mono", ui-monospace, monospace}*,*:before,*:after{box-sizing:border-box}html{font-size:16px;-webkit-text-size-adjust:100%}body{margin:0;font-family:var(--font);color:var(--ink);background:var(--bg);line-height:1.45}code,.kbd{font-family:var(--mono);font-size:.88em;background:var(--accent-dim);padding:.1em .35em;border-radius:4px}.hidden{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.small,.small *{font-size:.92rem}.tiny{font-size:.82rem}.muted{color:var(--muted)}.error{color:var(--danger)}.layout{min-height:100vh}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#1c1b1959;display:flex;align-items:center;justify-content:center;padding:1rem;z-index:40}.overlay-card{width:min(420px,100%);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1.5rem;box-shadow:0 12px 40px #0000001f}.field{display:flex;flex-direction:column;gap:.35rem;margin:.75rem 0}.field.tight{margin:0;gap:0}.flex-grow{flex:1 1 120px;min-width:0}.field span{font-size:.9rem;color:var(--muted)}.field.inline{flex-direction:row;align-items:center;gap:.5rem;margin:0}.field.inline span{min-width:auto}input,select,textarea{font:500 .875rem var(--mono);padding:.4rem .5rem;border:1px solid var(--line);border-radius:5px;background:#fff;color:var(--ink);width:100%}.input-compact{padding:.32rem .45rem;font-size:.8125rem}.flt-select{min-width:5.5rem;max-width:7.5rem}.btn-compact{padding:.32rem .55rem;font-size:.8125rem}textarea{min-height:140px;resize:vertical}.btn{font-family:var(--font);cursor:pointer;border-radius:6px;border:1px solid var(--line);background:#fff;color:var(--ink);padding:.55rem .9rem}.btn.primary{background:var(--ink);color:#fff;border-color:var(--ink)}.btn.secondary{background:var(--surface)}.btn.ghost{background:transparent}.btn.small,.btn.tiny{padding:.35rem .65rem;font-size:.88rem}.btn.danger{border-color:#f5c6c2;color:var(--danger);background:#fff5f5}.topbar{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.5rem .85rem;border-bottom:1px solid var(--line);background:var(--surface);position:sticky;top:0;z-index:50}.topbar-start{display:flex;align-items:center;gap:.45rem;min-width:0;flex:1 1 auto}.sidebar-menu-btn{display:none;flex-shrink:0}.brand{display:flex;gap:.75rem;align-items:center;min-width:0;flex:1 1 auto}.brand>div{min-width:0}.brand strong,.brand .tiny{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.brand-logo{width:40px;height:40px;border-radius:var(--radius);object-fit:contain;flex-shrink:0;display:block}.shell{display:grid;grid-template-columns:minmax(240px,280px) 1fr;gap:0;min-height:calc(100vh - 48px)}.sidebar{border-right:1px solid var(--line);background:#faf8f3;padding:.65rem .7rem;overflow:auto}.sidebar-drawer-head{display:none}.sidebar-scroll{min-height:0}.sidebar-backdrop{display:none}.main{padding:.65rem .85rem;overflow:auto}.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:.65rem .75rem;margin-bottom:.65rem}.panel.flat{background:transparent;border:none;padding:0}.panel h3{margin:0 0 .35rem;font-size:.98rem}.stack{display:flex;flex-direction:column;gap:.5rem}.account-item{display:flex;align-items:center;justify-content:space-between;gap:.35rem;padding:.35rem .45rem;border:1px solid var(--line);border-radius:5px;background:#fff}.account-item.active{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}.account-item button{font-size:.8rem}.list{display:flex;flex-direction:column;gap:.35rem;max-height:42vh;overflow:auto}.zone-item{text-align:left;width:100%;padding:.38rem .5rem;border:1px solid var(--line);border-radius:5px;background:#fff;font:inherit;cursor:pointer}.zone-item:hover{background:var(--accent-dim)}.zone-item.active{border-color:var(--accent);background:var(--accent-dim)}.row-between{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.banner{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:.5rem 1rem;padding:.55rem .75rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);margin-bottom:.65rem}.banner h2{margin:0;font-size:1.15rem;line-height:1.25}.banner-actions{display:flex;flex-wrap:wrap;gap:.35rem}.toolbar{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:.75rem;margin-bottom:.75rem}.toolbar-left,.toolbar-right{display:flex;flex-wrap:wrap;gap:.5rem;align-items:flex-end}.records-section{margin-bottom:0}.records-toolbar{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:.45rem .65rem;padding:.45rem .55rem;margin-bottom:.35rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}.toolbar-filters{display:flex;flex-wrap:wrap;align-items:flex-end;gap:.35rem;flex:1 1 240px;min-width:0}.toolbar-actions{display:flex;align-items:center;gap:.35rem;flex-shrink:0}.records-meta{margin:0 0 .35rem;line-height:1.3}.table-wrap{overflow:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}.table{width:100%;border-collapse:collapse;font-size:.8125rem;line-height:1.35}.table-record th,.table-record td{padding:.32rem .45rem;border-bottom:1px solid var(--line);vertical-align:middle;text-align:left}.table th{background:var(--bg);font-weight:600;white-space:nowrap;font-size:.78rem;letter-spacing:.02em;color:var(--muted);text-transform:none}.col-type{width:4rem}.col-narrow{width:3.25rem;white-space:nowrap}.col-actions{width:5.5rem;text-align:right}.col-name{min-width:7rem;max-width:14rem}.col-content{min-width:6rem}.table tr:last-child td{border-bottom:none}.cell-mono{font-family:var(--mono);font-size:.78rem;word-break:break-word}.pill{display:inline-block;padding:.06rem .35rem;border-radius:999px;border:1px solid var(--line);font-family:var(--mono);font-size:.72rem;font-weight:600;background:#fff;line-height:1.3}.pill-dns-A{background:#e8f1ff;border-color:#93b4f0;color:#163fad}.pill-dns-AAAA{background:#ede9fe;border-color:#c4b5fd;color:#5b21b6}.pill-dns-CNAME{background:#d1fae5;border-color:#6ee7b7;color:#047857}.pill-dns-MX{background:#ffedd5;border-color:#fdba74;color:#c2410c}.pill-dns-TXT{background:#f4f4f5;border-color:#d4d4d8;color:#3f3f46}.pill-dns-NS{background:#fce7f3;border-color:#f9a8d4;color:#9d174d}.pill-dns-SRV{background:#f3e8ff;border-color:#d8b4fe;color:#6b21a8}.pill-dns-CAA{background:#cffafe;border-color:#67e8f9;color:#0e7490}.pill-dns-PTR{background:#e0f2fe;border-color:#7dd3fc;color:#0369a1}.pill-dns-HTTPS,.pill-dns-SVCB{background:#e0e7ff;border-color:#a5b4fc;color:#4338ca}.pill-dns-CERT,.pill-dns-DNSKEY,.pill-dns-DS,.pill-dns-LOC,.pill-dns-NAPTR,.pill-dns-SMIMEA,.pill-dns-SSHFP,.pill-dns-TLSA,.pill-dns-URI,.pill-dns-UNKNOWN{background:#fafafa;border-color:#e4e4e7;color:#52525b}.record-content{word-break:break-word}.record-content--ipv4{color:#1d4ed8;font-weight:500}.record-content--ipv6{color:#6d28d9;font-weight:500}.record-content--host{color:#0f766e}.record-content--json{color:#86198f;font-weight:500}.record-content--empty{color:var(--muted);font-weight:400}.td-name-rec{color:#3730a3}.proxy-badge{display:inline-block;padding:.12rem .42rem;border-radius:6px;font-size:.72rem;font-weight:600;line-height:1.25}.proxy-badge.proxy-on{background:#fef3c7;border:1px solid #fcd34d;color:#b45309}.proxy-badge.proxy-off{background:#e8f0fe;border:1px solid #b6cbf7;color:#1e40af}.proxy-badge.proxy-na{background:transparent;border:1px solid transparent;color:var(--muted);font-weight:500}.ttl-tag{display:inline-block;padding:.08rem .38rem;border-radius:5px;font-family:var(--mono);font-size:.74rem;font-weight:500}.ttl-tag.ttl-auto{background:#ecfdf5;border:1px solid #a7f3d0;color:#047857}.ttl-tag.ttl-num{background:#f8fafc;border:1px solid var(--line);color:var(--muted)}.btn-action-edit{border-color:#bfdbfe;background:#eff6ff;color:#1e40af}.btn-action-edit:hover{background:#dbeafe;border-color:#93c5fd}.record-actions{display:inline-flex;flex-direction:row;flex-wrap:nowrap;align-items:center;justify-content:flex-end;gap:.25rem}.td-actions{text-align:right;white-space:nowrap}.btn-action{padding:.22rem .45rem;font-size:.75rem;line-height:1.2}.pager{display:flex;align-items:center;gap:.75rem;margin-top:.75rem}.pager-tight{margin-top:.45rem;gap:.5rem}.zone-pager{display:flex;align-items:center;flex-wrap:wrap;gap:.35rem}.details summary{cursor:pointer;font-weight:600;margin:.5rem 0}.drawer{position:fixed;top:0;right:0;bottom:0;left:0;background:#1c1b1947;z-index:30;display:flex;justify-content:flex-end}.drawer-panel{width:min(520px,100%);background:var(--surface);height:100%;overflow:auto;border-left:1px solid var(--line);box-shadow:-8px 0 40px #00000014}.drawer-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.65rem .85rem;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--surface)}.drawer-head h2{margin:0;font-size:1.15rem}.drawer-body{padding:.75rem .85rem 1.5rem}.form-actions{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}.toggle{display:flex;align-items:center;gap:.45rem;font-size:.92rem}.toast{position:fixed;bottom:1.25rem;left:50%;transform:translate(-50%);background:var(--ink);color:#fff;padding:.65rem 1rem;border-radius:999px;font-size:.9rem;z-index:50;max-width:min(90vw,480px);text-align:center}.pwa-update-bar{position:fixed;bottom:0;left:0;right:0;z-index:60;display:flex;align-items:center;justify-content:center;gap:.55rem 1rem;flex-wrap:wrap;padding:.5rem .75rem;padding-bottom:max(.5rem,env(safe-area-inset-bottom));background:var(--surface);border-top:1px solid var(--line);box-shadow:0 -8px 28px #00000014;font-size:.88rem;color:var(--ink)}.pwa-update-bar-text{flex:1 1 200px;text-align:center;line-height:1.35}.pwa-update-bar-actions{display:flex;align-items:center;gap:.35rem;flex-shrink:0}@media(max-width:900px){.shell{grid-template-columns:1fr;grid-template-rows:1fr;min-height:calc(100dvh - 3.75rem)}.sidebar-menu-btn{display:inline-flex}.sidebar-backdrop{display:block;position:fixed;left:0;right:0;top:3.75rem;bottom:0;z-index:45;margin:0;padding:0;border:none;background:#1c1b1959;opacity:0;pointer-events:none;transition:opacity .2s ease;cursor:pointer;-webkit-tap-highlight-color:transparent}.sidebar-backdrop.is-visible{opacity:1;pointer-events:auto}.sidebar{position:fixed;left:0;top:3.75rem;bottom:0;width:min(90vw,20rem);max-width:100%;z-index:48;transform:translate(-105%);transition:transform .22s ease;border-right:1px solid var(--line);border-bottom:none;box-shadow:6px 0 28px #0000001f;display:flex;flex-direction:column;padding:.55rem .65rem;overflow:hidden}.sidebar.sidebar--open{transform:translate(0)}.sidebar-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem;flex-shrink:0;padding-bottom:.5rem;margin-bottom:.45rem;border-bottom:1px solid var(--line)}.sidebar-drawer-title{font-weight:600;font-size:.95rem}.sidebar-scroll{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-right:.05rem}.sidebar .list{max-height:none}.main{min-height:0}}@media(max-width:720px){.banner{margin-bottom:.45rem;padding:.38rem .48rem;gap:.35rem .55rem}.banner h2{font-size:1.05rem;line-height:1.2}.banner #zone-meta.small{font-size:.8rem;line-height:1.3;margin-top:.15rem}.banner-actions{width:100%;justify-content:stretch;gap:.28rem}.banner-actions .btn{flex:1 1 auto;min-width:0;padding:.26rem .42rem;font-size:.78rem}.records-toolbar{flex-direction:column;align-items:stretch;padding:.32rem .42rem;gap:.32rem;margin-bottom:.28rem}.toolbar-filters{display:grid;grid-template-columns:1fr 1fr;gap:.32rem;align-items:stretch}.toolbar-filters .flt-select{max-width:none}.toolbar-filters .field.flex-grow{grid-column:1 / -1}.toolbar-filters #records-search{grid-column:1 / -1;padding:.26rem .48rem;font-size:.78rem}.records-section .input-compact{padding:.24rem .38rem;font-size:.78rem}.toolbar-actions #record-new{width:100%;padding:.3rem .55rem;font-size:.78rem}.records-meta{margin:0 0 .28rem;font-size:.82rem;line-height:1.25}}@media(max-width:640px){.main{padding:.38rem .42rem}.table.table-record thead{display:none}.table.table-record tbody{display:flex;flex-direction:column;gap:.45rem;padding:.35rem .4rem}.table.table-record tr.record-row{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto auto auto;column-gap:.5rem;row-gap:.2rem;padding:.45rem .55rem;border:1px solid var(--line);border-radius:6px;background:#fff;align-items:start}.table.table-record tr.record-row td{display:block;padding:0;border:none;vertical-align:top}.table.table-record .td-type{grid-column:1;grid-row:1;align-self:center}.table.table-record .td-actions{grid-column:2;grid-row:1;justify-self:end;align-self:center}.table.table-record .td-actions:before{display:none!important;content:none!important}.table.table-record .td-name{grid-column:1 / -1;grid-row:2;font-size:.8rem}.table.table-record .td-name:before{content:"名称 ";font-size:.68rem;color:var(--muted)}.table.table-record .td-content{grid-column:1 / -1;grid-row:3;font-size:.78rem;max-height:4.2em;overflow:auto}.table.table-record .td-content:before{content:"内容 ";font-size:.68rem;color:var(--muted);display:block;margin-bottom:.1rem}.table.table-record .td-ttl{grid-column:1;grid-row:4;font-size:.72rem;color:var(--muted);align-self:end}.table.table-record .td-ttl:before{content:"TTL ";color:var(--muted);font-size:.65rem}.table.table-record .td-proxy{grid-column:2;grid-row:4;font-size:.72rem;color:var(--muted);justify-self:end;align-self:end;text-align:right}.table.table-record .td-proxy:before{content:"代理 ";color:var(--muted);font-size:.65rem}.record-actions{gap:.35rem}.btn-action{min-height:2rem;min-width:2.75rem;padding:.28rem .5rem;font-size:.78rem}}@media(min-width:641px){.table.table-record tr:nth-child(2n) td{background:#f6f4ef59}}#df-splash-host{position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999}.df-splash{position:relative;box-sizing:border-box;width:100%;height:100%;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:max(1.25rem,env(safe-area-inset-top)) max(1.25rem,env(safe-area-inset-right)) max(1.25rem,env(safe-area-inset-bottom)) max(1.25rem,env(safe-area-inset-left));overflow:hidden;font-family:var(--font);color:var(--ink);background:linear-gradient(152deg,#faf7ef 0%,var(--bg) 38%,#ebe4d8 72%,#dfeaf9 100%);isolation:isolate}.df-splash:before,.df-splash:after{content:"";position:absolute;top:-35%;right:-35%;bottom:-35%;left:-35%;pointer-events:none;z-index:0;border-radius:50%;background:radial-gradient(circle at 30% 35%,rgba(47,111,235,.14) 0%,transparent 52%);animation:dfSplashPulse 9s ease-in-out infinite}.df-splash:after{top:-40%;right:-40%;bottom:-40%;left:-40%;background:radial-gradient(circle at 72% 62%,rgba(232,240,254,.85) 0%,transparent 48%);animation-duration:11s;animation-delay:-3s}.df-splash-halo{position:absolute;width:min(120vw,720px);height:min(120vw,720px);left:50%;top:42%;transform:translate(-50%,-50%);pointer-events:none;z-index:1;background:radial-gradient(circle,rgba(47,111,235,.22) 0%,rgba(47,111,235,.06) 38%,transparent 68%);filter:blur(36px);animation:dfSplashGlow 6s ease-in-out infinite}.df-splash-inner{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;text-align:center;gap:1.35rem}.df-splash-logo-wrap{position:relative;width:112px;height:112px;display:grid;place-items:center}.df-splash-rings{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;pointer-events:none}.df-splash-ring{position:absolute;width:72px;height:72px;border-radius:50%;border:2px solid rgba(47,111,235,.38);animation:dfSplashRing 2.8s ease-out infinite}.df-splash-ring:nth-child(2){animation-delay:.55s}.df-splash-ring:nth-child(3){animation-delay:1.1s}.df-splash-logo{position:relative;z-index:1;width:88px;height:88px;border-radius:calc(var(--radius) + 4px);object-fit:contain;box-shadow:0 14px 36px #1c1b1924,0 4px 12px #2f6feb1f;animation:dfSplashFloat 2.8s ease-in-out infinite}.df-splash-title{margin:0;font-size:clamp(1.55rem,4.5vw,2rem);font-weight:700;letter-spacing:-.02em;line-height:1.15}.df-splash-sub{margin:-.65rem 0 0;font-size:.98rem;color:var(--muted);letter-spacing:.04em}.df-splash-dots{display:flex;align-items:center;gap:.45rem;margin-top:.35rem}.df-splash-dot{width:9px;height:9px;border-radius:50%;background:#22c55e;animation:dfSplashDot 1.05s ease-in-out infinite}.df-splash-dot:nth-child(2){animation-delay:.14s}.df-splash-dot:nth-child(3){animation-delay:.28s}@keyframes dfSplashPulse{0%,to{opacity:.55;transform:scale(1) rotate(0)}50%{opacity:.82;transform:scale(1.045) rotate(2deg)}}@keyframes dfSplashGlow{0%,to{opacity:.55;transform:translate(-50%,-50%) scale(1)}50%{opacity:.88;transform:translate(-50%,-50%) scale(1.07)}}@keyframes dfSplashFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes dfSplashRing{0%{transform:scale(.72);opacity:.55}to{transform:scale(2.15);opacity:0}}@keyframes dfSplashDot{0%,70%,to{transform:scale(.62);opacity:.45}35%{transform:scale(1.12);opacity:1}}@media(prefers-reduced-motion:reduce){.df-splash:before,.df-splash:after,.df-splash-halo,.df-splash-ring,.df-splash-logo,.df-splash-dot{animation:none!important}.df-splash-ring{opacity:0}.df-splash-halo{opacity:.65;transform:translate(-50%,-50%)}}