@layer base{:root{color-scheme:light dark;interpolate-size:allow-keywords;--color-primary:#00f7be;--color-background:light-dark(#f0f0f0,#1e1e1e);--color-text:light-dark(#1e1e1e,#e4e5ed);@media (color-gamut:p3){--color-primary:oklch(87.06% .229 168.35)}--font-primary:Helvetica, Arial, sans-serif}[data-theme=light]{color-scheme:light only}[data-theme=dark]{color-scheme:dark only}*,:before,:after{box-sizing:border-box;position:relative}html{block-size:100%}body{accent-color:var(--color-primary);background-color:var(--color-background);block-size:100%;color:var(--color-text);font-family:var(--font-primary);font-size:calc(1rem * var(--text-scale));margin:0;padding:0;transition:--text-scale .5s ease-in-out;overflow:hidden}main{block-size:100%;display:block}#app-holder,#app{block-size:100%}#app-holder{overflow:hidden}#app{padding:50px;transition:transform .15s ease-out;overflow:auto;container:app/inline-size}}@layer ui{dialog{--transition-speed:.3s;opacity:0;transition:display var(--transition-speed) ease-out allow-discrete, opacity var(--transition-speed) ease-out, overlay var(--transition-speed) ease-out allow-discrete, transform var(--transition-speed) ease-out;transform:scale(.8);&::backdrop{transition:background-color var(--transition-speed), display var(--transition-speed) allow-discrete, overlay var(--transition-speed) allow-discrete;background-color:#0000}&[open]{opacity:1;transform:scale(1);&::backdrop{background-color:#00000080}}@starting-style{&[open]{opacity:0;transform:scale(.8);&::backdrop{background-color:#0000}}}}.guest-screen{padding:10px;& .files{grid-template-columns:1fr auto auto;grid-auto-flow:row;margin:0;padding:0;display:grid;& .button{appearance:none;color:var(--color-text);cursor:pointer;grid-column:1/-1;grid-template-columns:subgrid;background:0 0;border:0;border-radius:4px;grid-template-rows:1fr;align-items:baseline;gap:10px;inline-size:100%;padding:3px 6px;font-size:1em;text-decoration:none;display:grid;&:hover{background:rgba(black, .05)}&:focus{outline:2px solid #000}& span{text-overflow:ellipsis;display:block;overflow:hidden}& .filename{text-align:start}& .size{text-align:end;font-family:monospace}& .date{text-align:end}}}& .breadcrumbs{font-weight:700;& a.crumb{color:var(--color-text);cursor:pointer;border-radius:4px;padding:2px 4px;display:inline-block;&:hover{background-color:rgba(black, .05)}&:after{content:" /"}}}@media (width<800px){& .files{display:block;& .button{flex-wrap:wrap;display:flex;& .filename{flex:1 0 100%}& .date{text-align:initial}& .size,& .date{flex:1}}}}}}@layer design{:root{--dppx:1;--pixel-scale:calc(1px / var(--dppx));@media (resolution>=2x) and (resolution<2.5x){--dppx:2}@media (resolution>=2.5x) and (resolution<3x){--dppx:2.5}@media (resolution>=3x) and (resolution<3.5x){--dppx:3}@media (resolution>=3.5x) and (resolution<4x){--dppx:3.5}@media (resolution>=4x){--dppx:4}}.start-screen{border:var(--pixel-scale) solid black;block-size:100%;& .container{flex-direction:column;justify-content:center;align-items:center;block-size:100%;display:flex}& .select-button{appearance:none;cursor:pointer;background:0 0;border:0;font-size:2em;font-weight:700}& .recent{& a{display:block}}& input.file-select{opacity:0;z-index:1;block-size:100%;inline-size:100%;position:fixed;inset-block-start:0;inset-inline-end:0}& button,& a{cursor:pointer}}.preferences-button{appearance:none;cursor:pointer;z-index:2;background:0 0;border:0;padding:10px;display:block;position:fixed;inset-block-start:0;inset-inline-end:0}@media (width<=800px){#app{padding:5px}}}@property --text-scale{syntax:"<number>";inherits:false;initial-value:1}#logger{backdrop-filter:blur(5px);background-color:rgb(from var(--color-background) r g b / .9);border:1px solid red;max-height:200px;padding:10px;font-family:monospace;position:fixed;bottom:10px;left:10px;overflow-y:auto}@media (prefers-reduced-motion){*{scroll-behavior:initial;transition-duration:0s!important;animation-duration:0s!important}}