:root{color-scheme:light;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;--bg: #f6f7f9;--surface: #ffffff;--surface-muted: #f1f3f5;--border: #d7dce2;--text: #1f2933;--muted: #667085;--accent: #2563eb;--danger: #dc2626}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;color:var(--text);background:var(--bg)}button{font:inherit;color:inherit}.cutting-mat{min-height:100vh;padding:24px;background:var(--bg)}.desk-shadow{display:none}.top-strip{position:fixed;top:24px;right:24px;z-index:10;display:flex;justify-content:flex-end;margin:0}.tool-button,.text-button{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--border);border-radius:6px;background:var(--surface);padding:8px 12px;cursor:pointer}.tool-button:hover,.text-button:hover,.sticky-note:hover,.pack-card:hover,.inventory-sticker:hover:not(:disabled){border-color:var(--accent)}.workspace{position:relative;display:grid;gap:16px;width:100%;margin:0}.workspace-main-only{grid-template-columns:minmax(0,1fr)}.note{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:8px}.main-note{min-height:calc(100vh - 96px);display:grid;grid-template-rows:30px 1fr;padding:0;overflow:hidden}.side-note{padding:16px}.personal-note{position:fixed;z-index:5;width:min(360px,calc(100vw - 32px));max-height:calc(100vh - 150px);overflow:auto}.personal-note.is-folded{position:fixed;width:224px;height:48px;max-height:48px;padding:8px 10px;overflow:hidden}.shop-note{position:fixed;z-index:4;width:min(320px,calc(100vw - 32px));max-height:calc(100vh - 120px);overflow:auto}.shop-note.is-folded{width:224px;height:48px;max-height:48px;padding:8px 10px;overflow:hidden}.drag-handle{display:flex;align-items:center;gap:8px;min-height:30px;cursor:move;-webkit-user-select:none;user-select:none;touch-action:none}.drag-handle h2{flex:1}.fold-button{cursor:pointer}h1,h2,h3,p{margin-top:0}h2{margin-bottom:12px;font-size:1.25rem;line-height:1.2}h3{margin:16px 0 8px;font-size:1rem}.spring-rail{display:grid;grid-template-columns:repeat(18,1fr);align-items:center;gap:8px;padding:8px 18px;border-bottom:1px solid var(--border);background:var(--surface-muted)}.spring-rail span{height:12px;border:1px solid var(--border);border-radius:999px;background:var(--surface)}.note-pages{display:grid;grid-template-columns:2fr 1fr;min-height:0}.note-page{min-width:0;min-height:calc(100vh - 126px);padding:16px;overflow:auto}.note-page-projects{display:grid;grid-template-rows:1fr auto;gap:12px;border-right:1px solid var(--border);overflow:hidden;perspective:1100px}.project-board{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:12px;min-height:100%;transform-origin:50% 0%;will-change:opacity,transform,filter}.project-page-stack{position:relative;min-height:100%;overflow:hidden;perspective:1100px;isolation:isolate}.project-board-layer{position:absolute;inset:0}.project-board-layer[aria-hidden=true]{pointer-events:none}.project-board.page-enter-next{animation:pageEnterFromBottom .52s cubic-bezier(.2,.72,.18,1)}.project-board.page-leave-next{animation:pageLeaveToTop .52s cubic-bezier(.38,0,.24,1) forwards;z-index:2}.project-board.page-enter-prev{animation:pageEnterFromTop .52s cubic-bezier(.2,.72,.18,1)}.project-board.page-leave-prev{animation:pageLeaveToBottom .52s cubic-bezier(.38,0,.24,1) forwards;z-index:2}.project-page-controls{display:flex;align-items:center;justify-content:center;gap:10px}.project-page-controls span{color:var(--muted);font-size:.9rem;font-weight:600}.project-page-controls button:disabled{opacity:.45;cursor:not-allowed}@keyframes pageEnterFromBottom{0%{opacity:0;filter:drop-shadow(0 -18px 22px rgba(15,23,42,.18));transform:translateY(56%) rotateX(-28deg) scale(.985)}58%{opacity:1;filter:drop-shadow(0 -10px 16px rgba(15,23,42,.12));transform:translateY(-3%) rotateX(4deg) scale(1)}to{opacity:1;filter:drop-shadow(0 0 0 rgba(15,23,42,0));transform:translateY(0) rotateX(0) scale(1)}}@keyframes pageEnterFromTop{0%{opacity:0;filter:drop-shadow(0 18px 22px rgba(15,23,42,.18));transform:translateY(-56%) rotateX(28deg) scale(.985)}58%{opacity:1;filter:drop-shadow(0 10px 16px rgba(15,23,42,.12));transform:translateY(3%) rotateX(-4deg) scale(1)}to{opacity:1;filter:drop-shadow(0 0 0 rgba(15,23,42,0));transform:translateY(0) rotateX(0) scale(1)}}@keyframes pageLeaveToTop{0%{opacity:1;filter:drop-shadow(0 0 0 rgba(15,23,42,0));transform:translateY(0) rotateX(0) scale(1)}45%{opacity:.88;filter:drop-shadow(0 16px 20px rgba(15,23,42,.16));transform:translateY(-18%) rotateX(14deg) scale(.992)}to{opacity:0;filter:drop-shadow(0 22px 26px rgba(15,23,42,.2));transform:translateY(-72%) rotateX(32deg) scale(.975)}}@keyframes pageLeaveToBottom{0%{opacity:1;filter:drop-shadow(0 0 0 rgba(15,23,42,0));transform:translateY(0) rotateX(0) scale(1)}45%{opacity:.88;filter:drop-shadow(0 -16px 20px rgba(15,23,42,.16));transform:translateY(18%) rotateX(-14deg) scale(.992)}to{opacity:0;filter:drop-shadow(0 -22px 26px rgba(15,23,42,.2));transform:translateY(72%) rotateX(-32deg) scale(.975)}}.sticky-note{position:relative;display:grid;gap:8px;min-height:0;padding:14px;border:1px solid var(--border);border-radius:8px;background:var(--surface);text-align:left;cursor:pointer}.sticky-note.is-active{border-color:var(--accent);outline:2px solid rgba(37,99,235,.16)}.sticky-note[data-drop-ready=true]{border-style:dashed}.sticky-note[data-drop-ready=true]:after{content:"드롭 가능";position:absolute;right:10px;bottom:10px;padding:2px 7px;border-radius:999px;background:var(--surface-muted);color:var(--accent);font-size:.75rem;font-weight:700}.sticky-index,.sticky-note small,.counts,.stamp{display:block}.sticky-index,.sticky-note small,.counts{color:var(--muted)}.sticky-note strong{display:block;font-size:1.05rem;line-height:1.3}.sticky-note small{line-height:1.35}.stamp{width:fit-content;padding:3px 8px;border:1px solid var(--border);border-radius:999px;background:var(--surface-muted);font-size:.85rem;font-weight:600}.progress,.meter-row i,.exp-bar{display:block;overflow:hidden;height:8px;border-radius:999px;background:var(--surface-muted)}.progress i,.meter-row em,.exp-bar i{display:block;height:100%;background:var(--accent)}.attached-sticker,.sticker-chip{display:inline-flex;align-items:center;justify-content:center;min-width:34px;min-height:28px;padding:4px 8px;border:1px solid var(--border);border-radius:999px;background:var(--surface-muted);font-size:.8rem;font-weight:600}.attached-sticker{margin-right:4px}.project-detail{padding:0}.detail-title,.note-mini-header,.profile-header,.ticket-line,.meter-row{display:flex;align-items:center}.detail-title{gap:8px;align-items:baseline}.project-detail p,.profile-header span,.pack-result p{color:var(--muted);line-height:1.45}.meter-row{display:grid;grid-template-columns:auto auto 1fr;gap:8px;margin:12px 0}.meter-row i{align-self:center}.count-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:0}.count-grid div,.log-paper,.auth-panel,.inventory-sticker,.pack-card,.catalog-dot{border:1px solid var(--border);border-radius:6px;background:var(--surface)}.count-grid div{min-width:0;padding:8px;text-align:center}.count-grid dt{color:var(--muted);font-size:.85rem}.count-grid dd{margin:0;font-weight:700}.log-paper{padding:10px;margin-bottom:8px}.event-list,.history-list{display:grid;gap:6px}.event-list p,.history-list p{margin:0;line-height:1.35}.event-list span,.history-list span{margin-right:8px;color:var(--muted)}.note-mini-header{gap:8px;margin-bottom:12px}.note-mini-header h2{margin:0}.auth-panel{display:grid;gap:12px;padding:14px}.auth-title-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.oauth-buttons{display:grid;grid-template-columns:1fr 1fr;gap:8px}.email-auth-form{display:grid;gap:8px}.email-auth-form input{width:100%;min-width:0;border:1px solid var(--border);border-radius:6px;background:var(--surface);padding:9px 10px;font:inherit}.email-auth-form div{display:grid;grid-template-columns:1fr 1fr;gap:8px}.auth-message{margin:0;color:#b91c1c;font-size:.9rem}.auth-panel button,.stamp-button,.primary-button,.locked-panel button{border:1px solid var(--accent);border-radius:6px;background:var(--accent);color:#fff;padding:10px 12px;cursor:pointer;font-weight:600}.auth-panel .text-button{border-color:var(--border);background:var(--surface);color:var(--ink);padding:7px 9px}.locked-panel{display:grid;gap:8px;padding:14px;border:1px solid var(--border);border-radius:6px;background:var(--surface-muted)}.locked-panel p{margin-bottom:4px;color:var(--muted)}.profile-header{gap:10px}.avatar{display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--border);border-radius:50%;background:var(--surface-muted);font-weight:700}.profile-header div:nth-child(2){flex:1}.profile-header strong,.profile-header span{display:block}.ticket-line{gap:7px;margin:12px 0 7px}.ticket-line b{color:var(--accent)}.exp-bar{position:relative;height:18px;margin-bottom:12px}.exp-bar span{position:absolute;inset:0;display:grid;place-items:center;font-size:.78rem;font-weight:600}.tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin-bottom:10px}.tabs button{min-width:0;border:1px solid var(--border);border-radius:6px;background:var(--surface);padding:7px 3px;cursor:pointer;font-size:.9rem}.tabs button.active{border-color:var(--accent);color:var(--accent);font-weight:700}.note-section p{margin-bottom:6px}.attendance{display:grid;gap:10px}.stamp-board{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}.stamp-board span{display:grid;place-items:center;aspect-ratio:1;border:1px solid var(--border);border-radius:4px;color:var(--muted)}.stamp-board span.done{border-color:var(--accent);color:var(--accent);font-weight:700}.streak-rewards{display:grid;gap:8px}.streak-reward{display:grid;gap:3px;padding:9px 10px;border:1px solid var(--border);border-radius:6px;background:var(--surface)}.streak-reward span,.streak-reward small{color:var(--muted);font-size:.86rem}.streak-reward.ready{border-color:var(--accent)}.streak-reward.claimed{background:var(--surface-muted)}.inventory{display:grid;grid-template-columns:1fr 1fr;gap:8px}.selection-status{margin-bottom:8px;padding:8px 10px;border:1px solid var(--border);border-radius:6px;background:var(--surface-muted);color:var(--muted);font-size:.9rem}.selection-status.is-selected{border-color:var(--accent);background:#2563eb14;color:var(--text);font-weight:600}.inventory-sticker{min-width:0;min-height:82px;cursor:grab;padding:8px}.inventory-sticker:disabled{opacity:.45;cursor:not-allowed}.inventory-sticker.selected{border-color:var(--accent);outline:3px solid rgba(37,99,235,.2);background:#2563eb0f}.inventory-sticker span,.inventory-sticker b,.inventory-sticker small{display:block}.inventory-sticker b{margin:3px 0;font-size:.95rem}.shop-ticket{margin-bottom:10px;color:var(--muted);font-weight:600}.shop-tabs{display:grid;grid-template-columns:repeat(2,1fr);gap:4px;margin-bottom:10px}.shop-tabs button{min-width:0;border:1px solid var(--border);border-radius:6px;background:var(--surface);padding:7px 6px;cursor:pointer;font-size:.9rem}.shop-tabs button.active{border-color:var(--accent);color:var(--accent);font-weight:700}.pack-list{display:grid;gap:8px}.pack-card{display:grid;gap:3px;padding:10px 12px;text-align:left;cursor:pointer}.pack-card.selected{border-color:var(--accent);outline:3px solid rgba(37,99,235,.16);background:#2563eb0d}.pack-card span{color:var(--muted);font-size:.9rem}.pack-purchase-button{width:100%;margin-top:10px;justify-content:center}.pack-purchase-button:disabled{opacity:.5;cursor:not-allowed}.pack-result,.catalog{margin-top:14px;padding-top:10px;border-top:1px solid var(--border)}.result-stickers,.catalog{display:flex;flex-wrap:wrap;gap:6px}.catalog h3{width:100%}.catalog-dot{display:inline-block;padding:4px 8px;font-size:.85rem}.feedback-layer{position:fixed;right:24px;bottom:24px;display:grid;gap:10px;width:min(330px,calc(100vw - 32px))}.toast{margin:0;padding:12px 14px;border:1px solid var(--border);border-left:4px solid var(--accent);border-radius:6px;background:var(--surface);font-weight:600}.toast-warn{border-left-color:var(--danger)}.modal-backdrop{position:fixed;inset:0;z-index:20;display:grid;place-items:center;padding:20px;background:#0f172a59}.modal{width:min(420px,100%);padding:20px;border:1px solid var(--border);border-radius:8px;background:var(--surface)}.modal h2{margin-bottom:8px}.modal p{color:var(--muted);line-height:1.45}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}.pack-opening-modal{width:min(760px,100%)}.pack-opening-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:16px}.pack-opening-item{display:grid;gap:8px;min-width:0;border:0;background:transparent;padding:0;opacity:0;transform:translateY(20px) scale(.92);animation:packReveal .56s cubic-bezier(.2,.72,.18,1) forwards}.pack-opening-item.is-selectable{cursor:pointer}.pack-opening-item.is-selectable:hover .sticker-placeholder{border-color:var(--accent);outline:3px solid rgba(37,99,235,.18)}.pack-opening-item span{overflow-wrap:anywhere;text-align:center;font-size:.86rem;font-weight:700}.pack-choice-caption{margin:14px 0 0;color:var(--muted);text-align:center;font-size:.9rem}.daily-pack-stage{position:relative;min-height:360px;margin-top:16px;overflow:hidden;transition:min-height .22s ease}.daily-pack-stage.is-opened{min-height:430px}.daily-pack-rod{position:absolute;left:50%;bottom:18px;width:8px;height:188px;border-radius:999px;background:var(--border);transform:translate(-50%);transform-origin:50% 100%;animation:rodMetronome .78s ease-in-out infinite alternate}.daily-pack-rod.is-stopped{animation:none;opacity:0;transition:opacity .26s ease}.daily-pack-rod:before{content:"";position:absolute;left:50%;top:-14px;width:30px;height:30px;border:1px solid var(--border);border-radius:50%;background:var(--surface);transform:translate(-50%)}.daily-pack-rod:after{content:"";position:absolute;left:50%;bottom:-10px;width:76px;height:12px;border-radius:999px;background:var(--border);transform:translate(-50%)}.daily-pack-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;position:absolute;left:50%;bottom:188px;z-index:2;width:min(620px,92%);transform:translate(-50%)}.daily-pack-card{display:grid;gap:10px;min-width:0;border:1px solid var(--border);border-radius:8px;background:var(--surface);padding:12px;overflow:visible}.daily-pack-card.selected{border-color:var(--accent);outline:3px solid rgba(37,99,235,.18);z-index:3;animation:selectedPackFloat .72s cubic-bezier(.2,.72,.18,1) forwards}.daily-pack-card.dismissed{animation:packDissolve .42s ease forwards}.pack-slot-1{--selected-shift-x: calc(100% + 22px) }.pack-slot-2{--selected-shift-x: 0px}.pack-slot-3{--selected-shift-x: calc(-100% - 22px) }.daily-pack-card span{text-align:center;font-size:.94rem;font-weight:700}.daily-pack-preview{position:relative;height:148px}.pack-preview-sticker{position:absolute;left:50%;bottom:12px;width:min(116px,74%);aspect-ratio:1;border:1px solid var(--border);border-radius:8px;background:#d8dee9;transform:translate(-50%);transform-origin:50% 92%}.preview-1{--stack-x: -10px;--stack-y: 8px;--stack-rotate: -8deg;transform:translate(calc(-50% + var(--stack-x))) translateY(var(--stack-y)) rotate(var(--stack-rotate));z-index:1}.preview-2{--stack-x: 0px;--stack-y: 0px;--stack-rotate: 0deg;transform:translate(calc(-50% + var(--stack-x))) translateY(var(--stack-y)) rotate(var(--stack-rotate));z-index:2}.preview-3{--stack-x: 10px;--stack-y: 8px;--stack-rotate: 8deg;transform:translate(calc(-50% + var(--stack-x))) translateY(var(--stack-y)) rotate(var(--stack-rotate));z-index:3}.daily-pack-card.selected .daily-pack-preview{height:250px}.daily-pack-card.selected .pack-preview-sticker{animation:unfoldPackSticker .76s cubic-bezier(.16,.78,.24,1) forwards;animation-delay:.62s}.daily-pack-card.selected .preview-1{--unfold-x: -116px;--unfold-y: -72px;--unfold-rotate: -16deg}.daily-pack-card.selected .preview-2{--unfold-x: 0px;--unfold-y: -118px;--unfold-rotate: 0deg}.daily-pack-card.selected .preview-3{--unfold-x: 116px;--unfold-y: -72px;--unfold-rotate: 16deg}.sticker-placeholder{aspect-ratio:1;border:1px solid var(--border);border-radius:8px;background:#d8dee9}.sticker-placeholder.rarity-normal,.pack-preview-sticker.rarity-normal{background:#d8dee9}.sticker-placeholder.rarity-rare,.pack-preview-sticker.rarity-rare{background:#93c5fd}.sticker-placeholder.rarity-epic,.pack-preview-sticker.rarity-epic{background:#c4b5fd}.sticker-placeholder.rarity-strange,.pack-preview-sticker.rarity-strange{background:#f9a8d4}@keyframes packReveal{0%{opacity:0;transform:translateY(20px) scale(.92) rotate(-2deg)}62%{opacity:1;transform:translateY(-4px) scale(1.04) rotate(1deg)}to{opacity:1;transform:translateY(0) scale(1) rotate(0)}}@keyframes packPop{0%{transform:translate(-50%,-50%) scale(.86)}56%{transform:translate(-50%,-50%) scale(1.08)}to{transform:translate(-50%,-50%) scale(1)}}@keyframes rodMetronome{0%{transform:translate(-50%) rotate(-26deg)}to{transform:translate(-50%) rotate(26deg)}}@keyframes selectedPackFloat{0%{transform:translate(0) scale(1)}62%{transform:translate(var(--selected-shift-x),124px) scale(1.1)}to{transform:translate(var(--selected-shift-x),142px) scale(1)}}@keyframes packDissolve{0%{opacity:1;filter:blur(0);transform:scale(1)}to{opacity:0;filter:blur(8px);transform:scale(.92)}}@keyframes unfoldPackSticker{0%{transform:translate(calc(-50% + var(--stack-x))) translateY(var(--stack-y)) scale(1) rotate(var(--stack-rotate))}70%{transform:translate(calc(-50% + var(--unfold-x))) translateY(var(--unfold-y)) scale(1.06) rotate(var(--unfold-rotate))}to{transform:translate(calc(-50% + var(--unfold-x))) translateY(var(--unfold-y)) scale(1) rotate(var(--unfold-rotate))}}@media(max-width:640px){.cutting-mat{padding:12px}.spring-rail{grid-template-columns:repeat(9,1fr)}.note-pages{grid-template-columns:1fr}.note-page{min-height:auto}.note-page-projects{border-right:0;border-bottom:1px solid var(--border)}.side-note{padding:12px}.count-grid{grid-template-columns:repeat(3,1fr)}.inventory{grid-template-columns:1fr}}