:root{--primary-color: #2196f3;--primary-light: #64b5f6;--primary-dark: #1976d2;--secondary-color: #ff4081;--background-color: #fafafa;--surface-color: #ffffff;--text-primary: #212121;--text-secondary: #757575;--border-color: #e0e0e0;--shadow-color: rgba(0, 0, 0, .1);--vh: 1vh}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background-color:var(--background-color);color:var(--text-primary);height:100%}html,#root{height:100%}.app-container{display:flex;flex-direction:column;min-height:100vh;min-height:calc(var(--vh, 1vh) * 100);position:fixed;width:100%;top:0;left:0;right:0;bottom:0}.header{background-color:var(--surface-color);box-shadow:0 2px 4px var(--shadow-color);z-index:100;flex-shrink:0;position:relative}.header-content{max-width:1200px;margin:0 auto;padding:1rem;display:flex;align-items:center;justify-content:space-between;height:24px}.app-title{font-size:1.5rem;margin:0;line-height:1;font-weight:600;color:var(--primary-color);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;cursor:pointer}.credential-name{display:flex;align-items:center;gap:.5rem;color:var(--text-secondary)}.logout-button{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:.5rem;border-radius:50%;transition:background-color .2s}.logout-button:hover{background-color:var(--border-color)}.content-section{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:1rem;display:flex;flex-direction:column;gap:1rem;align-items:center;width:100%;box-sizing:border-box;position:relative;height:0;min-height:0}.content-item{background-color:var(--surface-color);border-radius:12px;box-shadow:0 2px 8px var(--shadow-color);padding:1.25rem;cursor:pointer;transition:all .2s ease;position:relative;overflow:visible;border:1px solid var(--border-color);display:flex;gap:1rem;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;width:100%;max-width:600px;box-sizing:border-box;min-height:fit-content;-webkit-tap-highlight-color:transparent}.content-item-text,.content-item-file{flex:1;min-width:0;width:100%;position:relative}.content-item-text p{margin:0 0 .75rem;white-space:pre-wrap;word-break:break-word;line-height:1.2;font-size:.95rem;color:var(--text-primary);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;transition:all .2s ease}.content-item:hover .content-item-text p{-webkit-line-clamp:unset;overflow:visible;z-index:1}.content-item-file{display:flex;flex-direction:column;gap:.75rem}.file-info{display:flex;justify-content:space-between;align-items:center;gap:1rem}.filename{font-weight:500;word-break:break-all;color:var(--primary-color);flex:1;line-height:1.2;font-size:.95rem;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}.file-size{color:var(--text-secondary);font-size:.85rem;white-space:nowrap}.progress-bar{height:6px;background-color:var(--border-color);border-radius:3px;overflow:hidden;margin:.25rem 0}.progress-bar-fill{height:100%;background-color:var(--primary-color);transition:width .3s ease}.btns-box{display:flex;flex-direction:column;justify-content:space-between}.star-button,.delete-button{position:relative;flex-shrink:0;align-self:flex-start;background:none;border:none;color:var(--text-secondary);cursor:pointer;border-radius:50%;opacity:0;transition:all .2s ease;display:flex;align-items:center;justify-content:center;margin-top:-.25rem;margin-right:-.5rem}.star-button.checked{color:#2196f3}.content-item:hover .delete-button,.content-item:hover .star-button{opacity:1}.delete-button:hover{color:#f44336}small{color:var(--text-secondary);font-size:.75rem;display:block;margin-top:.5rem}.input-section{position:sticky;bottom:0;background:var(--surface-color);border-top:1px solid var(--border-color);padding:1rem;z-index:10}.input-container{max-width:1200px;margin:0 auto;display:flex;gap:1rem;align-items:center}textarea{flex:1;height:42px;min-height:42px;max-height:120px;padding:10px 12px;border:1px solid var(--border-color);border-radius:8px;resize:none;font-family:inherit;font-size:1rem;line-height:1.4;color:var(--text-primary);transition:border-color .2s;background:var(--surface-color);box-sizing:border-box;display:block;overflow-y:hidden}textarea::-webkit-scrollbar{display:none}textarea{-ms-overflow-style:none;scrollbar-width:none}textarea:focus{outline:none;border-color:var(--primary-color)}.upload-button,.send-button{background-color:var(--primary-color);color:#fff;border:none;border-radius:8px;width:42px;height:42px;padding:0;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;-webkit-tap-highlight-color:transparent;transition:transform .1s ease,background-color .2s}.upload-button:active,.send-button:active{background-color:var(--primary-dark);border-radius:8px;transform:scale(.95)}.upload-button.disabled{opacity:.5;cursor:not-allowed;background-color:#ccc!important;pointer-events:none;transform:none}.upload-button.disabled:active{transform:none;background-color:#ccc!important}.copy-status{position:fixed;bottom:5rem;left:50%;transform:translate(-50%);background-color:#000c;color:#fff;padding:.5rem 1rem;border-radius:4px;font-size:.875rem;z-index:1000}.auth-container{min-height:100vh;min-height:calc(var(--vh, 1vh) * 100);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;background-color:var(--background-color);position:fixed;width:100%;top:0;left:0;box-sizing:border-box;padding:1rem}.auth-container h1{color:var(--primary-color);margin:0}.auth-container p{color:var(--text-secondary);margin:0}.auth-container input{width:100%;max-width:30px;padding:.75rem;border:1px solid var(--border-color);border-radius:8px;font-size:1rem;color:var(--text-primary);transition:border-color .2s;background:var(--surface-color)}.auth-container input:focus{outline:none;border-color:var(--primary-color)}.auth-container button{width:100%;max-width:300px;padding:.75rem;background-color:var(--primary-color);color:#fff;border:none;border-radius:8px;font-size:1rem;cursor:pointer;transition:background-color .2s}.auth-container button:hover{background-color:var(--primary-dark)}.content-item:hover{transform:translateY(-2px);box-shadow:0 4px 12px var(--shadow-color);border-color:var(--primary-light);z-index:2}@media(max-width:768px){.content-section{padding:.5rem}.content-item{padding:1rem;width:calc(100% - 1rem)}.content-item:active{background-color:var(--background-color);border-radius:12px;transform:scale(.98);transition:transform .1s ease}.star-button,.delete-button{opacity:1;margin-top:0}.input-section{padding:.75rem}.input-container{gap:.5rem}textarea{padding:10px}.upload-button:active,.send-button:active{background-color:var(--primary-dark);border-radius:8px;transform:scale(.95)}}.loading-more{text-align:center;padding:1rem;color:var(--text-secondary);font-size:.875rem;width:100%;box-sizing:border-box}.upload-button.disabled{opacity:.5;cursor:not-allowed;background-color:#ccc!important;pointer-events:none}.upload-button.disabled:hover{background-color:#ccc!important;transform:none}.upload-button.disabled svg{color:#666}.header-actions{display:flex;align-items:center}.refresh-button{position:fixed;right:1rem;bottom:calc(80px + env(safe-area-inset-bottom));background-color:var(--primary-color);color:#fff;border:none;width:42px;height:42px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px var(--shadow-color);transition:all .2s ease;z-index:100;-webkit-tap-highlight-color:transparent}.refresh-button:hover{transform:rotate(180deg);background-color:var(--primary-dark)}.refresh-button:active{transform:rotate(180deg) scale(.9)}@media(max-width:768px){.refresh-button{right:1rem;bottom:calc(80px + env(safe-area-inset-bottom))}.refresh-button:active{background-color:var(--primary-dark);transform:rotate(180deg) scale(.9)}}.code-inputs{display:flex;gap:.5rem;margin:2rem 0;padding:0 1rem}.code-input{width:36px;height:42px;padding:0;font-size:1.25rem;text-align:center;border:2px solid var(--border-color);border-radius:8px;background:var(--surface-color);color:var(--text-primary);transition:all .2s ease;-webkit-appearance:none}.code-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px var(--primary-light)}@media(max-width:768px){.code-input{width:32px;height:38px;font-size:1.125rem}.code-inputs{gap:.375rem}}.toast{position:fixed;left:50%;transform:translate(-50%);background-color:#000c;color:#fff;padding:.5rem 1rem;border-radius:4px;font-size:.875rem;z-index:1000;animation:fadeIn .2s ease;white-space:nowrap}.toast-top{top:4rem}.toast-bottom{bottom:5rem}@keyframes fadeIn{0%{opacity:0;transform:translate(-50%,-10px)}to{opacity:1;transform:translate(-50%)}}#root{margin:0 auto}.app-container{display:flex;flex-direction:column}