:root{--bg:#f8f6f2;--surface:#fff;--panel:#f1ede6;--panel-hover:#ece7df;--text:#1d1b18;--text-2:#4a453e;--text-3:#5f594f;--muted:#8a8378;--line:#e7e1d7;--line-strong:#cfc7ba;--accent:oklch(52% .11 45);--ink:#1d1b18;--ink-hover:#35312b;--error:#b3261e;--serif:"Noto Serif KR", serif;--mono:"IBM Plex Mono", ui-monospace, monospace;color:var(--text);background:var(--bg);font-family:Pretendard,system-ui,Malgun Gothic,sans-serif}*{box-sizing:border-box}body{background:var(--bg);min-height:100vh;color:var(--text);-webkit-font-smoothing:antialiased;word-break:keep-all;margin:0}button{font:inherit;white-space:nowrap;cursor:pointer;flex-shrink:0}input::placeholder{color:#aaa397}input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none}.shell{flex-direction:column;min-height:100vh;display:flex}.page{flex:1;width:100%;max-width:1200px;margin:0 auto;padding:56px 48px}.eyebrow{font-family:var(--mono);color:var(--accent);letter-spacing:.08em;font-size:12px}.serif-title{font-family:var(--serif);letter-spacing:-.035em;text-wrap:pretty;margin:0;font-weight:700}.btn{background:var(--ink);height:60px;color:var(--bg);border:0;border-radius:4px;padding:0 36px;font-size:17px;font-weight:600;transition:background .15s}.btn:hover:not(:disabled){background:var(--ink-hover)}.btn:disabled{opacity:.3;cursor:not-allowed}.btn-outline{border:1px solid var(--line-strong);background:var(--bg);height:48px;color:var(--text);border-radius:4px;padding:0 22px;font-size:15px;font-weight:600;transition:background .15s}.btn-outline:hover{background:#efebe4}.stripes{background:repeating-linear-gradient(135deg,#ebe6de 0 12px,#e4ded4 12px 24px)}.site-header{border-bottom:1px solid var(--line)}.site-header-inner{justify-content:space-between;align-items:center;gap:24px;max-width:1200px;margin:0 auto;padding:22px 48px;display:flex}.brand{all:unset;cursor:pointer;font-family:var(--serif);letter-spacing:-.02em;font-size:21px;font-weight:700}.header-right{align-items:center;gap:28px;display:flex}.step-label{font-family:var(--mono);color:var(--muted);letter-spacing:.04em;font-size:12px}.btn-new{border:1px solid var(--ink);height:40px;color:var(--ink);background:0 0;border-radius:4px;padding:0 18px;font-size:14px;font-weight:600;transition:background .15s,color .15s}.btn-new:hover{background:var(--ink);color:var(--bg)}.intro{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:center;gap:72px;padding-top:64px;padding-bottom:64px;display:grid}.intro-copy{flex-direction:column;gap:36px;display:flex}.intro-head{flex-direction:column;gap:20px;display:flex}.intro h1{font-size:52px;line-height:1.28}.intro-lead{max-width:480px;color:var(--text-3);text-wrap:pretty;margin:0;font-size:17px;line-height:1.7}.intro-cta{align-items:center;gap:20px;display:flex}.intro-cta small{color:var(--muted);font-size:14px}.intro-steps{border-top:1px solid #e1dbd1;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:0;padding:24px 0 0;list-style:none;display:grid}.intro-steps li{flex-direction:column;gap:8px;font-size:15px;display:flex}.intro-steps span{font-family:var(--mono);color:var(--muted);font-size:12px}.intro-visual{aspect-ratio:4/5;border-radius:4px;place-items:center;padding:32px;display:grid}.intro-visual svg{width:55%;height:auto}.input-page{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:72px;display:grid}.photo-slot{aspect-ratio:4/5;cursor:pointer;border-radius:4px;width:100%;display:block;position:relative;overflow:hidden}.photo-empty{background:var(--panel);text-align:center;border:1px dashed #c3bbae;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:24px;transition:background .15s;display:flex}.photo-empty:hover,.photo-empty:focus-visible,.photo-empty.dragging{background:var(--panel-hover);outline:none}.photo-plus{border:1px solid var(--ink);border-radius:50%;justify-content:center;align-items:center;width:52px;height:52px;font-size:24px;line-height:1;display:flex}.photo-empty strong{font-size:16px}.photo-empty small{color:var(--muted);font-size:14px}.photo-filled{background:#e4ded4;border:0;padding:0}.photo-filled img{object-fit:cover;width:100%;height:100%;display:block}.photo-change{background:#f8f6f2f0;border-radius:3px;padding:10px 14px;font-size:14px;font-weight:500;position:absolute;bottom:16px;right:16px}.input-side{flex-direction:column;gap:36px;padding-top:12px;display:flex}.input-head{flex-direction:column;gap:12px;display:flex}.input-head h2{letter-spacing:-.03em;font-size:36px}.input-head p{color:#6b655c;margin:0;font-size:16px;line-height:1.65}.fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.field{flex-direction:column;gap:10px;display:flex}.field>span{color:var(--text-2);font-size:14px;font-weight:600}.input-box{background:var(--surface);border:1px solid #d8d1c6;border-radius:4px;align-items:center;gap:6px;height:56px;padding:0 16px;display:flex}.input-box:focus-within{border-color:var(--ink)}.input-box input{min-width:0;font:inherit;color:var(--text);background:0 0;border:0;outline:0;flex:1;font-size:18px}.input-box em{color:var(--muted);font-size:15px;font-style:normal}.field-error,.form-error{color:var(--error);margin:0;font-size:13px}.submit-block{flex-direction:column;gap:14px;display:flex}.submit-block .btn{width:100%}.note{color:var(--muted);margin:0;font-size:13px;line-height:1.6}.loading-page{flex-direction:column;justify-content:center;gap:32px;max-width:560px;padding-top:96px;padding-bottom:96px;display:flex}.loading-page h2{letter-spacing:-.03em;font-size:36px;line-height:1.4}.progress{background:#e1dbd1;height:2px;overflow:hidden}.progress>div{background:var(--ink);height:100%;transition:width .3s linear}.load-steps{flex-direction:column;gap:14px;margin:0;padding:0;list-style:none;display:flex}.load-steps li{color:#b0a898;align-items:center;gap:14px;font-size:16px;display:flex}.load-steps li.active{color:var(--ink)}.load-steps span{width:24px;font-family:var(--mono);font-size:12px}.error-page{flex-direction:column;gap:20px;max-width:560px;padding-top:96px;display:flex}.error-page h2{font-size:32px}.error-page p{color:var(--text-3);margin:0;font-size:16px;line-height:1.7}.error-actions{gap:10px;margin-top:8px;display:flex}.error-actions .btn{height:48px;padding:0 22px;font-size:15px}.result-page{flex-direction:column;gap:48px;padding-bottom:80px;display:flex}.result-hero{border-bottom:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:40px;padding-bottom:40px;display:flex}.result-hero-copy{flex-direction:column;gap:16px;max-width:680px;display:flex}.result-hero h1{font-size:44px;line-height:1.3}.tags{flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none;display:flex}.tags li{border:1px solid var(--line-strong);color:var(--text-2);border-radius:100px;padding:7px 12px;font-size:13px}.section{flex-direction:column;gap:20px;display:flex}.section+.section{border-top:1px solid var(--line);padding-top:40px}.sections{flex-direction:column;gap:48px;display:flex}.section-head{justify-content:space-between;align-items:baseline;display:flex}.section-head h3{margin:0;font-size:19px;font-weight:700}.section-head span{font-family:var(--mono);color:var(--muted);font-size:12px}.body-grid{grid-template-columns:140px minmax(0,1fr);align-items:start;gap:24px;display:grid}.body-photo{aspect-ratio:3/4;background:repeating-linear-gradient(135deg,#ebe6de 0 8px,#e4ded4 8px 16px);border-radius:3px;overflow:hidden}.body-photo img{object-fit:cover;width:100%;height:100%;display:block}.facts{grid-template-columns:auto minmax(0,1fr);gap:14px 18px;margin:0;font-size:15px;display:grid}.facts dt{color:var(--muted)}.facts dd{margin:0;font-weight:600}.facts dd.plain{font-weight:400}.prose{color:var(--text-2);text-wrap:pretty;margin:0;font-size:15px;line-height:1.75}.palette-summary{color:var(--text-2);margin:0;font-size:15px;line-height:1.65}.palette{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none;display:grid}.palette li{flex-direction:column;gap:8px;display:flex}.swatch{aspect-ratio:1/1.3;border-radius:3px;box-shadow:inset 0 0 0 1px #0000000f}.palette strong{font-size:13px;font-weight:600;line-height:1.3}.palette small{font-family:var(--mono);color:var(--muted);font-size:11px}.avoid{color:#6b655c;align-items:center;gap:12px;font-size:14px;display:flex}.avoid strong{color:var(--ink);font-weight:600}.look-grid{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:end;gap:28px;display:grid}.look-frame{aspect-ratio:4/5;background:#e9e7e3;border-radius:4px;justify-content:center;align-items:center;display:flex;overflow:hidden}.look-frame img{object-fit:contain;width:100%;height:100%;display:block}.look-frame svg{width:auto;height:78%}.look-frame.stripes{justify-content:flex-start;align-items:flex-end;padding:16px}.look-frame .mono-note{font-family:var(--mono);color:#7d766b;font-size:12px}.look-copy{flex-direction:column;gap:14px;display:flex}.look-copy h4{font-family:var(--serif);letter-spacing:-.02em;margin:0;font-size:24px;font-weight:700;line-height:1.35}.look-items{color:var(--text-2);flex-direction:column;gap:10px;margin:0;padding:0;font-size:15px;line-height:1.5;list-style:none;display:flex}.look-items li{border-top:1px solid var(--line);padding-top:10px}.tips{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px;margin:0;padding:0;list-style:none;display:grid}.tips li{border-top:1px solid var(--line);flex-direction:column;gap:8px;padding:20px 0;display:flex}.tips .tip-n{font-family:var(--mono);color:var(--accent);font-size:12px}.tips strong{font-size:16px;font-weight:600}.tips p{color:var(--text-3);text-wrap:pretty;margin:0;font-size:15px;line-height:1.7}@media (width<=900px){.page{padding:32px 20px}.site-header-inner{padding:16px 20px}.header-right{gap:14px}.intro,.input-page,.look-grid{grid-template-columns:minmax(0,1fr);gap:40px}.intro h1{font-size:36px}.intro-cta{flex-direction:column;align-items:flex-start;gap:12px}.intro-visual{aspect-ratio:16/11;order:-1}.intro-visual svg{width:auto;height:100%}.result-hero h1{font-size:32px}.input-head h2,.loading-page h2{font-size:28px}.palette{grid-template-columns:repeat(auto-fit,minmax(72px,1fr))}.tips{grid-template-columns:minmax(0,1fr)}.avoid{flex-wrap:wrap}}@media (width<=480px){.fields{grid-template-columns:minmax(0,1fr)}.body-grid{grid-template-columns:96px minmax(0,1fr);gap:16px}.step-label{display:none}}.gender-field{border:0;min-width:0;margin:0;padding:0}.gender-field legend{color:var(--text-2);margin-bottom:10px;padding:0;font-size:14px;font-weight:600}.segmented{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.segmented label{background:var(--surface);cursor:pointer;border:1px solid #d8d1c6;border-radius:4px;justify-content:center;align-items:center;height:56px;font-size:16px;transition:background .15s,color .15s,border-color .15s;display:flex}.segmented label:hover{border-color:var(--ink)}.segmented label.selected{background:var(--ink);border-color:var(--ink);color:var(--bg);font-weight:600}.segmented label:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}.segmented input{opacity:0;pointer-events:none;position:absolute}.user-email{text-overflow:ellipsis;white-space:nowrap;max-width:200px;color:var(--muted);font-size:13px;overflow:hidden}.link-btn{color:var(--ink);text-underline-offset:3px;background:0 0;border:0;padding:0;font-size:14px;font-weight:600;text-decoration:underline}.link-btn:hover{color:var(--accent)}.login-page{flex-direction:column;gap:24px;max-width:480px;padding-top:72px;padding-bottom:96px;display:flex}.login-head{flex-direction:column;gap:12px;display:flex}.login-page h2{letter-spacing:-.03em;font-size:36px}.login-lead{color:#6b655c;margin:0;font-size:16px;line-height:1.65}.login-lead code{font-family:var(--mono);font-size:13px}.login-form{flex-direction:column;gap:20px;display:flex}.login-form .btn{width:100%}.notice{border:1px solid var(--line-strong);background:var(--panel);color:var(--text-2);border-radius:4px;margin:0;padding:12px 14px;font-size:14px;line-height:1.6}.notice.error{color:var(--error);background:#fbeeed;border-color:#e3b7b3}.login-switch{color:var(--muted);align-items:center;gap:10px;margin:0;font-size:14px;display:flex}.login-switch button{color:var(--ink);text-underline-offset:3px;background:0 0;border:0;padding:0;font-size:14px;font-weight:600;text-decoration:underline}@media (width<=900px){.user-email{display:none}.login-page{padding-top:40px}.login-page h2{font-size:28px}}.btn-google{background:var(--surface);width:100%;height:56px;color:var(--text);border:1px solid #d8d1c6;border-radius:4px;justify-content:center;align-items:center;gap:12px;font-size:16px;font-weight:600;transition:background .15s,border-color .15s;display:flex}.btn-google:hover:not(:disabled){border-color:var(--ink);background:#fdfcfa}.btn-google:disabled{opacity:.5;cursor:not-allowed}.divider{color:var(--muted);align-items:center;gap:14px;font-size:13px;display:flex}.divider:before,.divider:after{content:"";background:var(--line);flex:1;height:1px}.profile-menu{position:relative}.profile-btn{border:1px solid var(--line-strong);background:var(--bg);width:40px;height:40px;color:var(--ink);border-radius:50%;place-items:center;transition:border-color .15s,background .15s;display:grid}.profile-btn:hover,.profile-btn[aria-expanded=true]{border-color:var(--ink);background:#efebe4}.profile-dropdown{z-index:20;border:1px solid var(--line-strong);background:var(--surface);border-radius:6px;flex-direction:column;min-width:220px;max-width:280px;padding:6px;display:flex;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 8px 24px #1d1b181f}.profile-email{border-bottom:1px solid var(--line);color:var(--muted);text-overflow:ellipsis;white-space:nowrap;margin-bottom:4px;padding:10px 12px 12px;font-size:13px;overflow:hidden}.profile-dropdown button{text-align:left;color:var(--text);background:0 0;border:0;border-radius:4px;padding:10px 12px;font-size:15px}.profile-dropdown button:hover,.profile-dropdown button:focus-visible{background:var(--panel);outline:none}.mypage{flex-direction:column;gap:40px;max-width:720px;padding-bottom:96px;display:flex}.mypage-head{flex-direction:column;gap:12px;display:flex}.mypage-head h2{letter-spacing:-.03em;font-size:36px}.mypage .section+.section{border-top:1px solid var(--line);padding-top:40px}.info-list{grid-template-columns:96px minmax(0,1fr)}.info-list dd{overflow-wrap:anywhere}.action-row{flex-wrap:wrap;gap:10px;display:flex}.action-row .btn-outline:disabled{opacity:.5;cursor:not-allowed}.btn-danger,.btn-danger-outline{border-radius:4px;height:48px;padding:0 22px;font-size:15px;font-weight:600;transition:background .15s,color .15s}.btn-danger-outline{border:1px solid var(--error);color:var(--error);background:0 0}.btn-danger-outline:hover{background:#fbeeed}.btn-danger{border:1px solid var(--error);background:var(--error);color:#fff}.btn-danger:hover:not(:disabled){filter:brightness(.92)}.btn-danger:disabled{opacity:.6;cursor:not-allowed}.confirm-box{background:#fbeeed;border:1px solid #e3b7b3;border-radius:4px;flex-direction:column;gap:12px;padding:20px;display:flex}.confirm-box strong{color:var(--error);font-size:17px}.confirm-box p{color:var(--text-2);margin:0;font-size:14px;line-height:1.6}.confirm-box .notice.error{background:var(--surface)}.banner{width:100%;max-width:1200px;margin:0 auto;padding:24px 48px 0}@media (width<=900px){.banner{padding:16px 20px 0}.mypage-head h2{font-size:28px}}@media (width<=480px){.info-list{grid-template-columns:72px minmax(0,1fr)}}.history-page{flex-direction:column;gap:32px;padding-bottom:96px;display:flex}.history-page h2{letter-spacing:-.03em;margin:0;font-size:36px}.history-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 24px;margin:0;padding:0;list-style:none;display:grid}.history-card{color:inherit;flex-direction:column;gap:8px;text-decoration:none;display:flex}.history-thumb{aspect-ratio:4/5;border-radius:4px;margin-bottom:4px;overflow:hidden}.history-thumb img{object-fit:cover;width:100%;height:100%;transition:transform .25s;display:block}.history-card:hover .history-thumb img{transform:scale(1.03)}.history-card:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.history-date{font-family:var(--mono);color:var(--muted);font-size:12px}.history-headline{font-family:var(--serif);letter-spacing:-.02em;font-size:17px;line-height:1.4}.history-card:hover .history-headline{color:var(--accent)}.history-meta{color:var(--muted);font-size:13px}.history-empty{flex-direction:column;align-items:flex-start;gap:16px;padding:40px 0;display:flex}.history-empty .prose{margin:0}.back-link{color:var(--text-2);align-self:flex-start;font-size:14px;font-weight:600;text-decoration:none}.back-link:hover{color:var(--accent)}@media (width<=900px){.history-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}.history-page h2{font-size:28px}}@media (width<=480px){.history-grid{grid-template-columns:minmax(0,1fr)}}