:root{--green-deep:#1f6b22;--green:#1f7a24;--green-bright:#2a8c2a;--green-tile-bg:#e9f2e3;--green-tile-border:#cfe2c4;--border-green:#bfd8b2;--ink:#26321f;--ink-soft:#2a3324;--muted:#75705c;--muted-strong:#8a8166;--label:#9a9074;--card-bg:#fcf9f1;--page-bg:#faf8f2;--dot:#e9e1cc;--header-bg:#fdfcf8;--header-border:#e7dfcc;--input-border:#d8cdb2;--danger:#a4442e;--danger-border:#c05a40;--danger-bg:#f9ece7}*{box-sizing:border-box}html,body{background:var(--page-bg);margin:0;padding:0}body,input,textarea,button{font-family:Karla,sans-serif}#root{min-height:100vh}.app-shell{background-color:var(--page-bg);background-image:radial-gradient(var(--dot) 1px, transparent 1px);min-height:100vh;color:var(--ink-soft);background-size:24px 24px}input:focus,textarea:focus{outline:none;box-shadow:0 0 0 3px #2a8c2a1f;border-color:var(--green-bright)!important}@keyframes dlgIn{0%{opacity:0;transform:translateY(10px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.login-shell{justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.login-card{background:var(--card-bg);border:1px solid var(--border-green);border-radius:20px;flex-direction:column;align-items:center;gap:18px;width:380px;max-width:100%;padding:40px 32px 32px;display:flex;box-shadow:0 2px 6px #2d46230f,0 8px 20px #2d46230d}.login-logo{object-fit:contain;width:64px;height:64px}.login-heading{text-align:center;flex-direction:column;align-items:center;gap:2px;display:flex}.login-title{color:var(--green-deep);letter-spacing:.02em;font-family:Marcellus,serif;font-size:24px}.login-subtitle{letter-spacing:.14em;text-transform:uppercase;color:var(--label);font-size:13px;font-weight:600}.login-form{flex-direction:column;gap:14px;width:100%;margin-top:8px;display:flex}.login-label{flex-direction:column;gap:6px;width:100%;display:flex}.login-label span{letter-spacing:.1em;text-transform:uppercase;color:var(--muted-strong);font-size:12px;font-weight:700}.login-label input{border:1px solid var(--input-border);color:var(--ink-soft);background:#fff;border-radius:10px;padding:11px 14px;font-size:15px}.login-error{color:var(--danger);background:var(--danger-bg);border:1px solid var(--danger-border);border-radius:10px;padding:8px 12px;font-size:13px;font-weight:600}.login-submit{border:1px solid var(--green);background:var(--green);color:var(--card-bg);cursor:pointer;border-radius:999px;margin-top:4px;padding:11px 18px;font-size:14px;font-weight:700;transition:background .15s}.login-submit:hover{background:var(--green-bright)}.login-submit:disabled{opacity:.6;cursor:default}.app-header{border-bottom:1px solid var(--header-border);background:var(--header-bg)}.app-header-inner{flex-wrap:wrap;align-items:center;gap:18px;max-width:1120px;margin:0 auto;padding:20px 32px;display:flex}.app-header-logo{object-fit:contain;flex-shrink:0;width:64px;height:64px}.app-header-titles{flex-direction:column;gap:2px;display:flex}.app-header-title{color:var(--green-deep);letter-spacing:.02em;font-family:Marcellus,serif;font-size:26px;line-height:1.1}.app-header-subtitle{letter-spacing:.14em;text-transform:uppercase;color:var(--label);font-size:14px;font-weight:600}.app-header-nav{border:1px solid var(--header-border);background:#f1ecdd;border-radius:999px;align-items:center;gap:6px;margin-left:28px;padding:5px;display:flex}.app-header-nav button{cursor:pointer;color:var(--muted-strong);background:0 0;border:none;border-radius:999px;padding:8px 18px;font-size:14px;font-weight:700;transition:all .15s}.app-header-nav button.active{color:var(--green-deep);background:#fff;box-shadow:0 1px 3px #2d462326}.app-header-spacer{flex:1}.app-header-btn{cursor:pointer;border-radius:999px;align-items:center;gap:8px;padding:10px 18px;font-size:14px;font-weight:700;transition:all .15s;display:flex}.app-header-edit{color:#4c6b3c;background:0 0;border:1px solid #c7bb9c}.app-header-edit:hover{background:#4c6b3c1a}.app-header-edit.active{border-color:var(--green);background:var(--green);color:var(--card-bg)}.app-header-edit.active:hover{background:#256b27}.app-header-logout{border:1px solid var(--green);background:var(--green);color:#fff}.app-header-logout:hover{background:#256b27}.edit-banner{color:#2e6b2e;background:#edf4e8;border:1px solid #c9ddbe;border-radius:12px;margin-bottom:24px;padding:12px 18px;font-size:14px;font-weight:600}.cards-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px;display:grid}.card-tile{background:var(--card-bg);border:1px solid var(--border-green);color:inherit;cursor:pointer;border-radius:18px;flex-direction:column;gap:16px;min-height:200px;padding:30px 28px 26px;text-decoration:none;transition:all .2s;display:flex;position:relative;box-shadow:0 2px 6px #2d46230f,0 8px 20px #2d46230d}.card-tile:hover{border-color:var(--green-bright);transform:translateY(-4px);box-shadow:0 6px 16px #28501e1f,0 18px 40px #28501e24}.card-tile-icon{background:var(--green-tile-bg);border:1px solid var(--green-tile-border);border-radius:16px;flex-shrink:0;justify-content:center;align-items:center;width:58px;height:58px;display:flex}.card-tile-body{flex-direction:column;flex:1;gap:6px;display:flex}.card-tile-title{color:var(--ink);font-family:Marcellus,serif;font-size:22px;line-height:1.2}.card-tile-desc{color:var(--muted);font-size:15px;line-height:1.5}.card-tile-open{color:var(--green);align-items:center;gap:6px;font-size:14px;font-weight:700;display:flex}.card-tile-actions{gap:6px;display:flex;position:absolute;top:12px;right:12px}.card-tile-action{border:1px solid var(--input-border);cursor:pointer;background:#fff;border-radius:10px;justify-content:center;align-items:center;width:34px;height:34px;transition:all .15s;display:flex}.card-tile-action.edit{color:#4c6b3c}.card-tile-action.edit:hover{border-color:var(--green-bright);background:#edf4e8}.card-tile-action.delete{color:var(--danger)}.card-tile-action.delete:hover{background:var(--danger-bg);border-color:var(--danger-border)}.card-tile-add{min-height:200px;color:var(--muted-strong);cursor:pointer;background:0 0;border:2px dashed #c7bb9c;border-radius:18px;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:28px;font-size:15px;font-weight:700;transition:all .18s;display:flex}.card-tile-add:hover{border-color:var(--green-bright);color:var(--green);background:#f7f4e9}.card-tile-add-icon{border:1.5px solid;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;display:flex}.server-tab{flex-direction:column;gap:24px;display:flex}.server-stats-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;display:grid}.server-card{background:var(--card-bg);border:1px solid var(--border-green);border-radius:18px;flex-direction:column;gap:14px;padding:26px 28px;display:flex;box-shadow:0 2px 6px #2d46230f,0 8px 20px #2d46230d}.server-card-label{letter-spacing:.12em;text-transform:uppercase;color:var(--muted-strong);font-size:12px;font-weight:700}.server-card-label-row{justify-content:space-between;align-items:baseline;display:flex}.server-card-label-row .server-card-sub{color:var(--muted-strong);font-size:13px}.server-state-row{align-items:center;gap:12px;display:flex}.server-state-dot{border-radius:50%;width:14px;height:14px}.server-state-label{color:var(--ink);font-family:Marcellus,serif;font-size:32px;line-height:1}.server-card-hint{color:var(--muted);font-size:14px}.server-card-footer{color:var(--muted-strong);gap:18px;margin-top:auto;font-size:13px;display:flex}.server-card-footer b{color:#4c6b3c}.server-value-row{align-items:baseline;gap:8px;display:flex}.server-value{color:var(--ink);font-family:Marcellus,serif;font-size:32px;line-height:1}.server-value-sub{color:var(--muted);font-size:14px}.server-bar-track{background:#ebe4d2;border-radius:999px;height:10px;overflow:hidden}.server-bar-fill{background:linear-gradient(90deg,#2a8c2a,#1f7a24);border-radius:999px;height:100%;transition:width .6s}.server-bar-footer{color:var(--muted-strong);justify-content:space-between;font-size:13px;display:flex}.server-bar-footer b{color:#4c6b3c}.server-chart{width:100%;height:80px;display:block}.docker-card{background:var(--card-bg);border:1px solid var(--border-green);border-radius:18px;flex-direction:column;padding:26px 28px;display:flex;box-shadow:0 2px 6px #2d46230f,0 8px 20px #2d46230d}.docker-header{justify-content:space-between;align-items:baseline;margin-bottom:16px;display:flex}.docker-grid{grid-template-columns:auto 1fr 1fr auto auto;align-items:center;gap:12px 20px;font-size:14px;display:grid}.docker-dot{background:var(--green-bright);border-radius:50%;width:9px;height:9px}.docker-name{color:var(--ink);font-weight:700}.docker-image{color:var(--muted);font-family:ui-monospace,monospace;font-size:13px}.docker-uptime{color:var(--muted)}.docker-badge{background:var(--green-tile-bg);border:1px solid var(--green-tile-border);color:var(--green);border-radius:999px;justify-self:start;padding:3px 10px;font-size:12px;font-weight:700}.modal-overlay{z-index:100;background:#232c1c6b;justify-content:center;align-items:center;padding:24px;animation:.15s fadeIn;display:flex;position:fixed;inset:0}.modal-dialog{background:var(--card-bg);border-radius:20px;flex-direction:column;gap:18px;width:460px;max-width:100%;max-height:90vh;padding:28px;animation:.18s dlgIn;display:flex;overflow:auto;box-shadow:0 24px 60px #1e28144d}.modal-title{color:var(--ink);font-family:Marcellus,serif;font-size:22px}.modal-label{flex-direction:column;gap:6px;display:flex}.modal-label span{letter-spacing:.1em;text-transform:uppercase;color:var(--muted-strong);font-size:12px;font-weight:700}.modal-label input,.modal-label textarea{border:1px solid var(--input-border);color:var(--ink-soft);background:#fff;border-radius:10px;padding:11px 14px;font-size:15px}.modal-label textarea{resize:vertical}.modal-icon-field{flex-direction:column;gap:8px;display:flex}.modal-icon-grid{grid-template-columns:repeat(6,1fr);gap:8px;display:grid}.modal-icon-btn{aspect-ratio:1;border:1px solid var(--input-border);cursor:pointer;color:#4c6b3c;background:#fff;border-radius:12px;justify-content:center;align-items:center;transition:all .12s;display:flex}.modal-icon-btn:hover{border-color:var(--green-bright)}.modal-icon-btn.selected{border-color:var(--green);background:var(--green);color:var(--card-bg)}.modal-actions{align-items:center;gap:10px;margin-top:4px;display:flex}.modal-actions-spacer{flex:1}.modal-btn{cursor:pointer;border-radius:999px;padding:10px 18px;font-size:14px;font-weight:700}.modal-btn-delete{color:var(--danger);background:0 0;border:1px solid #dab4a6}.modal-btn-delete:hover{background:var(--danger-bg)}.modal-btn-cancel{border:1px solid var(--input-border);color:#6d6750;background:0 0}.modal-btn-cancel:hover{background:#f1ebdb}.modal-btn-save{border:1px solid var(--green);background:var(--green);color:var(--card-bg);padding:10px 22px;transition:background .15s}.modal-btn-save:hover{background:var(--green-bright)}