.marionnette{position:relative;width:100%;height:var(--mn-height,min(88vh,760px));min-height:480px;overflow:hidden;border-radius:14px;background:linear-gradient(180deg,#e6f0f7 0%,#c7dcea 100%);font-family:ui-rounded,"Trebuchet MS",Verdana,sans-serif;color:#1c2b3a;-webkit-user-select:none;user-select:none}
.marionnette canvas{position:absolute;top:0;left:0;width:100%;height:100%;display:block;touch-action:none}
.marionnette .mn-hint{position:absolute;top:22px;left:0;right:0;margin:0;text-align:center;font-size:15px;opacity:.75;transition:opacity .6s;pointer-events:none}
.marionnette .mn-hint.off{opacity:0}
.marionnette .mn-msg{position:absolute;bottom:74px;left:16px;right:16px;margin:0;text-align:center;font-size:14px;color:#8a2d12;pointer-events:none}
.marionnette .mn-btn{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);border:0;border-radius:999px;padding:12px 26px;background:#1c2b3a;color:#fff;font:inherit;font-size:16px;cursor:pointer;transition:background .2s}
.marionnette .mn-btn:hover{background:#2f4b6e}
.marionnette .mn-btn:focus-visible{outline:3px solid #e4572e;outline-offset:3px}
.marionnette .mn-vu{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);width:120px;height:4px;border-radius:2px;background:rgba(28,43,58,.15);overflow:hidden;pointer-events:none}
.marionnette .mn-vu i{display:block;height:100%;background:#e4572e;transform-origin:left;transform:scaleX(0)}