500;600;700&family=Noto+Sans+SC:wght@400;500;600;700&display=swap');

:root{font-family:'DM Sans','Noto Sans SC',sans-serif;color:#202829;background:#f6f7f6;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.52}svg{width:18px;height:18px;display:block;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}button:focus-visible,input:focus-visible{outline:3px solid #81b4a5;outline-offset:2px} .app-shell{display:flex;min-height:100vh}.sidebar{width:244px;flex:none;background:#172423;color:#d5e0dc;display:flex;flex-direction:column;padding:31px 18px 23px;min-height:100vh}.brand{display:flex;align-items:center;gap:12px;padding:0 13px;text-decoration:none;color:#fff;margin-bottom:51px}.brand-mark{height:37px;width:37px;border:1.5px solid #b6ded1;border-radius:12px;display:grid;place-items:center;transform:rotate(-11deg);background:linear-gradient(135deg,#78ae9d33,#a2ccbd0d)}.brand-mark span{height:18px;width:18px;border:1.5px solid #dceee7;border-radius:50%;position:relative}.brand-mark span:after{content:'';position:absolute;width:7px;height:7px;background:#b4dccd;right:-3px;top:-3px;border-radius:50%}.brand-type{display:flex;flex-direction:column;line-height:1.1}.brand-type strong{font-size:21px;font-weight:600;letter-spacing:3px}.brand-type small{font-size:8px;letter-spacing:1.65px;color:#92aaa2;margin-top:7px}.sidebar-label{color:#79938a;font-size:10px;font-weight:700;letter-spacing:2px;padding:0 15px;margin-bottom:12px}.side-nav{display:grid;gap:5px}.nav-item{width:100%;border:0;background:transparent;color:#96aaa4;display:flex;align-items:center;gap:12px;padding:13px 14px;border-radius:11px;text-align:left;font-size:13px;font-weight:600}.nav-item:hover,.nav-item.active{color:#effaf5;background:#2a423b}.nav-item.active .nav-icon{color:#c3e9da}.nav-icon svg{width:17px;height:17px}.nav-dot{width:5px;height:5px;border-radius:50%;background:#acd8c9;margin-left:auto}.sidebar-section{margin-top:42px}.step-list{display:grid;gap:1px;padding:0 11px}.step{height:42px;display:flex;align-items:center;gap:12px;color:#8da49b;font-size:12px;font-weight:500;position:relative}.step:not(:last-child):before{content:'';position:absolute;top:31px;bottom:-12px;left:10px;width:1px;background:#385149}.step-index{font-size:10px;color:#79998d;width:23px;flex:none}.step.done{color:#b2cabf}.step.done .step-index{color:#b2d9ca}.step.current{color:#e7f4eb;font-weight:700}.step.current .step-index{color:#d1e4d8}.step-check{margin-left:auto;color:#93cbb5}.step-check svg{width:13px;height:13px}.sidebar-bottom{margin-top:auto}.studio-note{background:#233d35;border:1px solid #345648;border-radius:14px;padding:20px 18px 18px;display:flex;flex-direction:column;gap:12px;margin:0 2px 22px}.note-spark{color:#c5e7ba}.note-spark svg{width:23px;height:23px}.studio-note strong{font-size:14px;color:#f0f7ef;line-height:1.55;letter-spacing:.2px}.studio-note>span:last-child{font-size:11px;line-height:1.65;color:#a4bdb0}.sidebar-footer{display:flex;align-items:center;gap:9px;padding:0 11px;color:#90aaa0;font-size:10px}.status-pulse{display:inline-block;width:6px;height:6px;border-radius:50%;background:#87cbb3;box-shadow:0 0 0 3px #87cbb31b;flex:none}.main-column{flex:1;min-width:0;display:flex;flex-direction:column}.topbar{height:72px;flex:none;border-bottom:1px solid #e9edeb;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 34px}.breadcrumb{display:flex;align-items:center;gap:13px;font-size:12px;color:#9aa5a2}.breadcrumb strong{color:#34403e;font-weight:600}.breadcrumb-slash{color:#c9d1ce}.top-actions{display:flex;align-items:center;gap:20px}.privacy-note{display:flex;align-items:center;gap:7px;font-size:11px;color:#84938f}.privacy-note svg{width:14px;height:14px}.icon-button{border:0;background:transparent;color:#8b9a95;width:30px;height:30px;display:grid;place-items:center;border-radius:8px}.icon-button:hover,.text-button:hover,.subtle-button:hover{background:#edf3f0;color:#315c4d}.avatar{width:30px;height:30px;border-radius:50%;background:#dfebe4;color:#557668;display:grid;place-items:center;font-size:11px;font-weight:700}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 352px;flex:1;min-height:0}.work-area{padding:37px clamp(25px,3.1vw,52px) 32px;min-width:0}.page-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:25px}.eyebrow{font-size:10px;letter-spacing:1.65px;font-weight:700;color:#8aaa9b;display:flex;align-items:center;gap:9px}.eyebrow-line{height:1px;width:17px;background:#7fb59f}.page-heading h1{font-size:clamp(24px,2.15vw,34px);letter-spacing:-1.7px;line-height:1.2;margin:12px 0 9px;font-weight:600;color:#182a27}.heading-period{color:#88b7a2}.page-heading p{font-size:12px;color:#8a9994;margin:0}.outline-button{display:flex;align-items:center;gap:8px;border:1px solid #dfe7e1;background:#fff;border-radius:9px;padding:10px 13px;font-size:11px;font-weight:700;color:#476456;white-space:nowrap;box-shadow:0 2px 5px #17242307}.outline-button:hover{border-color:#92bca9;background:#f6faf7}.outline-button svg{width:15px;height:15px}.editor-card{background:#fff;border:1px solid #e9eeeb;border-radius:15px;box-shadow:0 12px 38px #31433b0b;overflow:hidden}.editor-header{height:69px;display:flex;align-items:center;justify-content:space-between;padding:0 22px}.file-identity{display:flex;align-items:center;gap:12px;min-width:0}.file-icon{height:34px;width:34px;background:#eef5f0;color:#6c9d83;border-radius:9px;display:grid;place-items:center;flex:none}.file-icon svg{width:17px;height:17px}.file-identity div{display:flex;flex-direction:column;gap:3px;min-width:0}.file-identity strong{font-size:12px;color:#25332e;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.file-identity div span{font-size:10px;color:#9ba9a2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.editor-header-actions{display:flex;align-items:center;gap:16px}.autosave{display:flex;align-items:center;gap:7px;font-size:10px;color:#91a198;white-space:nowrap}.photo-backdrop{background:#e8eae6;min-height:430px;display:grid;place-items:center;position:relative;padding:23px 28px;background-image:radial-gradient(circle at 50% 40%,#f0f0ed 0,#e5e8e4 70%)}.photo-stage{position:relative;width:min(100%,820px);max-height:min(65vh,640px);aspect-ratio:4/3;overflow:hidden;box-shadow:0 14px 40px #26342e31;background:#c1c6c1;user-select:none;touch-action:none}.photo-stage img,.photo-stage canvas{display:block;width:100%;height:100%;position:absolute;inset:0;object-fit:cover}.photo-stage canvas{z-index:1}.compare-handle{position:absolute;z-index:3;top:0;bottom:0;left:50%;width:2px;background:#fff;box-shadow:0 0 6px #0005;pointer-events:none;transform:translateX(-50%)}.handle-circle{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:36px;height:36px;border-radius:50%;background:#fff;box-shadow:0 2px 12px #0004;display:grid;place-items:center;color:#345346}.handle-circle svg{width:19px;height:19px}.image-badge{position:absolute;z-index:2;bottom:16px;color:#fff;background:#1427219c;border:1px solid #ffffff40;border-radius:6px;padding:5px 9px;backdrop-filter:blur(7px);font-size:10px;font-weight:600}.badge-before{right:15px}.badge-after{left:15px}.image-loading{position:absolute;z-index:6;inset:0;background:#1e2c26ad;color:white;display:flex;align-items:center;justify-content:center;gap:12px;font-size:12px}.image-loading[hidden]{display:none}.loading-spinner{width:18px;height:18px;border-radius:50%;border:2px solid #fff8;border-top-color:white;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.drop-overlay{position:absolute;z-index:8;inset:11px;display:none;align-items:center;justify-content:center;flex-direction:column;gap:10px;border:2px dashed #73aa91;background:#ecf8efec;color:#3c7055;border-radius:11px;pointer-events:none}.drop-overlay svg{width:28px;height:28px}.drop-overlay strong{font-size:16px}.drop-overlay span:last-child{font-size:11px}.editor-card.dragging .drop-overlay{display:flex}.editor-toolbar{height:59px;display:flex;align-items:center;gap:19px;padding:0 20px;color:#65766c}.compare-controls{display:flex;align-items:center;gap:10px;font-size:11px;font-weight:600;white-space:nowrap}.compare-controls>svg{width:15px;height:15px;color:#779e88}.compare-controls input{width:clamp(70px,8vw,132px);accent-color:#47886b;height:3px;cursor:pointer}.compare-controls strong{font-size:10px;color:#6c8677;min-width:26px}.toolbar-divider{height:18px;width:1px;background:#e5ece7}.text-button{border:0;background:transparent;border-radius:6px;padding:7px 8px;display:flex;align-items:center;gap:7px;color:#65766c;font-size:11px;font-weight:600;white-space:nowrap}.text-button svg{width:15px;height:15px}.toolbar-hint{margin-left:auto;color:#adb8b0;font-size:10px;white-space:nowrap}.insight-strip{margin-top:17px;display:flex;align-items:center;gap:15px;background:#ecf2ec;border:1px solid #e3ece4;border-radius:12px;padding:16px 17px}.insight-icon{width:35px;height:35px;border-radius:10px;background:#dce9db;color:#719675;display:grid;place-items:center;flex:none}.insight-icon svg{width:18px;height:18px}.insight-strip>div:nth-child(2){display:flex;flex-direction:column;gap:5px;min-width:0}.insight-kicker{font-size:10px;color:#83a18a;font-weight:700}.insight-strip strong{font-size:11px;color:#567064;font-weight:500;line-height:1.5}.insight-strip button{margin-left:auto;flex:none;border:0;background:transparent;color:#7ca48a;border-radius:5px;padding:5px}.insight-strip button svg{width:17px;height:17px}.right-panel{background:#fff;border-left:1px solid #e8eee9;display:flex;flex-direction:column;min-height:calc(100vh - 72px)}.panel-topline{height:42px;padding:0 24px;background:#f0f7f2;color:#659177;font-size:10px;font-weight:700;display:flex;align-items:center;gap:8px;letter-spacing:.5px}.ai-orb{height:14px;width:14px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#e0f9d1,#8dbfa1 55%,#548569);box-shadow:0 0 0 4px #a8ccb33b}.panel-topline-tail{margin-left:auto}.panel-topline-tail svg{width:14px;height:14px}.panel-heading{display:flex;justify-content:space-between;align-items:center;padding:26px 24px 16px}.panel-heading h2{margin:7px 0 0;font-size:20px;letter-spacing:-.4px;color:#203029;font-weight:600}.analysis-mode{border-radius:99px;background:#edf4ee;color:#659875;font-size:10px;padding:6px 8px;font-weight:700;white-space:nowrap}.analysis-card{margin:0 24px 22px;background:#f6f9f5;border:1px solid #eaf0e9;border-radius:12px;padding:16px}.analysis-top{display:flex;align-items:center;gap:9px;color:#3c674e;font-size:12px;font-weight:700}.analysis-icon{color:#72a482}.analysis-icon svg{width:16px;height:16px}.analysis-card p{color:#7b8c7f;font-size:11px;line-height:1.7;margin:9px 0 17px}.metric-list{display:grid;gap:9px}.metric{display:grid;grid-template-columns:57px 1fr 25px;align-items:center;gap:9px;font-size:10px;color:#819388}.metric-track{height:5px;border-radius:9px;background:#e3ebe2;overflow:hidden}.metric-track i{display:block;width:0;height:100%;border-radius:9px;background:linear-gradient(90deg,#95c49d,#5e9874);transition:width .45s}.metric strong{font-size:10px;color:#6d8c76;text-align:right;font-weight:600}.panel-tabs{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid #e9eeeb;padding:0 24px;gap:10px}.panel-tab{background:transparent;border:0;border-bottom:2px solid transparent;color:#93a19a;padding:0 0 14px;font-size:11px;font-weight:700;white-space:nowrap}.panel-tab.active{color:#387456;border-bottom-color:#4a9a70}.panel-scroll{padding:20px 24px;overflow:auto;flex:1;min-height:220px;max-height:calc(100vh - 525px)}.tab-content{display:none}.tab-content.active{display:block}.section-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.section-heading>div{display:flex;flex-direction:column;gap:4px}.section-heading strong{font-size:12px;color:#2b382f}.section-heading span{font-size:10px;color:#a0aca2}.suggestion-count{font-size:10px;color:#8ca594;white-space:nowrap}.suggestions{display:grid;gap:10px}.suggestion-card{border:1px solid #e8eee8;border-radius:11px;padding:13px;background:#fff;transition:all .2s}.suggestion-card:hover{border-color:#cbded0;box-shadow:0 4px 14px #334f380b}.suggestion-card.applied{border-color:#98c8a5;background:#f8fbf7}.suggestion-top{display:flex;align-items:center;gap:10px}.suggestion-icon{width:31px;height:31px;border-radius:9px;background:#edf4eb;color:#6f9e78;display:grid;place-items:center;flex:none}.suggestion-icon svg{width:16px;height:16px}.suggestion-title{flex:1;min-width:0}.suggestion-title strong{display:block;font-size:11px;color:#374439}.suggestion-title small{font-size:10px;color:#a5b0a6;display:block;margin-top:3px}.suggestion-apply{border:1px solid #d6e6d9;color:#4a8b62;background:#f5faf5;border-radius:7px;padding:5px 8px;font-size:10px;font-weight:700;white-space:nowrap}.suggestion-apply:hover{background:#e7f4e8}.suggestion-card.applied .suggestion-apply{background:#5e9c70;color:#fff;border-color:#5e9c70}.suggestion-card>p{font-size:10px;line-height:1.6;color:#819086;margin:10px 0 0}.reason-toggle{margin-top:8px;border:0;background:transparent;padding:0;color:#5d9971;font-size:10px;font-weight:700}.suggestion-lesson{margin-top:9px;background:#eff6ef;border-left:2px solid #9fc5a5;padding:8px 9px;color:#6d846f;font-size:10px;line-height:1.55;display:none}.suggestion-card.expanded .suggestion-lesson{display:block}.slider-list{display:grid;gap:20px;padding:9px 0 19px}.slider-row>div{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.slider-row label{font-size:11px;font-weight:600;color:#536455}.slider-row output{font-size:10px;color:#74947a}.slider-row input{width:100%;height:4px;accent-color:#63a477;cursor:pointer}.subtle-button{background:#f5f8f5;color:#779380;border:0;border-radius:7px;padding:9px 12px;display:flex;align-items:center;gap:8px;font-size:10px;font-weight:700}.subtle-button svg{width:14px;height:14px}.lesson-hero{min-height:112px;background:linear-gradient(135deg,#25473b,#59846b);color:#eef6e9;border-radius:11px;display:flex;align-items:flex-start;justify-content:space-between;padding:18px;margin-bottom:15px}.lesson-hero svg{width:24px;height:24px;color:#c9e3b7}.lesson-hero span{font-size:14px;line-height:1.55;font-weight:600;text-align:right}.lesson-list{display:grid;gap:10px}.lesson-item{border:1px solid #e7eee8;border-radius:10px;padding:13px}.lesson-number{color:#83ac8f;font-size:10px;font-weight:700}.lesson-item strong{display:block;font-size:11px;color:#364c3d;margin:5px 0}.lesson-item p{color:#8a998b;font-size:10px;line-height:1.6;margin:0}.panel-footer{border-top:1px solid #edf1ed;padding:15px 24px 20px;background:#fff;display:grid;grid-template-columns:1fr auto;gap:9px}.primary-button{grid-column:1/-1;height:41px;background:#263d33;border:1px solid #263d33;border-radius:9px;color:#fff;font-size:11px;font-weight:700;display:flex;justify-content:center;align-items:center;gap:10px;box-shadow:0 5px 10px #2c56321e}.primary-button:hover{background:#355e47}.primary-button svg{width:15px;height:15px}.primary-button svg:last-child{margin-left:auto;position:absolute;right:39px}.export-button{grid-column:1/-1;height:37px;border-radius:8px;border:1px solid #dfe9df;background:#fff;color:#4f7557;display:flex;align-items:center;justify-content:center;gap:8px;font-size:11px;font-weight:700}.export-button:hover{background:#f4f9f4}.export-button svg{width:15px;height:15px}.footer-caption{grid-column:1/-1;text-align:center;color:#a6b2a8;font-size:9px;margin-top:2px}.toast{position:fixed;z-index:30;left:50%;bottom:30px;transform:translate(-50%,15px);background:#203b2e;color:#fff;padding:11px 18px;border-radius:9px;font-size:12px;box-shadow:0 8px 25px #172c2240;opacity:0;pointer-events:none;transition:all .25s;max-width:min(450px,calc(100vw - 40px));text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}.help-dialog{border:0;border-radius:17px;padding:29px;max-width:410px;width:calc(100% - 34px);box-shadow:0 25px 80px #1b2f2540;color:#283a2e}.help-dialog::backdrop{background:#172a23a8;backdrop-filter:blur(3px)}.dialog-close{position:absolute;right:17px;top:17px;border:0;background:#eef4ee;border-radius:7px;padding:7px;color:#637e68}.dialog-close svg{width:16px;height:16px}.dialog-icon{display:grid;place-items:center;width:39px;height:39px;background:#e8f4e9;color:#6e9b71;border-radius:10px}.help-dialog h2{font-size:18px;margin:17px 0}.help-dialog ol{padding-left:20px;display:grid;gap:12px}.help-dialog li{padding-left:3px;font-size:12px}.help-dialog li strong{display:block}.help-dialog li span{display:block;color:#7b8f7e;line-height:1.6;margin-top:2px}.help-dialog p{font-size:11px;color:#84968a;line-height:1.6;background:#f5f8f5;padding:10px;border-radius:8px;margin:18px 0 0}
@media(max-width:1250px){.sidebar{width:207px}.workspace{grid-template-columns:minmax(0,1fr) 329px}.work-area{padding-left:24px;padding-right:24px}.photo-backdrop{min-height:360px;padding:20px}.toolbar-hint{display:none}}@media(max-width:1050px){.sidebar{width:70px;padding-left:11px;padding-right:11px}.brand{padding:0;justify-content:center}.brand-type,.sidebar-label,.nav-item span:not(.nav-icon),.sidebar-section,.sidebar-bottom{display:none}.nav-item{justify-content:center;padding:13px}.nav-icon svg{width:20px;height:20px}.workspace{grid-template-columns:minmax(0,1fr) 310px}.topbar{padding:0 24px}.work-area{padding:29px 20px}.photo-backdrop{min-height:300px;padding:17px}}@media(max-width:800px){.sidebar{display:none}.workspace{display:flex;flex-direction:column}.right-panel{border-left:0;border-top:1px solid #e8eee9;min-height:auto}.panel-scroll{max-height:none;min-height:0}.photo-stage{max-height:none}.photo-backdrop{min-height:0}.work-area{padding:25px 20px}.topbar{height:60px}.panel-footer{position:sticky;bottom:0;z-index:8;box-shadow:0 -8px 25px #1e392318}.analysis-card{margin-bottom:17px}.right-panel{padding-bottom:0}}@media(max-width:560px){.topbar{padding:0 16px}.privacy-note,.top-help{display:none}.work-area{padding:22px 12px}.page-heading{align-items:start}.page-heading h1{font-size:24px;letter-spacing:-1px}.page-heading p{font-size:11px;line-height:1.5;max-width:230px}.change-photo{margin-top:19px;padding:9px 10px;font-size:0}.change-photo svg{width:17px;height:17px}.editor-header{padding:0 14px;height:59px}.autosave{display:none}.photo-backdrop{padding:9px}.photo-stage{width:100%}.editor-toolbar{padding:0 11px;gap:5px;height:52px}.compare-controls{gap:7px}.compare-controls input{width:70px}.toolbar-divider{display:none}.text-button{font-size:0;margin-left:auto}.text-button svg{width:17px;height:17px}.insight-strip{padding:13px}.insight-strip strong{font-size:10px}.panel-heading{padding-top:23px}}

.primary-button{position:relative}.primary-button svg:last-child{right:14px}
