@font-face{font-family:Mulish;src:url('/kalkulacka/assets/Mulish-400.ttf');font-weight:400;font-display:swap}
@font-face{font-family:Mulish;src:url('/kalkulacka/assets/Mulish-600.ttf');font-weight:600;font-display:swap}
:root{color-scheme:dark;font-family:Mulish,sans-serif;color:#f0f5ff;background:transparent;font-synthesis:none;--ease-out:cubic-bezier(.23,1,.32,1)}
*{box-sizing:border-box}body{margin:0;padding:0 2px;background:transparent;overflow-x:hidden;overflow-y:hidden;font-size:15px;line-height:1.6}button{font:inherit;cursor:pointer;touch-action:manipulation}button[disabled]{cursor:default;opacity:.55}[hidden]{display:none!important}button:focus-visible,summary:focus-visible{outline:2px solid #d7e6ff;outline-offset:5px}::selection{background:#b6caff;color:#071022}button svg,summary svg{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.call{position:relative;padding:8px 0 0}.call-top{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px}.call-top h2{font-size:clamp(17px,2.8vw,22px);line-height:1.35;font-weight:400;letter-spacing:-.02em;margin:0;max-width:26ch;color:#edf3ff}.call-meta{display:flex;align-items:center;gap:13px;flex:none}#timer{font-size:13px;color:#c1d2ed;font-variant-numeric:tabular-nums;letter-spacing:.02em}#material-motion{display:grid;place-items:center;width:44px;height:44px;padding:10px;border:1px solid #728bb756;border-radius:50%;background:transparent;color:#dce8ff;transition:background-color 160ms,border-color 160ms}#material-motion[aria-pressed=false] .resume-icon,#material-motion[aria-pressed=true] .pause-icon{display:none}
.voice-stage{height:330px;position:relative;isolation:isolate;overflow:hidden;contain:layout paint}.voice-stage canvas{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none}.presence-caption{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:13px;color:#bed0ed;letter-spacing:.015em;pointer-events:none}.presence-caption::before{content:'';display:inline-block;width:5px;height:5px;background:#b7d0ff;border-radius:50%;margin-right:9px;vertical-align:2px}.call[data-state=error] .presence-caption{color:#d6deed}.wave{display:none}
.call-actions{min-height:52px;display:flex;align-items:center;justify-content:center;margin:14px 0 16px}/* The same native control serves both start and resume. */
#start{
  position:relative;isolation:isolate;overflow:hidden;
  display:inline-flex;align-items:center;justify-content:center;gap:13px;
  min-height:54px;max-width:100%;padding:14px 20px 14px 22px;
  border:1px solid #c1d1eb;border-radius:13px;
  background-color:#bdd0eb;
  background-image:radial-gradient(ellipse at 16% 0%,#ffffffd9 0%,#ffffff00 53%),linear-gradient(173deg,#f7fbff 0%,#d3dfef 29%,#b6c8e3 47%,#e6effb 51%,#c5d5ed 76%,#a3b9db 100%);
  box-shadow:inset 0 1px 0 #fff,inset 0 -2px 3px #5674a24d,0 7px 20px #020a2038;
  color:#10245c;font-size:15px;font-weight:600;line-height:1.5;
  -webkit-tap-highlight-color:transparent;
  transition:transform 180ms var(--ease-out),box-shadow 180ms var(--ease-out),border-color 180ms;
}
#start::before{
  content:'';position:absolute;z-index:0;inset:-60% auto -60% 0;width:44%;pointer-events:none;
  background:linear-gradient(90deg,#fff0,#ffffff9c 49%,#fff0);
  transform:translateX(-145%) skewX(-24deg);opacity:0;
  transition:transform 620ms var(--ease-out),opacity 180ms;
}
#start>svg,#start>span{position:relative;z-index:1}
#start-label{min-width:0}
#start .start-open{width:18px;height:18px;margin-left:8px}
#start[disabled]{opacity:.6;box-shadow:inset 0 1px 0 #fff8,inset 0 -1px 2px #5674a233}
#start:not([disabled]):focus-visible{outline:2px solid #f4f8ff;outline-offset:5px}
#start:not([disabled]):active{transform:translateY(1px) scale(.99);box-shadow:inset 0 2px 5px #42629155,0 3px 10px #020a2029}
#status{margin:0 auto 18px;max-width:49ch;min-height:48px;text-align:center;color:#c7d7f0;font-size:14px;line-height:1.7;text-wrap:pretty}
#active-controls{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}#active-controls button,#sound-tools button,#play,#quality-report{min-height:48px;padding:11px 17px;border:1px solid #829dcc70;border-radius:10px;background:#12254a;color:#e5efff;line-height:1.5;font-size:14px}#stop{background:#e7efff!important;color:#122450!important;border-color:transparent!important}#mute[aria-pressed=true]{background:#304775;border-color:#b0c6ec}#sound-tools{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:0 0 14px}#sound-tools button{font-size:13px;background:transparent;min-height:44px;padding:9px 14px}#play{display:block;margin:0 auto 14px;background:#e7efff;color:#10245c}#quality-report{display:block;margin:0 auto 14px;min-height:44px;font-size:13px;padding:8px 15px;background:transparent}#audio-hint{max-width:50ch;color:#c1d0e9;font-size:13px;line-height:1.7;text-align:center;margin:0 auto 12px}
/* Live tools keep a quieter material and a clear role beside the primary silver CTA. */
#active-controls button{background-image:linear-gradient(168deg,#263e62,#142642 53%,#0d1b34);border-color:#7188ac8f;box-shadow:inset 0 1px 0 #d9e9ff24,inset 0 -1px 0 #01081388,0 3px 10px #02091629;transition:border-color 160ms,box-shadow 160ms,background-color 160ms}
#stop{background:linear-gradient(168deg,#526986,#2c4260 47%,#20334f)!important;color:#f0f5ff!important;border-color:#8ba0bd!important;box-shadow:inset 0 1px 0 #f3f7ff42,inset 0 -1px 0 #06122580,0 3px 10px #02091629}
#active-controls #mute[aria-pressed=true]{background:linear-gradient(165deg,#415d86,#233b62);border-color:#b0c9ec;color:#f0f6ff;box-shadow:inset 0 1px 0 #e8f4ff38,inset 0 0 0 1px #97b7e333}
#sound-tools button{background:linear-gradient(170deg,#1b2e4c99,#0c1a3099);border-color:#7089ae7a;box-shadow:inset 0 1px 0 #d9e9ff17}
#sound-tools #speaker-mode[aria-pressed=true]{background:linear-gradient(167deg,#3f5878,#1c3458);border-color:#aac2e4;color:#f0f6ff}
#sound-tools #touch-lock{background:transparent;border-color:#6e85a55e;box-shadow:inset 0 1px 0 #d9e9ff0d}
#play{background:linear-gradient(171deg,#e4eefb,#a9bdd9 49%,#c5d5ed 54%,#a1b6d2);border-color:#b1c6e3;box-shadow:inset 0 1px 0 #fff9,inset 0 -1px 2px #47628e4d;color:#142b55;font-weight:600}
footer{border-top:1px solid #839fc137;padding-top:16px}#selection-status{display:none!important}.memory-row{display:flex;align-items:center;justify-content:space-between;gap:16px}.memory-row p{font-size:13px;color:#bdceeb;line-height:1.65;margin:0;max-width:40ch}#forget{font-size:13px;line-height:1.4;min-height:44px;flex:none;max-width:13ch;border:0;background:none;color:#d3e0f5;padding:8px 0;text-align:right;text-decoration:underline;text-underline-offset:4px}details{font-size:13px;color:#bdceeb;margin-top:5px}summary{cursor:pointer;min-height:44px;display:flex;align-items:center;gap:10px;width:max-content;max-width:100%;list-style:none}summary::-webkit-details-marker{display:none}summary svg{width:16px;height:16px;transition:transform 160ms var(--ease-out)}details[open] summary svg{transform:rotate(180deg)}details p{line-height:1.8;max-width:65ch;margin:8px 0 16px}.call[data-state=idle] .call-top h2{color:#d7e5fa}
#touch-shield{position:fixed;inset:0;margin:0;padding:30px;border:0;max-width:none;max-height:none;width:100%;height:100%;background:#050609;color:#e9effc;overscroll-behavior:none;touch-action:none}#touch-shield::backdrop{background:#050609}.shield-body{height:100%;max-width:400px;margin:auto;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:16px}.shield-body h2{font-size:24px;font-weight:400}.shield-body p{color:#bbc6d8;line-height:1.75}.shield-body button{min-height:60px;padding:15px 20px;border:1px solid #62718c;border-radius:10px;background:#151d2a;color:white}
@media(hover:hover) and (pointer:fine){#start:not([disabled]):hover:not(:active){border-color:#f4f8ff;transform:translateY(-1px);box-shadow:inset 0 1px 0 #fff,inset 0 -2px 3px #5674a24d,0 10px 25px #020a204d}#start:not([disabled]):hover::before{transform:translateX(340%) skewX(-24deg);opacity:1}#material-motion:hover{background:#263c6566;border-color:#a9c3ed}#active-controls button:not([disabled]):hover,#sound-tools button:not([disabled]):hover{border-color:#d3e2ff}}
@media(max-width:420px){body{padding:0}.call-top{gap:10px}.call-meta{gap:8px}.call-top h2{font-size:18px;max-width:18ch}#timer{font-size:12px}.voice-stage{height:280px}.call-actions{margin-top:8px}#status{font-size:14px;min-height:48px}.memory-row{align-items:flex-start;gap:14px}.memory-row p{font-size:13px}#forget{font-size:12px;max-width:11ch;padding-top:4px}.presence-caption{font-size:12px}.call-actions #start{padding:13px 18px;font-size:14px}#start .start-open{margin-left:8px}#active-controls{gap:8px}#active-controls button{font-size:13px;padding:11px 13px}footer{padding-top:14px}}
@media(max-width:340px){.call-top h2{font-size:17px}.voice-stage{height:260px}.call-meta{gap:5px}#material-motion{width:40px;height:44px;border-radius:10px}.memory-row{flex-wrap:wrap;gap:0}#forget{text-align:left;max-width:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}#start{transform:none!important}#start::before{display:none;transition:none!important}}

/* Temporary decorative bridge from the native metal CTA into the voice sculpture. */
.cta-fusion{position:absolute;left:0;top:0;z-index:3;pointer-events:none;overflow:hidden;contain:layout style paint;user-select:none}
.cta-fusion-canvas{position:absolute;inset:0;display:block;pointer-events:none}
.cta-fusion-echo{position:absolute;box-sizing:border-box;isolation:isolate;overflow:hidden;pointer-events:none;user-select:none;white-space:nowrap;transition:none!important;transform-origin:50% 50%}
.cta-fusion-echo svg,.cta-fusion-echo span{position:relative;z-index:1;pointer-events:none}
.call.cta-fusion-active #active-controls{opacity:var(--cta-controls-opacity,1)}
.call.cta-fusion-active .presence-caption{opacity:var(--cta-caption-opacity,1)}
.call.cta-fusion-return #start{opacity:var(--cta-start-opacity,1)}
.call.cta-fusion-return #start[disabled]{opacity:calc(var(--cta-start-opacity,1)*.6)}
.call.cta-fusion-return #start:focus-visible{opacity:1!important}
@media(prefers-reduced-motion:reduce){.cta-fusion{display:none!important}.call.cta-fusion-active #active-controls,.call.cta-fusion-active .presence-caption,.call.cta-fusion-return #start{opacity:1!important}.call.cta-fusion-return #start[disabled]{opacity:.6!important}}

/* Privacy information stays beside the call action before any microphone use. */
.call-privacy{max-width:58ch;margin:0 auto 20px;color:#c7d7f0;font-size:13px;line-height:1.8;text-align:center;text-wrap:pretty}.call-privacy a,footer details a{color:#e8f1ff;text-underline-offset:4px;text-decoration-thickness:1px}.call-privacy a:focus-visible,footer details a:focus-visible{outline:2px solid #d7e6ff;outline-offset:4px;border-radius:2px}