@font-face{font-family:TT Hoves;src:url(/salary-calc/fonts/TTHoves-Regular.woff2)format("woff2");font-weight:400;font-style:normal;font-display:swap}:root{--bg:#f5f5f5;--card:#fff;--ink:#333;--muted:#999;--faint:#ccc;--blue:#33f;--blue-soft:#ccf;--line:#e2e2e2;--scrim:#f5f5f5db;--font:"TT Hoves", "Helvetica Neue", Arial, sans-serif;--gut:max(40px, env(safe-area-inset-left,0px));--gutr:max(40px, env(safe-area-inset-right,0px));--cw:300px;--ch:192px;--gap:8px;--delw:72px;--dur-xs:.12s;--dur-s:.2s;--dur-m:.32s;--dur-l:.6s;--stagger:40ms;--ease-out:cubic-bezier(.2, 0, 0, 1);--ease-in-out:cubic-bezier(.4, 0, .2, 1);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}@media (max-width:640px){:root{--gut:max(20px, env(safe-area-inset-left,0px));--gutr:max(20px, env(safe-area-inset-right,0px));--cw:min(300px, calc(100vw - 72px))}}*,:before,:after{box-sizing:border-box}[hidden]{display:none!important}html,body{height:100%}body{background:var(--bg);color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased;margin:0;font-size:14px;line-height:1.35}.app{flex-direction:column;min-height:100%;display:flex;overflow-x:hidden}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}input{font:inherit;color:inherit;background:0 0;border:0;outline:none;min-width:0;padding:0}a{color:inherit}:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:4px}.card input:focus{outline:none}.card input:focus-visible{outline:none}.top{padding:40px var(--gutr) 28px var(--gut);align-items:center;gap:16px;display:flex}.logo{width:48px;height:12px;display:block}.proto-badge{color:var(--muted);margin-left:auto;font-size:12px}.proto-badge a{color:var(--ink);transition:color var(--dur-xs);text-decoration:none}.proto-badge a:hover{color:var(--blue)}.start{grid-template-columns:minmax(0, 1fr) var(--cw);padding:0 var(--gutr) 40px var(--gut);flex:1;gap:40px;display:grid}.hero{max-width:520px;transition:opacity var(--dur-m) var(--ease-out), transform var(--dur-m) var(--ease-out);flex-direction:column;display:flex}.hero h1{letter-spacing:-.03em;text-wrap:balance;margin:0;font-size:80px;font-weight:400;line-height:.9}.hero .rule{background:var(--ink);max-width:360px;height:1px;margin:88px 0 12px}.hero .sub{max-width:340px;margin:0 0 24px;font-size:24px;line-height:1.15}.hero .fine{max-width:340px;margin:0 0 24px;font-size:12px;line-height:16px}.hero .go-link{color:var(--blue);align-self:flex-start;font-size:24px;text-decoration:none}.hero .go-link:hover{text-underline-offset:4px;text-decoration:underline}.preview{transition:opacity var(--dur-m) var(--ease-out);flex-direction:column;gap:4px;display:flex}.preview .card:nth-child(2){opacity:.72}.preview .card:nth-child(3){opacity:.42}.start.leaving .hero{opacity:0;transform:translateY(-24px)}.start.leaving .preview{opacity:0}.card{width:var(--cw);height:var(--ch);background:var(--card);transition:opacity var(--dur-m) var(--ease-in-out);border-radius:8px;flex-direction:column;padding:20px;display:flex;position:relative}.card .y{min-height:16px;font-size:12px;line-height:16px}.card .mid{letter-spacing:-.02em;white-space:nowrap;align-items:center;height:40px;margin-top:8px;font-size:40px;line-height:40px;display:flex;overflow:hidden}.card .mid number-flow{--number-flow-mask-height:.15em;line-height:40px}.card .bottom{white-space:nowrap;flex-direction:column;gap:4px;margin-top:auto;font-size:16px;line-height:16px;display:flex}.card .caption{color:var(--muted);margin-top:auto;font-size:12px;line-height:16px}.card.before,.card.after{opacity:.5}.card.input .amount,.card.filled .amount{color:var(--blue)}.card .note-line{border-top:1px solid var(--faint);color:var(--muted);text-overflow:ellipsis;white-space:nowrap;min-height:25px;margin-top:auto;padding-top:8px;font-size:16px;line-height:16px;overflow:hidden}.card.input .note-line input{width:100%;color:var(--ink)}.card.input .note-line input::placeholder{color:var(--muted)}.card.filled .note-line{color:var(--ink)}.card.filled .note-line.empty{color:var(--muted)}.card.input .yin{width:140px;height:16px;font-size:12px;line-height:16px}.card.input .yin::placeholder{color:var(--muted)}.autosize{height:40px;display:inline-grid}.autosize:after{content:attr(data-v);visibility:hidden;white-space:pre;font:inherit;letter-spacing:inherit;grid-area:1/1;line-height:40px}.autosize input{width:0;min-width:100%;height:40px;color:var(--blue);letter-spacing:inherit;grid-area:1/1;line-height:40px}.autosize input::placeholder{color:var(--blue)}.rub{white-space:pre;line-height:40px}.icon-btn{place-items:center;width:24px;height:24px;display:grid;position:absolute;top:16px;right:16px}.icon-btn svg{width:24px;height:24px;display:block}.go{color:var(--blue);transition:color var(--dur-xs)}.go:hover{color:var(--blue-soft)}.go:disabled{color:var(--faint);cursor:default}.swap{place-items:center;display:grid}.swap>svg{transition:opacity .24s var(--ease-in-out), transform .24s var(--ease-in-out);grid-area:1/1}.swap .h{opacity:0;transform:scale(.92)}.swap:hover .s{opacity:0;transform:scale(1.04)}.swap:focus-visible .s{opacity:0;transform:scale(1.04)}.swap:hover .h{opacity:1;transform:none}.swap:focus-visible .h{opacity:1;transform:none}.card.add{border:1px solid var(--faint);color:var(--muted);text-align:left;opacity:0;transition:opacity var(--dur-s) var(--ease-out), border-color var(--dur-xs), color var(--dur-xs);background:0 0}.card.add:hover{opacity:1}.card.add:focus-visible{opacity:1}.card.add:hover{border-color:var(--faint);color:var(--muted)}.card.add .plus{width:24px;height:24px;display:block;position:absolute;top:16px;right:16px}.card.add .y{color:var(--muted)}.card.add .cta{margin-top:auto;font-size:16px;line-height:16px}.card.add.touch{display:none}@media (hover:none){.card.add{display:none}.card.add.touch{opacity:1;left:var(--gut);display:flex;position:-webkit-sticky;position:sticky}.card.add.touch:hover{border-color:var(--faint);color:var(--muted)}}.calc{flex-direction:column;flex:1;min-width:0;display:flex}.stale{margin:0 var(--gutr) 16px var(--gut);color:var(--muted);font-size:12px}.solo{padding:0 var(--gutr) 40px var(--gut);flex-direction:column;align-items:center;display:flex}.solo .hint{width:var(--cw);color:var(--muted);margin-top:12px;padding-right:20px;font-size:12px;line-height:16px}.solo .hint.warn{color:var(--ink)}.scroller{padding:0 0 40px var(--gut);scrollbar-width:none;cursor:grab;overscroll-behavior-x:contain;overflow-x:auto;overflow-y:hidden}.scroller::-webkit-scrollbar{display:none}.scroller.dragging{cursor:grabbing;-webkit-user-select:none;-moz-user-select:none;user-select:none}.grid{gap:var(--gap);flex-direction:column;width:-webkit-max-content;width:-moz-max-content;width:max-content;padding-bottom:8px;display:flex}.row{grid-template-columns:repeat(var(--n), var(--cw)) var(--delw);column-gap:var(--gap);transition:opacity .24s var(--ease-in-out);row-gap:12px;display:grid}.row.leaving{opacity:0}.card .under{width:100%;color:var(--muted);text-align:left;font-size:12px;line-height:16px;position:absolute;top:calc(100% + 12px);left:0}.card .under:empty{display:none}.card .under.warn{color:var(--ink)}.card .cancel-edit{transition:color var(--dur-xs)}.card .cancel-edit:hover{color:var(--blue)}.card .under+.under{top:calc(100% + 40px)}.card .under.cancel-edit{font-size:16px;line-height:16px}.anchor{z-index:3;width:128px;height:var(--ch);box-sizing:border-box;background:var(--card);text-align:left;opacity:0;pointer-events:none;transition:opacity var(--dur-s) var(--ease-out), transform var(--dur-s) var(--ease-out);border-radius:8px;flex-direction:column;grid-row:1;padding:20px;display:flex;position:-webkit-sticky;position:sticky}.anchor.l{left:calc(-1 * var(--gut));grid-column:1;justify-self:start;transform:translate(-12px)}.anchor.r{justify-self:end;right:0;transform:translate(12px)}.row.anc-l .anchor.l,.row.anc-r .anchor.r{opacity:1;pointer-events:auto;transform:none}.anchor .ay{color:var(--ink);font-size:12px;line-height:16px}.anchor .aa{color:var(--blue);white-space:nowrap;margin-top:8px;font-size:16px;line-height:16px;overflow:hidden}.anchor .swap{width:24px;height:24px;margin-top:24px}.anchor .swap svg{width:24px;height:24px;display:block}.anchor.r .swap svg{transform:scaleX(-1)}.anchor.c{justify-self:end;right:0;transform:translate(12px)}.row.anc-c .anchor.c{opacity:1;pointer-events:auto;transform:none}.row.anc-c .anchor.r{right:calc(128px + var(--gap))}.anchor.c .swap svg{transform:scaleX(-1)}.anchor.c .aa,.anchor.c .an{color:var(--ink)}.anchor.c .an{border-top:0}.tip{z-index:2;background:var(--bg);color:var(--ink);white-space:nowrap;pointer-events:none;opacity:0;transition:opacity var(--dur-s) var(--ease-out), transform var(--dur-s) var(--ease-out);border-radius:8px;padding:8px;font-size:12px;line-height:16px;position:absolute;top:7px;left:94px;transform:translate(-4px)}.tip:before{content:"";background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='22' viewBox='0 0 13 22'%3E%3Cpath d='M11 22C11 15.925 6.075 11 0 11C6.075 11 11 6.075 11 0L13 0L13 22Z' fill='%23F5F5F5'/%3E%3C/svg%3E") no-repeat;width:13px;height:22px;position:absolute;top:calc(50% - 11px);left:-11px}.tip.on{opacity:1;transform:none}.tip.y:before{top:10px}.tip.below:before{top:-17px;left:16px;transform:rotate(90deg)}.tip.above:before{top:auto;bottom:-17px;left:16px;transform:rotate(-90deg)}.tip.below,.tip.above{transform:translateY(0)}.anchor .an{border-top:1px solid var(--faint);color:var(--muted);white-space:nowrap;text-overflow:ellipsis;margin-top:auto;padding-top:8px;font-size:12px;line-height:16px;overflow:hidden}.close{z-index:2;width:48px;height:100%;position:absolute;top:0;left:100%}.close>svg{transition:opacity var(--dur-s) var(--ease-in-out), transform var(--dur-s) var(--ease-in-out)}.row.draft.hide-x .close>svg{opacity:0}.close svg{width:24px;height:24px;display:block}.row.draft.hide-x .close:hover>svg.s{opacity:1}.row{transition:opacity .24s var(--ease-in-out), margin-bottom var(--dur-m) var(--ease-in-out);margin-bottom:0}.row.open{margin-bottom:calc(var(--ch) + var(--gap))}.row .card.input{z-index:1}.del{opacity:0;pointer-events:none;width:24px;height:24px;transition:opacity var(--dur-s) var(--ease-out);grid-row:1;place-self:center}.del svg{width:24px;height:24px;display:block}.scroller.reveal .del{opacity:1;pointer-events:auto}.grid.editing .card:not(.editing):not(.add){opacity:.25}.grid.editing .row.draft .card.add:hover{opacity:1}.grid.editing .addrow{opacity:0;pointer-events:none}.addrow{transition:opacity var(--dur-m) var(--ease-out)}.card.rise{animation:rise .48s var(--ease-out) both}@keyframes rise{0%{opacity:0;transform:translateY(24px)}}.row.grow{animation:grow var(--dur-m) var(--ease-out) both}@keyframes grow{0%{opacity:0;transform:translateY(-8px)}}.fade-in{animation:fadeIn var(--dur-m) var(--ease-out) both}@keyframes fadeIn{0%{opacity:0;transform:translateY(12px)}}.onboard{min-height:200px;padding:0 var(--gutr) 40px var(--gut);opacity:0;transition:opacity var(--dur-m) var(--ease-out);pointer-events:none;flex:1;place-items:center;display:grid}.onboard.on{opacity:1}.onboard .panel{transition:transform var(--dur-m) var(--ease-out);flex-direction:column;align-items:center;gap:16px;display:flex;transform:translateY(8px)}.onboard.on .panel{transform:none}.onboard svg{width:min(600px,90vw);height:auto;display:block}.onboard p{color:var(--ink);text-align:center;margin:0;font-size:14px}.err{margin:0 var(--gutr) 24px var(--gut);align-items:center;gap:16px;display:flex}.err button{color:var(--blue)}.method{padding:0 var(--gutr) 40px var(--gut);flex:1}.method article{max-width:680px}.method h1{letter-spacing:-.02em;text-wrap:balance;margin:0 0 32px;font-size:48px;font-weight:400;line-height:1}.method h2{margin:40px 0 12px;font-size:24px;font-weight:400;line-height:1.15}.method p,.method li{margin:0 0 12px;font-size:16px;line-height:1.5}.method ul{margin:0 0 12px;padding-left:20px}.method .tbl{overflow-x:auto}.method table{border-collapse:collapse;width:100%;font-size:14px}.method th,.method td{text-align:left;border-bottom:1px solid var(--line);vertical-align:top;padding:8px 12px 8px 0}.method th{color:var(--muted);font-size:12px;font-weight:400}.method .back{color:var(--blue);margin-bottom:32px;font-size:16px;text-decoration:none;display:inline-block}.method .note{color:var(--muted);font-size:14px}footer{padding:16px var(--gutr) 28px var(--gut);flex-wrap:wrap;align-items:baseline;gap:8px 24px;font-size:12px;line-height:16px;display:flex}footer .r{color:var(--muted);flex-wrap:wrap;gap:8px 24px;margin-left:auto;display:flex}footer .r a{transition:color var(--dur-xs);text-decoration:none}footer .r a:hover{color:var(--blue)}footer .disc{color:var(--muted)}.view-in{animation:fadeIn var(--dur-m) var(--ease-out) both}@media (max-width:860px){.start{grid-template-columns:minmax(0,1fr)}.preview{margin-right:calc(-1 * var(--gutr));padding-right:var(--gutr);scrollbar-width:none;flex-direction:row;overflow-x:auto}.preview .card{flex:none}}@media (max-width:640px){.top{padding-top:28px;padding-bottom:24px}.hero h1{font-size:32px;line-height:1}.hero .rule{margin-top:44px}.hero .sub{font-size:16px}footer{flex-direction:column}footer .r{flex-direction:column;gap:8px;margin-left:0}}@media (prefers-reduced-motion:reduce){.card.rise,.row.grow,.view-in,.fade-in{animation:fadeOnly var(--dur-xs) linear both}.start.leaving .hero{transform:none}@keyframes fadeOnly{0%{opacity:0}}}