/* 인스타 감성 필터 — 편집 레이아웃 */
#if-app{--ink:#2f2a2d;--muted:#7a6f75;--line:#e9e0e5;--accent:#8c4a62;--soft:#f6eef1;max-width:1120px;margin:14px auto 40px;color:var(--ink);text-align:left;font-size:14px;line-height:1.65}
#if-app *{box-sizing:border-box}#if-app [hidden]{display:none!important}#if-app h1,#if-app h2,#if-app h3,#if-app p{padding:0}
#if-app h1{font-size:38px;letter-spacing:-1.8px;line-height:1.28;font-weight:800;margin:14px 0}#if-app h2{font-size:21px;margin:0;font-weight:750;letter-spacing:-.6px}#if-app h3{font-size:16px;margin:0;font-weight:750;display:flex;align-items:center;gap:8px;flex-wrap:wrap}#if-app h3>span{font-size:11px;color:#b7899c;margin-right:1px}
#if-app .if-hero{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:34px 38px;border-radius:24px;background:var(--soft);border:1px solid #efe3e8;overflow:hidden}
#if-app .if-eyebrow{color:#9a6a80;font-size:10px;font-weight:750;letter-spacing:1.8px}#if-app .if-hero p{font-size:14px;color:#7a6570;margin:0 0 19px}#if-app .if-badge{font-size:11px;background:#eddde5;color:#7d4a62;border-radius:24px;padding:7px 12px}
/* 히어로: 같은 장면 세 장이 하나의 톤으로 */
#if-app .if-hero-art{position:relative;width:250px;height:230px;flex-shrink:0}#if-app .if-card{position:absolute;width:118px;height:150px;background:#fff;padding:7px 7px 24px;border-radius:5px;box-shadow:0 12px 30px #5a2f4518}#if-app .if-card i{display:block;width:100%;height:100%;border-radius:2px;background:radial-gradient(circle at 70% 22%,#fff2d6 0 12%,transparent 13%),linear-gradient(180deg,#89b4de 0 52%,#4f8fb0 52% 78%,#e6d4ad 78%)}#if-app .if-card-a{left:0;top:40px;transform:rotate(-9deg)}#if-app .if-card-a i{filter:sepia(.5) saturate(.8) brightness(1.05)}#if-app .if-card-b{left:66px;top:14px;transform:rotate(2deg);z-index:1}#if-app .if-card-b i{filter:sepia(.5) saturate(.8) brightness(1.05)}#if-app .if-card-c{left:134px;top:46px;transform:rotate(10deg)}#if-app .if-card-c i{filter:sepia(.5) saturate(.8) brightness(1.05)}#if-app .if-hero-art b{position:absolute;bottom:4px;left:72px;background:var(--accent);color:#fff;padding:6px 12px;border-radius:20px;font-size:11px;letter-spacing:1px;transform:rotate(-4deg);z-index:2}
#if-app .if-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:26px 0 16px}#if-app .if-link-button{border:0;background:transparent;color:var(--accent);font-size:12px;padding:4px;white-space:nowrap;min-height:32px}
#if-app .if-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;grid-template-areas:'upload side' 'filters side' 'adjust side';gap:18px;align-items:start}
#if-app .if-upload-panel{grid-area:upload}#if-app .if-filters{grid-area:filters}#if-app .if-adjust{grid-area:adjust}#if-app .if-side{grid-area:side;position:sticky;top:12px;display:flex;flex-direction:column;gap:18px;min-width:0}
#if-app .if-panel{border:1px solid var(--line);border-radius:18px;padding:22px;background:#fff;min-width:0}#if-app .if-row{display:flex;justify-content:space-between;align-items:center;gap:10px}#if-app .if-small{font-size:11px;color:var(--muted)}#if-app .if-note{font-size:12px;color:var(--muted);margin:11px 0 0;line-height:1.7;overflow-wrap:anywhere}
#if-app .if-pair{display:grid;grid-template-columns:1fr 1fr;gap:4px 16px}#if-app label,#if-app .if-label{display:block;font-size:13px;font-weight:650;margin:16px 0 6px}#if-app label small,#if-app .if-label small{font-size:11px;color:var(--muted);font-weight:400;margin-left:5px}
#if-app button,#if-app input,#if-app select{font:inherit}#if-app button{border:1px solid var(--line);border-radius:9px;min-height:44px;background:#fff;color:var(--ink);padding:10px 12px;font-size:12px;font-weight:600;cursor:pointer;line-height:1.5}#if-app button:hover{background:#faf4f7}#if-app button[aria-pressed=true]{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);background:#f8edf2}#if-app button:disabled{opacity:.45;cursor:not-allowed}
#if-app :is(button,input,select,a,summary):focus-visible{outline:3px solid #b98aa0;outline-offset:3px}
#if-app select,#if-app input[type=text]{display:block;width:100%;min-height:46px;border:1px solid #ddd3d8;background:#fdfbfc;color:var(--ink);border-radius:9px;padding:10px 12px;font-size:16px}#if-app input[type=range]{width:100%;accent-color:var(--accent);min-height:28px;margin:0}#if-app output{font-size:11px;color:var(--muted);float:right;font-weight:400}
/* 업로드 */
#if-app .if-drop{position:relative;border:1.5px dashed #d8c3cd;background:#fcf8fa;border-radius:13px;margin-top:17px;padding:20px 16px 15px;text-align:center}#if-app .if-drop.is-dragging{background:#f3e1ea;border-color:var(--accent)}#if-app .if-drop>label{display:flex;align-items:center;flex-direction:column;gap:6px;margin:0;padding-bottom:10px;cursor:pointer;font-weight:400}#if-app .if-drop label strong{padding:9px 20px;background:#fff;border:1px solid #d6c2cc;border-radius:9px;font-size:14px;color:#6f3f55}#if-app .if-drop label>span{font-size:11px;color:#8d7a84}#if-app .if-drop label .if-plus{font-size:27px;line-height:1.1;color:#9a6a80}#if-app .if-drop>small{font-size:10px;color:#8d857a}
#if-app #if-upload{position:absolute;width:1px;height:1px;padding:0;margin:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}#if-app .if-drop:focus-within{outline:3px solid #b98aa0;outline-offset:3px}
#if-app .if-thumbs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px;margin-top:15px}#if-app .if-thumb{padding:3px;position:relative;aspect-ratio:1;overflow:hidden;min-height:0}#if-app .if-thumb img{width:100%;height:100%;object-fit:cover;display:block;border-radius:4px}#if-app .if-thumb b{position:absolute;bottom:3px;left:3px;font-size:9px;color:#fff;background:#39332dd9;border-radius:3px;padding:1px 4px}
#if-app .if-photo-actions{justify-content:flex-end;margin-top:10px}#if-app .if-photo-actions button{font-size:11px;min-height:34px;padding:6px 8px}
/* 프리셋 타일 */
#if-app .if-presets{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:9px;margin-top:16px}#if-app .if-preset{position:relative;padding:5px 5px 7px;border-radius:12px;display:flex;flex-direction:column;align-items:center;gap:6px;min-height:0}#if-app .if-preset canvas{width:100%;height:auto;aspect-ratio:1;border-radius:8px;display:block;background:#ece6dc}#if-app .if-preset span{font-size:12px;font-weight:600}#if-app .if-preset[aria-pressed=true] span{color:var(--accent)}
#if-app .if-mytone i{position:absolute;top:1px;right:1px;width:22px;height:22px;border-radius:50%;background:#fff;border:1px solid var(--line);font-style:normal;font-size:14px;line-height:20px;text-align:center;color:#8d7a84}#if-app .if-mytone i:hover{background:#f3e1ea;color:var(--accent)}
/* 조정 */
#if-app .if-tone-save{margin-top:20px;padding-top:16px;border-top:1px solid var(--line)}#if-app .if-tone-row{display:grid;grid-template-columns:minmax(0,1fr) 88px;gap:8px}#if-app .if-tone-row button{min-height:46px}
/* 미리보기 */
#if-app .if-tone-chip{font-style:normal;font-size:11px;font-weight:600;background:#f3e4eb;color:var(--accent);border-radius:20px;padding:2px 9px}#if-app .if-stage{background:#f3eef0;margin:14px auto 0;max-width:316px;max-height:420px;display:flex;justify-content:center;border-radius:6px;overflow:hidden}#if-app canvas#if-canvas{max-width:100%;max-height:420px;object-fit:contain;width:auto;height:auto;display:block}
#if-app .if-compare{width:100%;margin-top:12px;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;background:#faf4f7;border-color:#d9c3ce;color:#6f3f55}#if-app .if-compare[aria-pressed=true]{background:#6f3f55;color:#fff;border-color:#6f3f55;box-shadow:none}
#if-app .if-primary{width:100%;margin-top:14px;background:#7d4a62;color:#fff;border-color:#7d4a62;padding:14px;font-size:15px}#if-app .if-primary:hover{background:#633a4e}#if-app .if-secondary{width:100%;margin-top:8px;padding:12px;color:#7d4a62;border-color:#d9c3ce;background:#faf4f7}#if-app #if-save-link{display:block;margin-top:10px;color:#7d4a62;font-size:12px}
/* 피드 미리보기 */
#if-app .if-feed{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:14px;background:#fff}#if-app .if-feed-cell{width:100%;height:auto;aspect-ratio:1;display:block;background:#f3eef0}
/* 도움말 */
#if-app .if-help{padding:32px 8px}#if-app .if-uses{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:22px 0 30px}#if-app .if-uses>div{border-left:2px solid #dcc3cf;padding-left:15px}#if-app .if-uses b{font-size:13px}#if-app .if-uses p{font-size:12px;color:var(--muted);margin:4px 0 0}#if-app details{border-top:1px solid var(--line);padding-top:16px;margin-top:16px}#if-app summary{cursor:pointer;font-size:14px;font-weight:600;min-height:28px}#if-app details p{color:var(--muted);font-size:13px;line-height:1.8;margin:10px 0 0}
@media(max-width:950px){#if-app .if-layout{grid-template-columns:minmax(0,1fr) 300px;gap:14px}#if-app .if-panel{padding:18px}#if-app .if-presets{grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}#if-app .if-stage{max-width:262px}}
@media(max-width:700px){#if-app{margin-top:8px}#if-app .if-hero{padding:27px 22px}#if-app h1{font-size:31px}#if-app .if-hero p{font-size:13px}#if-app .if-hero-art{display:none}#if-app h2{font-size:18px}#if-app .if-heading h2{font-size:17px}
 #if-app .if-layout{grid-template-columns:1fr;grid-template-areas:'upload' 'preview' 'filters' 'adjust' 'export' 'feed'}#if-app .if-side{display:contents}
 #if-app .if-preview{grid-area:preview;position:sticky;top:0;z-index:5;padding:12px 14px 12px;box-shadow:0 6px 18px #5a2f4514}#if-app .if-export{grid-area:export}#if-app .if-feedpanel{grid-area:feed}
 #if-app .if-preview h3{font-size:14px}#if-app .if-stage{margin-top:8px;max-width:100%;max-height:36vh}#if-app canvas#if-canvas{max-height:36vh}#if-app .if-compare{margin-top:8px;min-height:40px;font-size:12px}#if-app .if-preview .if-note{margin-top:6px;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 #if-app .if-thumbs{grid-template-columns:repeat(5,minmax(0,1fr))}#if-app .if-presets{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}#if-app .if-preset span{font-size:11px}#if-app .if-uses{grid-template-columns:1fr;gap:18px}#if-app .if-pair{gap:2px 12px}#if-app .if-small{font-size:10px}}
@media(max-width:400px){#if-app .if-pair{grid-template-columns:1fr}#if-app .if-export .if-pair{grid-template-columns:1.5fr 1fr}}
