:root{--green-900:#173f35;--green-800:#205b4b;--green-700:#28775e;--green-100:#e8f3ed;--green-50:#f5faf7;--line:#c9d9d1;--text:#243735;--muted:#688078;--white:#fff;--danger:#b42318}
*{box-sizing:border-box}html,body{height:100%;margin:0}body{font-family:"Segoe UI",Tahoma,sans-serif;color:var(--text);background:var(--green-50)}
.manual-shell{display:grid;grid-template-columns:270px minmax(0,1fr);height:100vh}.manual-sidebar{background:var(--green-100);border-right:1px solid var(--line);padding:22px 14px;overflow:auto}.manual-brand{display:flex;align-items:center;gap:12px;padding:0 9px 18px}.manual-logo{width:42px;height:42px;border:2px solid var(--green-800);border-radius:9px;display:grid;place-items:center;font-size:23px}.manual-brand strong{display:block;font-size:19px}.manual-brand small{color:var(--muted)}
.manual-nav button{display:block;width:100%;border:0;background:transparent;text-align:left;padding:11px 12px;margin:3px 0;border-radius:7px;color:#38534b;font-size:14px;cursor:pointer}.manual-nav button:hover{background:#dcebe3}.manual-nav button.active{background:var(--green-700);color:#fff;font-weight:600}.manual-main{overflow:auto;padding:48px 58px;background:#f5faf7}.manual-content{max-width:930px;margin:0}.manual-content h1{font-size:36px;line-height:1.25;margin:0 0 34px;color:#18322d}.manual-content h2{font-size:22px;color:#28775e;margin:34px 0 14px}.manual-content h3{font-size:18px;color:#28775e;margin:26px 0 10px}.manual-content p,.manual-content li{font-size:17px;line-height:1.75}.manual-content ol,.manual-content ul{padding-left:48px}.manual-content a{color:var(--green-700)}.manual-content kbd{background:#edf2ef;border:1px solid #c7d3cd;border-bottom-width:2px;border-radius:5px;padding:3px 8px}.manual-content img{max-width:100%;height:auto;border-radius:8px}.manual-content .media-block{margin:22px auto;max-width:100%}.manual-content .media-block.align-left{margin-left:0;margin-right:auto}.manual-content .media-block.align-center{margin-left:auto;margin-right:auto}.manual-content .media-block.align-right{margin-left:auto;margin-right:0}.manual-content .video-frame{position:relative;padding-top:56.25%;overflow:hidden;border-radius:8px;background:#10231e}.manual-content .video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.manual-empty{padding:32px;border:1px dashed var(--line);border-radius:10px;text-align:center;color:var(--muted);background:#fff}
.manual-top-actions{display:flex;gap:8px;margin:0 9px 16px}.manual-top-actions a{text-decoration:none;color:var(--green-800);font-size:12px}.manual-status{font-size:13px;color:var(--muted);padding:12px}
@media(max-width:760px){.manual-shell{grid-template-columns:1fr}.manual-sidebar{border-right:0;border-bottom:1px solid var(--line);max-height:42vh}.manual-main{padding:26px 20px}}

/* Admin editor */
.editor-shell{display:grid;grid-template-columns:300px minmax(0,1fr);height:100vh}.editor-sidebar{background:var(--green-100);border-right:1px solid var(--line);padding:16px;overflow:auto}.editor-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}.editor-head h1{font-size:18px;margin:0}.btn-manual{border:1px solid var(--line);background:#fff;color:var(--green-900);border-radius:7px;padding:9px 12px;cursor:pointer;font-weight:600}.btn-manual.primary{background:var(--green-700);border-color:var(--green-700);color:#fff}.btn-manual.danger{color:var(--danger)}.section-list{display:grid;gap:7px}.section-item{display:grid;grid-template-columns:1fr auto;gap:6px;background:#fff;border:1px solid var(--line);border-radius:8px;padding:9px}.section-item.active{border-color:var(--green-700);box-shadow:0 0 0 2px #28775e22}.section-item button{border:0;background:transparent;text-align:left;cursor:pointer;color:var(--text)}.section-tools{display:flex;gap:2px}.section-tools button{padding:3px 6px;color:var(--muted)}
.editor-main{min-width:0;overflow:auto;padding:20px 28px}.editor-card{max-width:980px;margin:auto;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}.editor-meta{padding:18px 20px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr 160px;gap:12px}.editor-meta label{font-size:12px;color:var(--muted)}.editor-meta input,.editor-meta select{display:block;width:100%;margin-top:5px;border:1px solid var(--line);border-radius:7px;padding:10px;font:inherit}.editor-toolbar{display:flex;flex-wrap:wrap;gap:5px;padding:10px 14px;border-bottom:1px solid var(--line);position:sticky;top:0;background:#f8fbf9;z-index:4}.editor-toolbar button,.editor-toolbar select{border:1px solid var(--line);background:#fff;border-radius:6px;padding:7px 9px;cursor:pointer}.rich-editor{min-height:520px;padding:28px 34px;outline:none;line-height:1.7}.rich-editor:empty:before{content:"พิมพ์เนื้อหาคู่มือที่นี่...";color:#9baba5}.rich-editor img{max-width:100%;height:auto}.rich-editor .media-block{position:relative;margin:16px auto}.rich-editor .media-block.selected{outline:3px solid #f3a64b}.editor-footer{padding:12px 18px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.save-status{font-size:13px;color:var(--muted)}.media-controls{display:none;align-items:center;gap:5px;padding:8px 14px;background:#fff8e8;border-bottom:1px solid #ead8ab}.media-controls.show{display:flex}.media-controls span{font-size:12px;color:#6f5b2f}.media-controls button{border:1px solid #d8c18c;background:#fff;border-radius:5px;padding:5px 8px;cursor:pointer}
@media(max-width:850px){.editor-shell{grid-template-columns:230px 1fr}.editor-main{padding:12px}.editor-meta{grid-template-columns:1fr}.rich-editor{padding:20px}}
.rich-editor img.selected,.rich-editor .video-frame.selected{outline:3px solid #f3a64b}.media-controls input[type="range"]{width:150px;accent-color:var(--green-700)}.media-controls strong{min-width:42px;font-size:12px;color:var(--green-900)}
.manual-content .youtube-hd-link{display:block;margin:9px 0 0;text-align:right;font-size:13px;font-weight:600;color:var(--green-700);text-decoration:none}.manual-content .youtube-hd-link:hover{text-decoration:underline}
