.imageone-page{--io-navy:#071a3a;--io-purple:#6f3bff;--io-orange:#f86000;--io-line:#dce5ef;--io-muted:#6c7f94;--io-soft:#f7f9fd;position:relative;padding:20px 20px max(36px,env(safe-area-inset-bottom));background:linear-gradient(135deg,#f4f7ff 0%,#f8f6ff 48%,#fff8f1 100%);color:var(--io-navy)}
.imageone-page .card,.imageone-hero-copy,.imageone-hero-result{border:1px solid rgba(207,218,232,.9);border-radius:22px;background:#fff;box-shadow:0 16px 46px rgba(14,40,78,.07)}
.imageone-hero{display:grid;grid-template-columns:minmax(0,1.06fr) minmax(360px,.94fr);gap:16px;margin-bottom:16px}.imageone-hero-copy{padding:30px;background:radial-gradient(circle at 86% 18%,rgba(111,59,255,.12),transparent 30%),linear-gradient(135deg,#fff,#fbf9ff 55%,#fff8f3)}.imageone-kicker{display:inline-flex;align-items:center;gap:8px;min-height:29px;padding:0 11px;border-radius:999px;background:#f0ebff;color:#6434ed;font-size:9px;font-weight:900;letter-spacing:.11em}.imageone-hero-copy h1{margin:14px 0 0;font-size:clamp(34px,4.1vw,56px);line-height:1.02;letter-spacing:-.045em}.imageone-hero-copy h1 em{font-style:normal;background:linear-gradient(90deg,#6f3bff,#2f6dff,#f86000);-webkit-background-clip:text;background-clip:text;color:transparent}.imageone-hero-copy p{max-width:760px;margin:14px 0 0;color:var(--io-muted);font-size:14px;line-height:1.65}.imageone-hero-steps{display:flex;flex-wrap:wrap;gap:7px;margin-top:20px}.imageone-hero-steps span{display:inline-flex;align-items:center;gap:7px;min-height:34px;padding:0 11px;border:1px solid #e0e7f0;border-radius:999px;background:#fff;color:#405873;font-size:10px;font-weight:800}.imageone-hero-steps b{width:20px;height:20px;display:grid;place-items:center;border-radius:50%;background:#0b2855;color:#fff;font-size:8px}.imageone-hero-result{padding:10px;background:linear-gradient(155deg,#091a39,#201842 62%,#2d1832)}
.imageone-result{min-height:330px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border:1px solid rgba(255,255,255,.11);border-radius:16px;background:radial-gradient(circle at 50% 16%,rgba(111,59,255,.22),transparent 45%),#0f1830;color:#b7c2d4;overflow:hidden}.imageone-result strong{color:#fff;font-size:18px}.imageone-result>span{max-width:420px;margin-top:7px;font-size:11px;line-height:1.55}.imageone-product-preview{display:flex;align-items:center;gap:17px;margin-bottom:18px}.imageone-product-preview span{width:66px;height:66px;display:grid;place-items:center;border-radius:18px;background:linear-gradient(135deg,#7144ff,#315fff);color:#fff;font-size:24px;box-shadow:0 15px 30px rgba(69,63,221,.27)}.imageone-product-preview span:last-child{background:linear-gradient(135deg,#f86000,#ff9d3f)}.imageone-product-preview>i{color:#71819b}.imageone-orbit{position:relative;width:92px;height:92px;margin-bottom:16px}.imageone-orbit>i{position:absolute;inset:22px;display:grid;place-items:center;border-radius:16px;background:#fff;color:#6f3bff;font-size:20px}.imageone-orbit span{position:absolute;inset:0;border:1px solid rgba(151,123,255,.45);border-radius:50%;animation:ioOrbit 3s linear infinite}.imageone-orbit span:nth-child(2){inset:11px;animation-direction:reverse;animation-duration:2.2s}.imageone-orbit span:nth-child(3){inset:-9px;animation-duration:4s}@keyframes ioOrbit{to{transform:rotate(360deg)}}.imageone-result-error>i{margin-bottom:11px;color:#ff8c98;font-size:30px}.imageone-result-ready{display:grid;align-items:stretch;padding:0;text-align:left}.imageone-result-ready>img{width:100%;height:270px;object-fit:contain;background:#0b1327}.imageone-result-ready>div{display:grid;gap:6px;padding:14px}.imageone-result-ready .btn{margin-top:3px;width:100%}
.imageone-workspace{display:grid;gap:14px}.imageone-workspace>.card{padding:18px;overflow:hidden}.imageone-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:14px}.imageone-section-head>div>span{display:block;color:var(--io-orange);font-size:8px;font-weight:900;letter-spacing:.12em}.imageone-section-head h2{margin:4px 0 0;font-size:21px;letter-spacing:-.02em}.imageone-section-head small{display:block;margin-top:4px;color:#8090a3;font-size:10px}.imageone-section-head .btn{min-height:39px}
.imageone-form-grid,.imageone-settings-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.imageone-form-grid label,.imageone-settings-grid label,.imageone-fact-grid label,.imageone-size-row label{display:grid;gap:6px}.imageone-form-grid label>span,.imageone-settings-grid label>span,.imageone-fact-grid label>span,.imageone-size-row label>span{font-size:9px;font-weight:850;color:#4b6077}.imageone-page .input{width:100%;min-height:43px;border:1px solid #dce5ef;border-radius:10px;background:#fbfcfe;color:#17314f;font:inherit;font-size:11px}.imageone-page textarea.input{padding:10px;resize:vertical;line-height:1.45}
.imageone-reference-section{margin-top:12px;padding:12px;border:1px solid #e1e7ef;border-radius:14px;background:#f8fafc}.imageone-section-mini{display:flex;justify-content:space-between;gap:12px;margin-bottom:9px}.imageone-section-mini strong{font-size:11px}.imageone-section-mini span{color:#7d8da0;font-size:9px}.imageone-ref-empty{min-height:105px;display:grid;grid-template-columns:44px minmax(0,1fr);align-items:center;column-gap:11px;padding:14px;border:1px dashed #cfd9e5;border-radius:12px;background:#fff}.imageone-ref-empty>i{grid-row:1/3;width:44px;height:44px;display:grid;place-items:center;border-radius:11px;background:#f0ebff;color:#6f3bff}.imageone-ref-empty strong{font-size:11px}.imageone-ref-empty span{font-size:9px;color:#77889b;line-height:1.5}.imageone-ref-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.imageone-ref-item{position:relative;aspect-ratio:1/1;border:1px solid #dce4ed;border-radius:11px;overflow:hidden;background:#fff}.imageone-ref-item img{width:100%;height:100%;object-fit:contain}.imageone-ref-item>span{position:absolute;left:6px;bottom:6px;padding:4px 6px;border-radius:6px;background:rgba(0,32,80,.8);color:#fff;font-size:6.5px;font-weight:900}.imageone-ref-item button{position:absolute;right:6px;top:6px;width:27px;height:27px;border:1px solid rgba(255,255,255,.75);border-radius:7px;background:rgba(8,27,58,.78);color:#fff}.imageone-ref-add{margin-top:9px;min-height:37px}
.imageone-card-types{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.imageone-card-type{display:grid;grid-template-columns:38px minmax(0,1fr);grid-template-rows:auto auto;column-gap:9px;row-gap:3px;min-height:82px;padding:11px;border:1px solid #dfe7f0;border-radius:13px;background:#fff;text-align:left;color:#17314f;cursor:pointer}.imageone-card-type>span{grid-row:1/3;width:38px;height:38px;display:grid;place-items:center;border-radius:10px;background:#f2efff;color:#6f3bff}.imageone-card-type strong{font-size:11px}.imageone-card-type small{font-size:8.5px;line-height:1.4;color:#7a8ba0}.imageone-card-type.active{border-color:#f86000;background:#fff8f3;box-shadow:0 0 0 2px rgba(248,96,0,.06)}.imageone-card-type.active>span{background:#fff0e7;color:#f86000}.imageone-fact-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}
.imageone-settings-grid{margin-bottom:12px}.imageone-model-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.imageone-model-card{position:relative;display:grid;grid-template-columns:38px minmax(0,1fr);gap:9px;align-items:center;min-height:70px;padding:10px;border:1px solid #dde5ef;border-radius:12px;background:#fff;text-align:left;color:#17314f;cursor:pointer}.imageone-mode-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;background:#f1edff;color:#6f3bff}.imageone-model-card strong{display:block;font-size:10.5px}.imageone-model-card small{display:block;margin-top:3px;font-size:8.5px;color:#7b8da2}.imageone-mode-check{position:absolute;right:9px;top:9px;color:#f86000}.imageone-model-card.active{border-color:#f86000;background:#fff8f3}.imageone-size-row{display:grid;grid-template-columns:minmax(220px,.55fr) minmax(0,1fr);gap:10px;align-items:end;margin-top:10px}.imageone-size-row>div{min-height:43px;display:flex;align-items:center;justify-content:flex-end;gap:9px}.imageone-size-row strong{color:#5d37df;font-size:14px}.imageone-size-row span{color:#78899b;font-size:9px}
.imageone-plan-empty{min-height:130px;display:flex;align-items:center;gap:13px;padding:17px;border:1px dashed #ced9e5;border-radius:14px;background:#f9fbfd}.imageone-plan-empty>span{width:48px;height:48px;display:grid;place-items:center;flex:0 0 auto;border-radius:12px;background:#0b2855;color:#fff}.imageone-plan-empty strong{font-size:12px}.imageone-plan-empty p{margin:4px 0 0;color:#76889b;font-size:9.5px;line-height:1.5}.imageone-plan-ready{padding:15px;border:1px solid #dbe4ed;border-radius:15px;background:#fbfcfe}.imageone-plan-ready.approved{border-color:#afd9c5;background:#f8fffb}.imageone-plan-ready>header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.imageone-plan-ready>header span{font-size:7px;font-weight:900;letter-spacing:.11em;color:#f86000}.imageone-plan-ready>header h3{margin:4px 0 0;font-size:17px}.imageone-plan-ready>header b{padding:6px 8px;border-radius:8px;background:#eef2f7;color:#61758a;font-size:8px}.imageone-plan-ready.approved>header b{background:#e8f8ef;color:#19714a}.imageone-plan-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:12px}.imageone-plan-grid article{display:grid;gap:5px;padding:10px;border:1px solid #e2e8ef;border-radius:10px;background:#fff}.imageone-plan-grid small,.imageone-plan-callouts>small,.imageone-plan-rules>small{font-size:6.8px;font-weight:900;letter-spacing:.1em;color:#8091a4}.imageone-plan-grid strong{font-size:9px;line-height:1.45;color:#314b66}.imageone-plan-callouts,.imageone-plan-rules{display:grid;gap:7px;margin-top:10px;padding:10px;border:1px solid #e2e8ef;border-radius:10px;background:#fff}.imageone-plan-callouts span,.imageone-plan-rules p{margin:0;display:flex;align-items:flex-start;gap:7px;color:#455d76;font-size:8.8px;line-height:1.45}.imageone-plan-callouts i{color:#18a06a}.imageone-plan-rules i{color:#6f3bff;margin-top:2px}.imageone-plan-ready>footer{display:flex;justify-content:flex-end;gap:8px;margin-top:11px}
.imageone-final-bar{position:sticky;bottom:max(8px,env(safe-area-inset-bottom));z-index:15;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;border:1px solid #d9e3ee;border-radius:15px;background:rgba(255,255,255,.94);box-shadow:0 18px 44px rgba(13,39,79,.13);backdrop-filter:blur(14px)}.imageone-final-bar>div{display:grid;gap:3px}.imageone-final-bar small{font-size:7px;font-weight:900;letter-spacing:.11em;color:#f86000}.imageone-final-bar strong{font-size:10.5px;color:#334d67}.imageone-final-bar .btn{min-width:245px;min-height:48px}.imageone-final-bar .btn>small{margin-left:6px;padding:3px 6px;border:1px solid rgba(255,255,255,.25);border-radius:6px;background:rgba(255,255,255,.13);color:#fff}
.imageone-history-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.imageone-history-card{overflow:hidden;border:1px solid #dfe6ee;border-radius:12px;background:#fff}.imageone-history-image{display:block;aspect-ratio:3/4;background:#eef2f7}.imageone-history-image img{width:100%;height:100%;object-fit:cover}.imageone-history-body{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;padding:9px}.imageone-history-body strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px}.imageone-history-body small{font-size:7.8px;color:#8393a5}.imageone-history-actions{display:flex;gap:4px}.imageone-history-actions button,.imageone-history-actions a{width:28px;height:28px;display:grid;place-items:center;border:1px solid #dce4ed;border-radius:7px;background:#fff;color:#385676;text-decoration:none}.imageone-history-actions button:last-child{color:#b83545}.imageone-gallery-loading,.imageone-gallery-empty{min-height:100px;display:grid;place-items:center;color:#7a8c9f;font-size:10px}
@media(max-width:1050px){.imageone-hero{grid-template-columns:1fr}.imageone-form-grid,.imageone-settings-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.imageone-plan-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.imageone-history-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){.imageone-page{padding:8px 8px max(92px,env(safe-area-inset-bottom))}.imageone-hero{gap:8px;margin-bottom:8px}.imageone-hero-copy{padding:16px;border-radius:16px}.imageone-hero-copy h1{font-size:28px}.imageone-hero-copy p{font-size:10.5px}.imageone-hero-steps{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}.imageone-hero-steps span{flex:0 0 auto}.imageone-hero-result:has(.imageone-result-empty){display:none}.imageone-result{min-height:220px}.imageone-workspace{gap:8px}.imageone-workspace>.card{padding:11px;border-radius:14px}.imageone-section-head{align-items:flex-start;flex-direction:column;margin-bottom:10px}.imageone-section-head h2{font-size:16px}.imageone-section-head small{font-size:8.5px}.imageone-section-head .btn{width:100%}.imageone-form-grid,.imageone-settings-grid,.imageone-fact-grid{grid-template-columns:1fr}.imageone-card-types{display:flex;overflow-x:auto;gap:7px;scroll-snap-type:x proximity;scrollbar-width:none}.imageone-card-type{flex:0 0 205px;scroll-snap-align:start}.imageone-ref-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.imageone-section-mini{flex-direction:column}.imageone-model-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.imageone-model-card{display:flex;flex-direction:column;justify-content:center;min-height:68px;padding:7px;text-align:center}.imageone-mode-icon{width:30px;height:30px}.imageone-model-card small{display:none}.imageone-size-row{grid-template-columns:1fr}.imageone-size-row>div{justify-content:flex-start}.imageone-plan-grid{grid-template-columns:1fr}.imageone-plan-ready>footer{display:grid;grid-template-columns:1fr}.imageone-final-bar{left:8px;right:8px;bottom:max(5px,env(safe-area-inset-bottom));display:grid;grid-template-columns:1fr;padding:8px}.imageone-final-bar>div{display:none}.imageone-final-bar .btn{width:100%;min-width:0;min-height:48px}.imageone-history-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.imageone-history-body{grid-template-columns:1fr}.imageone-history-actions{justify-content:flex-end}.imageone-result-ready>img{height:230px}}
@media(max-width:420px){.imageone-card-type{flex-basis:180px}.imageone-ref-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.imageone-history-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.imageone-orbit span{animation:none}}