.tn-image-upload-host{position:relative;outline:none}.tn-image-upload-host::after{content:"Click, drop or paste image";display:block;margin-top:6px;color:#52698e;font-size:.72rem;font-weight:700}.tn-image-upload-host.is-dragging{outline:3px solid #2458ff;outline-offset:4px;background:#edf3ff!important}.tn-image-cropper{width:min(1180px,calc(100vw - 24px));max-height:calc(100vh - 24px);padding:0;border:0;border-radius:20px;background:#fff;color:#10204e;box-shadow:0 30px 100px rgba(1,12,40,.4)}.tn-image-cropper::backdrop{background:rgba(2,10,30,.78);backdrop-filter:blur(4px)}.tn-image-cropper__shell{display:grid;max-height:calc(100vh - 24px);grid-template-rows:auto auto minmax(0,1fr) auto}.tn-image-cropper header{display:flex;align-items:start;justify-content:space-between;gap:20px;padding:20px 24px;border-bottom:1px solid #e0e7f2}.tn-image-cropper header small{color:#2458ff;font-weight:900;letter-spacing:.1em}.tn-image-cropper header h2{margin:4px 0;font-size:1.4rem}.tn-image-cropper header p{margin:0;color:#65728c}.tn-image-cropper header button{width:40px;height:40px;border:1px solid #d7e0ee;border-radius:10px;background:#fff;color:#1b2a50;font-size:1.5rem;cursor:pointer}.tn-image-cropper nav{display:flex;overflow:auto;gap:8px;padding:12px 24px;background:#f5f7fb}.tn-image-cropper nav button{display:flex;align-items:center;gap:8px;min-width:max-content;padding:8px 12px;border:1px solid #dbe3ef;border-radius:99px;background:#fff;color:#62708a;font-weight:800}.tn-image-cropper nav button b{display:grid;place-items:center;width:23px;height:23px;border-radius:50%;background:#e8eef8}.tn-image-cropper nav button.active{border-color:#2458ff;color:#174bd5}.tn-image-cropper nav button.active b,.tn-image-cropper nav button.done b{background:#2458ff;color:#fff}.tn-image-cropper main{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:18px;overflow:auto;padding:16px 24px}.tn-image-cropper__stage{overflow:hidden;border-radius:14px;background:#111827}.tn-image-cropper__stage canvas{display:block;width:100%;max-height:58vh;touch-action:none;cursor:move}.tn-image-cropper__hint{margin:10px 0 0;color:#68758f;font-size:.82rem}.tn-image-cropper__previews{min-width:0}.tn-image-cropper__previews h3{margin:0 0 10px;font-size:.95rem}.tn-image-cropper__previews>div{display:grid;gap:12px}.tn-image-cropper__previews figure{overflow:hidden;margin:0;border:1px solid #dbe3ef;border-radius:12px;background:#f7f9fc}.tn-image-cropper__previews canvas{display:block;max-width:100%;height:auto;margin:auto;background:#111827}.tn-image-cropper__previews figcaption{display:flex;justify-content:space-between;gap:8px;padding:8px 10px;color:#52617f;font-size:.72rem}.tn-image-cropper__previews figcaption strong{color:#142652}.tn-image-cropper footer{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:15px 24px;border-top:1px solid #e0e7f2}.tn-image-cropper footer>span{overflow:hidden;color:#50617f;font-size:.82rem;font-weight:750;text-overflow:ellipsis;white-space:nowrap}.tn-image-cropper footer>div{display:flex;gap:8px}.tn-image-cropper footer button{min-height:42px;padding:0 17px;border-radius:10px;font-weight:850;cursor:pointer}.tn-image-cropper footer .secondary{border:1px solid #ced9e9;background:#fff;color:#34466b}.tn-image-cropper footer .primary{border:0;background:#2458ff;color:#fff}@media(max-width:840px){.tn-image-cropper main{grid-template-columns:1fr}.tn-image-cropper__previews>div{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}}@media(max-width:640px){.tn-image-cropper header,.tn-image-cropper main,.tn-image-cropper footer{padding-left:14px;padding-right:14px}.tn-image-cropper nav{padding-left:14px;padding-right:14px}.tn-image-cropper footer{align-items:stretch;flex-direction:column}.tn-image-cropper footer>div{justify-content:flex-end}.tn-image-cropper__stage canvas{max-height:50vh}}