:root{font-family:Hiragino Sans,Yu Gothic,BIZ UDPGothic,sans-serif;color:#222;background:#f5f2ea;line-height:1.5;font-weight:400}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0}button,input{font:inherit}button{cursor:pointer}.page-shell{position:relative;min-height:100vh;overflow-x:hidden}.page{position:relative;z-index:1;width:calc(100% - 2rem);max-width:1200px;margin:0 auto;padding:32px 0 40px;animation:page-enter .42s ease}.home-page{display:grid;gap:18px;align-content:center;min-height:100vh}.hero{width:min(640px,100%);margin:0 auto;padding-top:8px;animation:fade-up .5s ease}.hero h1,.result-card h1{margin:0;font-size:clamp(1.8rem,4vw,2.6rem);line-height:1.15;letter-spacing:-.02em;font-weight:700}.hero-copy,.card-header p,.result-note,.result-subnote{margin:10px 0 0;max-width:40rem;color:#555;font-size:.96rem}.card{position:relative;background:#ffffffd1;border:1px solid #d8d2c7;border-radius:16px}.form-card{width:min(640px,100%);margin:0 auto;padding:20px;animation:fade-up .62s ease}.card-header h2{margin:0;font-size:1.1rem;font-weight:700}.input-form{display:grid;gap:18px;margin-top:18px}.field{display:grid;gap:10px}.field span{font-size:.92rem;font-weight:600}.segmented{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.segment,.ghost-button,.primary-button{border-radius:10px;transition:background .18s ease,transform .18s ease,border-color .18s ease,box-shadow .18s ease}.segment{padding:11px 10px;border:1px solid #d3cdc2;background:#f8f6f1;color:#373737;font-weight:600}.segment.active{background:#2e2e2e;border-color:#2e2e2e;color:#fff}.segment:hover,.segment:focus-visible,.ghost-button:hover,.ghost-button:focus-visible,.primary-button:hover,.primary-button:focus-visible{transform:translateY(-1px)}.input-wrap{display:flex;align-items:center;gap:8px;padding:8px;background:#fff;border-radius:10px;border:1px solid #d3cdc2;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}.input-wrap input{width:100%;min-width:0;padding:8px 10px;border:0;background:transparent;font-size:1rem;outline:none}.input-wrap:focus-within{border-color:#8e8578;box-shadow:0 0 0 3px #8e85781f;transform:translateY(-1px)}.unit-tag{padding:8px 10px;border-radius:8px;background:#f1eee7;color:#535353;font-weight:600}.primary-button{padding:12px 16px;border:1px solid #2e2e2e;background:#2e2e2e;color:#fff;font-weight:600;box-shadow:0 10px 20px #2e2e2e1f}.result-page{display:grid;min-height:100vh;align-content:center;justify-items:center;padding-top:32px;padding-bottom:32px}.result-card{z-index:1;width:min(640px,100%);margin:0 auto;padding:22px;animation:fade-up .52s ease;background:#ffffffa3}.result-note{font-size:.98rem}.result-subnote{color:#6b6256}.result-actions{margin-top:18px}.ghost-button{padding:10px 14px;border:1px solid #d3cdc2;background:#faf8f3;color:#333;font-weight:600}.icon-stack{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;display:grid;align-content:start;justify-content:stretch;grid-template-columns:repeat(auto-fill,minmax(108px,108px));gap:6px;padding:0;overflow:hidden}.stacked-icon{display:flex;align-items:center;justify-content:center;width:108px;height:108px;font-size:4.6rem;opacity:.28;filter:grayscale(1);animation-name:stack-drop;animation-timing-function:cubic-bezier(.22,1,.36,1);animation-fill-mode:both}@keyframes stack-drop{0%{opacity:0;transform:translateY(calc(-320px - (var(--stack-row, 0) * 20px))) scale(.88)}72%{opacity:.3;transform:translateY(-6px) scale(1.05)}to{opacity:.28;transform:translateY(0) scale(1)}}@keyframes fade-up{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes page-enter{0%{opacity:0}to{opacity:1}}@media(max-width:720px){.page{width:calc(100% - 1rem);max-width:none;padding:10px 0 18px}.home-page,.result-page{align-content:start;min-height:100svh;gap:12px}.hero{padding-top:0}.segmented{grid-template-columns:repeat(2,minmax(0,1fr))}.form-card,.result-card{padding:16px}.hero-copy,.card-header p,.result-note,.result-subnote{font-size:.92rem}.icon-stack{top:0;right:0;bottom:0;left:0;justify-items:center;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px 0}.stacked-icon{width:74px;height:74px;font-size:3rem}}