@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap";@import"https://fonts.googleapis.com/css2?family=PT+Serif&family=Raleway:wght@600;700&display=swap";:root{font-family:"PT Serif",serif;line-height:1.5;font-weight:400;color:#ffffffde;background-color:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--color-accent-red: #dd3333;--color-accent-green: #6eb48c;--color-olive: #747B2D;--color-bg-light: #F4EBE2;--color-bg-white: #FFFFFF;--color-text-dark: #2B2A29;--color-text-light: #ffffff;--color-border: #dedede;--tier-s: #ff7f7f;--tier-a: #ffbf7f;--tier-b: #ffff7f;--tier-c: #7fff7f;--tier-d: #7f7fff;--tier-e: #cccccc}*{box-sizing:border-box}body{margin:0;padding:0;color:#333;font-family:"PT Serif",serif}h1,h2,h3,h4,h5,h6{font-family:Raleway,sans-serif;margin-top:0}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1000;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}.modal-content{background-color:#fff;color:#333;padding:30px;border-radius:8px;max-width:400px;text-align:center;box-shadow:0 10px 25px #00000080}.modal-content h3{margin-top:0;color:#d33}.modal-actions{display:flex;justify-content:center;gap:15px;margin-top:20px}.modal-actions button,.modal-actions a.btn-confirm{padding:12px 24px;border:none;border-radius:25px;cursor:pointer;font-weight:600;transition:transform .2s;flex:1;text-align:center;justify-content:center;box-sizing:border-box}.modal-actions button:hover,.modal-actions a.btn-confirm:hover{transform:translateY(-2px)}.modal-actions .btn-cancel{background-color:#eee;color:#333}.modal-actions .btn-confirm{background-color:var(--color-accent-red);color:#fff}.share-text-box{margin:15px 0 20px;text-align:left}.share-text-label{display:block;font-size:13px;font-weight:700;color:#2b2a29;font-family:Raleway,sans-serif;margin-bottom:6px}.share-textarea{width:100%;height:75px;border:1px solid #dedede;border-radius:8px;padding:10px;font-size:12px;font-family:Inter,sans-serif;resize:none;background:#f8fafc;box-sizing:border-box;color:#334155;margin-bottom:8px}.btn-copy-text{background:#2b2a29;color:#fff;border:none;border-radius:20px;padding:6px 16px;font-size:12px;font-weight:600;font-family:Raleway,sans-serif;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:background-color .2s ease,transform .2s ease}.btn-copy-text:hover{background:var(--color-accent-red);transform:translateY(-1px)}.app-container{max-width:1000px;margin:0 auto;padding:10px 0;display:flex;flex-direction:column;gap:20px}.header{text-align:center;margin-bottom:20px}.header h1{font-size:2.5rem;margin:0 0 10px;color:var(--color-text-dark)}.header p{font-size:1.1rem;color:#666;margin:0}.share-section{margin-top:30px;padding-top:20px;border-top:1px solid #eee;text-align:center}.share-section h3{margin-top:0;font-size:1.1rem;color:#555;margin-bottom:15px}.share-buttons{display:flex;justify-content:center;gap:15px;flex-wrap:wrap}.share-buttons button{display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 20px;border:none;border-radius:25px;color:#fff;font-weight:600;cursor:pointer;transition:transform .2s,opacity .2s}.share-buttons button:hover{transform:translateY(-2px);opacity:.9}.btn-fb{background-color:#1877f2}.btn-ig{background:linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888)}.btn-bsky{background-color:#0085ff}.tier-list-wrapper{background:var(--color-bg-white);padding:0}.exporting.tier-list-wrapper{display:flex!important;flex-direction:column!important;justify-content:space-between!important;padding:45px 15px!important;box-sizing:border-box!important;background-color:#fff!important}.exporting .tier-list{width:100%!important;box-sizing:border-box!important;margin:20px auto!important;display:flex!important;flex-direction:column!important}.exporting .header{text-align:center!important;margin-bottom:20px!important}.exporting .header h1{font-size:3.2rem!important;margin-bottom:15px!important}.exporting .header p{font-size:1.5rem!important}.exporting .tier-label{width:140px!important;font-size:1.2rem!important}.exporting .restaurant-card{width:100px!important;height:100px!important;font-size:.9rem!important;box-shadow:none!important}.exporting .watermark{display:flex!important;width:100%!important;box-sizing:border-box!important;font-size:1.1rem!important;padding:20px 0!important;border-top:1px solid #eee!important}.exporting .watermark img{height:55px!important}.exporting [data-html2canvas-ignore=true]{display:none!important}.tier-list{display:flex;flex-direction:column;border:1px solid var(--color-border);background-color:#1a1a1a}.tier-row{display:flex;min-height:100px;border-bottom:1px solid #333}.tier-row:last-child{border-bottom:none}.tier-label{position:relative;overflow:hidden;width:120px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:1.2rem;font-weight:700;border-right:1px solid #333;word-wrap:break-word;word-break:break-word;-webkit-hyphens:auto;hyphens:auto;padding:5px}.tier-label:after{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:7rem;font-weight:900;color:#ffffff40;pointer-events:none;z-index:0;line-height:1}.tier-s:after{content:"S"}.tier-a:after{content:"A"}.tier-b:after{content:"B"}.tier-c:after{content:"C"}.tier-d:after{content:"D"}.tier-content{flex:1;display:flex;flex-wrap:wrap;gap:10px;padding:10px 0 10px 10px;min-height:100px;align-items:center}.unranked-container{min-height:150px;padding:15px 0;background-color:#fff;border:2px dashed var(--color-border);border-radius:0;display:flex;flex-wrap:wrap;gap:15px;justify-content:center;align-items:center}.restaurant-card{width:100px;height:100px;background-color:var(--color-bg-white);border:2px solid var(--color-border);border-radius:8px;display:flex;align-items:center;justify-content:center;text-align:center;padding:10px;font-size:.9rem;font-weight:600;cursor:grab;transition:transform .2s,border-color .2s;-webkit-user-select:none;user-select:none;touch-action:none;background-size:contain;background-position:center;background-repeat:no-repeat;color:transparent;position:relative}.remove-btn{position:absolute;top:-5px;right:-5px;background:var(--color-accent-red);color:#fff;border:none;border-radius:50%;width:22px;height:22px;font-size:16px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:10;box-shadow:0 2px 4px #0003}.move-select-wrapper{position:absolute;bottom:-5px;right:-5px;background:#fff;color:#333;border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px #0003;z-index:10;overflow:hidden;border:1px solid #ccc}.move-select-wrapper select{opacity:0;position:absolute;top:0;left:0;width:100%;height:100%;cursor:pointer}.move-select-wrapper:after{content:"↕️";font-size:12px;pointer-events:none}.btn-fullscreen{position:absolute;top:30px;right:30px;background:#fff;border:1px solid #ccc;border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:100;color:#333;box-shadow:0 2px 4px #0000001a;transition:transform .2s}.btn-fullscreen:hover{transform:scale(1.05)}.restaurant-card.has-image{color:#fff;text-shadow:0px 1px 4px rgba(0,0,0,1),0px 0px 3px rgba(0,0,0,1),0px -1px 3px rgba(0,0,0,1);border-color:#c8c8c880;box-shadow:inset 0 0 50px #0009}.restaurant-card:active{cursor:grabbing}.restaurant-card.is-dragging{opacity:.5;box-shadow:0 5px 15px #0003}.restaurant-card.is-drag-overlay{opacity:1;box-shadow:0 10px 20px #0000004d;cursor:grabbing;transform:scale(1.05)}.controls{display:flex;justify-content:center;margin-top:20px}.btn-export{background-color:var(--color-accent-red);color:#fff;border:none;padding:12px 24px;font-size:.8rem;font-weight:600;border-radius:25px;cursor:pointer;display:flex;align-items:center;gap:8px;transition:background-color .2s ease}.btn-export:hover{background-color:#c02a2a}.watermark{display:flex;justify-content:flex-end;align-items:center;gap:10px;text-align:right;padding:10px;font-size:.9rem;color:#000;font-weight:600;background-color:#fff}.tier-s{background-color:var(--tier-s)}.tier-a{background-color:var(--tier-a)}.tier-b{background-color:var(--tier-b)}.tier-c{background-color:var(--tier-c)}.tier-d{background-color:var(--tier-d)}.tier-e{background-color:var(--tier-e)}@media (max-width: 600px){.header{padding-top:30px}.tier-label{width:75px;font-size:.85rem}.restaurant-card{width:75px;height:75px}.btn-fullscreen{top:10px;right:10px;padding:8px}}
