#media-tools{width:850px;max-width:96vw;padding:24px;background:#f2f3ec}#media-tools h2{font-size:34px}#media-tool-status{font-size:12px;line-height:1.7;min-height:20px;color:#5f6e50}#media-tool-status.error{color:#a32820}#media-workspace{width:100%;max-height:340px;aspect-ratio:16/9;position:relative;overflow:hidden;background:repeating-conic-gradient(#d7dbcf 0% 25%,#eff1e8 0% 50%) 50%/22px 22px;border:1px solid #adb79e;isolation:isolate}#media-workspace>img,#media-workspace>video{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform-origin:50% 50%;max-width:none;max-height:none}#media-crop-layer{position:absolute;inset:0;z-index:2;touch-action:none;cursor:crosshair;background:#0001}#media-crop-layer[hidden]{display:none}#media-crop-box{position:absolute;border:2px solid #e0ff8e;box-shadow:0 0 0 2000px #121a12aa;pointer-events:none;background:linear-gradient(90deg,transparent 32.8%,#e0ff8e55 33%,transparent 33.2%,transparent 66%,#e0ff8e55 66.2%,transparent 66.4%),linear-gradient(0deg,transparent 32.8%,#e0ff8e55 33%,transparent 33.2%,transparent 66%,#e0ff8e55 66.2%,transparent 66.4%)}#media-crop-layer>span{position:absolute;bottom:8px;left:10px;padding:5px 8px;background:#192417d9;color:#f4f8e9;font-size:11px;pointer-events:none}.media-tool-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:20px 0}.media-tool-grid>label{font-size:12px}.media-tool-grid input[type=range]{display:block;width:100%;margin-top:12px}.media-tool-grid output{float:right;font-weight:700}.media-tool-buttons,.media-tool-launchers{display:flex;flex-wrap:wrap;gap:7px;margin:15px 0}.media-tool-buttons button,.media-tool-launchers button,#media-crop-apply{border:1px solid #9eae88;padding:10px 12px;background:#f6f8ed;font-size:12px}.media-tool-buttons button[aria-pressed=true],.media-tool-launchers button:not(:disabled),#media-crop-apply{background:#d7ee85;border-color:#88a641}.media-tool-launchers button:disabled{opacity:.45;cursor:not-allowed}.media-tool-grid select{display:block;width:100%;border:1px solid #adb79e;padding:10px;background:#fff;margin-top:8px}.media-crop-values{border:1px solid #b2bea1;padding:10px;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;min-width:0;font-size:10px}.media-crop-values input{width:100%;box-sizing:border-box;min-width:0;margin-top:5px;padding:6px;border:1px solid #b5bea8}.media-inspector-frame{position:relative;height:235px;overflow:hidden;background:#dfe5d5}.media-inspector-frame>img,.media-inspector-frame>video{position:absolute;inset:0;width:100%;height:100%;max-width:none;max-height:none;object-fit:cover}.media-inspector-frame:has(img[src="raven-mark.svg"]){height:260px}.media-inspector-frame>img[src="raven-mark.svg"]{object-fit:contain}#media-tools .edit-actions{margin-top:20px}#media-tools .edit-actions button[data-tool-action=apply]{background:#d7ee85;border-color:#7e9c3c}#media-crop-apply[hidden]{display:none}@media(max-width:600px){#media-tools{padding:18px;max-width:96vw}#media-tools h2{font-size:29px}#media-workspace{max-height:260px}.media-tool-grid{grid-template-columns:1fr;gap:15px}.media-tool-buttons button{font-size:11px;padding:10px}.media-crop-values{grid-template-columns:repeat(4,1fr)}.media-crop-values label{min-width:0}#media-tools .edit-actions{position:sticky;bottom:-18px;padding:12px 0;background:#f2f3ec;z-index:4}}

.logo-media-frame{display:block;flex:none;width:76px;height:88px;overflow:hidden}footer .logo-media-frame{width:60px;height:70px}.detail-media{overflow:hidden}@media(max-width:750px){header .logo-media-frame{width:48px;height:64px}}

/* A movable, nonmodal tool panel leaves the real page visible. */
#media-tools{position:fixed;inset:12px 12px auto auto;margin:0;width:370px;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);padding:16px;z-index:100;box-shadow:0 12px 44px #17201444;border:1px solid #93a479;overflow:auto;border-radius:8px}
#media-tools .inspector-header{position:sticky;top:-16px;margin:-16px -16px 0;padding:12px 14px;background:#edf2df;z-index:5;cursor:move;touch-action:none;border-bottom:1px solid #c1ccae;gap:7px}
#media-tools .inspector-header h2{font-size:23px;margin:0;flex:1;line-height:1.2}
#media-tools .inspector-header button{font-size:12px;padding:8px;cursor:pointer;border:1px solid #b3c194;border-radius:4px}
#media-tools #media-workspace{max-height:175px;min-height:115px;aspect-ratio:16/9!important}
#media-tools .media-tool-grid{gap:12px;margin:15px 0}
#media-tools .media-tool-buttons{gap:6px;margin:12px 0}
#media-tools .media-tool-buttons button{font-size:11px;padding:8px}
#media-tools .media-tool-grid:has(.media-crop-values){grid-template-columns:1fr}
#media-tools .media-tool-grid input[type=range]{margin-top:7px}
#media-tools .editor-help{font-size:11px;line-height:1.5;margin:10px 0}
#media-tools #media-tool-status{font-size:11px;line-height:1.5;margin:10px 0}
#media-tools>.edit-actions{position:sticky;bottom:-16px;background:#f2f3ec;margin:12px -16px -16px;padding:12px 16px;border-top:1px solid #c1ccae;z-index:6}
#media-tools.media-minimized .media-tool-body{display:none}
#media-tools.media-minimized{width:320px}
.media-adjusting #edit-markers,.media-adjusting #editing-bar,.media-adjusting #editor-open{visibility:hidden;pointer-events:none}
.media-adjusting .media-live-target{outline:3px solid #a4c955;outline-offset:4px;cursor:grab;touch-action:none;scroll-margin-top:20px}
.media-adjusting .media-live-target:active,#media-workspace.media-pan-enabled:active{cursor:grabbing}
#media-workspace.media-pan-enabled{cursor:grab;touch-action:none}
.media-adjusting .media-live-target img,.media-adjusting #media-workspace img{user-select:none;-webkit-user-drag:none}
@media(max-width:759px){#media-tools{inset:auto 8px 8px 8px;width:auto;max-width:calc(100vw - 16px);max-height:45dvh;padding:14px}#media-tools .inspector-header{top:-14px;margin:-14px -14px 0;padding:10px 12px}#media-tools>.edit-actions{bottom:-14px;margin:12px -14px -14px;padding:10px 14px}#media-tools .media-tool-grid{grid-template-columns:1fr 1fr}#media-tools #media-workspace{max-height:135px}#media-tools.media-minimized{width:auto}.media-adjusting .media-live-target{scroll-margin-bottom:48dvh}}
