[hidden]{display:none!important}:root,:root[data-theme=light]{--bg-main: #f8fafc;--bg-card: #ffffff;--bg-sunken: #f1f5f9;--text-main: #0f172a;--text-muted: #526071;--border: #e2e8f0;--primary: #4f46e5;--primary-hover: #4338ca;--primary-soft: rgba(79, 70, 229, .1);--secondary: #047857;--accent: #b45309;--accent-soft: rgba(217, 119, 6, .12);--danger: #b91c1c;--shadow: rgba(15, 23, 42, .06);color-scheme:light}@media (prefers-color-scheme: dark){:root:not([data-theme=light]){--bg-main: #0f172a;--bg-card: #1e293b;--bg-sunken: #162033;--text-main: #f8fafc;--text-muted: #a3b1c6;--border: #334155;--primary: #818cf8;--primary-hover: #6366f1;--primary-soft: rgba(129, 140, 248, .14);--secondary: #34d399;--accent: #fbbf24;--accent-soft: rgba(251, 191, 36, .12);--danger: #f87171;--shadow: rgba(0, 0, 0, .3);color-scheme:dark}}:root[data-theme=dark]{--bg-main: #0f172a;--bg-card: #1e293b;--bg-sunken: #162033;--text-main: #f8fafc;--text-muted: #a3b1c6;--border: #334155;--primary: #818cf8;--primary-hover: #6366f1;--primary-soft: rgba(129, 140, 248, .14);--secondary: #34d399;--accent: #fbbf24;--accent-soft: rgba(251, 191, 36, .12);--danger: #f87171;--shadow: rgba(0, 0, 0, .3);color-scheme:dark}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}html,body{font-family:Pretendard Variable,Pretendard,-apple-system,BlinkMacSystemFont,system-ui,Apple SD Gothic Neo,Noto Sans KR,Malgun Gothic,sans-serif;background-color:var(--bg-main);color:var(--text-main);min-height:100vh;overflow-x:hidden;word-break:keep-all}button,input,select{font:inherit}:focus-visible{outline:3px solid var(--primary);outline-offset:2px}#root{min-height:100vh;background-color:var(--bg-main)}.app-container{width:100%;max-width:480px;min-height:100vh;margin:0 auto;background:var(--bg-main);padding-bottom:env(safe-area-inset-bottom)}@media (min-width: 768px){.app-container{max-width:640px}.app-main{padding:24px 24px 48px}.tab-grid{grid-template-columns:repeat(6,1fr)!important}}.app-header{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:calc(12px + env(safe-area-inset-top)) 16px 12px;background:var(--bg-card);border-bottom:1px solid var(--border)}.header-left,.header-actions{display:flex;align-items:center;gap:10px;min-width:0}.header-actions{gap:6px;flex-shrink:0}.logo{width:36px;height:36px;flex-shrink:0;border-radius:10px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#6366f1,#4338ca)}.app-title{font-size:1.05rem;font-weight:800;letter-spacing:-.3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.app-subtitle{font-size:.8rem;color:var(--text-muted)}.icon-btn,.chip-btn{display:flex;align-items:center;justify-content:center;gap:4px;min-width:40px;min-height:40px;padding:0 10px;border-radius:10px;border:1px solid var(--border);background:var(--bg-sunken);color:var(--text-main);font-size:.85rem;font-weight:700;cursor:pointer}.chip-accent{color:var(--accent);background:var(--accent-soft)}.app-main{padding:16px 16px 40px}.tab-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px}.tab{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 4px;border-radius:12px;border:1px solid var(--border);background:var(--bg-card);color:var(--text-main);font-size:.875rem;font-weight:600;text-decoration:none;transition:background .15s ease}.tab svg{color:var(--primary)}.tab-active{background:var(--primary);border-color:var(--primary);color:#fff;font-weight:800}.tab-active svg{color:#fff}:root[data-theme=dark] .tab-active{color:#0f172a}:root[data-theme=dark] .tab-active svg{color:#0f172a}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:16px;padding:16px;margin-bottom:14px;box-shadow:0 2px 12px var(--shadow)}.card-guide{background:var(--primary-soft);border-color:transparent;box-shadow:none}.card-result{border:2px solid var(--primary)}.card-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}.card-head .card-title{margin-bottom:0}.card-title,.section-title{display:flex;align-items:center;gap:6px;font-size:.95rem;font-weight:800;color:var(--text-main);margin-bottom:12px}.card-title svg,.section-title svg{color:var(--primary);flex-shrink:0}.guide-text{font-size:.875rem;line-height:1.6}.diagram{display:block;width:100%;max-width:320px;height:auto;margin:0 auto 10px}.dg-line{fill:none;stroke:var(--text-muted);stroke-width:1.5}.dg-fill{fill:var(--bg-card);stroke:var(--text-muted);stroke-width:1.5}.dg-perimeter{fill:var(--bg-card);stroke:var(--primary);stroke-width:5}.dg-door{stroke:var(--bg-card);stroke-width:7}.dg-arrow{stroke:var(--primary);stroke-width:1.5}.dg-arrowhead{fill:var(--primary)}.dg-text{fill:var(--text-main);font-size:12px;font-weight:700}.dg-sub{fill:var(--text-muted);font-size:11px}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.field{min-width:0}.field-label{display:block;font-size:.85rem;font-weight:700;color:var(--text-main);margin-bottom:6px}.input{width:100%;min-height:46px;padding:10px 12px;border-radius:10px;border:1px solid var(--border);background:var(--bg-sunken);color:var(--text-main);font-size:1.05rem;font-weight:700}select.input{font-size:.95rem;font-weight:600}.input[aria-invalid=true]{border-color:var(--danger);border-width:2px}.field-hint,.field-error{font-size:.78rem;margin-top:4px;line-height:1.4;color:var(--text-muted)}.field-error{color:var(--danger);font-weight:600}.center{text-align:center;margin-top:8px}.muted{color:var(--text-muted);font-weight:500}.note{display:flex;gap:6px;margin-top:8px;font-size:.82rem;line-height:1.45;color:var(--accent);font-weight:600}.note svg{flex-shrink:0;margin-top:2px}.sub-section{margin-top:16px}.summary-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:14px;padding:12px;border-radius:10px;background:var(--bg-sunken);font-size:.9rem}.summary-row strong{color:var(--secondary);font-weight:800}.segmented{display:inline-flex;padding:3px;border-radius:10px;background:var(--bg-sunken);border:1px solid var(--border)}.segmented button{min-width:44px;min-height:34px;border:none;border-radius:8px;background:transparent;color:var(--text-muted);font-weight:700;cursor:pointer}.segmented .seg-active{background:var(--bg-card);color:var(--primary);box-shadow:0 1px 4px var(--shadow)}.option-grid{display:grid;gap:6px;margin-bottom:12px}.option-grid-2{grid-template-columns:repeat(2,1fr)}.option-grid-3{grid-template-columns:repeat(3,1fr)}.option-grid-4{grid-template-columns:repeat(2,1fr)}@media (min-width: 400px){.option-grid-4{grid-template-columns:repeat(4,1fr)}}.option-grid:last-child{margin-bottom:0}.option{display:flex;flex-direction:column;align-items:center;gap:2px;min-height:48px;padding:8px 4px;border-radius:10px;border:1px solid var(--border);background:var(--bg-sunken);color:var(--text-main);cursor:pointer;text-align:center}.option-active{border:2px solid var(--primary);background:var(--primary-soft);color:var(--primary)}.option-label{font-size:.875rem;font-weight:800}.option-desc{font-size:.75rem;color:var(--text-muted)}.btn-primary,.btn-secondary{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;border-radius:14px;font-weight:700;cursor:pointer;transition:transform .1s ease}.btn-primary{border:none;padding:14px 20px;background:var(--primary);color:#fff;font-size:1rem}:root[data-theme=dark] .btn-primary{color:#0f172a}.btn-secondary{padding:12px 16px;border:1px solid var(--border);background:var(--bg-card);color:var(--text-main);font-size:.95rem}.btn-large{min-height:54px;font-size:1.05rem;margin-top:4px}.btn-primary:active,.btn-secondary:active{transform:scale(.98)}.link-btn{display:inline-flex;align-items:center;gap:3px;min-height:32px;border:none;background:none;color:var(--primary);font-size:.8rem;font-weight:700;text-decoration:underline;cursor:pointer}.badge{display:inline-flex;align-items:center;padding:4px 8px;border-radius:6px;font-size:.75rem;font-weight:700;white-space:nowrap}.badge-success{background:#10b98124;color:var(--secondary)}.result-hero{text-align:center;padding:8px 0 16px;border-bottom:1px dashed var(--border)}.result-caption{font-size:.875rem;color:var(--text-muted);font-weight:600}.result-qty{font-size:2.6rem;font-weight:900;color:var(--secondary);letter-spacing:-1px;line-height:1.2}.result-unit{font-size:1.15rem;color:var(--text-main);font-weight:800}.result-raw{font-size:.85rem;color:var(--text-muted)}.detail-list{display:flex;flex-direction:column;gap:8px;margin-top:14px;font-size:.875rem}.detail-row{display:flex;justify-content:space-between;gap:12px}.detail-row dt{color:var(--text-muted);flex-shrink:0}.detail-row dd{font-weight:700;text-align:right}.detail-strong{padding:6px 8px;margin:0 -8px;border-radius:8px;background:var(--primary-soft)}.detail-strong dt,.detail-strong dd{color:var(--primary);font-weight:800}.callout{display:flex;gap:8px;margin-top:12px;padding:10px 12px;border-radius:10px;background:var(--bg-sunken);font-size:.84rem;line-height:1.5}.callout svg{flex-shrink:0;margin-top:2px;color:var(--text-muted)}.callout-warn{background:var(--accent-soft);color:var(--accent);font-weight:600}.callout-warn svg{color:var(--accent)}.cost-list{display:flex;flex-direction:column;gap:10px;margin-top:10px}.cost-row{display:flex;align-items:center;justify-content:space-between;gap:10px}.cost-label{font-size:.9rem;font-weight:700}.cost-input-wrap{display:flex;align-items:center;gap:6px;width:55%}.cost-input{text-align:right;font-size:.95rem}.products{margin:20px 0 16px}.disclosure{display:flex;gap:6px;padding:10px 12px;margin-bottom:10px;border-radius:10px;border:1px solid var(--border);background:var(--bg-sunken);color:var(--text-muted);font-size:.8rem;line-height:1.5}.disclosure svg{flex-shrink:0;margin-top:3px}.product-list{list-style:none;display:flex;flex-direction:column;gap:10px}.product{display:flex;align-items:center;gap:12px;padding:12px;border-radius:12px;border:1px solid var(--border);background:var(--bg-card);color:var(--text-main);text-decoration:none}.product-main{border:2px solid var(--primary)}.product-icon{display:flex;align-items:center;justify-content:center;width:48px;height:48px;flex-shrink:0;border-radius:10px;background:var(--primary-soft);color:var(--primary)}.product-body{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}.product-tag{font-size:.75rem;font-weight:800;color:var(--primary)}.product-title{font-size:.92rem;font-weight:800}.product-desc{font-size:.8rem;color:var(--text-muted);line-height:1.4}.product-cta{display:flex;align-items:center;gap:2px;flex-shrink:0;font-size:.8rem;font-weight:800;color:var(--primary)}.footer{margin-top:20px;padding:14px;border-radius:12px;border:1px solid var(--border);background:var(--bg-sunken);font-size:.78rem;line-height:1.55;color:var(--text-muted);display:flex;flex-direction:column;gap:8px}.footer-head{display:flex;align-items:center;justify-content:space-between}.footer-title{display:flex;align-items:center;gap:6px;font-size:.85rem;font-weight:800;color:var(--text-main)}.footer-title svg{color:var(--primary)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:20px;background:#0009}.modal{width:100%;max-width:440px;max-height:85vh;overflow-y:auto;padding:20px;border-radius:20px;border:1px solid var(--border);background:var(--bg-card);outline:none}.modal-title{display:flex;align-items:center;gap:6px;font-size:1.05rem;font-weight:800;margin-bottom:14px}.modal-title svg{color:var(--primary)}.modal-body{display:flex;flex-direction:column;gap:10px}.modal-item{padding:12px;border-radius:10px;background:var(--bg-sunken);font-size:.875rem;line-height:1.55}.modal-item strong{color:var(--primary)}.modal-item p{margin-top:4px;color:var(--text-muted)}.modal-close{margin-top:16px}@media (max-width: 360px){.app-main{padding:12px 12px 32px}.card{padding:12px}.field-grid{grid-template-columns:1fr}}@media (prefers-reduced-motion: reduce){*{transition:none!important}}.ad-label{margin-left:8px;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:700;background:#7f7f7f24;color:inherit;vertical-align:middle}.guide-tips{margin:12px 0 0;padding-left:18px;font-size:14px;color:var(--text-main);line-height:1.6}.guide-tips li+li{margin-top:4px}.faq-item{border-top:1px solid var(--border);padding:12px 0}.faq-item summary{cursor:pointer;font-weight:600;color:var(--text-main);list-style-position:outside}.faq-item p{margin:8px 0 0;font-size:14px;color:var(--text-muted);line-height:1.6}.fab-group{position:fixed;right:16px;bottom:20px;display:flex;flex-direction:column;align-items:flex-end;gap:8px;z-index:50}.fab{min-height:44px;padding:0 16px;border:none;border-radius:999px;background:var(--primary);color:#fff;font-weight:600;font-size:14px;box-shadow:0 6px 18px var(--shadow);cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.fab-secondary{background:var(--bg-card);color:var(--primary);border:1px solid var(--border)}@media (hover: hover) and (prefers-reduced-motion: no-preference){.card,.product,.btn-primary,.btn-secondary,.fab,.tab{transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease,border-color .2s ease}.card:hover{transform:translateY(-2px);box-shadow:0 8px 22px var(--shadow)}.product:hover{transform:translateY(-2px);box-shadow:0 8px 18px var(--shadow);border-color:var(--primary)}.btn-primary:hover,.btn-secondary:hover{transform:translateY(-1px);box-shadow:0 6px 14px var(--shadow)}.fab:hover{transform:translateY(-2px)}}.faq-item[open] summary{color:var(--primary)}.soft-notice{margin:10px 2px 4px;font-size:12.5px;color:var(--text-muted);line-height:1.6;padding-left:10px;border-left:3px solid var(--border)}.product-thumb{flex:none;width:64px;height:64px;border-radius:12px;display:grid;place-items:center;overflow:hidden;color:#fff;background:linear-gradient(135deg,var(--primary),#818cf8)}.product-thumb img{width:100%;height:100%;object-fit:cover}.thumb-deco-tile{background:linear-gradient(135deg,#b45309,#f59e0b)}.thumb-jangpan{background:linear-gradient(135deg,#0369a1,#38bdf8)}.thumb-wallpaper{background:linear-gradient(135deg,#be185d,#f472b6)}.thumb-paint{background:linear-gradient(135deg,#15803d,#4ade80)}.thumb-molding{background:linear-gradient(135deg,#6b21a8,#c084fc)}.thumb-lighting{background:linear-gradient(135deg,#a16207,#facc15)}@media (prefers-reduced-motion: no-preference){@keyframes card-rise{0%{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}}@keyframes pop-in{0%{opacity:0;transform:scale(.5)}60%{opacity:1;transform:scale(1.12)}to{transform:scale(1)}}@keyframes float-y{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes grad-shift{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.card{animation:card-rise .5s cubic-bezier(.2,.8,.2,1) both}.result-qty{animation:pop-in .6s cubic-bezier(.34,1.56,.64,1) both}.btn-primary,.btn-secondary{transition:transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .25s ease}.btn-primary:active,.btn-secondary:active{transform:scale(.94)}.btn-primary{background-size:200% 200%;animation:grad-shift 6s ease infinite}.tab.active{animation:pop-in .35s cubic-bezier(.34,1.56,.64,1) both}.product-thumb{animation:float-y 3.2s ease-in-out infinite}.product:nth-child(2n) .product-thumb{animation-delay:.6s}.product:nth-child(3n) .product-thumb{animation-delay:1.2s}.fab{animation:pop-in .4s cubic-bezier(.34,1.56,.64,1) both}}@media (hover: hover) and (prefers-reduced-motion: no-preference){.card{transition:transform .35s cubic-bezier(.34,1.56,.64,1),box-shadow .35s ease}.card:hover{transform:translateY(-4px) scale(1.005);box-shadow:0 16px 36px #6366f12e}.product{transition:transform .3s cubic-bezier(.34,1.56,.64,1),box-shadow .3s ease,border-color .3s ease}.product:hover{transform:translateY(-4px) rotate(-.4deg);box-shadow:0 14px 30px #8b5cf638;border-color:var(--primary)}.product:hover .product-thumb{transform:scale(1.08) rotate(4deg)}.product-thumb{transition:transform .35s cubic-bezier(.34,1.56,.64,1)}.product-cta{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.product:hover .product-cta{transform:translate(4px)}.btn-primary:hover,.btn-secondary:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 14px 28px #6366f14d}.tab{transition:transform .3s cubic-bezier(.34,1.56,.64,1),background-color .2s ease,color .2s ease}.tab:hover{transform:translateY(-3px)}.icon-btn,.link-btn{transition:transform .3s cubic-bezier(.34,1.56,.64,1),background-color .2s ease}.icon-btn:hover{transform:rotate(-12deg) scale(1.1)}.faq-item summary{transition:color .2s ease,transform .25s cubic-bezier(.34,1.56,.64,1)}.faq-item summary:hover{transform:translate(4px)}}