:root{color:#17202b;font-synthesis:none;text-rendering:optimizelegibility;--navy:#17202b;--navy-soft:#24364d;--silver:#d9dde1;--silver-light:#f2f3f2;--lcd:#dce6cf;--lcd-deep:#c6d2b8;--cobalt:#275dad;--orange:#f28c28;--line:#9ca5ad;background:#e7e9eb;font-family:Pretendard,Noto Sans KR,Apple SD Gothic Neo,Malgun Gothic,system-ui,sans-serif}*{box-sizing:border-box}html{background:#e7e9eb;min-width:320px;min-height:100%}body{min-width:320px;min-height:100vh;margin:0}button,textarea{font:inherit}button{-webkit-tap-highlight-color:transparent}.page-shell{background:linear-gradient(#ffffff8c,#fff0 38%),repeating-linear-gradient(90deg,#17202b05 0 1px,#0000 1px 4px),#e7e9eb;place-items:center;min-height:100vh;padding:32px 16px;display:grid}.calculator{background:linear-gradient(135deg, #f4f5f4 0%, var(--silver) 55%, #c8cdd1 100%);border:1px solid #87919a;border-radius:6px;width:min(880px,100%);overflow:hidden;box-shadow:0 24px 60px #17202b29,inset 0 0 0 2px #ffffffc7,inset 0 0 0 5px #4c58632e}.calculator-header{color:#f8f9f5;background:repeating-linear-gradient(90deg, #ffffff06 0 1px, transparent 1px 3px), var(--navy);border-bottom:4px solid #5c718b;grid-template-columns:44px 1fr auto;align-items:center;gap:14px;min-height:76px;padding:14px 22px;display:grid}.brand-mark{color:#fff;background:var(--cobalt);border:1px solid #7f9fc7;border-radius:3px;place-items:center;width:36px;height:36px;font-size:17px;font-weight:800;display:grid;box-shadow:inset 0 1px #ffffff61}.calculator-header h1{letter-spacing:-.04em;margin:0;font-size:clamp(20px,2.8vw,28px)}.connection{color:#cbd2da;align-items:center;gap:8px;min-width:max-content;font-size:13px;font-weight:700;display:inline-flex}.connection-dot{background:#8f9aa5;border:1px solid #ffffff73;border-radius:50%;width:10px;height:10px}.connection--online .connection-dot{background:#78d85a;box-shadow:0 0 0 3px #78d85a1f}.connection--setup .connection-dot{background:#f3b23f}.connection--offline .connection-dot{background:#e06455}.result-display{background:repeating-linear-gradient(0deg, #17202b07 0 1px, transparent 1px 4px), linear-gradient(180deg, #e6ecd9, var(--lcd));border:2px solid #55615c;border-radius:4px;grid-template-rows:auto minmax(98px,1fr) auto auto;gap:10px;min-height:300px;margin:22px 22px 0;padding:20px 24px 18px;display:grid;box-shadow:0 0 0 7px #b1b7b8,0 0 0 9px #f6f7f4,inset 0 1px 6px #202c2733}.source-row,.expression-row{grid-template-columns:56px minmax(0,1fr);align-items:start;gap:10px;display:grid}.display-kicker{color:#445048;letter-spacing:.08em;padding-top:2px;font-size:11px;font-weight:800}.source-text,.expression-row p{overflow-wrap:anywhere;color:#27312c;letter-spacing:-.025em;min-width:0;margin:0;font-size:14px;line-height:1.55}.result-value{overflow-wrap:anywhere;color:#202824;letter-spacing:-.07em;text-align:right;text-shadow:1px 1px #ffffff59;justify-content:flex-end;align-items:center;min-width:0;font-family:Courier New,Nanum Gothic Coding,monospace;font-size:clamp(44px,8.5vw,76px);font-weight:700;line-height:1;display:flex}.result-display--clarification .result-value{color:#7e5d12;letter-spacing:-.05em;font-family:inherit;font-size:clamp(36px,6vw,56px)}.result-display--error .result-value{color:#9c3f35;letter-spacing:-.05em;font-family:inherit;font-size:clamp(36px,6vw,56px)}.expression-row{border-top:1px solid #37433b52;padding-top:12px}.result-explanation{color:#58645c;margin:0 0 0 66px;font-size:12px;line-height:1.5}.composer{border:3px solid var(--navy-soft);background:var(--navy-soft);border-radius:4px;margin:20px 22px 0;box-shadow:0 4px #17202b2e}.operator-rail{grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;padding:5px 5px 6px;display:grid}.operator-key{color:#173153;cursor:pointer;background:linear-gradient(#fbfbfa,#d8dce0);border:1px solid #8e989f;border-radius:3px;min-width:0;min-height:54px;font-size:clamp(20px,3vw,30px);font-weight:700;box-shadow:inset 0 2px #ffffffe6,0 2px #111b28}.operator-key:hover{color:#0d4da6;background:#f8fafb}.operator-key:active{transform:translateY(2px);box-shadow:inset 0 1px 3px #17202b33}.input-panel{grid-template-columns:minmax(0,1fr) 112px;gap:6px;padding:0 5px 5px;display:grid}.input-panel textarea{resize:vertical;width:100%;min-height:104px;color:var(--navy);letter-spacing:-.03em;background:#fbfaf7;border:1px solid #a3a9ad;border-radius:3px;outline:none;padding:18px 20px;font-size:18px;line-height:1.55;box-shadow:inset 0 1px 3px #17202b1a}.input-panel textarea::placeholder{color:#858a8e}.input-panel textarea:focus{border-color:var(--cobalt);box-shadow:inset 0 1px 3px #17202b1a,0 0 0 2px #275dad33}.calculate-button{color:#fff;background:linear-gradient(#f6a33c, var(--orange));cursor:pointer;border:1px solid #a8560e;border-radius:3px;min-height:104px;font-size:19px;font-weight:800;box-shadow:inset 0 2px #ffffff59,0 2px #8c450b}.calculate-button:hover:not(:disabled){background:#f59a2f}.calculate-button:active:not(:disabled){transform:translateY(2px);box-shadow:inset 0 2px 3px #77340340}.calculate-button:disabled{color:#ffffff9e;cursor:not-allowed;box-shadow:none;background:#b4a08b;border-color:#93806d}.history{background:#fafaf7b8;border:1px solid #a4abb0;border-radius:3px;margin:18px 22px 0}.history-heading{border-bottom:1px solid #b6bcc0;justify-content:space-between;align-items:center;min-height:42px;padding:8px 14px;display:flex}.history-heading h2{color:#1f5396;margin:0;font-size:14px}.history-heading span{color:#76818a;font-size:11px}.history-list{display:grid}.history-list button{min-width:0;color:var(--navy);text-align:left;cursor:pointer;background:0 0;border:0;border-bottom:1px solid #d2d6d8;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px;padding:12px 14px;display:grid}.history-list button:last-child{border-bottom:0}.history-list button:hover{background:#275dad12}.history-list button span{color:#5b656c;text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.history-list button strong{font-family:Courier New,monospace;font-size:14px}.history-empty{color:#747d84;margin:0;padding:14px;font-size:12px}.calculator-footer{color:#737d85;justify-content:center;align-items:center;gap:8px;min-height:54px;padding:12px 22px;font-size:11px;display:flex}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}button:focus-visible,textarea:focus-visible{outline-offset:2px;outline:3px solid #275dad70}@media (max-width:620px){.page-shell{padding:0;display:block}.calculator{min-height:100vh;box-shadow:none;border-width:0;border-radius:0;flex-direction:column;display:flex}.calculator-header{grid-template-columns:34px 1fr auto;gap:9px;min-height:64px;padding:10px 12px}.brand-mark{width:30px;height:30px;font-size:14px}.connection{gap:5px;font-size:10px}.connection-dot{width:8px;height:8px}.result-display{min-height:270px;margin:16px 12px 0;padding:16px 14px 14px;box-shadow:0 0 0 4px #b1b7b8,0 0 0 5px #f6f7f4,inset 0 1px 5px #202c2733}.source-row,.expression-row{grid-template-columns:46px minmax(0,1fr);gap:6px}.source-text,.expression-row p{font-size:13px}.result-value{font-size:clamp(38px,14vw,60px)}.result-explanation{margin-left:52px}.composer{margin:16px 8px 0}.operator-rail{gap:3px;padding:4px}.operator-key{min-height:46px;font-size:21px}.input-panel{grid-template-columns:minmax(0,1fr) 82px;gap:4px;padding:0 4px 4px}.input-panel textarea{min-height:96px;padding:14px;font-size:16px}.calculate-button{min-height:96px;font-size:16px}.history{margin:14px 8px 0}.calculator-footer{min-height:46px;margin-top:auto}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}