*{transition:background-color .3s ease,border-color .3s ease,color .3s ease}.nano-product-header{display:grid;gap:1rem;max-width:1240px;margin:0 auto;padding:1rem 1.25rem 1.2rem;color:#0f172a}.nano-brand,.nano-credit-panel button,.nano-header-tools button,.nano-nav button{cursor:pointer;font:inherit}.nano-brand{display:inline-flex;align-items:center;gap:.65rem;min-height:2.65rem;border:0;background:transparent;color:#0f172a;font-weight:850}.nano-brand span{display:grid;place-items:center;width:2.35rem;height:2.35rem;border:1px solid #ccfbf1;border-radius:.65rem;background:#0f766e;color:#fff;font-size:.78rem}.nano-brand strong{font-size:1.08rem}.nano-header-tools,.nano-nav{display:flex;align-items:center;justify-content:flex-end;gap:.45rem}.nano-header-tools button,.nano-nav button{min-height:2.35rem;border:0;border-radius:.55rem;background:transparent;color:#475569;padding:0 .85rem;font-weight:750}.nano-header-tools button.active,.nano-header-tools button:hover,.nano-nav button:hover{background:#fff;color:#0f766e;box-shadow:0 10px 25px rgba(15,23,42,.08)}.nano-workspace-bar{display:grid;grid-template-columns:minmax(0,.8fr) minmax(520px,1.2fr);gap:1rem;align-items:stretch;border:1px solid #dbe4ef;border-radius:.75rem;background:hsla(0,0%,100%,.86);box-shadow:0 20px 55px rgba(15,23,42,.08);backdrop-filter:blur(14px);padding:1rem}.nano-workspace-bar h2,.nano-workspace-bar p,.nano-workspace-bar span{margin:0}.nano-workspace-bar p{color:#0f766e;font-size:.78rem;font-weight:850;text-transform:uppercase}.nano-workspace-bar h2{margin-top:.35rem;font-size:2rem;line-height:1.08}.nano-workspace-bar>div:first-child>span{display:block;margin-top:.5rem;color:#64748b;line-height:1.55}.nano-credit-panel{display:grid;grid-template-columns:minmax(120px,.75fr) minmax(90px,.45fr) minmax(110px,.55fr) minmax(220px,1fr);gap:.65rem;align-items:stretch}.nano-credit-panel>div{min-width:0;padding:.75rem;border:1px solid #dbe4ef;border-radius:.65rem;background:#f8fafc}.nano-credit-panel span,.nano-credit-panel strong{display:block}.nano-credit-panel span{color:#64748b;font-size:.78rem}.nano-credit-panel strong{overflow:hidden;margin-top:.3rem;color:#0f172a;font-size:.95rem;text-overflow:ellipsis;white-space:nowrap}.nano-email-sync{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.5rem}.nano-email-sync input{min-width:0;width:100%;border:1px solid #cbd5e1;border-radius:.5rem;background:#fff;color:#0f172a;padding:0 .7rem;outline:none}.nano-email-sync input:focus{border-color:#0f766e;box-shadow:0 0 0 3px rgba(15,118,110,.12)}.nano-email-sync button{min-height:2.35rem;border:0;border-radius:.5rem;background:#0f766e;color:#f8fafc;padding:0 .85rem;font-weight:800;white-space:nowrap}.nano-credit-panel>p{grid-column:1/-1;margin:0;color:#0f766e;font-weight:750}@media (max-width:768px){header{padding:1rem!important}header nav:not(.nano-nav){display:none!important}.nano-product-header{padding:1rem!important}.nano-credit-panel,.nano-email-sync,.nano-product-header>div:first-child,.nano-workspace-bar{grid-template-columns:1fr!important}.nano-product-header>div:first-child{display:grid!important}.nano-header-tools,.nano-nav{display:grid!important;justify-content:stretch}.nano-header-tools,.nano-nav{grid-template-columns:repeat(3,1fr)}.nano-workspace-bar h2{font-size:1.6rem}.mode-selector{padding:1rem!important}.mode-button{flex:1!important;padding:.75rem 1rem!important;font-size:.9rem!important}.main-content{padding:0 1rem 2rem!important;gap:1rem!important;flex-direction:column!important;align-items:stretch!important}.left-panel{order:2!important}.left-panel,.right-panel{width:100%!important;min-width:0!important}.right-panel{order:1!important}.upload-area{padding:1.5rem 1rem!important;min-height:300px!important}.image-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:.5rem!important;max-height:none!important}.image-preview{height:100px!important}.action-buttons{gap:.5rem!important;flex-wrap:wrap!important}.action-button{padding:.4rem .8rem!important;font-size:.8rem!important}.text-input-area{min-height:300px!important;display:flex!important;flex-direction:column!important}textarea{min-height:150px!important;padding:.75rem!important;font-size:1rem!important}.quick-prompts-grid{grid-template-columns:1fr!important;gap:.5rem!important}.quick-prompt-button{padding:.4rem!important;font-size:.8rem!important}.style-buttons{grid-template-columns:1fr 1fr!important;gap:.5rem!important}.style-button{padding:.6rem!important;font-size:.8rem!important}.generate-button{padding:.8rem!important;font-size:.9rem!important}.result-section{padding:1rem!important}.result-grid{grid-template-columns:1fr!important;gap:1rem!important}.result-image{height:auto!important;max-height:240px!important;-o-object-fit:cover!important;object-fit:cover!important}.examples-grid{gap:1rem!important}.examples-grid,.templates-grid,.tips-grid{grid-template-columns:1fr!important}button{min-height:44px!important;min-width:44px!important}.close-button{width:32px!important;height:32px!important;font-size:16px!important}.image-number{font-size:10px!important;padding:1px 4px!important}}@media (max-width:480px){.mode-button{padding:.6rem .8rem!important;font-size:.8rem!important}.upload-area{padding:1rem .75rem!important}.style-button{padding:.5rem!important;font-size:.75rem!important}.generate-button{padding:.75rem!important;font-size:.85rem!important}.upload-area:hover{border-color:rgba(16,185,129,.4)!important;background:linear-gradient(135deg,#0f0f0f,#1a1a1a)!important}.upload-area:active{transform:scale(.98)!important;border-color:#10b981!important}.image-grid{-webkit-overflow-scrolling:touch!important}input[type=file]{-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important}.action-button:active,.quick-prompt-button:active,.style-button:active{transform:scale(.95)!important;opacity:.8!important}textarea{-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important;font-size:16px!important}@media (hover:hover) and (pointer:fine){.upload-area:hover{border-color:rgba(16,185,129,.4)!important;background:linear-gradient(135deg,#0f0f0f,#1a1a1a)!important}.action-button:hover,.quick-prompt-button:hover,.style-button:hover{transform:translateY(-1px)!important}}}@supports (-webkit-touch-callout:none){.image-preview,.upload-area{-webkit-user-select:none!important;-webkit-touch-callout:none!important}}.gradient-card{background:linear-gradient(135deg,#111,#1a1a1a);border:1px solid rgba(16,185,129,.1);box-shadow:0 8px 25px rgba(0,0,0,.3)}.button-enhanced{background:linear-gradient(135deg,#10b981,#059669);border-radius:.75rem;transition:all .3s ease;box-shadow:0 8px 25px rgba(16,185,129,.3)}.button-enhanced:hover{transform:translateY(-2px);box-shadow:0 12px 35px rgba(16,185,129,.4)}input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:8px;background:linear-gradient(90deg,#1a1a1a,#2a2a2a);outline:none;opacity:.9;transition:all .3s ease;border-radius:6px;cursor:pointer}input[type=range]:hover{opacity:1}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;background:linear-gradient(135deg,#10b981,#059669);cursor:pointer;border-radius:50%;box-shadow:0 4px 15px rgba(16,185,129,.4);-webkit-transition:all .3s ease;transition:all .3s ease}input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.1);box-shadow:0 6px 20px rgba(16,185,129,.6)}input[type=range]::-moz-range-thumb{width:20px;height:20px;background:#10b981;cursor:pointer;border-radius:50%;box-shadow:0 0 10px rgba(16,185,129,.5)}input[type=range]::-webkit-slider-runnable-track{width:100%;height:8px;cursor:pointer;background:#1a1a1a;border-radius:4px}input[type=range]::-moz-range-track{width:100%;height:8px;cursor:pointer;background:#1a1a1a;border-radius:4px}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#1a1a1a;border-radius:4px}::-webkit-scrollbar-thumb{background:#333;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#444}textarea{scrollbar-width:thin;scrollbar-color:#333 #1a1a1a}textarea:focus{outline:none;border-color:#10b981!important}button{transition:all .2s ease}button:hover{transform:translateY(-1px)}button:active{transform:translateY(0)}input[type=file]{display:none}@keyframes pulse{0%{opacity:.6}50%{opacity:1}to{opacity:.6}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes glow{0%,to{box-shadow:0 8px 25px rgba(16,185,129,.3)}50%{box-shadow:0 8px 35px rgba(16,185,129,.5)}}.loading{animation:pulse 1.5s ease-in-out infinite}.button-glow{animation:glow 2s ease-in-out infinite}.rotating{animation:spin 1s linear infinite}