@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Nanum+Myeongjo:wght@700;800&family=Pretendard:wght@400;500;600;700;800&display=swap');

:root { --ink:#312526; --cream:#fffaf3; --rose:#de6272; --pink:#f9e2dc; --yellow:#f5c755; --line:#e5d6cb; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); font-family:Pretendard, 'Apple SD Gothic Neo', sans-serif; background:radial-gradient(circle at 14% 5%, #ffe1d9 0, transparent 28%), radial-gradient(circle at 86% 88%, #f6ddb0 0, transparent 24%), #f4eee8; }
button { font:inherit; }
.workspace { width:min(1240px, 100%); margin:auto; padding:48px 24px 70px; }
.site-header { display:flex; justify-content:space-between; align-items:end; gap:24px; margin:0 0 20px; }
.eyebrow,.section-label { margin:0; color:#ae5e66; font-size:10px; font-weight:800; letter-spacing:.15em; }
.site-header h1 { margin:8px 0; font:800 clamp(26px, 4vw, 43px)/1.15 'Nanum Myeongjo', serif; letter-spacing:-.06em; }
.site-header p:not(.eyebrow) { margin:0; color:#78696a; font-size:14px; }
.print-button { border:0; border-radius:999px; padding:15px 21px; color:#fff; background:var(--rose); box-shadow:0 10px 24px #ca65745c; font-weight:700; cursor:pointer; white-space:nowrap; }
.print-button span { margin-left:6px; font-size:17px; }
.tips { display:flex; flex-wrap:wrap; gap:7px; margin-bottom:22px; }
.tips span { border:1px solid #dfd0c7; border-radius:99px; padding:7px 10px; background:#fff9f6aa; color:#756364; font-size:12px; }
.resume-sheet { position:relative; isolation:isolate; overflow:hidden; width:210mm; height:297mm; margin:auto; padding:13mm 14mm 9mm; background:var(--cream); box-shadow:0 25px 60px #74555138; }
.paper-grain { position:absolute; z-index:-1; inset:0; opacity:.35; background-image:radial-gradient(#dbbaac 0.45px, transparent .7px); background-size:6px 6px; }
.resume-header { display:grid; grid-template-columns:1fr auto; gap:6px 20px; align-items:end; padding-bottom:7mm; border-bottom:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:7px; color:var(--rose); font-family:'DM Serif Display',serif; font-size:17px; letter-spacing:.05em; }
.brand-heart { display:grid; place-items:center; width:20px; height:20px; color:white; border-radius:50%; background:var(--rose); font-family:Arial; font-size:11px; }
.resume-header > p { grid-column:1; margin:0; color:#776666; font-size:12px; }
.issue { grid-column:2; grid-row:1 / span 2; color:#9c8986; font-size:9px; letter-spacing:.08em; }
.top-grid { display:grid; grid-template-columns:42% 1fr; gap:8mm; padding:8mm 0 7mm; }
.photo-slot { position:relative; overflow:hidden; background:#f4e6de; cursor:pointer; }
.photo-slot img { width:100%; height:100%; display:block; object-fit:cover; }
.photo-empty { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; color:#b99c94; background:linear-gradient(135deg, #f8e9e2, #f0dcd3); font-size:9px; font-weight:700; letter-spacing:.08em; }
.photo-empty b { display:grid; place-items:center; width:27px; height:27px; border:1px solid currentColor; border-radius:50%; font-size:17px; font-weight:400; }
.large-photo { height:63mm; border-radius:44% 44% 4px 4px; border:5px solid white; box-shadow:5px 6px 0 #e7c9bb; }
.intro-card { padding:4mm 0 0; }
.intro-card h2 { margin:6px 0 2px; font:800 34px/1 'Nanum Myeongjo',serif; letter-spacing:-.09em; }
.name-note { margin:0; color:#806d6d; font-size:12px; }
.info-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px 18px; margin:15px 0; }
.info-grid p { display:grid; gap:3px; margin:0; padding-bottom:6px; border-bottom:1px solid #eadcd4; }
.info-grid span,.taste-list span { color:#ae8e88; font-size:8px; font-weight:800; letter-spacing:.13em; }
.info-grid b { font-size:12px; }
.mini-profile { display:grid; gap:5px; padding:10px 12px; border-radius:3px; color:#875d55; background:#f9e3d5; transform:rotate(-1deg); }
.mini-profile span { font-size:9px; font-weight:700; }
.mini-profile strong { font-size:12px; }
.story-row { display:grid; grid-template-columns:1fr 43%; align-items:center; gap:8mm; padding:7mm 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.story-copy h3 { margin:7px 0 10px; font:800 21px/1.32 'Nanum Myeongjo',serif; letter-spacing:-.06em; }
.story-copy > p:last-child { margin:0; color:#65595a; font-size:11px; line-height:1.7; }
.polaroid-stack { position:relative; height:50mm; }
.polaroid { position:absolute; width:43mm; height:49mm; padding:3mm 3mm 7mm; background:white; box-shadow:2px 4px 9px #765c4a2e; }
.polaroid .photo-empty { inset:3mm 3mm 7mm; }
.polaroid-back { left:5mm; transform:rotate(-7deg); background:#fffdf5; }
.polaroid-front { right:3mm; transform:rotate(6deg); }
.bottom-grid { display:grid; grid-template-columns:1fr 44%; gap:8mm; padding:7mm 0; }
.taste-card { padding:4mm 0; }
.taste-list { display:grid; gap:7px; margin-top:10px; }
.taste-list p { display:grid; grid-template-columns:70px 1fr; gap:7px; align-items:baseline; margin:0; }
.taste-list b { padding-bottom:5px; border-bottom:1px dashed #cfbcb3; font-size:11px; }
.love-quote { margin-top:11px; padding:10px 12px; color:#7e514d; border-left:3px solid var(--yellow); background:#fff1cf; font:italic 14px/1.35 'DM Serif Display','Nanum Myeongjo',serif; }
.small-photos { display:grid; grid-template-columns:1fr 1fr; gap:4mm; align-items:center; }
.small-photo { height:40mm; border:3px solid white; box-shadow:3px 4px 0 #efd5c6; }
.small-photo:first-child { transform:rotate(-3deg); }
.small-photo:last-child { transform:rotate(4deg); }
.resume-footer { display:flex; justify-content:space-between; align-items:center; margin-top:2mm; padding-top:4mm; border-top:1px solid var(--line); color:#b5958e; font-size:8px; font-weight:700; letter-spacing:.17em; }
[contenteditable="true"] { outline:none; cursor:text; border-radius:2px; }
[contenteditable="true"]:focus { background:#fff4a8a6; box-shadow:0 0 0 3px #fff4a8a6; }
[contenteditable="true"]:empty:before { content:attr(data-placeholder); color:#c1afaa; }
@page { size:A4 portrait; margin:0; }
@media print { body { background:#fff; } .no-print { display:none !important; } .workspace { padding:0; } .resume-sheet { box-shadow:none; margin:0; } }
@media (max-width:760px) { .workspace { padding:28px 12px 48px; } .site-header { align-items:flex-start; flex-direction:column; } .print-button { width:100%; } .resume-sheet { transform-origin:top center; transform:scale(calc((100vw - 24px) / 793.7)); margin-bottom:calc(-297mm + ((100vw - 24px) * 1.414)); } }