:root{color:#171717;background:#fbfbfa;font-family:Inter,PingFang SC,Microsoft YaHei,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:linear-gradient(180deg,#fff,#f7f7f4)}button,input,textarea{font:inherit}button{cursor:pointer;transition:background .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,transform .16s ease}.app-shell{min-height:100vh;padding:20px;background:radial-gradient(circle at 50% 0%,#ffffffeb,#fff0 42%),#fbfbfa}.workspace{display:grid;grid-template-columns:minmax(260px,318px) minmax(420px,1fr) minmax(270px,326px);gap:0;min-height:calc(100vh - 40px);overflow:hidden;background:#ffffffdb;border:1px solid rgba(24,24,22,.08);border-radius:6px;box-shadow:0 32px 88px #1a1a1714,0 1px #ffffffe6 inset}.panel,.preview-area{background:#ffffffc7}.panel{padding:22px 20px;overflow:auto}.panel:first-child{border-right:1px solid rgba(24,24,22,.08)}.panel-right{border-left:1px solid rgba(24,24,22,.08)}.brand{display:flex;gap:13px;align-items:center;margin-bottom:22px}.brand-logo{display:block;width:98px;height:auto;object-fit:contain;mix-blend-mode:multiply}.brand p,.topbar p{margin:0 0 5px;color:#9a9a93;font-size:10px;font-weight:400;text-transform:uppercase;letter-spacing:.08em}.brand h1,.topbar h2{margin:0;font-size:20px;font-weight:420;line-height:1;letter-spacing:0}.upload-zone{display:grid;min-height:126px;place-items:center;gap:9px;margin-bottom:16px;color:#252520;border:1px dashed rgba(36,36,32,.24);border-radius:6px;background:linear-gradient(180deg,#ffffffe6,#f7f7f4ad);font-size:13px;font-weight:320}.upload-zone:hover{border-color:#1818157a;background:#fff}.upload-zone input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.thumb-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-bottom:20px}.thumb{position:relative;aspect-ratio:1;overflow:hidden;background:#e8e8e4;border-radius:4px}.thumb img{width:100%;height:100%;object-fit:cover}.thumb button{position:absolute;top:5px;right:5px;display:grid;width:22px;height:22px;place-items:center;color:#fff;background:#00000094;border:0;border-radius:50%}.control-group{padding:18px 0;border-top:1px solid rgba(20,20,20,.075)}.control-title{display:flex;gap:8px;align-items:center;margin-bottom:12px;color:#242420;font-size:12px;font-weight:420;letter-spacing:.02em}.style-list,.action-stack{display:grid;gap:7px}.style-card{display:grid;grid-template-columns:13px 1fr;gap:5px 10px;width:100%;padding:13px 12px;text-align:left;color:#242420;background:transparent;border:1px solid transparent;border-radius:6px}.style-card.selected{background:#fbfbfa;border-color:#18181680;box-shadow:0 8px 24px #1414120a}.style-card:hover{background:#fbfbfa;border-color:#18181629}.style-card span{width:10px;height:10px;margin-top:4px;border-radius:1px}.style-card strong{font-size:14px;font-weight:420}.style-card small{grid-column:2;color:#92928b;font-size:11px;font-weight:300}.style-pagination{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:center;margin-top:12px}.style-pagination button{min-height:32px;color:#2a2a26;background:#fff;border:1px solid rgba(20,20,20,.11);border-radius:6px;font-size:12px;font-weight:320}.style-pagination button:disabled{cursor:default;color:#b8b8b2;background:#f8f8f6}.style-pagination button:not(:disabled):hover{border-color:#14141252;background:#fbfbfa}.style-pagination span{color:#8e8e87;font-size:11px;font-weight:320;letter-spacing:.04em}.preview-area{display:grid;grid-template-rows:auto minmax(0,1fr);min-width:0;overflow:hidden;background:#fcfcfb}.topbar{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:18px 24px;border-bottom:1px solid rgba(24,24,22,.075)}.palette{display:flex;gap:7px}.palette span{width:17px;height:17px;border:1px solid rgba(0,0,0,.12);border-radius:50%}.canvas-wrap{position:relative;display:grid;place-items:center;min-height:0;padding:38px;overflow:hidden;background:linear-gradient(90deg,rgba(17,17,15,.025) 1px,transparent 1px),linear-gradient(180deg,rgba(17,17,15,.025) 1px,transparent 1px),#f8f8f6;background-size:34px 34px}canvas{position:relative;z-index:1;display:block;width:auto;max-width:100%;height:auto;max-height:calc(100vh - 128px);background:#fff;box-shadow:0 26px 70px #1c1c1824,0 0 0 1px #10100e14,0 1px #ffffffdb inset;cursor:crosshair;touch-action:none}.segmented,.theme-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.segmented button,.theme-grid button{min-height:34px;padding:0 8px;color:#30302b;background:#fff;border:1px solid rgba(20,20,20,.105);border-radius:6px;font-size:12px;font-weight:320}.segmented button.active,.theme-grid button.active{color:#fff;background:#171714;border-color:#171714;box-shadow:0 10px 24px #1414111f}.segmented button:not(.active):hover,.theme-grid button:not(.active):hover,.secondary-action:hover,.reset-all:hover,.edit-actions button:hover,.batch-download:hover{border-color:#14141252;background:#fbfbfa}.copy-input{display:grid;gap:8px;margin-top:15px}.copy-input span{display:flex;align-items:center;justify-content:space-between;gap:8px;color:#888882;font-size:11px;font-weight:320;text-transform:uppercase;letter-spacing:.06em}.text-clear-button{min-height:24px;padding:0 8px;color:#252525;background:#fff;border:1px solid rgba(20,20,20,.12);border-radius:6px;font-size:11px;font-weight:320}.text-clear-button:hover{border-color:#14141252;background:#fbfbfa}.copy-input textarea{width:100%;resize:vertical;min-height:78px;padding:11px 12px;color:#171717;background:#fcfcfb;border:1px solid rgba(20,20,20,.11);border-radius:6px;outline:none;font-size:13px;line-height:1.55}.copy-input textarea:focus{border-color:#14141285;box-shadow:0 0 0 3px #14141209}.hint{margin:8px 0 0;color:#85857f;font-size:12px;line-height:1.55}.toggle-row{display:flex;gap:10px;align-items:center;margin-top:12px;color:#343430;font-size:12px;font-weight:320}.toggle-row input{width:16px;height:16px;accent-color:#171714}.layer-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.layer-tabs button,.edit-actions button{min-height:36px;color:#252525;background:#fff;border:1px solid rgba(20,20,20,.12);border-radius:6px;font-size:12px;font-weight:320}.layer-tabs button.active{color:#fff;background:#111}.range-row{display:grid;grid-template-columns:46px 1fr;gap:10px;align-items:center;margin-top:14px;color:#777772;font-size:11px;font-weight:320;text-transform:uppercase;letter-spacing:.04em}.color-row{display:grid;grid-template-columns:52px 42px 1fr;gap:10px;align-items:center;margin-top:12px;color:#777772;font-size:11px;font-weight:320;text-transform:uppercase;letter-spacing:.04em}.color-row input{width:38px;height:30px;padding:2px;background:#fff;border:1px solid rgba(20,20,20,.12);border-radius:6px}.color-row button{min-height:30px;color:#252525;background:#fff;border:1px solid rgba(20,20,20,.12);border-radius:6px;font-size:12px;font-weight:320}.color-row button:hover{border-color:#14141252;background:#fbfbfa}.range-row input{width:100%;accent-color:#171714}.crop-controls{padding:12px;margin-top:12px;background:#ffffffa3;border:1px solid rgba(20,20,20,.08);border-radius:6px}.crop-controls p{margin:0 0 2px;color:#343430;font-size:12px;font-weight:360}.crop-controls .range-row{grid-template-columns:72px 1fr;margin-top:10px}.crop-controls button{width:100%;min-height:32px;margin-top:10px;color:#252525;background:#fff;border:1px solid rgba(20,20,20,.12);border-radius:6px;font-size:12px;font-weight:320}.edit-actions,.history-actions{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:12px}.history-actions button{display:flex;align-items:center;justify-content:center;gap:6px;min-height:34px;color:#252525;background:#fff;border:1px solid rgba(20,20,20,.12);border-radius:6px;font-size:12px;font-weight:320}.history-actions button:hover:not(:disabled){border-color:#14141252;background:#fbfbfa}.history-actions button:disabled{cursor:not-allowed;opacity:.42}.reset-all{width:100%;min-height:36px;margin-top:10px;color:#252525;background:#fff;border:1px solid rgba(20,20,20,.12);border-radius:6px;font-size:12px;font-weight:320}.primary-action,.secondary-action{display:flex;justify-content:center;align-items:center;gap:8px;min-height:42px;border-radius:6px;font-size:13px}.primary-action:disabled,.secondary-action:disabled{cursor:wait;opacity:.55}.primary-action{color:#fff;background:#171714;border:1px solid #171714;font-weight:420;box-shadow:0 14px 30px #14141229}.primary-action:hover{background:#2a2a25;transform:translateY(-1px)}.secondary-action{color:#1e1e1a;background:#fff;border:1px solid rgba(20,20,20,.12);font-weight:320}.insight-card{margin-top:16px;padding:14px 0 0;color:#242420;background:transparent;border-top:1px solid rgba(20,20,20,.08);font-size:12px}.batch-panel{padding:16px 0;border-top:1px solid rgba(20,20,20,.08)}.batch-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.batch-item{display:grid;gap:7px}.batch-preview{overflow:hidden;padding:0;background:#f7f7f5;border:1px solid rgba(20,20,20,.12);border-radius:6px}.batch-preview img{display:block;width:100%;aspect-ratio:3 / 4;object-fit:cover}.batch-download{min-height:32px;color:#202020;background:#fff;border:1px solid rgba(20,20,20,.14);border-radius:6px;font-size:11px;font-weight:320}.insight-card p{margin:6px 0 0;color:#777771;font-size:12px;line-height:1.55}@media(max-width:1100px){.workspace{grid-template-columns:minmax(230px,290px) minmax(360px,1fr)}.panel-right{grid-column:1 / -1;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;border-top:1px solid rgba(24,24,22,.08)}.panel-right .control-group{border-top:0;padding:0}.insight-card{margin-top:0}}@media(max-width:760px){.app-shell{padding:10px}.workspace,.panel-right{grid-template-columns:1fr}.workspace{min-height:auto;overflow:visible}.panel:first-child,.panel-right{border-right:0;border-left:0}.preview-area{min-height:560px}.topbar{align-items:flex-start;flex-direction:column}.canvas-wrap{padding:12px}canvas{max-height:72vh}}
