*,*::before,*::after{box-sizing:border-box}
body{margin:0;font-family:Verdana,system-ui,sans-serif;font-size:14px;background:#f3f5ee;color:#222}
a{color:#3d6017}
.adm-header{display:flex;justify-content:space-between;align-items:center;background:#c8e6a0;padding:.7rem 1.2rem;border-bottom:1px solid #a8c87f}
.adm-brand a{font-weight:bold;color:#2d4a10;text-decoration:none}
.adm-nav{display:flex;gap:1.2rem;align-items:center}
.adm-nav a{text-decoration:none}
.adm-nav .adm-user{color:#555;font-size:.85rem}
.adm-nav .adm-logout{color:#aa2222}
.adm-main{max-width:1100px;margin:0 auto;padding:1.5rem}

h1{margin-top:0}
.adm-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}
.btn{display:inline-block;padding:.4rem .9rem;background:#fff;border:1px solid #aac;color:#222;text-decoration:none;cursor:pointer;font:inherit;border-radius:3px}
.btn:hover{background:#eef}
.btn-primary{background:#c8e6a0;border-color:#a8c87f;color:#1f3408}
.btn-primary:hover{background:#b6d989}
.btn-danger,.danger{color:#a22}
.btn-small{padding:.2rem .5rem;font-size:.85rem}
.flash{padding:.6rem .9rem;border-radius:3px;margin:.5rem 0}
.flash.ok{background:#dff5c4;border:1px solid #a8c87f}
.flash.error{background:#fbd9d9;border:1px solid #c87f7f}

.form-edit input[type=text],.form-edit input[type=password],.form-edit input[type=email],
.form-edit textarea,.form-edit select{width:100%;max-width:600px;padding:.45rem;font:inherit;border:1px solid #bbb;border-radius:3px}
.form-edit textarea{max-width:100%;width:100%}

.adm-table{border-collapse:collapse;width:100%;background:#fff}
.adm-table th,.adm-table td{border:1px solid #ddd;padding:.4rem .6rem;text-align:left;vertical-align:top}
.adm-table th{background:#eef0e6}

.page-tree,.page-tree ul{list-style:none;padding-left:1rem}
.page-tree>li{margin:.2rem 0}
.tree-row{display:flex;align-items:center;gap:.6rem;padding:.4rem .6rem;background:#fff;border:1px solid #ddd;border-radius:3px}
.tree-row .drag{cursor:move;user-select:none;color:#777}
.tree-row .meta{color:#888;font-size:.8rem}
.tree-row .actions{margin-left:auto;font-size:.85rem}
.tree-row .actions a{margin-left:.4rem}

.login-body{background:#dfe9c8;display:flex;align-items:center;justify-content:center;min-height:100vh;margin:0}
.login-box{background:#fff;padding:2rem;border-radius:4px;box-shadow:0 4px 16px rgba(0,0,0,.1);width:100%;max-width:360px}
.login-box input{width:100%;padding:.5rem;border:1px solid #bbb;border-radius:3px;font:inherit}
.login-box button{width:100%}

/* Media */
.media-toolbar{display:flex;gap:.6rem;align-items:center;margin:.5rem 0}
#m-path{font-family:monospace;color:#555}
.media-drop{border:2px dashed #a8c87f;border-radius:5px;padding:1rem;text-align:center;margin:.5rem 0;background:#fafdf3}
.media-drop.drag{background:#e8f5cd}
.media-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:.6rem}
.media-item{border:1px solid #ddd;background:#fff;border-radius:3px;padding:.4rem;font-size:.8rem;text-align:center;position:relative}
.media-item img{max-width:100%;height:90px;object-fit:contain}
.media-item .name{display:block;word-break:break-all;margin-top:.3rem}
.media-item .acts{display:flex;gap:.2rem;justify-content:center;margin-top:.3rem}
.media-item .acts button{padding:.15rem .4rem;font-size:.75rem}
.media-item.dir{background:#eef5d8;cursor:pointer}

@media (max-width:760px){
  .adm-header{flex-direction:column;gap:.4rem}
  .adm-nav{flex-wrap:wrap;justify-content:center}
}