*{box-sizing:border-box;margin:0;padding:0}:root{--color-primary:#007bff;--color-bg:#f5f5f5;--radius:6px}body{background:var(--color-bg);font-family:sans-serif}.container{width:min(1200px,90%);margin:auto}.mt-2{margin-top:2rem}.text-center{text-align:center}.AppContainer{flex-direction:column;width:100vw;height:100dvh;display:flex;overflow:hidden}.AppHeader{color:#fff;background:#222;flex-shrink:0;align-items:center;width:100%;height:60px;padding:0 20px;display:flex}.AppContent{-webkit-overflow-scrolling:touch;background:#789;flex:1;padding:20px;overflow-y:auto}.AppFooter{color:#fff;background:#333;flex-shrink:0;justify-content:center;align-items:center;height:50px;display:flex}@media (width<=768px){.AppHeader{height:54px;padding:0 12px}.AppContent{padding:14px}.AppFooter{height:auto;min-height:44px;padding:8px 10px}}.home-content{flex-direction:column;justify-content:start;align-items:center;height:100%;display:flex}.home-content h2,.home-content p{color:var(--color-text)}.home-content img{width:15%;margin-top:2%;margin-bottom:1%}.home-role{color:var(--color-text);margin-bottom:1%;font-size:1.1rem}.home-description{text-align:center;max-width:600px;color:var(--color-text);margin-top:1%;margin-bottom:2%;line-height:1.6}.home-buttons{gap:20px;margin-top:20px;display:flex}.home-btn{color:#fff;background:#06f;border-radius:6px;padding:10px 20px;font-size:1rem;text-decoration:none;transition:background .2s}.home-btn:hover{background:#0050cc}@media (width<=768px){.home-content img{width:40%;margin-top:5%;margin-bottom:3%}.home-content h2{font-size:1.4rem}.home-role{text-align:center;padding:0 10px;font-size:.95rem}.home-description{max-width:100%;padding:0 16px;font-size:.95rem}.home-buttons{flex-direction:column;gap:15px}}@media (width<=480px){.home-content img{width:50%}}.footer-content{width:100%;height:100%;display:flex}.footer-left{justify-content:flex-start;align-items:center;width:30%;margin-left:10px;display:flex}.footer-center{justify-content:center;align-items:center;width:40%;display:flex}.footer-right{justify-content:flex-end;align-items:center;width:30%;margin-right:10px;display:flex}@media (width<=768px){.footer-content{flex-direction:column;align-items:center;gap:2px;padding:6px 0}.footer-left,.footer-center,.footer-right{justify-content:center;width:100%;margin:0;font-size:.75rem}}.Navbar{justify-content:space-between;align-items:center;width:100%;height:100%;padding:0 1.5rem;display:flex}.nav-links{justify-content:space-between;align-items:center;width:100%;display:flex}.nav-left,.nav-right{gap:2rem;display:flex}.nav-item{color:#fff;border-radius:6px;padding:8px 12px;font-size:1.1rem;font-weight:500;text-decoration:none;transition:all .2s}.nav-item:hover{background:#fff3}.logout-btn{color:#fff;cursor:pointer;background:0 0;border:none;border-radius:6px;padding:8px 12px;font-size:1.1rem;font-weight:500;transition:all .2s}.logout-btn:hover{background:#fff3}.nav-separator{background:#999;border-radius:2px;width:3px;height:32px;margin:0 18px;display:inline-block}.hamburger{cursor:pointer;z-index:1100;background:0 0;border:none;flex-direction:column;gap:5px;padding:6px;display:none}.hamburger-line{background:#fff;border-radius:3px;width:26px;height:3px;transition:transform .3s,opacity .3s;display:block}.hamburger.is-active .hamburger-line:first-child{transform:translateY(8px)rotate(45deg)}.hamburger.is-active .hamburger-line:nth-child(2){opacity:0}.hamburger.is-active .hamburger-line:nth-child(3){transform:translateY(-8px)rotate(-45deg)}.nav-overlay{display:none}@media (width<=768px){.hamburger{display:flex}.nav-overlay{z-index:1000;background:#00000080;animation:.25s fadeIn;display:block;position:fixed;inset:0}.nav-links{z-index:1050;background:#1a1a2e;flex-direction:column;justify-content:flex-start;align-items:flex-start;width:260px;height:100dvh;padding:80px 24px 24px;transition:left .3s;position:fixed;top:0;left:-280px;box-shadow:4px 0 20px #0006}.nav-links.nav-open{left:0}.nav-left,.nav-right{flex-direction:column;gap:0;width:100%}.nav-right{margin-top:auto;padding-bottom:20px}.nav-item{border-radius:8px;width:100%;padding:14px 16px;font-size:1.15rem}.nav-item:hover{background:#ffffff1a}.logout-btn{text-align:left;width:100%;padding:14px 16px;font-size:1.15rem}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.nf-container{justify-content:center;align-items:center;height:100%;padding:2rem;display:flex}.nf-box{text-align:center;background:#fff;border-radius:12px;max-width:500px;padding:3rem 2rem;box-shadow:0 4px 12px #00000026}.nf-title{color:#d9534f;margin-bottom:.5rem;font-size:5rem;font-weight:700}.nf-subtitle{margin-bottom:1rem;font-size:1.8rem}.nf-text{color:#555;margin-bottom:2rem;font-size:1.1rem;line-height:1.6}.nf-button{color:#fff;background:#007bff;border-radius:8px;padding:12px 25px;font-size:1rem;font-weight:600;text-decoration:none;transition:all .2s;display:inline-block}.nf-button:hover{background:#0056b3}@media (width<=768px){.nf-container{padding:1rem}.nf-box{padding:2rem 1.2rem}.nf-title{font-size:3.5rem}.nf-subtitle{font-size:1.3rem}.nf-text{font-size:.95rem}}.login-container{justify-content:center;align-items:center;height:100%;padding:2rem;display:flex}.login-box{text-align:center;background:#fff;border-radius:12px;width:100%;max-width:420px;padding:3rem 2rem;box-shadow:0 4px 12px #00000026}.login-title{margin-bottom:2rem;font-size:2rem;font-weight:600}.login-form{text-align:left;flex-direction:column;gap:1rem;display:flex}.login-form label{font-size:.95rem;font-weight:600}.login-form input{border:1px solid #ccc;border-radius:6px;padding:10px;font-size:1rem}.login-button{color:#fff;cursor:pointer;background:#007bff;border:none;border-radius:6px;margin-top:1rem;padding:12px;font-size:1.1rem;font-weight:600;transition:all .2s}.login-button:hover{background:#0056b3}.login-footer{color:#666;margin-top:2rem;font-size:.85rem}@media (width<=768px){.login-container{align-items:flex-start;padding:10% 1rem 1rem}.login-box{padding:2rem 1.2rem}.login-title{font-size:1.6rem}.login-form input{font-size:16px}}.resources-container{color:#e0e6ff;text-align:center;background:#191970;border-radius:12px;padding:40px}.resources-title{margin-bottom:8px;font-size:1.8rem;font-weight:600}.resources-subtitle{color:#9aa0b8;margin-bottom:40px;font-size:1.2rem}.resources-grid{flex-wrap:wrap;justify-content:center;gap:24px;display:flex}.service-card{background:linear-gradient(145deg,#141a2b,#0d1120);border-radius:10px;width:240px;padding:20px;transition:all .3s;box-shadow:0 0 10px #5064ff33}.service-card:hover{box-shadow:0 0 20px #5064ff66}.service-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.service-tag{color:#aab4ff;background:#5064ff33;border-radius:6px;padding:3px 8px;font-size:1rem}.service-protocol{color:#4da3ff;border:1px solid #d3d3d3;border-radius:12px;margin-top:3%;margin-bottom:4px;padding:10px;font-weight:600}.service-url{color:#cfd6ff;border:1px solid #d3d3d3;border-radius:12px;margin-bottom:4px;padding:10px;font-family:monospace;font-size:1rem}.service-port{color:#cfd6ff;border:1px solid #d3d3d3;border-radius:12px;margin-bottom:16px;padding:10px;font-family:monospace;font-size:1rem}.service-button{color:#fff;cursor:pointer;background:linear-gradient(90deg,#4da3ff,#7b5bff);border:none;border-radius:8px;margin-top:3%;padding:8px 16px;font-weight:600;transition:all .2s}.service-button:hover{opacity:.85}.cardPage{flex-flow:wrap;justify-content:center;gap:5%;width:100%;height:100%;display:flex}.card{background:linear-gradient(145deg,#000,#404040);border-radius:10px;width:30%;margin-bottom:5%;padding:20px;transition:all .3s;box-shadow:0 0 10px #5064ff33}.card:hover{box-shadow:0 0 20px #5064ff66}.service-header{background-color:indigo;border-radius:12px 12px 0 0;justify-content:center;align-items:center;width:100%;padding:10px 0;display:flex}.service-header h1{text-align:center;margin:0}@media (width<=768px){.resources-container{border-radius:8px;padding:20px 12px}.resources-title{font-size:1.3rem}.resources-subtitle{margin-bottom:20px;font-size:1rem}.cardPage{flex-direction:column;align-items:center;gap:16px}.card{width:100%;max-width:400px;margin-bottom:0;padding:16px}.service-header h1{font-size:1.2rem}.service-url{word-break:break-all;padding:8px;font-size:.8rem}.service-protocol,.service-port{padding:8px;font-size:.9rem}.service-tag{font-size:.85rem}.service-button{width:100%;padding:12px;font-size:1rem}}@media (width<=480px){.card{max-width:100%}}.about-wrapper{color:#333;align-items:flex-start;gap:40px;width:100%;max-width:1200px;height:100%;min-height:0;margin:0 auto;padding:40px 20px;font-family:sans-serif;display:flex;overflow:hidden}.about-sidebar{text-align:center;flex:0 0 280px;width:280px;height:auto}.about-photo{object-fit:cover;border:3px solid #ddd;border-radius:50%;width:180px;height:180px;margin:0 auto 20px;display:block}.about-info h2{margin:0 0 5px;font-size:1.6rem}.about-info p{color:#666;margin:5px 0;font-size:.95rem}.about-content{flex:1;min-width:0;height:100%;min-height:0;padding-right:10px;line-height:1.6;overflow:hidden auto}.about-content h1{margin:0 0 30px;font-size:2rem}.about-content h2{margin:0 0 15px;font-size:1.5rem}.about-content h3{margin:20px 0 10px;font-size:1.2rem}@media (width<=900px){.about-wrapper{flex-direction:column;height:auto;min-height:auto;padding:40px 20px;overflow:visible}.about-sidebar{flex:none;width:100%;height:auto;margin-bottom:10px;position:static}.about-content{width:100%;height:auto;padding-right:0;overflow:visible}}@media (width<=768px){.about-wrapper{gap:20px;padding:20px 14px}.about-photo{width:130px;height:130px}.about-info h2{font-size:1.3rem}.about-content h1{margin-bottom:20px;font-size:1.5rem}.about-content h2{font-size:1.2rem}.about-content h3{font-size:1.05rem}.about-content section{margin-bottom:24px}.about-content p{font-size:.95rem}}.about-wrapper{color:#333;gap:40px;max-width:1200px;margin:0 auto;padding:40px 20px;font-family:sans-serif;display:flex}.about-sidebar{text-align:center;flex-shrink:0;width:280px}.about-photo{object-fit:cover;border:3px solid #ddd;border-radius:50%;width:180px;height:180px;margin-bottom:20px}.about-info h2{margin-bottom:5px;font-size:1.6rem}.about-info p{color:#666;font-size:.95rem}*{box-sizing:border-box}.about-wrapper{overflow-x:hidden}.about-content{flex:1;line-height:1.6}.about-content h1{margin-bottom:30px;font-size:2rem}.about-content section{margin-bottom:40px}.about-content h2{margin-bottom:15px;font-size:1.5rem}.about-content h3{margin-top:20px;margin-bottom:10px;font-size:1.2rem}.about-content ul{margin-top:10px;padding-left:20px}.about-content li{margin-bottom:6px}.places-list h3{border-radius:6px;align-items:center;gap:10px;margin:0;padding:5px 10px;font-size:1.05rem;font-weight:500;display:flex}.places-list h3 img{object-fit:cover;border-radius:2px;width:28px;height:20px}.places-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 20px;width:100%;margin:15px 0;padding:0;list-style:none;display:grid;overflow-x:hidden}.places-list li{margin:0;padding:0}.places-list h3{border-radius:6px;margin:0;padding:5px 10px;font-size:1.05rem;font-weight:500;transition:background-color .2s,transform .2s}@media (width<=900px){.about-wrapper{text-align:left;flex-direction:column}.about-sidebar{width:100%;margin-bottom:30px}.about-photo{margin:0 auto 20px}}@media (width<=768px){.about-wrapper{gap:20px;padding:20px 14px}.about-photo{width:130px;height:130px}.about-info h2{font-size:1.3rem}.about-content h1{margin-bottom:20px;font-size:1.5rem}.about-content h2{font-size:1.2rem}.about-content h3{font-size:1.05rem}.about-content section{margin-bottom:24px}.about-content p{font-size:.95rem}}@media (width<=600px){.places-list{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}}@media (width<=900px){.places-list{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=600px){.places-list{grid-template-columns:repeat(1,minmax(0,1fr))}}.setup-wrapper,.setup-wrapper *{box-sizing:border-box}.setup-wrapper{color:#333;align-items:flex-start;gap:40px;width:100%;max-width:1200px;margin:0 auto;padding:40px 20px;font-family:sans-serif;display:flex}.setup-sidebar{text-align:center;flex:0 0 280px;align-self:flex-start;width:280px;position:sticky;top:40px}.setup-photo{object-fit:cover;border:3px solid #ddd;border-radius:50%;width:180px;height:180px;margin:0 auto 20px;display:block}.setup-info h2{margin:0 0 5px;font-size:1.6rem}.setup-info p{color:#666;margin:5px 0;font-size:.95rem}.setup-content{flex:1;min-width:0;line-height:1.6}.setup-content section{border:1px solid;border-radius:10px;margin-bottom:40px;padding:5px;box-shadow:0 6px 14px #00000059}.setup-content h1{margin:0 0 30px;font-size:2rem}.setup-content h2{margin:0 0 15px;font-size:1.5rem}.setup-content h3{margin:20px 0 10px;font-size:1.2rem}.setup-content ul{margin-top:10px;padding-left:20px}.setup-content li{margin-bottom:6px}.setup-diagram-placeholder{-webkit-overflow-scrolling:touch;width:100%;padding:10px 0;overflow:auto hidden}.setup-diagram-placeholder img,.setup-diagram-placeholder svg{width:100%;max-width:100%;height:auto;display:block}@media (width<=900px){.setup-wrapper{flex-direction:column;gap:20px;padding:40px 20px}.setup-sidebar{flex:none;width:100%;margin-bottom:10px;position:static}.setup-content{width:100%}}@media (width<=768px){.setup-wrapper{padding:20px 14px}.setup-photo{width:130px;height:130px}.setup-info h2{font-size:1.3rem}.setup-content h1{margin-bottom:20px;font-size:1.5rem}.setup-content h2{font-size:1.2rem}.setup-content h3{font-size:1.05rem}.setup-content section{margin-bottom:24px}.setup-content p{font-size:.95rem}}@media (width<=600px){.setup-diagram-placeholder{width:100%;overflow:auto hidden}.setup-diagram-placeholder img,.setup-diagram-placeholder svg{width:100%;max-width:100%;height:auto}}.scheleton-wrapper{color:#333;align-items:flex-start;gap:40px;width:100%;max-width:1200px;height:100%;min-height:0;margin:0 auto;padding:40px 20px;font-family:sans-serif;display:flex;overflow:hidden}.scheleton-sidebar{text-align:center;flex:0 0 280px;width:280px;height:auto}.scheleton-photo{object-fit:cover;border:3px solid #ddd;border-radius:50%;width:180px;height:180px;margin:0 auto 20px;display:block}.scheleton-info h2{margin:0 0 5px;font-size:1.6rem}.scheleton-info p{color:#666;margin:5px 0;font-size:.95rem}.scheleton-content{flex:1;min-width:0;height:100%;min-height:0;padding-right:10px;line-height:1.6;overflow:hidden auto}.scheleton-content h1{margin:0 0 30px;font-size:2rem}.scheleton-content section{margin-bottom:40px}.scheleton-content h2{margin:0 0 15px;font-size:1.5rem}.scheleton-content h3{margin:20px 0 10px;font-size:1.2rem}.scheleton-content ul{margin-top:10px;padding-left:20px}.scheleton-content li{margin-bottom:6px}@media (width<=900px){.scheleton-wrapper{flex-direction:column;height:auto;min-height:auto;padding:40px 20px;overflow:visible}.scheleton-sidebar{flex:none;width:100%;height:auto;margin-bottom:10px;position:static}.scheleton-content{width:100%;height:auto;padding-right:0;overflow:visible}}@media (width<=768px){.scheleton-wrapper{gap:20px;padding:20px 14px}.scheleton-photo{width:130px;height:130px}.scheleton-info h2{font-size:1.3rem}.scheleton-content h1{margin-bottom:20px;font-size:1.5rem}.scheleton-content h2{font-size:1.2rem}.scheleton-content h3{font-size:1.05rem}.scheleton-content section{margin-bottom:24px}.scheleton-content p{font-size:.95rem}}.tailscale-wrapper{color:#333;align-items:flex-start;gap:40px;width:100%;max-width:1200px;height:100%;min-height:0;margin:0 auto;padding:40px 20px;font-family:sans-serif;display:flex;overflow:hidden}.tailscale-sidebar{text-align:center;flex:0 0 280px;width:280px}.tailscale-photo{object-fit:cover;border:3px solid #ddd;border-radius:50%;width:180px;height:180px;margin:0 auto 20px;display:block}.tailscale-info h2{margin:0 0 5px;font-size:1.6rem}.tailscale-info p{color:#666;margin:5px 0;font-size:.95rem}.tailscale-content{flex:1;min-width:0;height:100%;min-height:0;padding-right:10px;line-height:1.6;overflow:hidden auto}.tailscale-content h1{margin:0 0 15px;font-size:2rem}.tailscale-map-wrapper{background:#f8f9fa;border:1px solid #d6d6d6;border-radius:16px;width:100%;margin-top:30px;overflow:auto hidden}.tailscale-map{width:100%;min-width:850px;height:auto;display:block}.tailscale-map-title{fill:#222;font-size:24px;font-weight:700}.tailscale-map-subtitle{fill:#777;font-size:12px}.tailscale-section-home,.tailscale-section-office,.tailscale-section-remote{fill:#fff;stroke:#d0d0d0;stroke-width:1.5px}.tailscale-section-title{fill:#333;font-size:18px;font-weight:700}.tailscale-line{stroke:#b6b6b6;stroke-width:1.5px;stroke-dasharray:5 5}.tailscale-card{cursor:pointer}.tailscale-card-background{fill:#fff;stroke:#c8c8c8;stroke-width:1.5px;transition:stroke .15s,stroke-width .15s,filter .15s}.tailscale-card:hover .tailscale-card-background{stroke:#777;stroke-width:2px;filter:drop-shadow(0 3px 5px #0000001f)}.tailscale-card.selected .tailscale-card-background{stroke:#333;stroke-width:2.5px;filter:drop-shadow(0 3px 6px #00000029)}.tailscale-card-icon{fill:#333;font-size:20px}.tailscale-card-name{fill:#222;font-size:13px;font-weight:700}.tailscale-card-vmid{fill:#777;font-size:10px}.tailscale-card-ip{fill:#666;font-family:monospace;font-size:9px}.tailscale-status-online{fill:#20b968;stroke:#fff;stroke-width:2px}.tailscale-status-offline{fill:#e5484d;stroke:#fff;stroke-width:2px}.tailscale-node-details{background:#fafafa;border:1px solid #d6d6d6;border-radius:12px;margin-top:25px;padding:20px}.tailscale-details-header{justify-content:space-between;align-items:flex-start;margin-bottom:20px;display:flex}.tailscale-details-header h2{margin:0 0 5px}.tailscale-details-header button{cursor:pointer;color:#555;background:0 0;border:none;font-size:28px;line-height:1}.tailscale-online{color:#159447;font-weight:700}.tailscale-offline{color:#d3343d;font-weight:700}.tailscale-details-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;display:grid}.tailscale-details-grid div{flex-direction:column;gap:3px;display:flex}.tailscale-details-grid strong{font-size:.85rem}.tailscale-details-grid span{font-family:monospace}.tailscale-description{margin-top:20px}.tailscale-last-seen{color:#777;margin-top:10px;font-size:.9rem}@media (width<=900px){.tailscale-wrapper{flex-direction:column;height:auto;min-height:auto;padding:40px 20px;overflow:visible}.tailscale-sidebar{flex:none;width:100%;margin-bottom:10px}.tailscale-content{width:100%;height:auto;padding-right:0;overflow:visible}}@media (width<=768px){.tailscale-wrapper{gap:20px;padding:20px 14px}.tailscale-photo{width:130px;height:130px}.tailscale-info h2{font-size:1.3rem}.tailscale-content h1{font-size:1.5rem}.tailscale-details-grid{grid-template-columns:1fr}}