body{color:#bfb;background:#334;font-family:sans-serif;}#dropzone{display:block;border:2px dashed #ffb;padding:10px;margin:10px;max-width:600px;width:90%;text-align:center;}a,a:visited{color:#bfb;}#logo{font-size:calc(1em + 2vw);font-weight:900;text-shadow:#000 3px 5px 2px;text-transform:uppercase;/* Make all letters uppercase */ font-variant:small-caps;/* Differentiate capital letters slightly */}#logo::first-letter{font-size:1.2em;/* Slightly increase size of the first letter if it's uppercase */}#chatinput{width:80%;}#fileInput, #folderInput, #manualKey, #manualKeyEnter{display:none;}#logolink{text-decoration:none;}#qrcode{display:inline-block;}#qrcode:not(:empty){background-color:#fff;padding:5px;margin:5px;}button{background-color:#bfb;/* Green */ border:none;color:#334;padding:5px 5px;margin:5px;text-align:center;text-decoration:none;display:inline-block;font-size:16px;box-shadow:#000 2px 3px 1px;}button:active{transform:translate(1px,1px);box-shadow:#000 1px 1px 0px;}button:disabled{background-color:#999}.chatdiv{margin:2px;padding:2px;max-width:800px;width:90%;}#msghistory{margin:2px;padding:2px;overflow-y:auto;max-height:300px;}.msgbox{--r:10px;/* the radius */ --t:20px;/* the size of the tail */ /* max-width:300px;*/ padding:calc(2*var(--r)/6);background:linear-gradient(135deg,#FE6D00,#1384C5) border-box;color:#fff;mask:radial-gradient(var(--t) at var(--_d) 0,#0000 98%,#000 102%) var(--_d) 100%/calc(100% - var(--r)) var(--t) no-repeat, conic-gradient(at var(--r) var(--r),#000 75%,#0000 0) calc(var(--r)/-2) calc(var(--r)/-2) padding-box, radial-gradient(50% 50%,#000 98%,#0000 101%) 0 0/var(--r) var(--r) space padding-box;-webkit-mask:radial-gradient(var(--t) at var(--_d) 0,#0000 98%,#000 102%) var(--_d) 100%/calc(100% - var(--r)) var(--t) no-repeat, conic-gradient(at var(--r) var(--r),#000 75%,#0000 0) calc(var(--r)/-2) calc(var(--r)/-2) padding-box, radial-gradient(50% 50%,#000 98%,#0000 101%) 0 0/var(--r) var(--r) space padding-box;margin-top:5px;}.msgbox .contentDiv{display:flex;justify-content:space-between;align-items:center;width:100%;}.msgbox .copyButton{cursor:copy;margin-left:8px;opacity:1.0;}.msgbox .copyButton:hover{text-shadow:1px 1px 10px #fff, 1px 1px 10px #ccc;}.left{--_d:0%;border-left:var(--t) solid #0000;margin-right:var(--t);place-self:start;}.right{--_d:100%;border-right:var(--t) solid #0000;margin-left:var(--t);place-self:end;}.copied{position:fixed;/* Ensure visibility independent of parent positioning */ top:50%;/* Center vertically (adjustable) */ left:50%;/* Center horizontally */ transform:translate(-50%, -50%);/* Center exactly */ font-size:14px;color:#4caf50;background:white;padding:5px 10px;border:1px solid #ddd;border-radius:5px;opacity:1;animation:moveUpFade 1s ease-out forwards;z-index:9999;/* Ensure it's above all other content */ pointer-events:none;/* Avoid interfering with other interactions */}@keyframes moveUpFade{0%{opacity:1;transform:translate(-50%, -50%);}100%{opacity:0;transform:translate(-50%, -100%);}}