:root{--bg:#f6f4ef;--paper:#ffffff;--ink:#1d1b18;--muted:#6d685f;--line:#e6e1d6;--line-strong:#d2cbbd;--accent:#2f4a68;--accent-soft:#e8eef5;--warn:#8a3b2b;--warn-soft:#f6e8e4;--ok:#2d5a3d;--shadow:0 1px 2px rgba(29,27,24,0.04),0 8px 24px rgba(29,27,24,0.04);--radius:14px}*{box-sizing:border-box}body,html{margin:0;padding:0}html{-webkit-text-size-adjust:100%}body{min-height:100vh;background:var(--bg);color:var(--ink);font-family:Noto Sans KR,Apple SD Gothic Neo,Malgun Gothic,sans-serif;font-size:16px;line-height:1.6}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit;color:inherit}.wrap{width:min(980px,calc(100% - 32px));margin:0 auto;padding:36px 0 64px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:36px}.brand{display:flex;flex-direction:column;gap:2px}.brand small{color:var(--muted);letter-spacing:.08em;font-size:11px;text-transform:uppercase}.brand h1{margin:0;font-size:22px;font-weight:650;letter-spacing:-.03em}.ghost{background:transparent;border:1px solid var(--line-strong);border-radius:999px;padding:8px 14px;cursor:pointer;color:var(--muted)}.ghost:hover{border-color:var(--ink);color:var(--ink)}.lead{margin:0 0 28px;color:var(--muted)}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:16px;gap:16px}.folder{display:block;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:22px 22px 18px;box-shadow:var(--shadow);min-height:148px;transition:border-color .15s ease,transform .15s ease}.folder:hover{border-color:var(--accent);transform:translateY(-1px)}.folder-icon{width:36px;height:28px;margin-bottom:18px;color:var(--accent)}.folder h2{margin:0 0 6px;font-size:20px;letter-spacing:-.03em}.folder p{margin:0;color:var(--muted);font-size:14px}.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:28px}.page-head h1{margin:4px 0 0;font-size:28px;letter-spacing:-.04em}.back{color:var(--muted);font-size:14px}.back:hover{color:var(--ink)}.primary{background:var(--accent);color:#fff;border:0;border-radius:999px;padding:10px 16px;cursor:pointer}.primary:disabled{opacity:.5;cursor:default}.tabs{display:flex;gap:6px;border-bottom:1px solid var(--line);margin-bottom:22px}.tab{background:none;border:0;padding:10px 14px 12px;color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px}.tab.active{color:var(--ink);border-bottom-color:var(--ink);font-weight:600}.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:20px 22px;box-shadow:var(--shadow);margin-bottom:14px}.card h3{margin:0 0 6px;font-size:18px;letter-spacing:-.02em}.meta{color:var(--muted);font-size:13px;margin-bottom:14px}.section{padding:14px 0;border-top:1px solid var(--line)}.section:first-of-type{border-top:0}.section h4{margin:0 0 8px;font-size:15px}.section p{margin:0;white-space:pre-wrap;color:#2a2824}.empty{color:var(--muted);padding:40px 8px;text-align:center}.errbox,.pending{padding:12px 14px;border-radius:10px;font-size:14px}.pending{background:var(--accent-soft);color:var(--accent)}.errbox{background:var(--warn-soft);color:var(--warn)}.linkish{color:var(--accent);font-size:14px;background:none;border:0;padding:0;cursor:pointer}.login-shell{min-height:100vh;display:grid;place-items:center;padding:24px}.login-card{width:min(360px,100%);background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:36px 28px 28px;box-shadow:var(--shadow);text-align:center}.login-card h1{margin:0 0 8px;font-size:24px;letter-spacing:-.04em}.login-card p{margin:0 0 24px;color:var(--muted);font-size:14px}.pin-dots{display:flex;justify-content:center;gap:10px;margin-bottom:22px}.pin-dots span{width:12px;height:12px;border-radius:50%;border:1px solid var(--line-strong);background:transparent}.pin-dots span.on{background:var(--ink);border-color:var(--ink)}.pad{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:10px;gap:10px}.pad button{height:56px;border:1px solid var(--line);background:#fbfaf7;border-radius:12px;cursor:pointer;font-size:20px}.pad button:hover{border-color:var(--ink)}.auth-error{min-height:24px;margin:14px 0 0;color:var(--warn);font-size:14px}.modal-back{position:fixed;inset:0;background:rgba(29,27,24,.28);display:grid;place-items:center;padding:20px;z-index:20}.modal{width:min(480px,100%);background:var(--paper);border-radius:16px;padding:24px;box-shadow:var(--shadow)}.modal h2{margin:0 0 16px;font-size:20px}.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;text-align:left}.field label{font-size:13px;color:var(--muted)}.field input:not([type]),.field input[type=file],.field input[type=text],.field select{border:1px solid var(--line-strong);border-radius:10px;padding:10px 12px;background:#fff}.check{align-items:center;margin:8px 0 18px}.actions,.check{display:flex;gap:8px}.actions{justify-content:flex-end}.quiz-box textarea{width:100%;min-height:90px;border:1px solid var(--line-strong);border-radius:10px;padding:12px;resize:vertical;background:#fff}.quiz-nav{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:14px}.answer{margin-top:12px;padding:12px 14px;background:#f3f1eb;border-radius:10px}.progress{color:var(--muted);font-size:13px}@media (max-width:720px){.wrap{width:min(100% - 24px,980px);padding-top:22px}.grid{grid-template-columns:1fr}.page-head{flex-direction:column}.page-head h1{font-size:24px}.folder{min-height:0}}.radios{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:2px}.radio{display:flex;align-items:center;gap:6px;font-size:14px;cursor:pointer}.radio input{accent-color:var(--accent)}.file-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.dropzone{border:1px dashed var(--line-strong);border-radius:10px;padding:22px 14px;text-align:center;color:var(--muted);font-size:14px;background:#fbfaf7;cursor:pointer}.dropzone.over,.dropzone:hover{border-color:var(--accent);color:var(--ink);background:var(--accent-soft)}.file-list{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}.file-list li{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px;padding:6px 8px;border:1px solid var(--line);border-radius:8px;background:#fff}.file-list .name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-list button{background:none;border:0;color:var(--muted);cursor:pointer;font-size:12px;padding:0;flex-shrink:0}.file-list button:hover{color:var(--warn)}.card-head{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.card-head h3{margin:0 0 6px}.card-del{background:none;border:0;padding:0;color:var(--muted);font-size:13px;cursor:pointer;flex-shrink:0}.card-del:hover{color:var(--warn)}.quiz-card{cursor:-webkit-grab;cursor:grab;position:relative;transition:box-shadow .15s ease,transform .15s ease,opacity .15s ease,border-color .15s ease}.quiz-card:active{cursor:-webkit-grabbing;cursor:grabbing}.quiz-card.dragging{opacity:.5;transform:translateY(-3px);box-shadow:0 10px 28px rgba(29,27,24,.1);border-color:var(--line-strong)}.quiz-card.drop-after:after,.quiz-card.drop-before:before{content:"";display:block;height:2px;background:var(--accent);border-radius:1px}.quiz-card.drop-before:before{margin:0 0 12px}.quiz-card.drop-after:after{margin:12px 0 0}.grip{color:var(--line-strong);font-size:13px;letter-spacing:-1px;line-height:1.2;-webkit-user-select:none;-moz-user-select:none;user-select:none;padding:4px 2px 0 0;flex-shrink:0}.card-head,.title-view{align-items:flex-start}.title-view{display:flex;gap:8px;flex:1 1;min-width:0}.title-view h3{margin:0;min-width:0}.title-btn{background:none;border:0;padding:0;margin:0;font:inherit;font-size:18px;font-weight:650;letter-spacing:-.02em;color:inherit;cursor:pointer;text-align:left}.title-btn:hover{text-decoration:underline;text-underline-offset:3px}.title-edit{background:none;border:0;padding:2px 0 0;color:var(--muted);font-size:13px;cursor:pointer;flex-shrink:0}.title-edit:hover{color:var(--ink)}.title-editor{display:flex;flex-wrap:wrap;align-items:center;gap:6px;flex:1 1;min-width:0}.title-editor input{flex:1 1;min-width:140px;border:1px solid var(--line-strong);border-radius:8px;padding:6px 10px;background:#fff;font:inherit;font-size:16px}.title-cancel,.title-ok{background:none;border:0;padding:4px 2px;font-size:13px;cursor:pointer}.title-ok{color:var(--accent)}.title-cancel{color:var(--muted)}.title-cancel:hover,.title-ok:hover{text-decoration:underline;text-underline-offset:2px}.title-err{flex-basis:100%;color:var(--warn);font-size:13px}.errbox+.empty,.errbox+div{margin-top:14px}.note-card{cursor:pointer}.note-card[draggable=true]{cursor:-webkit-grab;cursor:grab}.note-card[draggable=true]:active{cursor:-webkit-grabbing;cursor:grabbing}.note-card.dragging{opacity:.5;transform:translateY(-3px);box-shadow:0 10px 28px rgba(29,27,24,.1);border-color:var(--line-strong)}.note-card:hover{border-color:var(--accent)}.note-card .meta{margin-bottom:0}.note-back{display:inline-block;background:none;border:0;padding:0;margin-bottom:12px;cursor:pointer}.note-detail-head{margin-bottom:8px}.folder-title{margin:0 0 16px;font-size:20px;letter-spacing:-.03em}.folder-toolbar{display:flex;justify-content:flex-end}.folder-create,.folder-toolbar{margin-bottom:14px}.quiz-folder{cursor:pointer}.quiz-folder:hover{border-color:var(--accent)}.quiz-folder .folder-icon{margin-bottom:10px;color:var(--accent)}.quiz-folder h3{margin:0 0 4px;font-size:18px}.quiz-folder p{margin:0;color:var(--muted);font-size:14px}.folder-actions{display:flex;gap:10px;margin-top:10px}.folder-actions button{background:none;border:0;padding:0;color:var(--muted);font-size:13px;cursor:pointer}.folder-actions button:hover{color:var(--ink)}.move-box{display:flex;flex-direction:column;align-items:flex-start;gap:8px}.move-box .linkish{text-align:left}.retry-btn{background:var(--warn-soft);color:var(--warn);border:1px solid #e0b8ae;border-radius:999px;padding:4px 12px;font-size:13px;font-weight:600;cursor:pointer;flex-shrink:0;line-height:1.4}.retry-btn:hover{border-color:var(--warn)}.retry-btn:disabled{opacity:.55;cursor:default}.card-head .retry-btn,.note-card .retry-btn{margin-top:1px}.note-modal{width:min(560px,100%)}.field textarea{width:100%;min-height:200px;border:1px solid var(--line-strong);border-radius:10px;padding:12px;resize:vertical;background:#fff;line-height:1.6}.page-head-actions{display:flex;gap:8px;flex-wrap:wrap}