.media-page{padding:28px;min-height:100%;background:#f8fafc;color:#172033}.media-page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:20px}.media-page-header h1{font-size:28px;margin:0 0 4px}.media-page-header p{margin:0;color:#667085}.media-header-actions{display:flex;align-items:center;gap:12px}.media-header-actions .btn,.media-batch button,.media-batch select,.media-detail-dialog .btn{display:inline-flex;align-items:center;justify-content:center;gap:7px}.media-storage{width:180px;font-size:11px;color:#667085}.media-storage>span{display:block;text-align:right;margin-bottom:5px}.media-storage>i{display:block;height:6px;border-radius:999px;background:#e5e7eb;overflow:hidden}.media-storage b{display:block;height:100%;background:#0ba37f}.media-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:18px}.media-sidebar{background:#fff;border:1px solid #e4e7ec;border-radius:14px;padding:12px;align-self:start;position:sticky;top:18px;max-height:calc(100vh - 36px);overflow:auto}.media-sidebar nav,.media-folder-list{display:grid;gap:3px}.media-sidebar nav>button,.media-folder-list>div>button{border:0;background:transparent;width:100%;display:flex;align-items:center;gap:9px;padding:9px 10px;border-radius:9px;color:#344054;text-align:left;cursor:pointer}.media-sidebar nav>button svg,.media-folder-list svg{width:16px;height:16px}.media-sidebar nav>button span,.media-folder-list span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.media-sidebar nav>button small{background:#f2f4f7;border-radius:999px;padding:2px 7px}.media-sidebar nav>button.is-active,.media-folder-list>div.is-active>button{background:#e9faf5;color:#087e63;font-weight:700}.media-sidebar-title{display:flex;align-items:center;justify-content:space-between;margin:18px 8px 7px;color:#667085;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}.media-sidebar-title button,.media-folder-actions button,.media-sidebar-mobile-head button{border:0;background:transparent;padding:3px;color:#667085;cursor:pointer}.media-sidebar-title svg,.media-folder-actions svg{width:15px;height:15px}.media-folder-list>div{display:flex;align-items:center}.media-folder-actions{display:flex;opacity:0}.media-folder-list>div:hover .media-folder-actions{opacity:1}.media-tag-filter{display:flex;flex-wrap:wrap;gap:5px;padding:0 7px}.media-tag-filter button{display:flex;align-items:center;gap:4px;border:1px solid #d0d5dd;background:#fff;color:#475467;border-radius:999px;padding:5px 8px;font-size:11px;cursor:pointer}.media-tag-filter button.is-active{background:#e9faf5;border-color:#0ba37f;color:#087e63}.media-tag-filter svg{width:12px;height:12px}.media-main{min-width:0}.media-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:#fff;border:1px solid #e4e7ec;border-radius:12px;padding:10px}.media-toolbar select,.media-search{border:1px solid #d0d5dd;border-radius:8px;background:#fff;min-height:38px}.media-toolbar select{padding:0 28px 0 10px;color:#344054}.media-search{display:flex;align-items:center;gap:7px;padding:0 10px;flex:1;min-width:190px}.media-search input{border:0;outline:0;width:100%;font:inherit}.media-view-toggle{display:flex;border:1px solid #d0d5dd;border-radius:8px;overflow:hidden}.media-view-toggle button{border:0;background:#fff;padding:10px;color:#667085}.media-view-toggle button.is-active{background:#e9faf5;color:#087e63}.media-selection-row{display:flex;justify-content:space-between;color:#667085;font-size:12px;padding:12px 4px}.media-selection-row label{display:flex;gap:7px;align-items:center}.media-batch{position:sticky;top:8px;z-index:5;display:flex;align-items:center;gap:8px;background:#172033;color:#fff;border-radius:11px;padding:9px 12px;margin-bottom:12px;box-shadow:0 8px 25px #10182826}.media-batch strong{margin-right:auto}.media-batch button,.media-batch select{border:1px solid #475467;background:#344054;color:#fff;border-radius:7px;padding:7px 10px}.media-batch svg{width:14px;height:14px}.media-batch .media-batch-close{border:0;background:transparent;padding:4px}.media-results--grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}.media-card{position:relative;background:#fff;border:1px solid #e4e7ec;border-radius:12px;overflow:hidden}.media-card:hover{border-color:#98a2b3;box-shadow:0 5px 20px #10182812}.media-card.is-selected{border-color:#0ba37f;box-shadow:0 0 0 2px #0ba37f22}.media-card-check{position:absolute;z-index:2;top:9px;left:9px}.media-card-check input{position:absolute;opacity:0}.media-card-check span{display:grid;place-items:center;width:22px;height:22px;border:1px solid #d0d5dd;border-radius:6px;background:#fffe}.media-card-check svg{width:14px;opacity:0}.media-card-check input:checked+span{background:#0ba37f;color:#fff;border-color:#0ba37f}.media-card-check input:checked+span svg{opacity:1}.media-card-content{display:grid;grid-template-rows:minmax(0,1fr) auto;height:100%;border:0;background:transparent;width:100%;padding:0;text-align:left;cursor:pointer;color:inherit}.media-card-thumb{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:1;min-width:0;min-height:0;overflow:hidden;box-sizing:border-box;background:#f7f8fa;padding:12px}.media-card-content.is-transparent .media-card-thumb,.media-detail-preview.is-transparent{background-color:#fff;background-image:linear-gradient(45deg,#eceff3 25%,transparent 25%),linear-gradient(-45deg,#eceff3 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#eceff3 75%),linear-gradient(-45deg,transparent 75%,#eceff3 75%);background-size:18px 18px;background-position:0 0,0 9px,9px -9px,-9px 0}.media-card-thumb .media-thumbnail-image{position:relative;z-index:1;display:block;width:100%;height:100%;min-width:0;min-height:0;object-fit:contain}.media-card-copy{display:block;position:relative;z-index:1;min-width:0;min-height:67px;padding:11px 12px 13px;border-top:1px solid #eef1f4;background:#fff}.media-card-copy strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}.media-card-copy small{display:block;color:#667085;font-size:11px;margin-top:3px}.media-card-copy>span{display:flex;gap:4px;margin-top:7px;overflow:hidden}.media-card-copy i{font-style:normal;font-size:10px;border-radius:999px;background:#f2f4f7;padding:3px 6px;white-space:nowrap}.media-card-arrow{display:none}.media-results--list{display:grid;gap:6px}.media-results--list .media-card-content{display:grid;grid-template-columns:78px minmax(0,1fr) 20px;grid-template-rows:1fr;min-height:80px;padding-left:38px;align-items:center}.media-results--list .media-card-thumb{width:68px;height:66px;aspect-ratio:auto;margin:7px 0;padding:5px}.media-results--list .media-card-copy{min-height:0;padding:9px 12px;border-top:0}.media-results--list .media-card-arrow{display:block;width:17px;color:#98a2b3}.media-state{min-height:280px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#667085}.media-state>svg{width:28px}.spin{animation:media-spin 1s linear infinite}@keyframes media-spin{to{transform:rotate(360deg)}}.media-infinite-loader{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:52px;margin:20px auto;padding:14px;color:#667085;font-size:13px}.media-infinite-loader svg{width:17px;height:17px}.media-sidebar-title .media-sidebar-add{display:grid;place-items:center;width:30px;height:30px;padding:0;border:1px solid #0a8f70;border-radius:8px;background:#0ba37f;color:#fff;box-shadow:0 2px 6px #0ba37f33;cursor:pointer}.media-sidebar-title .media-sidebar-add:hover:not(:disabled){border-color:#087e63;background:#087e63;color:#fff;box-shadow:0 4px 10px #0ba37f42}.media-sidebar-title .media-sidebar-add:focus-visible{outline:2px solid #0ba37f;outline-offset:2px}.media-sidebar-title .media-sidebar-add:disabled{cursor:not-allowed;opacity:.45}.media-sidebar-title .media-sidebar-add svg{width:16px;height:16px}.media-mobile-nav,.media-sidebar-backdrop,.media-sidebar-mobile-head{display:none}.media-progress-overlay,.media-detail-backdrop{position:fixed;inset:0;background:#10182866;z-index:100}.media-progress-overlay{display:grid;place-items:center}.media-progress-overlay>div{width:min(360px,calc(100vw - 32px));background:#fff;border-radius:14px;padding:24px;display:grid;gap:10px;text-align:center}.media-progress-overlay svg{margin:auto;color:#0ba37f}.media-progress-overlay progress{width:100%;accent-color:#0ba37f}.media-detail{position:fixed;z-index:102;right:0;top:0;bottom:0;width:min(430px,100vw);background:#fff;box-shadow:-12px 0 35px #10182822;display:flex;flex-direction:column;overflow:hidden}.media-detail>header{display:flex;justify-content:space-between;padding:16px 18px;border-bottom:1px solid #e4e7ec}.media-detail>header div{display:grid;gap:2px}.media-detail>header span{font-size:11px;color:#667085}.media-detail>header button{border:0;background:transparent}.media-detail-preview{height:250px;display:grid;place-items:center;background:#f7f8fa;padding:16px}.media-detail-preview img{max-width:100%;max-height:100%;object-fit:contain}.media-detail-body{padding:17px;overflow:auto;display:grid;gap:17px}.media-detail-body>label{display:grid;gap:6px;font-size:12px;font-weight:700}.media-detail input,.media-detail select{border:1px solid #d0d5dd;border-radius:8px;padding:9px;font:inherit}.media-detail fieldset{border:0;padding:0;margin:0}.media-detail legend,.media-detail h3{font-size:12px;font-weight:800;margin:0 0 8px}.media-detail-tags{display:flex;flex-wrap:wrap;gap:5px}.media-detail-tags label{font-size:11px;background:#f2f4f7;border-radius:999px;padding:5px 8px}.media-detail-tags input{padding:0}.media-detail-meta dl{margin:0;display:grid;gap:6px}.media-detail-meta dl>div{display:flex;justify-content:space-between;font-size:12px}.media-detail-meta dt{color:#667085}.media-section-heading{display:flex;justify-content:space-between;align-items:center}.media-section-heading .btn{font-size:11px;padding:6px 9px}.media-suggestion{background:#f4fbf8;border:1px solid #b7e8d9;border-radius:9px;padding:10px;display:grid;gap:5px;font-size:12px}.media-suggestion>div{display:flex;gap:6px;margin-top:5px}.media-open-in{display:grid;grid-template-columns:1fr 1fr;gap:6px}.media-open-in a{border:1px solid #d0d5dd;border-radius:8px;padding:8px;text-align:center;font-size:11px;color:#344054;text-decoration:none}.media-versions{display:grid;gap:5px}.media-versions button{display:flex;gap:9px;align-items:center;border:1px solid #e4e7ec;background:#fff;border-radius:8px;padding:6px;text-align:left}.media-versions button.is-current{border-color:#0ba37f}.media-versions img{width:42px;height:42px;object-fit:contain}.media-versions span{display:grid}.media-versions small{color:#667085}.media-references{margin:0;padding-left:18px;font-size:12px}.media-detail>footer{margin-top:auto;border-top:1px solid #e4e7ec;padding:12px;display:flex;gap:7px;flex-wrap:wrap}.media-detail>footer .btn{font-size:12px}.media-similar-list{display:grid;gap:12px}.media-similar-list>article{background:#fff;border:1px solid #e4e7ec;border-radius:12px;padding:12px}.media-similar-list header{display:flex;justify-content:space-between;align-items:center}.media-similar-list header div{display:grid}.media-similar-list header span{font-size:11px;color:#667085}.media-similar-list article>div{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}.media-similar-list article>div button{display:grid;grid-template-columns:90px 1fr;grid-template-rows:auto auto;border:0;background:#f7f8fa;border-radius:9px;text-align:left;padding:8px}.media-similar-list img{grid-row:1/3;width:78px;height:78px;object-fit:contain}.media-similar-list small{color:#667085}@media(max-width:900px){.media-page{padding:16px}.media-page-header{align-items:stretch}.media-storage{display:none}.media-layout{display:block}.media-sidebar{position:fixed;z-index:110;left:0;top:0;bottom:0;width:min(300px,88vw);max-height:none;border-radius:0;transform:translate(-102%);transition:transform .2s}.media-sidebar.is-open{transform:none}.media-sidebar-backdrop.is-open{display:block;position:fixed;inset:0;background:#10182866;z-index:109}.media-sidebar-mobile-head{display:flex;justify-content:space-between;align-items:center;padding:4px 4px 12px}.media-mobile-nav{display:flex;align-items:center;gap:7px;border:1px solid #d0d5dd;background:#fff;border-radius:8px;padding:9px 11px;margin-bottom:10px}.media-results--grid{grid-template-columns:repeat(auto-fill,minmax(155px,1fr))}.media-card-thumb{height:135px}}@media(max-width:600px){.media-page-header{display:grid}.media-header-actions{justify-content:space-between}.media-toolbar select{flex:1;min-width:130px}.media-view-toggle{margin-left:auto}.media-results--list .media-card-content{grid-template-columns:62px minmax(0,1fr) 18px;padding-left:34px}.media-results--list .media-card-thumb{width:56px;height:58px}.media-results--list .media-card-copy{padding:8px 10px}.media-batch{flex-wrap:wrap}.media-batch strong{width:100%}.media-similar-list article>div{grid-template-columns:1fr}.media-open-in{grid-template-columns:1fr}}@media(max-width:900px){.media-results--grid .media-card-thumb{height:auto}}.media-detail-backdrop{z-index:120;background:#10182894;backdrop-filter:blur(2px)}.media-detail-dialog{position:fixed;z-index:121;top:50%;left:50%;width:min(980px,calc(100vw - 48px));max-height:calc(100dvh - 48px);transform:translate(-50%,-50%);border:1px solid #e4e7ec;border-radius:16px;background:#fff;box-shadow:0 24px 80px #10182847;display:flex;flex-direction:column;overflow:hidden;outline:none}.media-detail-dialog.is-loading{width:min(420px,calc(100vw - 32px));min-height:240px}.media-detail-dialog>header{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px;border-bottom:1px solid #e4e7ec}.media-detail-dialog>header>div{display:grid;gap:2px;min-width:0}.media-detail-dialog>header h2{margin:0;color:#172033;font-size:17px;line-height:1.3}.media-detail-dialog>header span{color:#667085;font-size:12px}.media-detail-dialog>header button{flex:0 0 auto;display:grid;place-items:center;width:36px;height:36px;border:1px solid #e4e7ec;border-radius:9px;background:#fff;color:#475467;cursor:pointer}.media-detail-dialog>header button:hover:not(:disabled){background:#f8fafc;color:#172033}.media-detail-dialog>header button svg{width:18px;height:18px}.media-detail-layout{flex:1 1 auto;min-height:0;display:grid;grid-template-columns:minmax(300px,.95fr) minmax(390px,1.05fr);overflow:hidden}.media-detail-visual{min-width:0;overflow:auto;padding:20px;border-right:1px solid #e4e7ec;background:#f8fafc}.media-detail-preview{width:100%;height:min(430px,48vh);box-sizing:border-box;border:1px solid #e4e7ec;border-radius:12px;overflow:hidden;background:#fff}.media-detail-preview img{display:block;width:100%;height:100%;min-width:0;min-height:0;object-fit:contain}.media-detail-meta{margin-top:16px;padding:14px;border:1px solid #e4e7ec;border-radius:10px;background:#fff}.media-detail-meta h3,.media-detail-dialog .media-detail-body h3,.media-detail-dialog legend{margin:0 0 9px;color:#344054;font-size:12px;font-weight:800}.media-detail-meta dd{max-width:62%;margin:0;overflow:hidden;color:#344054;text-align:right;text-overflow:ellipsis;white-space:nowrap}.media-detail-body{min-width:0;min-height:0;padding:20px;overflow:auto}.media-detail-body>label{color:#344054}.media-detail-dialog input,.media-detail-dialog select{width:100%;box-sizing:border-box;border:1px solid #d0d5dd;border-radius:8px;padding:9px 10px;background:#fff;color:#172033;font:inherit}.media-detail-dialog fieldset{min-width:0;margin:0;padding:0;border:0}.media-detail-dialog .media-detail-tags input{width:auto}.media-detail-dialog>footer{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 16px;border-top:1px solid #e4e7ec;background:#fff}.media-detail-footer-actions,.media-detail-footer-submit{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.media-detail-dialog>footer .btn{min-height:36px;font-size:12px}@media(max-width:760px){.media-detail-dialog{inset:0;width:100%;max-height:none;transform:none;border:0;border-radius:0}.media-detail-dialog.is-loading{width:100%;min-height:100%}.media-detail-layout{display:block;overflow:auto}.media-detail-visual{overflow:visible;padding:16px;border-right:0;border-bottom:1px solid #e4e7ec}.media-detail-preview{height:min(320px,38vh)}.media-detail-body{overflow:visible;padding:16px}.media-detail-dialog>footer{align-items:stretch;padding:10px 12px}}@media(max-width:520px){.media-detail-dialog>header{padding:12px 14px}.media-detail-dialog>footer{display:grid;gap:8px}.media-detail-footer-actions,.media-detail-footer-submit{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.media-detail-footer-actions .btn:first-child:last-child,.media-detail-footer-submit .btn:first-child:last-child{grid-column:1 / -1}}.media-modal-backdrop{position:fixed;inset:0;z-index:120;background:#10182866}.media-ai-dialog{position:fixed;z-index:121;top:50%;left:50%;display:flex;width:min(620px,calc(100vw - 32px));max-height:min(720px,calc(100vh - 32px));flex-direction:column;overflow:hidden;transform:translate(-50%,-50%);border-radius:14px;background:#fff;box-shadow:0 24px 80px #10182833}.media-ai-dialog>header,.media-ai-dialog>footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;border-bottom:1px solid #e4e7ec}.media-ai-dialog>header h2{margin:0;font-size:17px}.media-ai-dialog>header p{margin:3px 0 0;color:#667085;font-size:12px}.media-ai-dialog>header button{border:0;background:transparent}.media-ai-dialog-list{display:grid;gap:7px;padding:12px 18px;overflow:auto}.media-ai-dialog-list article{display:grid;grid-template-columns:minmax(120px,1fr) auto;gap:3px 12px;padding:9px 11px;border:1px solid #e4e7ec;border-radius:9px;font-size:12px}.media-ai-dialog-list article strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.media-ai-dialog-list article small{grid-column:1 / -1;color:#667085}.media-ai-dialog-list .is-error{color:#b42318}.media-ai-dialog>footer{justify-content:flex-end;border-top:1px solid #e4e7ec;border-bottom:0}.media-ai-dialog .btn{display:inline-flex;align-items:center;justify-content:center}.media-tag-row{display:inline-flex;align-items:center;overflow:hidden;border:1px solid #d0d5dd;border-radius:999px;background:#fff}.media-tag-filter .media-tag-row>button{border:0;border-radius:0}.media-tag-filter .media-tag-row>button+button{padding:5px 3px;color:#667085}.media-tag-filter .media-tag-row>button:last-child{padding-right:7px}.media-tag-filter .media-tag-row>button+button svg{width:11px;height:11px}
