:root{--bg: #f5efe2;--bg-tint: #ede5d2;--card: #ffffff;--ink: #2a261f;--ink-2: rgba(42, 38, 31, .65);--ink-3: rgba(42, 38, 31, .45);--line: rgba(42, 38, 31, .08);--line-2: rgba(42, 38, 31, .14);--accent: #d97757;--accent-dark: #b85e40;--accent-soft: #fbece4;--success: #5b8a5f;--radius-sm: 8px;--radius: 14px;--radius-lg: 20px;--shadow-sm: 0 1px 2px rgba(42, 38, 31, .06);--shadow: 0 1px 2px rgba(42, 38, 31, .04), 0 8px 24px -8px rgba(42, 38, 31, .1);--shadow-lg: 0 1px 2px rgba(42, 38, 31, .04), 0 32px 60px -24px rgba(42, 38, 31, .18);--font-ui: "Inter", "Pretendard", "Noto Sans KR", system-ui, sans-serif;--font-display: "Gowun Dodum", "Inter", system-ui, sans-serif}*,*:before,*:after{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--font-ui);color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}button{font:inherit;color:inherit;cursor:pointer;border:0;background:transparent}img{-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.app{min-height:100%;display:flex;flex-direction:column;max-width:1180px;margin:0 auto;padding:28px 32px 40px}.app__header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:22px}.app__brand{display:flex;align-items:baseline;gap:10px}.app__logo{font-size:28px;line-height:1;transform:translateY(2px)}.app__title{font-family:var(--font-display);font-size:28px;font-weight:700;margin:0;letter-spacing:-.01em}.app__sub{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}.app__footer{margin-top:auto;padding-top:24px;font-size:11.5px;letter-spacing:.04em;color:var(--ink-3);text-align:center}.app__main{display:grid;grid-template-columns:472px 1fr;gap:24px;align-items:stretch}@media (max-width: 980px){.app__main{grid-template-columns:1fr}.app{padding:20px}}.card{background:var(--card);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:28px}.card__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.card__label{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3);font-weight:600}.card__hint{font-size:12.5px;color:var(--ink-3)}.card--char{display:flex;flex-direction:column;align-items:center;gap:16px;padding:24px 28px 28px}.card--char .card__label{align-self:flex-start}.card--wardrobe{display:flex;flex-direction:column;min-height:640px}.char-canvas{position:relative;background:radial-gradient(80% 60% at 50% 90%,rgba(42,38,31,.06) 0%,transparent 60%),linear-gradient(180deg,#faf5ea,#f1e8d2);border-radius:var(--radius);overflow:hidden}.char-base,.char-layer{position:absolute;pointer-events:none}.char-base{top:0;left:50%;height:100%;width:auto;transform:translate(-50%);z-index:1}.char-layer{filter:drop-shadow(0 2px 4px rgba(42,38,31,.1));animation:layer-pop .22s cubic-bezier(.4,1.6,.6,1) forwards}@keyframes layer-pop{0%{opacity:0;transform:translate(-50%) scale(.86)}to{opacity:1;transform:translate(-50%) scale(1)}}.tabs{display:flex;gap:4px;background:var(--bg-tint);border-radius:999px;padding:4px;margin-bottom:20px;align-self:flex-start}.tab{display:inline-flex;align-items:center;gap:8px;padding:8px 18px;border-radius:999px;font-size:13px;font-weight:500;color:var(--ink-2);transition:background .15s,color .15s,box-shadow .15s;white-space:nowrap}.tab:hover{color:var(--ink)}.tab--active{background:var(--card);color:var(--ink);box-shadow:var(--shadow-sm);font-weight:600}.tab__dot{display:inline-block;width:6px;height:6px;border-radius:999px;background:var(--accent)}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}@media (max-width: 480px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}.grid-empty{padding:60px 0;text-align:center;color:var(--ink-3);font-size:13px}.item-card{position:relative;display:flex;flex-direction:column;gap:6px;padding:10px 10px 12px;background:var(--card);border:1.5px solid var(--line);border-radius:var(--radius);transition:transform .15s,border-color .15s,box-shadow .15s,background .15s;text-align:left}.item-card:hover{transform:translateY(-2px);border-color:var(--line-2);box-shadow:var(--shadow)}.item-card--on{border-color:var(--accent);background:var(--accent-soft)}.item-card--on:hover{border-color:var(--accent-dark)}.item-card__thumb{position:relative;aspect-ratio:1 / 1;display:flex;align-items:center;justify-content:center;background:var(--bg);border-radius:var(--radius-sm);overflow:hidden}.item-card--on .item-card__thumb{background:#fff}.item-card__thumb img{max-width:80%;max-height:80%;object-fit:contain}.item-card__check{position:absolute;top:6px;right:6px;width:22px;height:22px;border-radius:999px;background:var(--accent);color:#fff;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 2px 6px #d9775773}.item-card__name{font-size:12.5px;color:var(--ink);font-weight:500;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.controls{display:flex;align-items:center;gap:10px}.controls__count{font-size:12px;color:var(--ink-3);padding:6px 12px;border-radius:999px;background:var(--bg-tint);margin-right:4px}.controls__count strong{color:var(--ink);font-weight:600;margin-left:2px}.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:999px;font-size:13px;font-weight:500;transition:background .15s,color .15s,transform .1s}.btn:disabled{opacity:.4;cursor:not-allowed}.btn--ghost{background:var(--card);color:var(--ink);border:1px solid var(--line-2)}.btn--ghost:hover:not(:disabled){background:var(--bg-tint)}.btn--ghost:active:not(:disabled){transform:scale(.97)}