/* MODO belongs to the same editorial rhythm as the accepted VETA drawer. */
#visual-direction.method-m10{padding-top:64px}
@media(max-width:850px){#visual-direction.method-m10{padding-top:48px}}
#visual-direction.method-m10>.shell{display:grid;grid-template-columns:minmax(0,312fr) minmax(0,960fr);gap:48px;align-items:start}
.method-m10 .method-entry{padding-top:6px;min-width:0}
.method-m10 .method-entry .eyebrow{margin:0 0 21px}
.method-m10 #method-title{font:400 32px/1.17 Georgia,serif;letter-spacing:-.03em;margin:0}
.method-m10 .visual-method-intro{display:block;margin:23px 0 0;max-width:290px}
.method-m10 .visual-method-intro p{margin:0;font:400 16px/1.6 Arial,sans-serif;color:var(--muted)}
.m10-drawer{position:relative;container-type:inline-size;min-width:0;z-index:6;color:var(--ink)}
.m10-panel{position:relative;inset:0 0 auto;background:#e6e0d7;isolation:isolate;box-shadow:0 0 0 1px #453b3020;transition:box-shadow .45s ease}
.m10-board{position:relative;height:37.5cqw;overflow:hidden;transition:height .6s cubic-bezier(.22,1,.36,1)}
.m10-screen{position:absolute;display:block;min-width:0;border:0;padding:0;background:transparent;cursor:zoom-in;text-align:left;color:#534d46;transition:left .6s cubic-bezier(.22,1,.36,1),top .6s cubic-bezier(.22,1,.36,1),width .6s cubic-bezier(.22,1,.36,1),transform .4s ease}
.m10-frame{display:block;border:1px solid #534b3d38;background:#faf8f4;box-shadow:0 8px 24px #382c2816;overflow:hidden;line-height:0}
.m10-screen img{display:block;width:100%;height:auto;max-width:100%}
.m10-frame{position:relative}
.m10-frame[data-preview-state=loading] img,.m10-frame[data-preview-state=error] img{visibility:hidden}
.m10-preview-state{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:8px;background:#e6e0d7;color:#534c44;font:400 clamp(10px,1cqw,14px)/1.4 Arial,sans-serif;text-align:center}
.m10-browser{display:flex;align-items:center;gap:4px;min-height:19px;padding:4px 8px;background:#f7f4ef;border-bottom:1px solid #534b3d20;font:400 10px/1 Arial,sans-serif;color:#756b60}
.m10-browser>i{width:3px;height:3px;border-radius:50%;background:#b8afa4;flex:none}
.m10-browser>span{margin-left:auto}
.m10-screen-caption{display:flex;gap:12px;align-items:baseline;font:400 14px/1.4 Arial,sans-serif;padding-top:10px;opacity:0;transition:opacity .25s ease}
.m10-screen-caption>span{color:#756b60;font-size:12px}
.m10-main{left:4%;top:6.8cqw;width:60%;z-index:3}
.m10-bauhaus{left:67%;top:3.2cqw;width:27%;z-index:1;transform:rotate(2deg)}
.m10-organic{left:63%;top:13.7cqw;width:27%;z-index:2;transform:rotate(-2deg)}
.m10-editorial{left:71%;top:24cqw;width:27%;z-index:4;transform:rotate(2deg)}
.m10-phone{left:52%;top:32cqw;width:13%;z-index:5;opacity:0;visibility:hidden;pointer-events:none}
.m10-phone .m10-frame{padding:4px;border-radius:15px;background:#f9f7f2}
.m10-phone img{border-radius:10px}
.m10-toolbar{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:55px;padding:12px 20px;background:#f8f5ef;border-top:1px solid #bdb3a8}
.m10-label{font:400 14px/1.5 Arial,sans-serif;color:#534c44}
.m10-controls{display:flex;align-items:center;gap:22px;flex:none}
.m10-toggle{min-height:32px;display:inline-flex;align-items:center;gap:16px;padding:4px 0;border:0;background:transparent;font:400 14px/1.5 Arial,sans-serif;color:#534c44;cursor:pointer}
.m10-toggle b{font:400 21px/1 Arial,sans-serif}
.m10-case{display:none;padding:6px 0;font:400 13px/1.5 Arial,sans-serif;text-decoration:underline;text-underline-offset:4px}
.m10-screen:focus-visible .m10-frame,.m10-toggle:focus-visible,.m10-case:focus-visible{outline:2px solid #5c5447;outline-offset:4px}
.m10-drawer.is-open{z-index:51;aspect-ratio:auto}
.m10-drawer.is-open .m10-panel{position:relative;box-shadow:0 20px 55px #372a362b,0 0 0 1px #69557d26}
.m10-drawer.is-open .m10-board{height:66cqw}
.m10-drawer.is-open .m10-main{top:13cqw;width:60%}
.m10-drawer.is-open .m10-bauhaus{left:69%;top:4cqw;width:26%;transform:none}
.m10-drawer.is-open .m10-organic{left:69%;top:24.5cqw;width:26%;transform:none}
.m10-drawer.is-open .m10-editorial{left:69%;top:45cqw;width:26%;transform:none}
.m10-drawer.is-open .m10-phone{opacity:1;visibility:visible;pointer-events:auto}
.m10-drawer.is-open .m10-screen-caption{opacity:1;transition-delay:.25s}
.m10-drawer.is-open .m10-case{display:inline}
.m10-dialog{width:min(1440px,calc(100vw - 32px));max-height:94dvh;margin:auto;inset:0;padding:0;border:1px solid #b9afa2;background:#f8f5ef;color:#332d29}
.m10-dialog::backdrop{background:#29222be0}
.m10-dialog-bar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 18px;border-bottom:1px solid #c7bab0}
.m10-dialog h2{margin:0;font:400 16px/1.4 Arial,sans-serif;letter-spacing:normal}
.m10-dialog-controls{display:flex;gap:8px;align-items:center;flex:none}
.m10-dialog button{min-width:40px;min-height:40px;border:1px solid #c7bab0;background:transparent;padding:7px 11px;font:400 13px/1.3 Arial,sans-serif;color:inherit;cursor:pointer}
.m10-dialog button[aria-pressed=true]{background:#514b43;color:#fff;border-color:#514b43}
.m10-dialog button[data-modo-close]{background:#514b43;color:#fff;border-color:#514b43;white-space:nowrap}
.m10-dialog button:focus-visible{outline:2px solid #5c5447;outline-offset:3px}
.m10-view-modes{display:flex;gap:6px;margin-left:12px}
.m10-dialog-position{min-width:42px;text-align:center;font:400 12px/1 Arial,sans-serif}
.m10-dialog-image{display:flex;align-items:flex-start;justify-content:center;overflow:auto;max-height:calc(94dvh - 82px);padding:18px;background:#e6e0d7;overscroll-behavior:contain}
.m10-dialog-image img{display:block;max-width:100%;height:auto;width:auto;max-height:calc(94dvh - 116px);object-fit:contain}
.m10-dialog-image.is-zoomed{display:block}
.m10-dialog-image.is-zoomed img{max-width:none;max-height:none;width:var(--m10-native-width);margin-inline:auto}
.m10-dialog-image[data-load-state=loading],.m10-dialog-image[data-load-state=error]{min-height:180px;align-items:center}
.m10-dialog-image[data-load-state=loading] img,.m10-dialog-image[data-load-state=error] img{display:none}
.m10-load-state{text-align:center;font:400 14px/1.5 Arial,sans-serif;padding:24px}
.m10-load-state p{margin:0 0 14px}
@media(hover:hover){.m10-screen:hover .m10-frame{box-shadow:0 10px 30px #382c2830}.m10-toggle:hover{color:#211d18}}
@media(max-width:1100px) and (min-width:851px){#visual-direction.method-m10>.shell{gap:30px;grid-template-columns:minmax(230px,1fr) minmax(0,2.4fr)}.method-m10 #method-title{font-size:29px}.m10-toolbar{padding:12px 14px}.m10-label{font-size:13px}.m10-controls{gap:12px}.m10-toggle{font-size:13px;gap:10px}.m10-drawer.is-open .m10-toolbar{display:grid;grid-template-columns:1fr auto}.m10-drawer.is-open .m10-controls{display:contents}.m10-drawer.is-open .m10-case{grid-row:2;grid-column:1/-1}.m10-toggle{grid-row:1;grid-column:2}.m10-screen-caption{font-size:12px;gap:6px}}
@media(max-width:850px){
 #visual-direction.method-m10>.shell{display:block}.method-m10 .method-entry{padding-top:0}.method-m10 #method-title{max-width:600px}.method-m10 .visual-method-intro{max-width:560px;margin:18px 0 26px}.m10-panel{position:relative}.m10-drawer{aspect-ratio:auto}
 .m10-board,.m10-drawer.is-open .m10-board{height:44cqw}.m10-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 16px;padding:12px 16px}.m10-controls{display:contents}.m10-label{grid-row:1;grid-column:1}.m10-toggle{grid-row:1;grid-column:2;min-height:44px}.m10-case{display:block!important;grid-row:2;grid-column:1/-1;width:fit-content;padding:6px 0}.m10-screen-caption{display:none}
}
@media(min-width:601px) and (max-width:1000px){.m10-dialog-bar{flex-wrap:wrap}.m10-dialog-controls{width:100%;flex-wrap:wrap}.m10-dialog-image{max-height:calc(94dvh - 125px)}.m10-dialog-image img{max-height:calc(94dvh - 161px)}}
@media(max-width:600px){
 .method-m10 #method-title{font-size:30px;line-height:1.18}.method-m10 .method-entry .eyebrow{margin-bottom:16px}.method-m10 .visual-method-intro{max-width:360px}
 .m10-board,.m10-drawer.is-open .m10-board{height:101cqw}.m10-main,.m10-drawer.is-open .m10-main{left:5%;top:6cqw;width:90%}.m10-bauhaus,.m10-drawer.is-open .m10-bauhaus{left:5%;top:72cqw;width:28%;transform:none}.m10-organic,.m10-drawer.is-open .m10-organic{left:36%;top:72cqw;width:28%;transform:none}.m10-editorial,.m10-drawer.is-open .m10-editorial{left:67%;top:72cqw;width:28%;transform:none}.m10-phone{display:none}
 .m10-browser{font-size:9px;min-height:18px;padding:4px 7px}.m10-toolbar{padding:10px 14px;column-gap:10px}.m10-label{font-size:13px;max-width:185px}.m10-toggle{font-size:13px;gap:9px}.m10-case{font-size:13px}
 .m10-dialog{width:calc(100vw - 16px);max-height:95dvh}.m10-dialog-bar{display:block;padding:12px}.m10-dialog h2{font-size:14px;margin:0 0 12px}.m10-dialog-controls{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px}.m10-dialog button{font-size:12px;padding:8px 9px;min-height:40px}.m10-view-modes{margin-left:0;order:2;flex-basis:100%;justify-content:center;border-top:1px solid #c7bab0;padding-top:10px;margin-top:4px}.m10-view-modes button{flex:1}.m10-dialog-image{padding:8px;max-height:calc(95dvh - 192px)}.m10-dialog-image img{max-height:calc(95dvh - 210px)}
}
@media(prefers-reduced-motion:reduce){.m10-board,.m10-panel,.m10-screen,.m10-screen-caption{transition:none}}