@import"https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap";:root{--ffiv-blue: #000088;--ffiv-blue-light: #0000cc;--ffiv-white: #ffffff;--ffiv-border-outer: #ffffff;--ffiv-border-inner: #cccccc;--ffiv-shadow: #000000;--font-pixel: "Press Start 2P", cursive}.theme-grey{--ffiv-blue: #444444;--ffiv-blue-light: #777777}.theme-red{--ffiv-blue: #880000;--ffiv-blue-light: #cc0000}.theme-purple{--ffiv-blue: #440088;--ffiv-blue-light: #6600cc}*{box-sizing:border-box;margin:0;padding:0;cursor:none}body{background-color:#000;color:var(--ffiv-white);font-family:var(--font-pixel);font-size:16px;line-height:1.5;overflow:hidden;image-rendering:pixelated}#root{width:100vw;height:100vh;display:flex;justify-content:center;align-items:center}.resolution-warning{text-align:center;padding:2rem;color:red}.ffiv-window{background:linear-gradient(135deg,var(--ffiv-blue) 0%,var(--ffiv-blue-light) 100%);border:4px solid var(--ffiv-border-outer);box-shadow:4px 4px 0 var(--ffiv-shadow);padding:20px;position:relative}.ffiv-window:before{content:"";position:absolute;inset:2px;border:2px solid var(--ffiv-border-inner);pointer-events:none}.cursor{position:absolute;width:24px;height:24px;z-index:9999;pointer-events:none;transition:all .1s steps(4);animation:pointerHover .6s steps(2) infinite}@keyframes pointerHover{0%{transform:translate(0)}50%{transform:translate(-4px)}to{transform:translate(0)}}.nav-legend{position:fixed;bottom:20px;left:50%;transform:translate(-50%);background:#000000b3;border:2px solid var(--ffiv-border-outer);padding:8px 16px;display:flex;gap:20px;font-size:10px;color:var(--ffiv-white);z-index:10000;pointer-events:none;text-shadow:2px 2px #000;box-shadow:0 0 10px #00000080}.nav-key{color:#ff0;margin-right:4px}.ff-app-container{width:1024px;height:768px;padding:16px;background:#000;display:flex;flex-direction:column;position:relative;cursor:none}.main-grid{display:grid;grid-template-columns:1fr 280px;grid-template-rows:1fr 100px 80px;gap:16px;height:100%}.party-window{grid-column:1;grid-row:1 / 4;display:flex;flex-direction:column;gap:20px}.menu-window{grid-column:2;grid-row:1}.time-window{grid-column:2;grid-row:2}.gp-window{grid-column:2;grid-row:3}.char-row{display:flex;align-items:center;gap:20px;padding:10px}.char-avatar-container{width:80px;height:80px;border:4px solid var(--ffiv-white);overflow:hidden;image-rendering:pixelated}.pixel-avatar{width:100%;height:100%;object-fit:cover}.empty-slot .char-avatar-container{background:#222;border-color:#444}.char-details{flex:1}.char-header{display:flex;justify-content:space-between;font-size:20px;margin-bottom:10px;border-bottom:2px solid rgba(255,255,255,.2);padding-bottom:5px}.char-stats{display:flex;flex-direction:column;gap:6px}.stat-line{display:flex;justify-content:flex-end;gap:20px;font-size:16px}.stat-label{color:var(--ffiv-border-inner)}.stat-value{min-width:100px;text-align:right}.menu-list{list-style:none;display:flex;flex-direction:column;gap:16px}.menu-item{font-size:20px;padding-left:10px}.menu-item.disabled{color:#666}.selected{color:#ff0;text-shadow:2px 2px #000}.time-content,.gp-content{display:flex;justify-content:space-between;align-items:center;height:100%}.label{color:#aaa;font-size:14px}.value{font-size:20px}.detail-overlay{position:absolute;inset:0;background:#000000b3;display:flex;justify-content:center;align-items:center;z-index:100}.detail-overlay-window{width:800px;height:600px;display:flex;flex-direction:column;overflow:hidden}.detail-header{font-size:24px;margin-bottom:20px;border-bottom:4px solid var(--ffiv-white);padding-bottom:10px;flex-shrink:0;background:var(--ffiv-blue);z-index:10}.detail-body{flex:1;overflow-y:auto;overflow-x:hidden;padding:20px;scrollbar-width:thin;scrollbar-color:var(--ffiv-white) transparent}.detail-body::-webkit-scrollbar{width:8px}.detail-body::-webkit-scrollbar-track{background:transparent}.detail-body::-webkit-scrollbar-thumb{background:var(--ffiv-white);border:2px solid var(--ffiv-blue-dark)}.detail-list{display:flex;flex-direction:column;gap:20px;padding-left:30px;padding-bottom:40px}.detail-item{font-size:20px;line-height:1.4;transition:color .2s;word-break:break-word}.skill-row{display:grid;grid-template-columns:1fr 150px 80px;align-items:center;gap:15px;width:100%}.skill-icon{display:none}.skill-bar-container{height:12px;background:#ffffff1a;border:1px solid var(--ffiv-white);position:relative}.skill-bar-fill{height:100%;background:linear-gradient(to bottom,#0f0,#080);box-shadow:0 0 5px #0f0}.skill-level{text-align:right;font-size:16px}.detail-footer{text-align:center;font-size:14px;margin-top:20px;color:#aaa;animation:blink 1s infinite;border-top:1px solid rgba(255,255,255,.1);padding-top:10px}@keyframes blink{0%{opacity:1}50%{opacity:0}to{opacity:1}}.about-layout{display:flex;gap:40px;padding:10px;height:100%}.about-avatar-col{flex-shrink:0}.about-avatar{width:160px;height:160px;border:4px solid var(--ffiv-white);image-rendering:pixelated;object-fit:cover;display:block}.about-info-col{display:flex;flex-direction:column;gap:20px;flex:1}.about-field{display:flex;flex-direction:column;gap:6px}.about-label{font-size:11px;color:#aaa;letter-spacing:2px}.about-value{font-size:16px;color:var(--ffiv-white)}.about-langs{display:flex;gap:20px}.about-lang-tag{font-size:14px;color:var(--ffiv-white)}.about-lang-level{color:#ff0}.about-bio{display:flex;flex-direction:column;gap:14px;border-top:2px solid rgba(255,255,255,.2);padding-top:16px}.about-bio-line{font-size:13px;line-height:1.8;color:#ddd}.bottom-touch-menu,.bottom-touch-menu-wrapper,.close-button{display:none}@media(max-width:768px){.cursor,.nav-legend{display:none!important}*{cursor:auto}#root{min-height:100vh!important;display:block!important;padding:0!important;overflow-x:hidden}.ff-app-container{display:block;width:100%;min-height:100vh;background-color:#000;padding:25px 10px 120px;box-sizing:border-box}.main-grid{display:block;height:auto;width:100%;margin:0;padding:0}.party-window{display:flex;flex-direction:column;width:100%;height:auto;margin-top:0;margin-bottom:20px;gap:20px}.menu-window,.time-window,.gp-window{display:none}.bottom-touch-menu-wrapper{position:fixed;bottom:0;left:0;width:100%;height:100px;z-index:20000;background:linear-gradient(135deg,var(--ffiv-blue) 0%,var(--ffiv-blue-light) 100%);border-top:4px solid var(--ffiv-border-outer);box-shadow:0 -4px 15px #0009;display:flex;align-items:center}.bottom-touch-menu-wrapper:before{content:"";position:absolute;inset:2px 0 0;border-top:2px solid var(--ffiv-border-inner);pointer-events:none}.bottom-scroll-track{display:flex;align-items:center;width:100%;height:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;padding:0 40px 0 10px;gap:10px}.scroll-indicator{position:absolute;right:10px;top:50%;transform:translateY(-50%);color:#ff0;font-size:20px;pointer-events:none;animation:bounceRight 1s infinite;text-shadow:2px 2px 0px #000;z-index:20001}@keyframes bounceRight{0%,to{right:10px}50%{right:15px}}.touch-item{color:var(--ffiv-white);text-align:center;font-size:10px;display:flex;flex-direction:column;align-items:center;gap:8px;min-width:70px;flex-shrink:0;justify-content:center}.touch-icon{font-size:20px}.close-button{position:absolute;top:10px;right:10px;width:40px;height:40px;background:var(--ffiv-blue);border:2px solid var(--ffiv-white);color:var(--ffiv-white);display:flex;justify-content:center;align-items:center;font-size:24px;z-index:1001}.detail-overlay-window{width:95%;height:80%}.about-layout{flex-direction:column;gap:20px}.about-avatar{width:100px;height:100px}.about-bio-line{font-size:11px}.skill-row{display:flex;flex-wrap:wrap;align-items:center;gap:5px}.skill-name{width:100%;text-align:left;font-weight:700;margin-bottom:2px}.skill-bar-container{flex:1;min-width:100px}.skill-level{width:auto;min-width:60px;text-align:right}.char-header{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:5px;height:auto;margin-top:10px;margin-bottom:20px}.char-job{align-self:flex-start;font-size:14px;color:#ccc;margin-top:2px}html,body{background-color:#000;margin:0;padding:0;overflow-x:hidden;overflow-y:auto!important;height:auto;min-height:100%}}
