*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;font-family:Arial,Helvetica,sans-serif;background:#e9ede3;color:#21362a}button,select{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}a:focus-visible,button:focus-visible,select:focus-visible{outline:3px solid #96b65e;outline-offset:3px}.viewer-bar{height:76px;background:#fafbf6;border-bottom:1px solid #d8dfce;display:flex;align-items:center;justify-content:space-between;padding:12px 27px;gap:20px}.viewer-back{display:flex;align-items:center;gap:11px;font-size:11px;white-space:nowrap}.viewer-back img{width:31px;height:31px}.viewer-picker{display:flex;flex-direction:column;gap:5px;min-width:0}.viewer-picker small{font-size:7px;text-transform:uppercase;letter-spacing:1px;color:#809170}.viewer-picker select{max-width:290px;border:0;padding:3px 20px 3px 0;font-size:12px;background:transparent;color:#21362a;min-width:0}.device-controls{display:flex;align-items:center;gap:3px;border:1px solid #d8dfce;padding:4px;border-radius:8px}.device-controls button{border:0;background:transparent;color:#7d8b72;border-radius:5px;padding:10px 12px;display:flex;align-items:center;gap:7px;font-size:9px}.device-controls button.active{background:#21362a;color:#edf4e2}.device-controls svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.5}.viewer-use{padding:13px 18px;background:#21362a;color:#f7f9ee;border-radius:7px;font-size:11px;white-space:nowrap}.viewer-canvas{height:calc(100dvh - 121px);padding:18px 20px;display:flex;align-items:center;justify-content:center;overflow:auto;background-image:radial-gradient(#becbb4 1px,transparent 1px);background-size:20px 20px}.device-shell{position:relative;flex-shrink:0;box-shadow:0 20px 70px #263b212d;background:#fff;border-radius:9px}.device-inner{transform-origin:top left;position:absolute;top:0;left:0;overflow:hidden;border-radius:9px;outline:1px solid #bbc5b0}.device-inner.mobile{border:8px solid #21362a;border-radius:35px;background:#21362a}.device-inner.tablet{border:9px solid #3b4e34;border-radius:22px}.device-inner iframe{display:block;width:100%;height:100%;border:0;background:#fff}.device-inner.mobile iframe{border-radius:26px}.device-inner.tablet iframe{border-radius:13px}.viewer-foot{min-height:45px;padding:11px 25px;background:#fafbf6;border-top:1px solid #d8dfce;display:flex;align-items:center;justify-content:space-between;font-size:9px;line-height:1.6;gap:15px;color:#7b8970}.viewer-foot a{color:#21362a;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}.viewer-foot strong{font-weight:500;color:#21362a}.viewer-error{padding:20px;font-size:13px}.viewer-title{display:flex;align-items:center;gap:25px;min-width:0}
@media(max-width:1000px){.viewer-back span{display:none}.viewer-picker select{max-width:235px}.device-controls button span{display:none}.viewer-bar{padding:13px 18px;gap:15px}.viewer-title{gap:18px}.viewer-use{font-size:10px;padding:12px 14px}.device-controls button{padding:9px 10px}}
@media(max-width:620px){.viewer-bar{height:121px;flex-wrap:wrap;gap:11px;align-content:center;padding:12px 15px}.viewer-title{gap:11px;flex:1}.viewer-picker select{font-size:11px;max-width:205px}.viewer-picker small{font-size:7px}.viewer-back img{width:28px;height:28px}.viewer-use{padding:12px 11px;font-size:9px;max-width:123px;text-align:center}.device-controls{order:3;margin:auto;padding:2px}.device-controls button{padding:6px 15px}.device-controls button span{display:block;font-size:8px}.viewer-canvas{height:calc(100dvh - 183px);padding:12px}.viewer-foot{min-height:62px;padding:9px 15px;align-items:center;font-size:8px}.viewer-foot>span{max-width:240px}.viewer-picker{max-width:calc(100vw - 195px)}.viewer-picker select{width:100%;font-size:10px}.device-inner.mobile{border-width:6px}}

html,body{background:#f1edf8;color:#342047}.viewer-bar{background:#fff;border-color:#e5dcee}.viewer-use{background:#7545df;color:#fff;border-color:#7545df}.device-controls button.active{background:#7545df;color:#fff}.viewer-foot{background:#fff;border-color:#e5dcee;color:#887697}

.device-inner.mobile{border-color:#3e2858}.viewer-canvas{background-color:#f1edf8}