html{color:#fff}body,h1{margin:0}textarea,input,button{font-family:inherit;font-size:inherit;font-weight:inherit;box-sizing:border-box;outline:none}textarea{overflow:hidden;resize:none}button{border:unset;outline:none;background-color:#0000}:root{--color-dark-grey:#343a40;--color-light-grey:#657b83;--color-green:#28a745;--color-red:#db3b21;--color-blue:#376ef6;--color-gold:gold;--color-silver:silver;--color-bronze:#8b4513;--color-header:#2e2d2d;--transition-time:.1s}html{font-family:Rubik,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-size:20px;font-weight:700;line-height:24px}body{display:flex;background-color:#000;flex-direction:column;min-height:100vh}body:has(dialog[open]){overflow:hidden}body>.wallpaper{position:fixed;object-fit:cover;pointer-events:none;inset:0;transform:scale(1.05)}body>img.wallpaper[src=""]:not([style*=background-image]){display:none}body>video.wallpaper[src=""]{display:none}.no-scrollbar::-webkit-scrollbar{display:none;-webkit-appearance:none;width:0;height:0}.spa-button{display:flex;box-sizing:border-box;cursor:pointer;transition-property:background-color,transform,box-shadow,border;transition-duration:var(--transition-time);will-change:background-color,transform,box-shadow,border;border-radius:8px;flex-shrink:0;justify-content:center;align-items: center;gap:8px;box-shadow:3px 3px #000}.spa-button.spa-light{background-color:var(--color-light-grey)}.spa-button.spa-dark{background-color:var(--color-dark-grey);color:#fff}.spa-button.spa-green{background-color:var(--color-green);color:#fff}.spa-button.spa-red{background-color:var(--color-red);color:#fff}.spa-button.spa-blue{background-color:var(--color-blue);color:#fff}.spa-button.spa-40{width:40px;height:40px}.spa-button.spa-80{width:80px;height:80px}.spa-button.spa-80-40{width:80px;height:40px}.spa-button.spa-rounded{border-radius:50%}.spa-button.spa-autosize{padding:8px 12px}.spa-button:active{transform:translate(1px,1px);box-shadow:2px 2px #000}.spa-button:hover{transform:translate(1px,1px);box-shadow:2px 2px #000}.spa-button:focus-visible{transform:translate(1px,1px);box-shadow:2px 2px #000}.spa-button:focus-visible{border:3px solid #448aff}.spa-input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.spa-input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.spa-input::-webkit-calendar-picker-indicator{display:none!important}.spa-textarea,.spa-input{--background-color:#d8d8d8;--border-color:var(--color-dark-grey);--box-shadow-color:black;color:#000;transition-property:border-color,box-shadow,transform;transition-duration:var(--transition-time);border:3px solid var(--border-color);background-color:var(--background-color);box-shadow:3px 3px 0 var(--box-shadow-color);border-radius:8px;padding:4px 8px;font-size:26px;font-weight:400}:is(.spa-textarea,.spa-input)::placeholder{opacity:0}:is(.spa-textarea,.spa-input):focus{--border-color:#448aff}:is(.spa-textarea,.spa-input):focus::placeholder{opacity:1}:is(.spa-textarea,.spa-input):active{transform:translate(1px,1px);box-shadow:2px 2px #000}:is(.spa-textarea,.spa-input):hover{transform:translate(1px,1px);box-shadow:2px 2px #000}:is(.spa-textarea,.spa-input):focus-visible{transform:translate(1px,1px);box-shadow:2px 2px #000}header{display:grid;grid-template-columns:1fr auto 1fr;z-index:1;background-color:var(--color-header);color:var(--color-light-grey);justify-content:center;align-items: center;gap:16px;padding:16px}header .left{display:flex;gap:8px}header .center{text-align:center;line-height:100%}header .right{display:flex;justify-content:flex-end;gap:8px}main{display:flex;z-index:1;flex-direction:column;flex-grow:1;align-items: center;gap:40px;padding:56px 32px}.timer-container{display:flex;position:-webkit-sticky;position:sticky;z-index:1;align-items: center;gap:24px;top:32px}.timer-container .timer-state-controls{display:flex;flex-direction:column;gap:16px}[is=spa-timer]{display:flex;text-shadow:3px 3px #000;font-size:8vw;line-height:1em}[is=spa-timer] .minutes{text-align:end;min-width:2ch}[is=spa-timer] .seconds{text-align:end;width:2ch}[is=spa-timer] .milliseconds{width:3ch}.timer-time-controls{pointer-events:auto;display:flex;flex-wrap:wrap;justify-content:center;gap:24px;width:100%}[is=spa-list]{display:flex;flex-direction:column;width:100%;max-width:1024px}[is=spa-list-item]{display:grid;grid-template-areas:"remove name sum diff add";grid-template-columns:40px auto calc(8ch + 16px + 6px)calc(7ch + 16px + 6px)40px;align-items: center;gap:16px;margin-left:-56px}[is=spa-list-item]:not(:first-child){padding-top:12px}[is=spa-list-item]:not(:last-child){padding-bottom:12px}[is=spa-list-item] .remove{grid-area:remove;color:#fff;transition:opacity .2s}[is=spa-list-item]:not(:hover)>.remove{opacity:0;pointer-events:none}[is=spa-list-item]:only-child>.remove{opacity:0;pointer-events:none}[is=spa-list-item] .name{grid-area:name;text-align:end}[is=spa-list-item] .sum{grid-area:sum;text-align:end}[is=spa-list-item] .sum::placeholder{text-align:center}[is=spa-list-item] .diff{grid-area:diff;text-align:center}[is=spa-list-item] .add{grid-area:add;transition:opacity .2s;font-size:26px}[is=spa-list-item]:first-child input{--border-color:var(--background-color);--box-shadow-color:var(--background-color);box-shadow:0 0 10px var(--box-shadow-color),3px 3px 0 black;border-style:outset}[is=spa-list-item]:first-child input:focus{box-shadow:0 0 40px var(--box-shadow-color),3px 3px 0 black}[is=spa-list-item]:first-child textarea{--border-color:var(--background-color);--box-shadow-color:var(--background-color);box-shadow:0 0 10px var(--box-shadow-color),3px 3px 0 black;border-style:outset}[is=spa-list-item]:first-child textarea:focus{box-shadow:0 0 40px var(--box-shadow-color),3px 3px 0 black}[is=spa-list-item]:nth-child(2) input{--border-color:var(--background-color);--box-shadow-color:var(--background-color);box-shadow:0 0 10px var(--box-shadow-color),3px 3px 0 black;border-style:outset}[is=spa-list-item]:nth-child(2) input:focus{box-shadow:0 0 40px var(--box-shadow-color),3px 3px 0 black}[is=spa-list-item]:nth-child(2) textarea{--border-color:var(--background-color);--box-shadow-color:var(--background-color);box-shadow:0 0 10px var(--box-shadow-color),3px 3px 0 black;border-style:outset}[is=spa-list-item]:nth-child(2) textarea:focus{box-shadow:0 0 40px var(--box-shadow-color),3px 3px 0 black}[is=spa-list-item]:nth-child(3) input{--border-color:var(--background-color);--box-shadow-color:var(--background-color);box-shadow:0 0 10px var(--box-shadow-color),3px 3px 0 black;border-style:outset}[is=spa-list-item]:nth-child(3) input:focus{box-shadow:0 0 40px var(--box-shadow-color),3px 3px 0 black}[is=spa-list-item]:nth-child(3) textarea{--border-color:var(--background-color);--box-shadow-color:var(--background-color);box-shadow:0 0 10px var(--box-shadow-color),3px 3px 0 black;border-style:outset}[is=spa-list-item]:nth-child(3) textarea:focus{box-shadow:0 0 40px var(--box-shadow-color),3px 3px 0 black}[is=spa-list-item]:first-child input{--background-color:var(--color-gold)}[is=spa-list-item]:first-child textarea{--background-color:var(--color-gold)}[is=spa-list-item]:nth-child(2) input{--background-color:var(--color-silver)}[is=spa-list-item]:nth-child(2) textarea{--background-color:var(--color-silver)}[is=spa-list-item]:nth-child(3) input{--background-color:var(--color-bronze)}[is=spa-list-item]:nth-child(3) textarea{--background-color:var(--color-bronze)}dialog[open]{position:fixed;z-index:10;display:flex;overflow:auto;box-sizing:border-box;backdrop-filter:blur(5px);border:3px solid var(--color-dark-grey);background:#ffffffad;border-radius:16px;flex-direction:column;align-items: center;gap:16px;max-width:calc(100% - 64px);max-height:calc(100% - 64px);padding:24px;inset:16px}dialog:not([open]){display:none}dialog.gentlemens{max-width:700px}dialog.gentlemens .text{text-align:center;user-select:text;font-size:24px;font-weight:400;line-height:32px}dialog.history:before{content:"История";margin-bottom:8px;font-size:xx-large}dialog.bookmarks:before{content:"Сохранённые";margin-bottom:8px;font-size:xx-large}dialog.bookmarks .dialog-controls{display:flex;gap:8px}dialog.history,dialog.bookmarks{max-width:900px}:is(dialog.history,dialog.bookmarks) .container{display:flex;flex-direction:column;gap:24px}:is(dialog.history,dialog.bookmarks) .container .list{display:flex;border:3px solid var(--color-dark-grey);border-radius:16px;flex-direction:column;gap:16px;padding:12px}:is(dialog.history,dialog.bookmarks) .container .list .title{display:flex;text-align:center;justify-content:space-between;align-self: center;align-items: center;gap:24px}:is(dialog.history,dialog.bookmarks) .container .list .title .date{margin-top:2px;font-size:larger}:is(dialog.history,dialog.bookmarks) .container .list .items{display:grid;grid-template-columns:1fr auto;gap:0 8px}:is(dialog.history,dialog.bookmarks) .container .list .items .item{position:relative;display:grid;grid-template-columns:subgrid;grid-column:1/-1;gap:24px;padding:8px}:is(dialog.history,dialog.bookmarks) .container .list .items .item .name{text-align:end}:is(dialog.history,dialog.bookmarks) .container .list .items .item .sum{align-self: center;min-width:6ch}:is(dialog.history,dialog.bookmarks) .container .list .items .item+:is(:is(dialog.history,dialog.bookmarks) .container .list .items .item):before{content:"";position:absolute;border-top:1px solid var(--color-light-grey);left:16px;right:16px}:is(dialog.history,dialog.bookmarks) .container .list .controls{display:flex;justify-content:space-between;gap:8px;font-size:smaller}dialog.settings{gap:32px;min-width:700px;max-width:700px}dialog.settings .block{display:flex;flex-direction:column;gap:16px;width:100%}dialog.settings .block:before{content:attr(data-title);margin-left:auto;margin-right:auto;font-size:30px}dialog.settings .block .content{display:flex;gap:16px}dialog.settings .block.wallpapers .content{display:grid;grid-template-columns:1fr 1fr 1fr;cursor:pointer}dialog.settings .block.api-key input{text-align:center;width:100%}dialog.settings [data-dialog-hide]{margin-top:auto}dialog.settings [is=spa-dialog-settings-wallpaper]{position:relative;display:flex;aspect-ratio:16/9;flex-direction:column}dialog.settings [is=spa-dialog-settings-wallpaper]:has(img:not([src=""])) .select{display:none}dialog.settings [is=spa-dialog-settings-wallpaper]:has(video:not([src=""])) .select{display:none}dialog.settings [is=spa-dialog-settings-wallpaper]:has(img[src=""]):has(video[src=""]) .remove{display:none}dialog.settings [is=spa-dialog-settings-wallpaper]:has(img[src=""]):has(video[src=""]) .custom-css{display:none}dialog.settings [is=spa-dialog-settings-wallpaper] img{position:absolute;object-fit:cover;box-sizing:border-box;border-radius:8px;inset:0}dialog.settings [is=spa-dialog-settings-wallpaper] img[src=""]{display:none}dialog.settings [is=spa-dialog-settings-wallpaper] video{position:absolute;object-fit:cover;box-sizing:border-box;border-radius:8px;inset:0}dialog.settings [is=spa-dialog-settings-wallpaper] video[src=""]{display:none}dialog.settings [is=spa-dialog-settings-wallpaper] .select{height:100%}dialog.settings [is=spa-dialog-settings-wallpaper] .remove{position:absolute;top:8px;right:8px}dialog.settings [is=spa-dialog-settings-wallpaper] .custom-css{position:absolute;top:8px;left:8px}