:root{--desk:#b6b1a8;--desk-dark:#99948b;--case:#e7e1d7;--case-light:#f0ebe2;--case-shadow:#cec8be;--graphite:#292927;--graphite-deep:#181817;--ink:#2e2d2a;--muted:#6f6b64;--line:#33312d38;--line-strong:#33312d75;--signal:#d94b38;--signal-dark:#b83b2c;--paper:#f5f0e7;color:var(--ink);background:var(--desk);font-synthesis:none;font-family:Arial,Helvetica Neue,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{background:var(--desk);min-width:320px}button,input{font:inherit}button{color:inherit;-webkit-user-select:none;user-select:none}.line-stage{background:radial-gradient(circle at 50% 5%, #f5f1e994, transparent 43%), linear-gradient(145deg, #cbc7bf 0%, var(--desk) 48%, var(--desk-dark) 100%);place-items:center;min-height:100vh;padding:clamp(24px,4.5vw,72px);display:grid;overflow:hidden}.line-shell{filter:drop-shadow(0 32px 34px #2c282238);width:min(960px,96vw);position:relative}.phone-header{background:var(--case);border:1px solid #ffffffad;border-bottom:0;border-radius:34px 34px 0 0;justify-content:space-between;align-items:flex-start;gap:36px;width:calc(100% - 78px);min-height:142px;margin:0 auto -58px;padding:30px 42px 72px;display:flex;box-shadow:inset 0 1px #ffffffc7}.line-brand p,.line-brand small,.line-status span,.number-display>span,.number-display>small,.phone-controls label>span,.phone-controls label small,.clear-button,.line-footer,.handset-grip,.line-error{letter-spacing:.16em;text-transform:uppercase;font-size:10px;font-weight:700}.line-brand p,.line-brand small{color:var(--muted);margin:0}.line-brand h1{letter-spacing:.13em;margin:8px 0 7px;font-size:clamp(31px,4vw,49px);font-weight:300;line-height:.94}.line-brand h1 span{color:var(--signal);font-weight:500}.line-brand small{letter-spacing:.1em;text-transform:none}.line-status{grid-template-columns:11px 1fr;align-items:center;gap:13px;min-width:218px;padding-top:5px;display:grid}.line-status>i{background:#aaa69e;border:1px solid #87837c;border-radius:50%;width:10px;height:10px;box-shadow:inset 0 1px #ffffffb3}.line-status>i.is-active,.line-shell.is-open .line-status>i{border-color:var(--signal-dark);background:var(--signal);box-shadow:0 0 12px #d94b386b}.line-status div{gap:7px;display:grid}.line-status span{color:var(--muted);font-size:8px}.line-status strong{letter-spacing:.12em;max-width:210px;font-size:11px;font-weight:700;line-height:1.35}.handset-button{z-index:5;cursor:pointer;filter:drop-shadow(0 15px 11px #25221e3d);background:0 0;border:0;align-items:center;width:calc(100% - 132px);height:124px;margin:0 auto -52px;padding:0;transition:transform .24s cubic-bezier(.2,.8,.2,1),filter .24s;display:flex;position:relative}.handset-button:hover{filter:drop-shadow(0 19px 13px #25221e45);transform:translateY(-4px)}.handset-button:disabled{cursor:wait}.handset-button.is-open{filter:drop-shadow(0 28px 18px #25221e4f);transform:translateY(-20px)rotate(-1.15deg)}.handset-button.is-active{animation:.43s ease-in-out 2 handset-ring}.handset-cup{z-index:2;background:linear-gradient(145deg, #41413e 0%, var(--graphite) 46%, var(--graphite-deep) 100%);border:1px solid #11110f;flex:none;place-items:center;width:156px;height:116px;display:grid;position:relative;box-shadow:inset 0 2px #ffffff14,inset 0 -8px 14px #0000003d}.handset-cup-left{border-radius:48% 32% 30% 48%;transform:rotate(4deg)}.handset-cup-right{border-radius:32% 48% 48% 30%;transform:rotate(-4deg)}.handset-cup i{background:radial-gradient(circle,#3a3a37 0 13%,#0000 14%),radial-gradient(circle,#20201e 0 38%,#343431 39% 100%);border:10px solid #20201e;border-radius:50%;width:78px;height:78px;box-shadow:inset 0 2px 5px #0000007a}.handset-grip{z-index:1;color:#f7f3ebd6;background:linear-gradient(180deg, #3a3a37, var(--graphite) 50%, #1f1f1d);border-top:1px solid #11110f;border-bottom:1px solid #11110f;flex:1;justify-content:center;align-items:center;gap:18px;min-width:0;height:62px;margin:0 -12px;display:flex;position:relative;box-shadow:inset 0 2px #ffffff0f,inset 0 -5px 9px #0003}.handset-grip b,.handset-grip small{white-space:nowrap}.handset-grip b{letter-spacing:.17em;font-size:10px}.handset-grip small{color:#f7f3eb75;letter-spacing:.14em;font-size:8px}.line-shell.is-open .handset-grip b,.line-shell.is-open .handset-grip small{color:#f3afa5}.phone-body{background:linear-gradient(115deg, #ffffff38, transparent 38%), var(--case);border:1px solid #ffffffb8;border-radius:48px 48px 34px 34px;min-height:680px;padding:100px clamp(32px,6vw,70px) 38px;position:relative;box-shadow:inset 0 1px #ffffffdb,inset 0 -16px 24px #574f440f,0 10px 18px #2f2b2524}.phone-body:before,.phone-body:after{content:"";background:#bab4aa;border:1px solid #8f8a82;border-radius:50%;width:7px;height:7px;position:absolute;top:35px;box-shadow:inset 0 1px #ffffffb8}.phone-body:before{left:38px}.phone-body:after{right:38px}.number-display{justify-items:center;width:min(600px,100%);margin:0 auto 26px;display:grid}.number-display>span,.number-display>small{color:var(--muted)}.number-display>span{margin-bottom:10px}.number-display>small{margin-top:10px;font-size:8px}.number-slots{border:1px solid var(--line);background:#f5f0e7a8;border-radius:3px;grid-template-columns:repeat(6,1fr);gap:8px;width:100%;padding:8px 10px;display:grid;box-shadow:inset 0 2px 4px #3a352e14}.number-slot{border-left:1px solid var(--line);color:#a29d94;font-variant-numeric:tabular-nums;place-items:center;height:52px;font-size:27px;font-weight:300;transition:color .12s,background .12s,transform .12s;display:grid}.number-slot:first-child{border-left:0}.number-slot.is-active{color:var(--ink)}.number-slot.is-playing{color:var(--paper);background:var(--graphite);transform:translateY(2px)}.rotary-wrap{--dial-size:386px;--dial-radius:151px;width:var(--dial-size);height:var(--dial-size);margin:0 auto 30px;position:relative}.rotary-dial{--dial-rotation:0deg;--dial-counter-rotation:0deg;--dial-duration:.54s;background:radial-gradient(circle at 50% 50%, transparent 0 31%, #343431 31.5% 34%, transparent 34.5%), radial-gradient(circle at 40% 34%, #484844 0%, var(--graphite) 43%, #1c1c1a 100%);transform:rotate(var(--dial-rotation));border:13px solid #20201e;border-radius:50%;transition-property:transform;transition-duration:0s;transition-timing-function:linear;position:absolute;inset:0;box-shadow:0 13px 19px #2c282340,inset 0 3px 4px #ffffff14,inset 0 -9px 16px #00000057}.rotary-dial:after{content:"";pointer-events:none;border:1px solid #ffffff1a;border-radius:50%;position:absolute;inset:81px}.rotary-dial.is-dialing{transition-duration:.17s;transition-timing-function:cubic-bezier(.2,.8,.25,1)}.rotary-dial.is-returning{transition-duration:var(--dial-duration);transition-timing-function:cubic-bezier(.16,.76,.26,1)}.dial-number{--digit-angle:0deg;--digit-counter-angle:0deg;background:var(--case-light);cursor:pointer;width:62px;height:62px;transform:translate(-50%, -50%) rotate(var(--digit-angle)) translateY(calc(var(--dial-radius) * -1)) rotate(var(--digit-counter-angle));touch-action:manipulation;border:7px solid #161614;border-radius:50%;place-items:center;padding:0;display:grid;position:absolute;top:50%;left:50%;box-shadow:inset 0 2px 4px #3a342d2e,0 1px #ffffff1a}.dial-number span{color:var(--graphite);font-variant-numeric:tabular-nums;font-size:20px;font-weight:500;line-height:1}.dial-number:hover:not(:disabled),.dial-number:focus-visible,.dial-number.is-active{border-color:var(--signal-dark);background:#f2d7d1}.dial-number.is-active span{color:var(--signal-dark)}.dial-number:disabled{cursor:wait}.dial-center{z-index:2;width:176px;height:176px;color:var(--ink);background:radial-gradient(circle at 50% 35%, #ffffff8c, transparent 40%), var(--paper);transform:translate(-50%, -50%) rotate(var(--dial-counter-rotation));transition-property:transform;transition-duration:inherit;transition-timing-function:inherit;border:8px solid #1e1e1c;border-radius:50%;grid-template-rows:1fr auto 1fr;place-items:center;padding:33px 12px 27px;display:grid;position:absolute;top:50%;left:50%;box-shadow:inset 0 3px 8px #342f292b}.dial-center span,.dial-center small{color:var(--muted);letter-spacing:.2em;font-size:9px;font-weight:700}.dial-center strong{color:var(--signal);letter-spacing:.02em;font-size:46px;font-weight:300;line-height:.85}.dial-stop{z-index:4;background:linear-gradient(#c8c3ba,#9e9990);border:1px solid #77736d;border-radius:4px 18px 18px 4px;width:92px;height:38px;position:absolute;bottom:56px;right:-20px;transform:rotate(-32deg);box-shadow:0 5px 8px #2f2a252e}.dial-stop i{background:var(--signal);border-radius:50%;width:24px;height:24px;position:absolute;top:50%;right:7px;transform:translateY(-50%);box-shadow:inset 0 2px #ffffff47}.phone-controls{border-top:1px solid var(--line);grid-template-columns:minmax(210px,1fr) auto minmax(180px,.7fr);align-items:end;gap:34px;padding-top:28px;display:grid}.phone-controls label{grid-template-rows:auto 28px auto;grid-template-columns:1fr auto;gap:5px 12px;min-width:0;display:grid}.phone-controls label>span{grid-column:1/-1}.phone-controls input[type=range]{width:100%;accent-color:var(--signal);cursor:ew-resize;margin:0}.phone-controls label small{color:var(--muted);grid-column:1/-1;justify-content:space-between;font-size:7px;display:flex}.phone-controls label small b{font-weight:700}.master-control output{min-width:28px;color:var(--muted);font-variant-numeric:tabular-nums;font-size:11px}.clear-button{border:1px solid var(--line-strong);cursor:pointer;background:0 0;min-height:48px;padding:0 20px}.clear-button:hover:not(:disabled){color:var(--paper);border-color:var(--graphite);background:var(--graphite)}.clear-button:disabled{opacity:.35;cursor:default}.line-footer{width:calc(100% - 74px);min-height:56px;color:var(--muted);background:var(--case-shadow);border:1px solid #ffffff85;border-top:0;border-radius:0 0 24px 24px;grid-template-columns:repeat(3,auto) 1fr;align-items:center;gap:24px;margin:0 auto;padding:0 34px;font-size:7px;display:grid;box-shadow:inset 0 1px #ffffff40}.line-footer strong{color:var(--ink);justify-self:end;font-size:8px}.line-error{z-index:8;max-width:300px;color:var(--paper);background:var(--signal-dark);margin:0;padding:9px 12px;line-height:1.45;position:absolute;bottom:64px;right:42px}button:focus-visible,input:focus-visible{outline:2px solid var(--signal);outline-offset:4px}.handset-button:focus-visible{outline-offset:8px;border-radius:48px}@keyframes handset-ring{0%,to{transform:rotate(0)}30%{transform:translateY(-4px)rotate(-1deg)}65%{transform:translateY(-2px)rotate(1deg)}}@media (width<=820px){.line-stage{padding:20px}.line-shell{width:100%}.phone-header{width:calc(100% - 42px);padding-inline:30px}.handset-button{width:calc(100% - 70px)}.handset-cup{width:124px}.handset-cup i{width:66px;height:66px}.handset-grip small{display:none}.phone-body{padding-inline:34px}.phone-controls{grid-template-columns:1fr 1fr}.clear-button{grid-area:2/1/auto/-1}}@media (width<=620px){.line-stage{padding:0;display:block;overflow:visible}.line-shell{filter:none;width:100%;min-height:100vh;padding-top:0}.phone-header{border:0;border-radius:0;width:100%;min-height:126px;margin:0;padding:25px 22px 54px}.line-brand h1{font-size:29px}.line-brand small{display:none}.line-status{grid-template-columns:9px 1fr;gap:9px;min-width:0}.line-status strong{max-width:120px;font-size:9px}.handset-button{width:calc(100% - 30px);height:100px;margin:-42px auto -39px}.handset-cup{width:98px;height:94px}.handset-cup i{border-width:7px;width:56px;height:56px}.handset-grip{height:52px}.handset-grip b{font-size:8px}.phone-body{border:0;border-radius:28px 28px 0 0;min-height:0;padding:76px 20px 28px}.phone-body:before,.phone-body:after{top:28px}.number-display{margin-bottom:22px}.number-slot{height:46px;font-size:23px}.number-display>small{text-align:center;line-height:1.45}.rotary-wrap{--dial-size:min(330px, 88vw);--dial-radius:calc(var(--dial-size) * .39)}.rotary-dial{border-width:10px}.rotary-dial:after{inset:21%}.dial-number{border-width:6px;width:clamp(48px,15vw,56px);height:clamp(48px,15vw,56px)}.dial-center{border-width:6px;width:44%;height:44%;padding:27px 8px 21px}.dial-center strong{font-size:clamp(34px,11vw,43px)}.dial-stop{width:76px;height:32px;bottom:43px;right:-7px}.dial-stop i{width:20px;height:20px}.phone-controls{grid-template-columns:1fr;gap:22px;padding-top:24px}.clear-button{grid-area:auto}.line-footer{border:0;border-radius:0;grid-template-columns:1fr 1fr;gap:12px;width:100%;padding:14px 22px}.line-footer strong{justify-self:start}.line-error{max-width:none;position:fixed;bottom:12px;left:12px;right:12px}}@media (width<=390px){.phone-header{padding-inline:17px}.line-status span{display:none}.handset-button{width:calc(100% - 18px)}.handset-cup{width:84px}.handset-grip b{font-size:7px}.number-slots{gap:3px;padding-inline:6px}.rotary-wrap{--dial-size:286px}.dial-number{border-width:5px;width:46px;height:46px}.dial-number span{font-size:17px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation:none!important}}