::-ms-expand{display:none}
:root{--color-accent:#cfa65b;--color-bg:#111111;--color-dark-surface:#1b1b1b;--color-text:#eeeeee;--font-body:-apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-heading:"Georgia", serif}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
*,::before,::after{box-sizing:border-box}
a,area,button,input,label,select,summary,textarea,[tabindex]{touch-action:manipulation}
body{align-items:center;background:radial-gradient(circle at top, #222 0, #111 55%, #000 100%);color:var(--color-text);display:flex;font-family:var(--font-body);justify-content:center;overflow:hidden;padding:2rem 1rem}
button:focus,input:focus,select:focus,textarea:focus,[contenteditable]:focus{outline:0}
html,body{height:100%}
input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none}
input[type="number"]{-moz-appearance:textfield}
table{border-collapse:collapse}
.card-body p{color:rgba(238, 238, 238, .8);font-size:1.1rem;line-height:1.6;margin-bottom:1rem}
.card-footer{border-top:1px solid rgba(207, 166, 91, .1);color:rgba(238, 238, 238, .5);font-size:.85rem;letter-spacing:.5px;margin-top:2.5rem;padding-top:1.5rem;text-align:right}
.card-header{margin-bottom:2rem}
.card-header h1{color:var(--color-text);font-family:var(--font-heading);font-size:1.8rem;font-weight:400}
.logo{color:var(--color-accent);font-family:var(--font-heading);font-size:2.5rem;font-weight:700;letter-spacing:2px;margin-bottom:.5rem}
.pause-card{background:rgba(27, 27, 27, .95);border:1px solid rgba(207, 166, 91, .1);border-radius:8px;box-shadow:0 10px 30px rgba(0, 0, 0, .5);max-width:600px;padding:3rem;z-index:10}
.pause-container{align-items:center;display:flex;flex-direction:row;justify-content:center;max-width:90vw;position:relative;width:1000px}
.pause-image{display:block;height:100%;object-fit:cover;width:100%}
.pause-image-container{border-radius:8px;height:600px;opacity:.7;overflow:hidden;pointer-events:none;position:absolute;right:-250px;top:50%;transform:translateY(-50%);width:500px;z-index:5}
@media (max-width: 1050px){
.pause-image-container{height:500px;right:-100px;width:400px}}
@media (max-width: 768px){
#app{align-items:flex-start}
.card-body p{font-size:1rem}
.card-footer{text-align:center}
.card-header h1{font-size:1.5rem}
.pause-card{box-shadow:0 5px 20px rgba(0, 0, 0, .5);margin:0 auto;padding:2rem 1.5rem;width:90%}
.pause-container{margin-top:5vh;max-width:100%;width:100%}
.pause-image-container{display:none}}
@media (max-width: 900px){
body{overflow-y:auto;padding:1.5rem 1rem}
.card-footer{text-align:center}
.pause-container{flex-direction:column}
.pause-image-container{display:none}}