:root{--bg:#f8faf8;--surface:#fff;--surface-2:#eef5f2;--ink:#17211d;--muted:#53635d;--soft:#6f7e77;--line:#d8e2dc;--line-strong:#b9c9c0;--accent:#0e7c66;--accent-dark:#075f4d;--accent-soft:#dceee9;--warn:#a54712;--warn-bg:#fff2e8;--focus:#1f6feb;--shadow:0 18px 46px #1a2f261f;--radius:8px;color:var(--ink);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;min-width:320px}body{background:linear-gradient(180deg, #dceee98c, #f8faf800 320px), var(--bg);min-width:320px;margin:0}body,button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a{color:var(--accent-dark);text-underline-offset:.18em;text-decoration-thickness:.08em}a:hover{color:#093f36}button{cursor:pointer;border:0}button:disabled{cursor:not-allowed;opacity:.58}:focus-visible{outline:3px solid var(--focus);outline-offset:3px}h1,h2,h3,p{margin-top:0}h1{letter-spacing:0;max-width:760px;margin-bottom:16px;font-size:44px;font-weight:760;line-height:1.06}h2{letter-spacing:0;margin-bottom:12px;font-size:27px;line-height:1.18}h3{margin-bottom:8px;font-size:19px;line-height:1.24}p{color:var(--muted);line-height:1.68}code{overflow-wrap:anywhere;border:1px solid var(--line);color:#10221c;background:#f5f8f6;border-radius:5px;max-width:100%;padding:2px 6px;font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:.92em;display:inline-block}.page-shell{width:min(1120px,100% - 40px);margin-inline:auto}.site-header{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#f8faf8eb;border-bottom:1px solid #d8e2dccc;justify-content:space-between;align-items:center;gap:24px;min-height:72px;padding:14px max(20px,50vw - 560px);display:flex}.brand{min-height:44px;color:var(--ink);white-space:nowrap;align-items:center;gap:10px;font-weight:760;text-decoration:none;display:inline-flex}.brand-mark{border:1px solid var(--line-strong);width:42px;height:42px;color:var(--accent-dark);background:var(--surface);border-radius:8px;justify-content:center;align-items:center;font-weight:800;display:inline-flex}.site-header nav,.site-footer nav{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:6px;display:flex}.site-header nav a,.site-footer nav a{min-height:40px;color:var(--muted);border-radius:7px;align-items:center;gap:6px;padding:8px 10px;font-size:15px;font-weight:650;text-decoration:none;display:inline-flex}.site-header nav a:hover,.site-footer nav a:hover{color:var(--ink);background:var(--accent-soft)}.tool-band{padding:44px 0 36px}.tool-grid{grid-template-columns:minmax(0,.86fr) minmax(540px,1.14fr);align-items:start;gap:32px;display:grid}.tool-intro{padding-top:14px}.eyebrow{color:var(--accent-dark);letter-spacing:.08em;text-transform:uppercase;margin-bottom:10px;font-size:13px;font-weight:800}.lead{color:#34433d;max-width:680px;font-size:18px;line-height:1.7}.lead.narrow{max-width:780px}.feature-list{gap:9px;max-width:560px;margin:24px 0 0;padding:0;list-style:none;display:grid}.feature-list li{color:var(--muted);padding-left:22px;line-height:1.5;position:relative}.feature-list li:before{color:var(--accent);content:"✓";font-weight:800;position:absolute;left:0}.tool-panel{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);min-width:0;min-height:620px;box-shadow:var(--shadow);padding:18px}.fraction-form{gap:14px;display:grid}.input-row{grid-template-columns:minmax(0,1fr) 44px minmax(0,1fr);align-items:end;gap:12px;display:grid}label{min-width:0;color:var(--ink);gap:7px;font-weight:720;display:grid}label span{font-size:14px}input{border:1px solid var(--line-strong);width:100%;min-height:52px;color:var(--ink);background:#fbfdfc;border-radius:7px;padding:10px 12px;font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:18px}input::placeholder{color:#82918a}.actions{flex-wrap:wrap;gap:9px;display:flex}.primary-button,.secondary-button,.icon-button,.examples button{border-radius:7px;justify-content:center;align-items:center;gap:7px;min-height:44px;font-weight:730;display:inline-flex}.primary-button{color:#fff;background:var(--accent);padding:10px 16px}.primary-button:hover{background:var(--accent-dark)}.secondary-button,.examples button{border:1px solid var(--line);color:var(--ink);background:#f7faf8;padding:10px 12px}.secondary-button:hover,.examples button:hover{border-color:var(--line-strong);background:var(--surface-2)}.icon-button{border:1px solid var(--line);width:44px;min-width:44px;color:var(--accent-dark);background:#f7faf8;padding:0}.icon-button:hover{background:var(--accent-soft)}.examples{flex-wrap:wrap;gap:8px;margin:15px 0;display:flex}.examples button{min-height:38px;color:var(--muted);padding:8px 10px;font-size:14px}.result-panel{border:1px solid var(--line);border-radius:var(--radius);background:#fbfdfc;min-height:390px;padding:16px}.result-header{justify-content:space-between;align-items:center;gap:16px;margin-bottom:12px;display:flex}.result-header h2{margin:0;font-size:20px}.result-live{min-height:326px}.muted{color:var(--soft)}.error-box{color:var(--warn);background:var(--warn-bg);border:1px solid #efc8ad;border-radius:7px;align-items:flex-start;gap:11px;padding:14px;display:flex}.error-box p{color:#7d3b12;margin:2px 0 0}.comparison-output{gap:16px;display:grid}.answer-line{background:var(--accent-soft);border-radius:7px;grid-template-columns:minmax(0,1fr) 54px minmax(0,1fr);align-items:center;gap:10px;min-height:78px;padding:14px;display:grid}.fraction-text,.symbol{overflow-wrap:anywhere;color:var(--ink);text-align:center;font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-weight:850}.fraction-text{min-width:0;font-size:27px;line-height:1.18}.symbol{color:#fff;background:var(--accent);border-radius:999px;justify-content:center;align-items:center;min-height:54px;font-size:28px;display:inline-flex}.copied-note{color:var(--accent-dark);margin:-6px 0 0;font-weight:700}.visual-note{border:1px solid var(--line);background:#f7faf8;border-radius:7px;align-items:flex-start;gap:10px;padding:12px;display:flex}.visual-note p{color:var(--muted);margin:0;font-size:14px;line-height:1.5}.fraction-bars{border:1px solid var(--line);background:#f7faf8;border-radius:7px;gap:10px;padding:12px;display:grid}.bar-row{grid-template-columns:minmax(58px,88px) minmax(0,1fr);align-items:center;gap:10px;display:grid}.bar-row>span{overflow-wrap:anywhere;color:var(--muted);font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-weight:760}.bar{border:1px solid var(--line-strong);background:#fff;border-radius:6px;min-height:26px;display:grid;overflow:hidden}.bar span{border-right:1px solid var(--line);min-width:0}.bar span:last-child{border-right:0}.bar .filled{background:#49a088}.steps{gap:10px;margin:0;padding-left:23px;display:grid}.steps li{padding-left:4px}.steps p{color:var(--muted);margin:3px 0 6px;font-size:15px;line-height:1.5}.steps code{width:100%}.compact-guide{padding:48px 0 60px}.section-heading{max-width:820px;margin-bottom:22px}.method-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;display:grid}.method-card{border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);min-height:166px;padding:18px}.method-card p{margin-bottom:0}.next-link{margin:22px 0 0;font-weight:720}.text-page{padding:52px 0 74px}.text-page section{max-width:860px;margin-top:34px}.text-page ul{color:var(--muted);line-height:1.72}.not-found{min-height:58vh}.primary-link{color:#fff;background:var(--accent);border-radius:7px;align-items:center;min-height:44px;padding:10px 14px;font-weight:780;text-decoration:none;display:inline-flex}.site-footer{border-top:1px solid var(--line);background:#edf5f1;justify-content:space-between;align-items:center;gap:24px;padding:24px max(20px,50vw - 560px);display:flex}.site-footer p{margin:4px 0 0;font-size:14px;line-height:1.45}@media (width<=920px){.tool-grid{grid-template-columns:1fr}.tool-panel{min-height:0}.method-grid{grid-template-columns:1fr}}@media (width<=640px){.page-shell{width:min(100% - 28px,1120px)}.site-header,.site-footer{flex-direction:column;align-items:flex-start}.site-header nav,.site-footer nav{justify-content:flex-start}h1{font-size:34px}h2{font-size:24px}.tool-band{padding-top:28px}.tool-panel{padding:13px}.input-row{grid-template-columns:1fr 44px}.input-row label{grid-column:1/-1}.input-row .icon-button{grid-area:1/2;place-self:end}.actions>*{flex:calc(50% - 9px)}.answer-line{grid-template-columns:1fr}.symbol{justify-self:center;width:54px}}@media (width<=430px){.page-shell{width:min(100% - 22px,1120px)}.brand{white-space:normal}.site-header nav a,.site-footer nav a{padding-inline:8px}.fraction-text{font-size:23px}.actions>*,.examples button{flex-basis:100%}.bar-row{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important}}